﻿/*-------------------------------------------

             Title :  Marketeering
             Usage :  Global Layout
             Author:  QualityXHTML
             Edited:  2009-07-11

---------------------------------------------*/


/*===================TOC=====================

               1. Reset
               2. Containers
               3. Skip Links
               4. Branding
               5. Site Navigation
               6. Catcher
               7. Content
               8. Supp Content
               9. Site Info
              10. Valid Codes
              11. Form Elements

=============================================*/



/* 1. Reset
---------------------------------------------*/
* {
	margin: 0;
	padding: 0;
	}

body {
	line-height: 1;
	}

ol, ul {
	list-style: none;
	}

a {
	text-decoration: none;
	}

a:hover,
a:focus {
	text-decoration: underline;
	}

img, abbr, fieldset {
	border: none;
	}

img {
	vertical-align: top;
	}

strong, em, cite {
	font-style: normal;
	font-weight: normal;
	}

legend {
	display: none;
	}


/* 2. Containers
---------------------------------------------*/
html {
	display: inline;
	background: #072656 url(../images/html_bg.png) repeat-x top left;
	}

body {
	min-width: 964px;
	font-family: Arial, sans-serif;
	background: url(../images/body_bg.jpg) no-repeat top center;
	}


/* 3. Skip Links
---------------------------------------------*/
#skip {
	position: absolute;
	left: -500em;
	}


/* 4. Branding
---------------------------------------------*/
#branding {
	margin: 0 auto;
	width: 964px;
	min-height: 121px;
	}

#branding h1 {
	position: relative;
	z-index: 2;
	width: 310px;
	}

#branding h1 a {
	position: absolute;
	top: 30px;
	left: -8px;
	width: 314px;
	height: 73px;
	overflow: hidden;
	text-indent: -500em;
	}

.ie #branding h1 a {
	width: 317px;
	}

#branding p {
	position: absolute;
	left: -500em;
	}


/* 5. Site Navigation
---------------------------------------------*/
#site-nav {
	position: relative;
	margin: -121px auto 0;
	padding-left: 314px;
	width: 650px;
	min-height: 121px;
	overflow: hidden;
	}

#site-nav h3 {
	position: absolute;
	left: -500em;
	background: url(../images/site-nav_a_bg.png) repeat top left;   /* preloading image */
	}

#site-nav ul {
	position: relative;
	z-index: 1;
	float: right;
	margin-top: 53px;
	}

.ie6-7 #site-nav ul {
	padding-bottom: 20px;
	}

#site-nav ul li {
	float: left;
	margin-bottom: 20px;
	border-left: 1px solid;
	}

#site-nav ul li:first-child + li                          { border-color: #62C6ED; }
#site-nav ul li:first-child + li + li                     { border-color: #6ECEF0; }
#site-nav ul li:first-child + li + li + li                { border-color: #78D6F2; }
#site-nav ul li:first-child + li + li + li + li           { border-color: #80D8F3; }
#site-nav ul li:first-child + li + li + li + li + li      { border-color: #7ECCF0; }
#site-nav ul li:first-child + li + li + li + li + li + li { border-color: #72BCEb; }

#site-nav ul li:first-child {
	border: none;
	}

#site-nav ul li a {
	position: relative;
	display: block;
	padding: 10px 19px 10px 20px;
	color: white;
	font-weight: bold;
	font-size: 0.75em;
	line-height: 1.1em;
	text-decoration: none;
	}

.safari #site-nav ul li a {
	font-weight: normal;
	}
	
#site-nav ul li a:hover,
#site-nav ul li a:focus {
	background: url(../images/site-nav_a_bg.png) repeat top left;
	}

#site-nav .selected { background: url(../images/site-nav_a_bg.png) repeat top left; }


/* 6. Catcher
---------------------------------------------*/
#catcher {
	position: relative;
	z-index: 2;
	margin: 0 auto;
	padding: 15px 5px 0;
	width: 954px;
	background: url(../images/catcher_bg.png) no-repeat top left;
	}

#catcher .inner {
	padding: 0 10px;
	min-height: 365px;
	background: url(../images/catcher_inner_bg.jpg) no-repeat top left;
	}

