@charset "UTF-8";
/* CSS Document */

body {
	margin: 0;
	padding: 0;
	background: #FFFFFF url(images/img01.jpg) repeat-x;
	font: normal 11px Arial, Helvetica, sans-serif;
	color: #666666;
}

p {
	font-family:helvetica;
	font-size: 12px;
	color:#666666;
	margin: 0px;
	padding: 0px;
	line-height: 1.5em;
}

h2 {
	font-size: 20px;
	font-family: Helvetica;
	color: #213655;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 40px;
	margin-left: 0px;
}
h3 {
	font-size: 14px;
}
.story {
	width: 320px;
	height: 90px;
	padding-top: 5px;
	padding-bottom: 5px;
	font-size: 12px;
	line-height: 1.5em;
	font-family: Helvetica;
}
.post {
	width: 320px;
	margin-bottom: 15px;
}

a {
	color: #FF9900;
}

a:hover {
	text-decoration: none;
}

/* Header */

#header {
	width: 768px;
	height: 135px;
	background: url(images/img02.jpg);
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
}

/* Menu */

#menu {
	width: 768px;
	height: 30px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	padding-bottom: 25px;
}

/* Content */

#content {
	width: 755px;
	margin-top: 15;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	background-image: url(images/middle.jpg);
	background-repeat: repeat-x;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #213655;
	padding-top: 20px;
	padding-right: 10px;
	padding-bottom: 0px;
	padding-left: 10px;
}
#logo {
	background-image: url(images/logo.png);
	background-repeat: no-repeat;
	height: 100px;
	width: 290px;
}
.floatimgleft {
	margin-right:5px;
	float: left;
	margin-bottom: 10px;
}
.floatimgright {
	margin-right:5px;
	float: right;
	margin-bottom: 5px;
}
.title {
	font-family: Helvetica;
	font-size: 14px;
	font-weight: bold;
	color: #213655;
}
.focusing {
	font-family: Helvetica;
	font-size: 14px;
	font-weight: bold;
	color: #535c6b;
}
#middle/* Posts */

 {
	float: left;
	width: 320px;
	margin-top: 10px;
	height: 350px;
}
#left {
	float: left;
	width: 170px;
	margin-top: 10px;
	margin-right: 10px;
}
#botright {
	float: right;
}
#sidebar/* Links */

 {
	float: right;
	width: 225px;
	margin-top: 10px;
	background-image: url(images/sidebar.jpg);
	background-repeat: repeat-x;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #213655;
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
}

#links li h2 {
	font-size: 14px;
}

/* Footer */

#footer {
	height: 176px;
	background-image: url(images/img07.jpg);
	background-repeat: repeat-x;
}

#footer p {
	text-align: center;
	color: #ffffff;
	padding-top: 25px;
}

#footer a {
	color: #213655;
}
#footer a:hover {
	color: #213655;
}
#botlogo {
	float: left;
	width: 170px;
	margin-top: 106px;
	margin-right: 10px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #213655;
	background-image: url(images/adbkgrnd.jpg);
	background-repeat: repeat-x;
	height: 200px;
	padding-top: 10px;
}
.head {
	font-family: Helvetica;
	font-size: 14px;
	font-weight: bold;
	color: #213655;
}
#contentbot {
	margin-right: auto;
	margin-left: auto;
	background-image: url(images/bottom.jpg);
	height: 76px;
	background-repeat: repeat-x;
	width: 770px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #213655;
	margin-bottom: 15px;
}







/* ######### NAVIGATION ######### */
.nav-container {
	width: 768px;
	height: 30px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	padding-bottom: 25px;
}
.spacer {
	float: left;
	height: 28px;
	width: 1px;
	background-color: #FFFFFF;
	margin: 0px;
	padding: 0px;
}
.chromestyle{
	width: 100%;
	height: 28px;
	float: left;
	padding-left: 2px;
}

.chromestyle:after{ /*Add margin between menu and rest of content in Firefox*/
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}
#seperator {
	width: 700px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #213655;
	padding-top: 20px;
}
#middlefull {
	float: left;
	width: 755px;
	margin-top: 10px;
}
#middlefull li {
	font-family: helvetica;
	font-size: 12px;
	color: #666666;
	line-height: 1.5em;
}

