body {margin: 0; padding: 0;font-family: "Trebuchet MS",Arial,Helvetica; color: #666}
.dev {position: absolute; z-index: 50; top: -30px; left: 30px;}
.dev2 {float: right; position: absolute; z-index: 40; top: -30px; left: 0px;}

/* //////////////////// BODY ELEMENTS //////////////////// */
.design_body {background:#a7daed url("http://www.flame-media.co.uk/assets/images/backgrounds/design.jpg") fixed repeat-x 50% 100%; }
.default_body {background:#a7daed url("http://www.flame-media.co.uk/assets/images/backgrounds/default_bg.jpg") fixed repeat-x 50% 100%; }
.team_body {background:#a7daed url("http://www.flame-media.co.uk/assets/images/backgrounds/print.jpg") fixed repeat-x 50% 100%; }
.marketing_body {background:#a7daed url("http://www.flame-media.co.uk/assets/images/backgrounds/marketing_bg_clouds.jpg") fixed repeat-x 50% 100%; }
.print_body {background:#a7daed url("http://www.flame-media.co.uk/assets/images/backgrounds/print_bg2.jpg") fixed repeat-x 50% 100%; }
.contact_body {background:#a7daed url("http://www.flame-media.co.uk/assets/images/backgrounds/default_bg.jpg") fixed repeat-x 50% 100%; }
.portfolio_body {background:#a7daed url("http://www.flame-media.co.uk/assets/images/backgrounds/design.jpg") fixed repeat-x 50% 100%; }
.page_body {background:#a7daed url("http://www.flame-media.co.uk/assets/images/backgrounds/print.jpg") fixed repeat-x 50% 100%; }

/* //////////////////// HTML ELEMENTS //////////////////// */
a {color: #6e88a1; font-weight: bold;}
a:hover {color: #666; text-decoration:none}

/* //////////////////// 5 A DAY //////////////////// */

#fiveaday {background: url("http://www.flame-media.co.uk/assets/images/shell/5aday.jpg") no-repeat !important ; background-color: transparent !important; margin: 0 auto; padding: 0 0 0 0; width: 773px; height:92px; font-size: 0.8em;}

#fiveaday h2 {width:530px; float:right; margin:20px 0 0 0; padding:0; line-height:100%;}
.apple {float:left; width:28px}
.appleh2  {float:left; width:470px; height:36px; margin:10px 0 0 10px; padding:0}
#fiveaday h2 a {color:#666; text-decoration:none}
#fiveaday h2 a:hover {color:#6e88a1; text-decoration:none}
#fiveaday p {width:510px; float:right; margin:0; padding:0 20px 0 0; line-height:130%}

#fivesbottom {width:199px; height:210px; position:absolute; right:5px; bottom:5px;}
.newpage {background:url("http://www.flame-media.co.uk/assets/images/shell/newpage.jpg") no-repeat; background-position:right; padding: 0 20px 0 0}


/* //////////////////// CONTAINERS ELEMENTS //////////////////// */
#container {margin: 0 auto 120px auto; width: 790px; }
#content {background-image: url("http://www.flame-media.co.uk/assets/images/shell/home_page_bg.png") !important; background-color: transparent !important; margin: 0 auto; padding: 0; width: 773px; font-size: 0.8em;}
#main_content_shell {float: left; width: 530px; background: #fff;}

#main_content {padding: 10px; font-size: 0.9em;}
#main_page_content {padding: 10px 25px; font-size: 0.9em;}
#main_content ul, #main_page_content ul{font-size: 0.9em; padding-left: 15px; margin: 10px 0;}
#main_content li, #main_page_content li{padding:0px 0 1px 20px; margin: 1px 0; background:url("http://www.flame-media.co.uk/assets/images/icons/bullet.gif") no-repeat;list-style-type:none; }

#sub_page_content {background-image: url("http://www.flame-media.co.uk/assets/images/shell/sub_page_bg.png") !important; background-color: transparent !important; margin: 0 auto; padding: 0; width: 773px;}
#team_content, #contact_content, #page_content {background-image: url("http://www.flame-media.co.uk/assets/images/shell/team_page_bg.png") !important; background-color: transparent !important; margin: 0 auto; padding: 0; width: 773px;}
#content_base {clear: both; font-size: 0.7em; padding-top: 10px;}
#hidden {display: none}

.contact_box {float: left; width: 200px;}
.contact_map {float: left; width: 30%;}
.contact_box h3 {padding: 0; margin: 0;}
#googlemap {width: 320px; height: 180px;  margin-bottom: 10px; border: 1px solid #ccc}
hr {clear:both;  border-top: 1px solid #ccc}

/* //////////////////// USEFUL LINKS ELEMENTS //////////////////// */
.useful_links {padding:3px 0 0 10px; margin:0; list-style:none; height:26px;position:relative; z-index:1;}
.useful_links li.top {display:block; float:right; margin: 0 20px 0 0;}
.useful_links li a.top_link {display:block; float:right; height:26px; line-height:27px; color:#fff; text-decoration:none; font-weight:bold; padding:0 20px 0 0px; cursor:pointer;}
.useful_links li a.top_link span {float:left; display:block; padding:0 20px 0 20px; height:36px;}
.useful_links li a.top_link:hover {color:#fff; line-height:27px;}
.useful_links li a.top_link:hover span {}
.useful_links li:hover > a.top_link {color:#000; line-height:27px;}
.useful_links li:hover > a.top_link span {}
.useful_links a:hover {visibility:visible; position:relative; z-index:1; color: #333}
.useful_links li:hover {position:relative; z-index:1;}
.useful_links ul {position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}
.useful_links ul.sub1 {width:172px;}
.useful_links :hover ul {left:-5px; top:-212px; background-image: url("http://www.flame-media.co.uk/assets/images/shell/useful_links_bg.png") !important; background-color: transparent !important; padding:70px 3px 3px 3px; white-space:nowrap; height:auto; z-index:50;}
.useful_links :hover ul li {display:block; height:20px; position:relative; font-weight:normal; width:auto; padding-left: 5px;}
.useful_links :hover ul li a {color: #666; display:block; margin: 0 30px 0 7px;height:20px; line-height:20px; width:auto; padding:0 10px 0 20px; text-decoration:none;}
.useful_links :hover ul li:hover {color:#666;}
.useful_links :hover ul li a:hover {color:#6e88a1;}
.useful_links em {text-decoration:underline; font-style:normal}
.useful_links a {text-decoration:none}


/* //////////////////// HOME PAGE ELEMENTS //////////////////// */
#home_design {float: left; width: 253px; padding-bottom: 10px}
#home_marketing {float: left; width: 261px; padding-bottom: 10px}
#home_print {float: left; width: 252px; padding-bottom: 10px}

#home_design p {padding: 5px 10px 5px 10px; margin: 0;} 
#home_marketing p {padding: 5px 10px 5px 25px; margin: 0;}
#home_print p {padding: 5px 10px 5px 25px; margin: 0;}

#home_design img {margin: 0;} 
#home_marketing img {margin: 0 0 0 18px;}
#home_print img {margin: 0 0 0 15px;}

#home_design a img,
#home_marketing a img,
#home_print a img {border: none;}

#home_design a:hover img,
#home_marketing a:hover img,
#home_print a:hover img {filter:alpha(opacity=50);-moz-opacity:.50;opacity:.50;}


/* //////////////////// TEAM ELEMENTS //////////////////// */
.team_profile {width: 180px; float: left; margin: 0 4px 10px 4px}
.team_profile h3 {font-size: 1em;color: #6e88a1; margin: 10px 0; padding: 0;}
.team_profile p {margin: 0; font-size: 0.9em;}


/* //////////////////// SITE MAP ELEMENTS //////////////////// */
.sitemap {float: left; margin: 0px 2px 10px 2px; width: 237px;}
.sitemap h3 {margin: 0; padding: 5px; color: #fff !important; background: #ef2d6b}
.sitemap h3 a {color: #FFF; text-decoration: none; display: block;}
.sitemap h3 a:hover {color: #FFF; text-decoration: underline}

.sitemap li {margin-right: 10px !important;}

.sitemap li a {border-bottom: 1px solid; text-decoration:none}
.sitemap li a:hover {border-bottom: 1px dotted;}
.sitemap li a:visited {color: #6b972f; text-decoration:none}
.sitemap li a:visited:hover {border-bottom: 1px dotted}


.sitemap_home {background:#eae204 !important}
.sitemap_design {background:#ef2d6b !important}
.sitemap_print {background:#f7931c !important}
.sitemap_marketing {background:#8cc53e !important}

.sitemap_key {font-size: 0.8em; float: right; margin: 0px 2px 10px 2px; width: 200px; border: 1px solid #ccc; background: #ededed}
.sitemap_key h3 {margin: 0; padding: 5px; color: #fff !important; background: #6e88a1;}
.sitemap_key .visited {color: #6b972f; text-decoration:none; font-weight: bold; cursor:help}
.sitemap_key .unvisited {color: #6e88a1; font-weight: bold; text-decoration:underline; cursor:help}
.sitemap_key acronym {bordeR: none}
.sitemap_key li {font-size: 1.2em}

.sitemap_row1 {background: url("http://www.flame-media.co.uk/assets/images/shell/sitemap_row1.gif");margin-bottom: 4px}
.sitemap_row2 {background: url("http://www.flame-media.co.uk/assets/images/shell/sitemap_row2.gif");margin-bottom: 4px}


/* //////////////////// CONTACT ELEMENTS //////////////////// */
#contact {}
#contact fieldset {border: none;}
#contact legend {display: none;}
#contact label {float: left; width: 200px; padding: 5px 10px 0 0;}
#contact .required,#contact .error {color: #F00}


.formField {background: url("http://www.flame-media.co.uk/assets/images/shell/input_bg.gif") no-repeat; width: 312px; height: 23px; padding: 7px 5px 0px 5px; border: none; font-weight: bold; font-size: 0.9em; color: #666;}

.formField:hover {background: url("http://www.flame-media.co.uk/assets/images/shell/input_bg_hover.gif") no-repeat; width: 312px; height: 23px; padding: 7px 5px 0px 5px; border: none; font-weight: bold; font-size: 0.9em; color: #666;}
.formField:focus {background: url("http://www.flame-media.co.uk/assets/images/shell/input_bg_hover.gif") no-repeat; width: 312px; height: 23px; padding: 7px 5px 0px 5px; border: none; font-weight: bold; font-size: 0.9em; color: #666;}

.formError {background: url("http://www.flame-media.co.uk/assets/images/shell/input_bg_error.gif") no-repeat; width: 312px; height: 23px; padding: 7px 5px 0px 5px; border: none; font-weight: bold; font-size: 0.9em; color: #666;}
.formError:hover {background: url("http://www.flame-media.co.uk/assets/images/shell/input_bg_hover.gif") no-repeat; width: 312px; height: 23px; padding: 7px 5px 0px 5px; border: none; font-weight: bold; font-size: 0.9em; color: #666;}
.formError:focus {background: url("http://www.flame-media.co.uk/assets/images/shell/input_bg_hover.gif") no-repeat; width: 312px; height: 23px; padding: 7px 5px 0px 5px; border: none; font-weight: bold; font-size: 0.9em; color: #666;}

.messagebox {overflow: auto; font-family: "Trebuchet MS",Arial,Helvetica;background: url("http://www.flame-media.co.uk/assets/images/shell/text_area_bg.gif") no-repeat; width: 312px; height: 143px; padding: 7px 5px 0px 5px; border: none; font-weight: bold; font-size: 0.9em; color: #666;}
.messagebox:hover {font-family: "Trebuchet MS",Arial,Helvetica;background: url("http://www.flame-media.co.uk/assets/images/shell/text_area_bg_hover.gif") no-repeat; width: 312px; height: 143px; padding: 7px 5px 0px 5px; border: none; font-weight: bold; font-size: 0.9em; color: #666;}
.messagebox:focus {font-family: "Trebuchet MS",Arial,Helvetica;background: url("http://www.flame-media.co.uk/assets/images/shell/text_area_bg_hover.gif") no-repeat; width: 312px; height: 143px; padding: 7px 5px 0px 5px; border: none; font-weight: bold; font-size: 0.9em; color: #666;}

.formbutton {margin: 0 0 0 220px; padding: 0;}

/* //////////////////// BRANDING ELEMENTS //////////////////// */
#header {width: 780px;background: #FFF url("http://www.flame-media.co.uk/assets/images/shell/telephone.gif") 96% 25% no-repeat; margin: 0 auto; padding: 10px 0; height: 90px; position: relative; z-index: 10}
#header img {float: left; border: none; }
#header ul { font-variant: small-caps;text-align: right; padding: 55px 20px 0 0; margin: 0; list-style: none; font-size: 1em;}
#header li {display: inline; padding: 5px 10px;}
#header li a {text-decoration: none;}
#header li a:hover {border-bottom: 1px dotted;}
#header li .current {font-size: 1.4em; color: #666}


/* //////////////////// HEADING ELEMENTS //////////////////// */
#design_heading {margin: 0 auto; padding: 0;width: 773px; background: url("http://www.flame-media.co.uk/assets/images/headings/design.png"); height:100px}
#marketing_heading {margin: 0 auto; padding: 0;width: 773px; background: url("http://www.flame-media.co.uk/assets/images/headings/marketing.png"); height:100px}
#team_heading {margin: 0 auto; padding: 0;width: 773px; background: url("http://www.flame-media.co.uk/assets/images/headings/team.png"); height:100px}
#design_heading {margin: 0 auto; padding: 0;width: 773px; background: url("http://www.flame-media.co.uk/assets/images/headings/design.png"); height:100px}
#print_heading {margin: 0 auto; padding: 0;width: 773px; background: url("http://www.flame-media.co.uk/assets/images/headings/print.png"); height:100px}
#contact_heading {margin: 0 auto; padding: 0;width: 773px; background: url("http://www.flame-media.co.uk/assets/images/headings/contact.png"); height:100px}
#portfolio_heading {margin: 0 auto; padding: 0;width: 773px; background: url("http://www.flame-media.co.uk/assets/images/headings/portfolio.png"); height:100px}
#accessibility_heading {margin: 0 auto; padding: 0;width: 773px; background: url("http://www.flame-media.co.uk/assets/images/headings/accessibility.png"); height:100px}
#sitemap_heading {margin: 0 auto; padding: 0;width: 773px; background: url("http://www.flame-media.co.uk/assets/images/headings/sitemap.png"); height:100px}
#copyright_heading {margin: 0 auto; padding: 0;width: 773px; background: url("http://www.flame-media.co.uk/assets/images/headings/copyright.png"); height:100px}
#privacy_heading {margin: 0 auto; padding: 0;width: 773px; background: url("http://www.flame-media.co.uk/assets/images/headings/privacy.png"); height:100px}
#friend_heading {margin: 0 auto; padding: 0;width: 773px; background: url("http://www.flame-media.co.uk/assets/images/headings/friend.png"); height:100px}
#error_heading {margin: 0 auto; padding: 0;width: 773px; background: url("http://www.flame-media.co.uk/assets/images/headings/page_not_found.png"); height:100px}
#home_heading  {margin: 0 auto; padding: 0;width: 773px; height:112px; background-image:url("http://www.flame-media.co.uk/assets/images/headings/home.png")}




#home_heading h2, 
#error_heading h2, 
#design_heading h2, 
#marketing_heading h2, 
#team_heading h2,
#accessibility_heading h2,
#sitemap_heading h2,
#privacy_heading h2,
#copyright_heading h2,
#friend_heading h2,
#print_heading h2,
#portfolio_heading h2,
#page_heading h2 ,
#contact_heading h2 {display: none}


/* //////////////////// SUB NAVIGATION ELEMENTS //////////////////// */
#sub_navigation {float: left;width: 240px; padding: 0;}
#sub_navigation ul {font-size: 0.8em; list-style: none; margin: 20px 0 0 1px; padding: 0;border-top: 1px solid #ddd; width: 214px;}
#sub_navigation li {font-variant: small-caps; float: left; margin: 0; padding: 0; display: block; width: 214px;}
#sub_navigation li a {text-decoration: none; margin: 0; padding: 5px; display: block; border-bottom: 1px solid #ddd; }
#sub_navigation li:hover {background: url("http://www.flame-media.co.uk/assets/images/backgrounds/button_ps.gif") #ededed;}
#sub_navigation li .current{font-size: 1.2em; background: url("http://www.flame-media.co.uk/assets/images/icons/arrow3.gif") no-repeat 95% center; color:#666 !important}


/* //////////////////// PORTFOLIO ELEMENTS //////////////////// */
.portfolio_img {float: right; width: 250px;padding-top: 5px; padding-left: 5px;}
#portfolio_item h2{margin:0; font-size: 1.2em}
#portfolio_item p {}
.portfolio_thumb {float:left;}
.portfolio_thumb a:hover {filter:alpha(opacity=50);-moz-opacity:.50;opacity:.50;}
.portfolio {text-align: center;}
.portfolio h3 {text-align: left; background: url("http://www.flame-media.co.uk/assets/images/shell/portfolio_heading.gif") no-repeat #ff57b3; display: block; color: #333; padding: 4px 3px 3px 3px; width: 442px; margin: 5px auto;}
.portfolio img {border: none; margin: 0 1px;}

/* //////////////////// FOOTER ELEMENTS //////////////////// */
#footer {background: #FFF; margin: 0 auto; padding: 0; width: 700px; filter:alpha(opacity=90);-moz-opacity:.90;opacity:.90; color:#929394}
#footer ul {margin: 0; padding: 5px 0 0 0; list-style: none; font-size: 0.8em;}
#footer li {display: inline; padding: 5px 10px;}
#footer p {margin: 0; padding: 5px 10px; font-size: 0.7em;}
#footer a {color: #666; text-decoration:none}
#footer a:hover {text-decoration: underline; color:#6e88a1}
#footer a:visited {color: #777; text-decoration:none}
#footer a:visited:hover {text-decoration: underline}

/* //////////////////// VARIOUS ELEMENTS //////////////////// */
.tell_a_friend {padding: 0 0 0 25px;background:url("../images/icons/email.gif") no-repeat left;}
.print_page {padding: 0 0 0 25px;background:url("../images/icons/printer.gif") no-repeat left;}
.bookmark {padding: 0 0 0 25px;background:url("../images/icons/bookmark.gif") no-repeat left;}
.bookmark_delicious {padding: 0 0 3px 25px;background:url("../images/icons/bookmark_delicious.gif") no-repeat left;}
.bookmark_digg {padding: 0 0 3px 25px;background:url("../images/icons/bookmark_digg.gif") no-repeat left;}
.bookmark_facebook {padding: 0 0 3px 25px;background:url("../images/icons/bookmark_facebook.gif") no-repeat left;}
.bookmark_google {padding: 0 0 3px 25px;background:url("../images/icons/bookmark_google.gif") no-repeat left;}
.bookmark_reddit {padding: 0 0 3px 25px;background:url("../images/icons/bookmark_reddit.gif") no-repeat left;}
.bookmark_stumble{padding: 0 0 3px 25px;background:url("../images/icons/bookmark_stumble.gif") no-repeat left;}
.bookmark_yahoo {padding: 0 0 3px 25px;background:url("../images/icons/bookmark_yahoo.gif") no-repeat left;}
.new_window {padding: 0 20px 0 0;background:url("../images/icons/new_window_small.gif") no-repeat right;}


.flash {padding-top: 15px}
.opacity {clear: both; margin: 0 auto; width: 700px; background: #FFF; height: 30px; filter:alpha(opacity=70);-moz-opacity:.60;opacity:.70;}
.opacity_small {clear: both; margin: 0 auto; width: 700px; background: #FFF; height: 20px; filter:alpha(opacity=70);-moz-opacity:.60;opacity:.70;}

.to_the_edge {float: right; margin-right: -13px;}
.to_the_left_edge {float: left; margin-left: -23px; padding-right: 10px}

/* //////////////////// NO SCRIPT ELEMENTS //////////////////// */
noscript .mainalert {width: 700px; border: 1px solid #f00;margin:10px auto; background:url("../images/icons/warning.gif") no-repeat left #f8b3b3; font-size: 9pt;}
noscript strong {font-size: 0.8em;}
noscript p{padding: 3px 10px;margin: 0 0 0 60px;}

.browser_notice {padding: 5px 0; border: 1px solid #993;margin:10px auto; background:url("../images/icons/info.jpg") no-repeat left #e6fda0; width: 700px;}
.browser_notice .title{font-weight: bold;font-size: 1.1em; padding: 0 10px 0px 70px; margin: 0;}
.browser_notice p {padding: 0 10px 3px 70px; margin: 0; font-size: 0.7em;}