#welcome {
	float: left;
	width: 543px;
	height: 356px;
	overflow: hidden;
	}

#welcome h2 {
	padding: 19px 0 0 26px;
	width: 290px;
	color: white;
	font-weight: normal;
	font-size: 1.9em;
	line-height: 1.2em;
	}

.safari #welcome h2 {
	text-shadow: #021740 0 1px 1px;
	}

#welcome p {
	margin: 35px 0 0 26px;
	width: 275px;
	color: white;
	font-size: 1.5em;
	line-height: 1.2em;
	}

.safari #welcome p {
	text-shadow: #00163E 0 1px 1px;
	}

#freebie {
	position: relative;
	float: left;
	width: 391px;
	height: 260px;
	}

#freebie h3 {
	position: absolute;
	left: -500em;
	background: url(../images/button.png) no-repeat top left;   /* preloading image */
	}

#freebie form div label {
	position: absolute;
	left: -500em;
	}

#freebie form div #freebie-name,
#freebie form div #freebie-email {
	position: absolute;
	left: 30px;
	padding: 10px 15px 0;
	width: 202px;
	height: 26px;
	border: none;
	color: white;
	font: bold 0.75em Arial, sans-serif;
	background: none;
	}

#freebie form div #freebie-name  { top: 113px; }
#freebie form div #freebie-email { top: 162px; }

.opera #freebie form div input[type="text"] {
	padding-top: 4px !important;
	}

.opera #freebie form div input[type="text"],
.ff2   #freebie form div input[type="text"] {
	text-indent: 1px;
	}

.safari #freebie form div #freebie-name  { text-shadow: #DA6205 0 1px 1px; }
.safari #freebie form div #freebie-email { text-shadow: #DF7C03 0 1px 1px; }

#freebie form div #freebie-sub {
	position: absolute;
	top: 210px;
	left: 30px;
	width: 114px;
	height: 36px;
	border: none;
	font-size: 0;
	letter-spacing: -100px;
	cursor: pointer;
	background: none;
	}

#freebie form div #freebie-sub:hover,
#freebie form div #freebie-sub:focus {
	background: url(../images/button.png) no-repeat top left;
	}

#subscribe h3 {
	position: absolute;
	left: -500em;
	}

#subscribe ul li {
	float: left;
	}

#subscribe ul li      { width: 193px; }
#subscribe ul li + li { width: 198px; }

#subscribe ul li a {
	display: block;
	height: 96px;
	overflow: hidden;
	text-indent: -500em;
	background: url(../images/subscribe_a_bg.jpg) no-repeat -500em 0;
	}

#subscribe ul li      a:hover,
#subscribe ul li      a:focus { background-position:      0 0; }
#subscribe ul li + li a:hover,
#subscribe ul li + li a:focus { background-position: -193px 0; }


/* 7. Content
---------------------------------------------*/
#content {
	position: relative;
	z-index: 1;
	margin: -176px auto 18px;
	padding-top: 196px;
	border: solid #06224D;
	border-width: 0 5px;
	width: 954px;
	height: 1%;
	background: white;
	}

.safari #content {
	text-shadow: white 0 1px 1px;
	}

#content:after {
	content: ".";
	clear: both;
	display: block;
	height: 0;
	visibility: hidden;
	}

#content-bottom {
	float: left;
	clear: both;
	margin: -6px -5px 0;
	width: 964px;
	height: 11px;
	background: url(../images/content-bottom_bg.png) no-repeat top left;
	}

#main {
	float: left;
	margin-left: 18px;
	padding-right: 21px;
	width: 600px;
	border-right: 1px solid #CECECE;
	}

#sub {
	float: left;
	margin-left: -1px;
	padding: 9px 0 0 12px;
	width: 292px;
	border-left: 1px solid #CECECE;
	}

#sub > div {
	margin-bottom: 25px;
	}

#sub h4 {
	margin-bottom: 13px;
	color: #E57B00;
	font-size: 0.9em;
	}

#search form {
	position: relative;
	height: 36px;
	background: url(../images/search_form_bg.png) no-repeat top left;
	}

#search form div #search-txt {
	position: absolute;
	top: 0;
	left: 0;
	padding: 11px 11px 0;
	width: 214px;
	height: 25px;
	border: none;
	color: #072656;
	font: 0.75em Arial, sans-serif;
	background: none;
	}