#middlefull ul { list-style-image: url(images/checkmark.png); }


#middlefull h2 {
	font-size: 20px;
	font-family: Helvetica;
	color: #213655;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
}
#middlefull h3 {
	font-size: 20px;
	font-family: Helvetica;
	color: #213655;
	padding: 0px;
	margin-top: 25px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}
#middlefull h4 {
	color: #213655;
	font-family: Helvetica;
	font-size: 14px;
	font-weight: bold;
	margin: 0px;
	padding: 0px;
}
#middlefull em {
	font-size: 12px;
}
#loancalc {
	float: left;
	width: 725px;
	margin-top: 10px;
	padding: 10px;
}
#resource {
	float: left;
	width: 755px;
	margin-top: 10px;
}
#resource li {
	font-family: helvetica;
	font-size: 12px;
	color: #666666;
	line-height: 1.5em;
}
#resource  ul {
	list-style-image: url(images/checkmark.png);
}
#resource h2 {
	font-size: 20px;
	font-family: Helvetica;
	color: #213655;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 5px;
	margin-left: 0px;
}
#resource h3 {
	font-size: 12px;
	font-family: helvetica;
	color: #666666;
	text-decoration: underline;
	font-weight: normal;
	line-height: 1.5em;
}
#resource h4 {
	font-size: 12px;
	font-family: helvetica;
	color: #000000;
	line-height: 1.5em;
	padding: 0px;
	font-weight: normal;
	font-style: italic;
	margin-right: 0px;
	margin-bottom: 30px;
	margin-left: 0px;
}


/* News and Media Page */

/*
  +------------------------------------------------------------------+
  | Green-Beast.com                                                  |
  | CSS: List Boxes                                                  |
  | Cascading Style Sheet                                            |
  | Copyright Aug 2007                                               |
  | Use with attribution by visible link please!                     |
  | Attribute to: <a href="http://green-beast.com/">Mike Cherim</a>  |
  +------------------------------------------------------------------+
*/ 

/*
  Below is the CSS need for the list. I also added the CSS used for 
  the wrapper and headings and paras. I will mark them as separate.
  Please note that if you use this, you may need to zero or re-
  calculate the padding and margin of the ul, li, h3 (if used) and p.
  The reason is I am using a gloab reset with nothing spec'd for ul
  and li so mine are effectively zero except as marked.
*/

/*
  First define a content are width and position, if needed. I'm centering
  the 623px wide shell
*/
#clb-shell {
	width : 762px;
	margin-right: auto;
	margin-left: auto;
	padding-left: 10px;
}

/*
  Now I'm resetting the paragraph padding (it was zeroed). I'm also clearing
  the p, but I don't really need this for the top one, only the bottom. The 
  top has no effect (it'll clear the heading by default), but it is needed 
  for the bottom (depending on the shell width versus the ul width). It may 
  not be needed at all. Your situation will determine.
*/
#clb-shell p {
	clear : both;
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
}

/*
  I define the width of the ul, set the height (in ems!) align the text and
  remove list styles. The last may not be needed on most browsers
*/
ul#clb {
	width : 725px;
	height : 100%;
	display: inline;
}

/*
  Now I style the individual boxes (li)
*/
ul#clb li {
	width : 400px;
	float : left;
	display : inline;
	height: 100%;
}

/*
  Style the li links
*/
#clb-shell a {
	color : #FF9900;
}
#clb-shell a:hover, #clb-shell a:focus, #clb-shell a:active {
  color : #000;
  text-decoration : none;
}
#clb-shell a:focus, #clb-shell a:active {
  background-color : #fff;
}
#clb-shell /*
  Style the h3 links
*/
 ul#clb  h3  {
	color : #FFFFFF;
	display : block;
	width : 500px;
	background : #213655;
	border-bottom : 1px solid #666;
	padding-top: 4px;
	padding-right: 3px;
	padding-bottom: 3px;
	padding-left: 8px;
}
.videotitle {
	font-weight: bold;
	color: #213655;
	font-size: 16px;
	font-family: Helvetica;
}
#clb-shell ul#clb h3 a:hover, #clb-shell ul#clb h3 a:focus, #clb-shell ul#clb h3 a:active {
	color : #fff;
}

/*
  This tyles the text p content within the li separately. The most important 
  thing here is to re-kill the padding and add the margin to create good gutters
*/
ul#clb p {
	font-size : 1em;
	padding : 0;
	color: #666666;
	font-family: Helvetica;
	margin-top: 2px;
	margin-right: 2px;
	margin-bottom: 2px;
	margin-left: 2px;
}

/* End Styles */
#leftlink {
	float: left;
	width: 400px;
	margin-top: 10px;
}
#leftlink h2 {
	font-size: 20px;
	font-family: Helvetica;
	color: #213655;
	padding: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
}
#rightlink {
	float: right;
	width: 325px;
	margin-top: 10px;
	height: 100%;
	background-image: url(images/sidebar.jpg);
	background-repeat: repeat-x;
	border-top: 1px solid #213655;
}
#rightlink h2 {
	font-size: 20px;
	font-family: Helvetica;
	color: #213655;
	padding: 5px 0px 0px 5px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
}
#ticker {
	width: 350px;
	padding: 0px;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	text-align: center;
}
#ticker p {
	text-align: left;
}
#vidright {
	float: right;
	width: 350px;
	margin-top: 10px;
}
#medialeft h3 {
	font-family: Helvetica;
	font-size: 18px;
	color: #213655;
	padding-left: 95px;
}
#medialeft p {
	font-family: Helvetica;
	font-size: 1.1em;
	color: #666666;
	padding-left: 95px;
}
#medialeft {
	width : 762px;
	margin-right: auto;
	margin-left: auto;
	padding-left: 10px;
}
.icon {
	float: left;
}
.disclaimer {
	font-size: 10px;
	color: #213655;
	text-align: center;
	display: block;
}


.thanks {
	font-size: 12;
	font-family: Helvetica;
	color:#213655;
}

.error {
	font-size: 12;
	font-family: Helvetica;
	color:#CC0000;
}
#mortgage-calculator {
	float: left;
	width: 725px;
}
#middlefull img {
	float: left;
	margin-right: 25px;
	margin-bottom: 25px;
}
#indvid {
	width: 215px;
	height: 290px;
	background-image: url(images/sidevid.jpg);
	background-repeat: repeat-x;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #213655;
	padding-top: 10px;
	padding-right: 5px;
	padding-left: 5px;
}
#indvid img {
	margin-bottom: 5px;
	margin-left: 40px;
}
#indvid p {
	color: #666666;
	padding-left: 5px;
}
#videoplayer {
	margin-top: 10px;
	margin-bottom: 10px;
	display: block;
	margin-left: 5px;
}
.vidtitle {
	font-family: Helvetica;
	font-size: 16px;
	color: #FFFFFF;
	padding-left: 5px;
	padding-top: 10px;
	display: block;
	font-weight: bold;
	text-transform: uppercase;
}
#content img a {
}
#medialeft img {
	margin-top: 10px;
}
#resource img {
	margin-bottom: 20px;
}
#middlefull p {
	padding-bottom: 10px;
}

.vidbox {
	float: left;
	height: 275px;
	width: 320px;
	text-align: center;
	background-image: url(images/indvid.jpg);
	background-repeat: repeat-x;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #213655;
	padding-top: 10px;
}
#graphs {
	width: 750px;
}
#botcontent {
	width: 755px;
	margin-top: 15;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	background-image: url(images/middle.jpg);
	background-repeat: repeat-x;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #213655;
	padding-top: 20px;
	padding-right: 10px;
	padding-bottom: 0px;
	padding-left: 10px;
	height: 255px;
}
#botleft {
	float: left;
	display: block;
}
#botfollow {
	width: 755px;
	margin-top: 15;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	background-image: url(images/middle.jpg);
	background-repeat: repeat-x;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #213655;
	padding-top: 20px;
	padding-right: 10px;
	padding-bottom: 0px;
	padding-left: 10px;
	height: 100px;
}


a.swap {
	background-image:url(images/facebook1.jpg);
}

a.swap:hover {
	background-image:url(images/facebook2.jpg);
}