.opera #search form div #search-txt {
	padding-top: 0;
	height: 36px;
	}

#search form div #search-sub {
	position: absolute;
	top: 0;
	right: 0;
	width: 52px;
	height: 36px;
	overflow: hidden;
	border: none;
	font-size: 0;
	letter-spacing: -100px;
	cursor: pointer;
	background: none;
	}

#search form div:hover {
	width: 52px;
	height: 36px;
	background:url(../images/search_form_bg2.png) no-repeat top left;
	}

#widgets .textwidget {
	font-size: 12px;
	line-height: 18px;
	}

#cate ul, #widgets ul {
	border-top: 1px solid #CCC;
	margin-bottom: 20px;
	}

#cate ul li, #widgets ul li {
	padding: 9px 0 12px 28px;
	border-bottom: 1px solid #CCC;
	background: url(../images/bullet.png) no-repeat 10px 15px;
	}

.ie6-7 #cate ul li, #widgets ul li {
	padding: 8px 0 11px 28px;
	}

#cate ul li a, #widgets ul li a {
	color: #2F83D0;
	font-size: 0.75em;
	}

.ie6-7 #cate ul li a, #widgets ul li a {
	display: inline-block;
	}

#posts {
	overflow: hidden;
	}

#posts h4 {
	position: relative;
	float: left;
	margin-bottom: -6px;
	padding-left: 1px;
	border-top: 1px solid white;
	}

#posts h4.current {
	border-color: #CCC;
	background: url(../images/posts_h4_bg.png) no-repeat top left;
	}

#posts h4:first-child.current {
	padding-left: 3px;
	background: url(../images/posts_h4-first-child_bg.png) no-repeat top left;
	}

#posts h4 div {
	padding: 1px 1px 0 0;
	}

#posts h4.current div {
	background: url(../images/posts_h4_bg.png) no-repeat top right;
	}

#posts h4 div a {
	display: block;
	padding: 7px 11px 0;
	height: 26px;
	color: #E57B00;
	text-decoration: none;
	cursor: pointer;
	}

#posts h4 div a:hover,
#posts h4 div a:active,
#posts h4 div a:focus {
	color: #2F82D0;
	outline: none;
	}

#posts h4.current div a {
	color: #2F82D0;
	background: #E0E0E0;
	}

.safari #posts h4.current div a {
	text-shadow: #E0E0E0 0 1px 1px;
	}

#posts h4:first-child div a {
	height: 29px;
	text-indent: -2px;
	}

#posts h4:first-child.current div a {
	text-indent: -4px;
	}

#post ul li div {
	font-size: 14px;
	}

#post ul li a {
	text-decoration: underline;
	font-weight: bold;
	}

#post ul li a:hover {
	text-decoration: none;
	}

#post ul li a strong span {
	font-weight: bold;
	}

#post p.listtitle {
	font-weight: bold;
	font-style: normal;
	}

#post p.listtitle strong {
	font-weight: bold;
	}

#posts .inner {
	float: left;
	clear: both;
	width: 292px;
	background-image: url(../images/posts_inner_bg.png);
	}

#posts .inner-1 { background-repeat:  repeat-y; background-position: -292px    0; }
#posts .inner-2 { background-repeat: no-repeat; background-position:      0    0; }
#posts .inner-3 { background-repeat: no-repeat; background-position: -584px 100%; }

#posts div div div ol {
	display: none;
	margin: 4px 7px 10px;
	border-bottom: 1px solid #EBEBEB;
	}

#posts div div div ol li {
	padding: 8px 0 11px 23px;
	border-top:    1px solid #EBEBEB;
	border-bottom: 1px solid #CDCDCD;
	line-height: 0.75em;
	background: url(../images/bullet.png) no-repeat 0 -60px;
	}

.ie6-7 #posts div div div ol li {
	padding: 9px 0 9px 23px;
	line-height: 0.85em;
	}

#posts div div div ol li:first-child {
	border-top: none;
	}

#posts div div div ol li a {
	color: #00163F;
	font-size: 0.75em;
	}

.ie6-7 #posts div div div ol li a {
	display: inline-block;
	}

.safari #posts div div div ol li a {
	text-shadow: #E0E0E0 0 1px 1px;
	}

#twitter {
	position: absolute;
	left: -500em;
	}


/* 8. Supplementary Content
---------------------------------------------*/
#supp {
	border-bottom: 1px solid #45AAE3;
	background: #368CDA url(../images/supp_bg.png) repeat-x top left;
	}

#supp .inner {
	margin: 0 auto;
	padding-top: 12px;
	width: 954px;
	overflow: hidden;
	}

#supp .inner > div {
	float: left;
	padding-top: 14px;
	min-height: 211px;
	}

#supp .inner div h4 {
	margin-bottom: 12px;
	color: white;
	font-weight: normal;
	font-size: 0.9em;
	}

/*** ADDITION ***/
#twitter ol, #twitter ol li ul {
	list-style: none;
	background: none;
	}

#twitter_div {
	font-size: 12px;
	}

#twitter ol#twitter_update_list li {
	list-style-type: none;
	background: none;
	font: 12px;
	}

#twitter ol#twitter_update_list li a {
	font-size: 12px;
	}
/*** ADDITION ***/

.safari #supp .inner div h4 {
	text-shadow: #0D3C81 0 1px 1px;
	}

#about {
	margin-left: 19px;
	padding-right: 39px;
	width: 380px;
	background: url(../images/about_bg.png) no-repeat top right;
	}

#about p {
	color: white;
	font-size: 0.75em;
	line-height: 1.7em;
	}

.safari #about p {
	text-shadow: #17509a 0 1px 1px;
	}

#sitemap {
	margin-left: 38px;
	width: 240px;
	background: url(../images/about_bg.png) no-repeat top right;
	}

#sitemap ul div {
	float: left;
	margin-right: 16px;
	}

#sitemap ul .div-1 { width:  82px; }
#sitemap ul .div-2 { width: 122px; }

#sitemap ul li {
	margin-bottom: 8px;
	list-style-position: outside;
	}

#sitemap ul li a {
	color: white;
	font-size: 0.75em;
	line-height: 1.7em;
	}

.safari #sitemap ul li a {
	text-shadow: #17509a 0 1px 1px;
	}

#explore {
	margin-left: 34px;
	}

#explore ul li {
	margin-bottom: 8px;
	}

#explore ul li a {
	color: white;
	font-size: 0.75em;
	line-height: 1.7em;
	}

.safari #explore ul li a {
	text-shadow: #17509a 0 1px 1px;
	}


/* 9. Site Info
---------------------------------------------*/
#siteinfo {
	color: white;
	font-size: 0.7em;
	border-top: 1px solid #0C4EBA;
	background: #0C4FBC;
	}

.safari #siteinfo {
	text-shadow: #0C4FBC 0 1px 1px;
	}

#siteinfo .inner {
	position: relative;
	margin: 0 auto;
	padding: 24px 0;
	width: 916px;
	}


/* 10. Valid Codes
---------------------------------------------*/
#valid {
	position: absolute;
	top: 0;
	right: 0;
	padding: 24px 0;
	}

#valid a {
	color: white;
	}
	
/* 11. Form Elements
---------------------------------------------*/
.textbox { width: 256px; height: 30px; font-size: 16px; color: #333; font-weight: bold; padding-top: 12px; padding-left: 10px; padding-right: 10px; margin-bottom: 10px; }

.textarea { width: 256px; height: 130px; font-size: 16px; color: #333; font-weight: bold; padding-top: 12px; padding-left: 10px; padding-right: 10px; margin-bottom: 10px; }

.button { width: auto; height: 30px; border: none; font-size: 16px; color: #333; font-weight: bold; text-align: center; background: none; padding-left: 10px; padding-right: 10px; margin-bottom: 20px; }

#twitter_update_list span { font-size: 12px; line-height: 18px; !important }

/* 12. Additionals
---------------------------------------------*/
#social ul li {
	width: 141px;
	float: left;
	padding-bottom: 10px;
	}

#social ul li.right {
	padding-left: 10px;
	}

#social h4 {
	color: #E57B00;
	font-size: 0.9em;
	font-weight: bold;
	}
	
#social h4 strong {
	font-weight: bold;
	}