/** STYLE SHEET FOR MGIC HOMEBUYER SITE: www.buywithmi.com (MI SPACE) *******/

body {
background-color: #ece3db;
margin-top: 1em;
margin-left:0;
margin-right:0;
margin-bottom: 0;
padding:0;
font-size:90%;
font-family: Arial, Verdana, Helvetica, sans-serif; 
/* needed to center all in IE5/WIN */
text-align:center;
}

/* wrap centers all */
#wrap {
margin-right:auto;
margin-left:auto;
width: 95%;
max-width: 1200px;
min-width: 900px;
/*min-width: 780px;*/
background-color: #fff;
/* overwrites IE5/WIN center hack in body */
text-align: left;
font-size: 1em;
}

* html div#wrap {width: 780px /* fallback value */;
width:expression(((document.compatMode && 
document.compatMode=='CSS1Compat') ? 
document.documentElement.clientWidth : 
document.body.clientWidth) 
> 1218 ? "1200px" : (((document.compatMode && 
document.compatMode=='CSS1Compat') ? 
document.documentElement.clientWidth : 
document.body.clientWidth) < 932 ? "900px" : "95%")); }
/*document.body.clientWidth) < 812 ? "780px" : "95%")); }*/


/**---- Header starts here----*/
#banner {
background-color: #fff;
margin:0;
}

/************* Utility Bar **************/

#utilitybar {
background-color: #ece3db;
padding-top: 1em;
padding-right: 1em;
padding-bottom:1em;
font-size: .9em;
margin:0;
overflow:visible;
_padding-bottom: 0;
}

#utilitybar div.left {
float: left;
clear: right;
margin-left: 0;
margin-right: 0;
margin-top:0;
margin-bottom: 0;
padding-top: .2em;
}

#utilitybar div.right {
float: right;
clear: left;
margin-left: 1em;
margin-right: 0;
margin-top:0;
margin-bottom: 0;
padding-top: .2em;
}

div.search {
margin-bottom: -1.5em;
padding-left: 0;
padding-right: 0;
padding-top: 0;
background:none;
_margin-top: -.4em;
_margin-bottom: 0;
_padding-bottom: 1em;
}
  
#utilitybar div.left ul {
list-style-type:none;
padding: 0;
margin: 0;
}

#utilitybar div.left li{
margin:0;
padding: 0;
display:inline;
font-size: .9em;
}

#utilitybar div.left li.copyright{
margin:0;
display:inline;
padding-left: .5em;
}

#utilitybar div.left a {
color:#10617f;
font-weight: bold;
margin: 0;
padding-right: 1em;
padding-top: 0;
background:none;
text-transform: uppercase;
}

#utilitybar div.left a:link, #utilitybar a:visited {
text-decoration:none;
}
#utilitybar div.left a:hover {
text-decoration:none;
color: #ed5100;
}
#utilitybar div.left a:active {
text-decoration:none;
}


/***------------- Search Box and Results page formatting ------------***/
#minisearch {
padding: 0;
margin: 0;
}

#minisearch input.searchbtn {
font-size: .9em;
background-color: #fff;
color: #10617f;
font-weight: bold;
text-align: center;
width: 4.5em;
height: 1.8em;
margin-left: .5em;
margin-top: 0;
padding-top: 0;
}

#minisearch input[type="submit"]:hover { 
color: #fff;
cursor:pointer;
}

#minisearch input.btnhov{
font-size: .9em;
background-color: #ed5100;
color: #fff;
font-weight: bold;
text-align: center;
width: 4.5em;
height: 1.8em;
margin-left: .5em;
}


#search_content{
width: 98%;
padding: .5em;
background-color: #fff;
}

#search_content table {
border: 0;
}

/* End Search */



#content{
width:100%;
}



/* ---- Left Column formatting, includes Left Nav items generated by the JavaScript menu ----- */

#leftcolumn{
float: left;
width: 20%;
background-color: #fff;
margin-top: .5em;
margin-right: .5em;
margin-left: .5em;
}

#leftcolumn ul {
list-style-type:none;
font-size: .8em;
padding:0;
margin-top: .5em;
margin-bottom: .5em;
margin-right:.5em;
margin-left:.5em;
}

#leftcolumn ul li {
list-style-type:none;
text-transform: uppercase;
padding:0;
margin:0;
}

#leftcolumn ul li a {
text-decoration: none;
	display: block;
	padding: .25em 0 .25em .25em;
	color: #10617f;
	_height: 1em;
}

#leftcolumn ul li a:hover {
text-decoration: none;
color: #ed5100;
}

#leftcolumn ul ul li {
font-size: 1.2em;
margin: 0;
padding:0;
}

#leftcolumn ul ul li a {
	display: block;
	padding: .25em 0 .25em .25em;
	color: #10617f;
	_height: 1em;
}

#leftcolumn ul ul li a:hover {
text-decoration: none;
color: #ed5100;
}


#leftnav {
margin-top: .25em;
padding: 0;
}

/* left nav current formatting in individual section style sheets to get different colors for each section */

/* -- end leftnav formatting -----*/


#centercolumn{
margin-top: 2.5em;
float: left;
width: 47%;
}

/*MGIC vs. FHA comparison tables*/
#centercolumn .tablefha {
border-right: 1px solid #dbd9d1;
font-size: .75em;
table-layout:fixed;
vertical-align:bottom;
}

#centercolumn .tablefha th {
border-left: 1px solid #FFFFFF;
border-bottom: 1px solid #FFFFFF;
font-weight: bold;
color: #000;
text-align: center;
background-color:#CCCCCC;
padding:5px;
vertical-align:bottom;
}

#centercolumn .tablefha th.noborder {
border-left:none;
}

#centercolumn .tablefha td {
border-left: 1px solid #dbd9d1;
border-bottom: 1px solid #dbd9d1;
text-align:right;
padding:5px;
}

#centercolumn .tablefha td.left {
text-align:left;
}

#centercolumn .tablefha tr.highlight {
background-color:#D1E8C8;
}

#centercolumn .footnote {
font-size:.75em;
font-style:italic;
text-align:left;
}

#center_noright {
margin-top: 2em;
float: left;
width: 75%;
}

#rightcolumn{
float: left;
clear: right;
width: 25%;
background-color: #fff;
margin-top: 4em;
margin-left: .75em;
}

/* --- note: rightcolumn content must be < 190 pixels wide or the right column will jump as you resize the browser window -----*/
/* -- typical rightcolumn images are 150px wide -----*/
/*-- .center centers images in the right column --*/
.center {
text-align: center;
}

#rightcolumn img {
margin-bottom: .5em;
border: 0;
}

#rightcolumn a {
color: #10617f;
}

#rightcolumn a:hover {
color: #ed5100;
}

#rightcolumn dl{
font-size: .9em;
margin-left: -2.5em;
}

.orange {
color: #ed5100;
}


/********HOME PAGE layout**** (leftnav is "display: none;" in the HTML code on the home page, so the JavaScript nav tabs can still see that code and will still display across the top; but the layout requires different attributes for the center and right columns) ***/


#centercolumn_home {
margin-top: 2.5em;
float: left;
width: 40%;
margin-left: 2em;
padding: 1em;
}

#rightcolumn_home{
float: left;
clear: right;
width: 40%;
background-color: #fff;
margin-top: 4em;
margin-left: 2.5em;
margin-right: 1em;
padding: 1em;
}

#rightcolumn_home img {
margin: .2em;
border:none;
}

h1.home {
color: #ed5100;
background-image: none;
padding-left: 0 !important;
}

/************* Footer **************/

#footer {
background-color: #1f601a;
width: 100%;
padding: 0;
margin: 0;
min-height: 2.85em;
_width: 98.7%;
}

#footer_search {
background-color: #1f601a;
width: 100%;
padding: 0;
margin: 0;
}

#footer_search div {
float: left;
clear: right;
background-color: #1f601a;
text-align:center;
border-right: .5em solid #fff;
padding: 1.45em;
text-transform: uppercase;
font-size: .7em;
}

#footer_search a {
overflow: visible;

}

#footer_search a:link, #footer_search a:visited {
text-decoration:none;
color:#fff;
}

#footer_search a:hover {
text-decoration:none;
color: #bef0f8;
}



#footer div {
float: left;
clear: right;
background-color: #1f601a;
text-align:center;
border-right: .5em solid #fff;
padding: 1.45em;
text-transform: uppercase;
font-size: .7em;
}

#footer div.copyright {
padding: .75em;
}


#footer a {
height: 100%;
overflow: visible;

}

#footer a:link, #footer a:visited {
text-decoration:none;
color:#fff;
}

#footer a:hover {
text-decoration:none;
color: #bef0f8;
height: 100%;
padding-top:.4em;
_padding-top: .15em;
}


/******************* Menu Tabs **************************/

#tabswrap {
background-color: #4ebcce;
min-height: 3.5em;
_height: 2em;
}

#tabs {
margin:0;
padding-left:10em;
_padding-left: 11.5em;
}

#tabs noscript p {
padding-top: 1em;
}

#tabs div {
float: left;
background-color:#4ebcce;
text-align:center;
border-right: .5em solid #fff;
padding-top:.9em;
padding-bottom: .9em;
padding-left: 1.5em;
padding-right: 1.5em;
text-transform: uppercase;
font-size: .8em;
font-weight: bold;
_padding-bottom: 1em;
}


#tabs div.first {
background-color:#ed5100;
background-image: url(http://www.buywithmi.com/images/mispace_logo_50.gif);
background-position:top left;
background-repeat:no-repeat;
border-right: .5em solid #fff;
border-left: .5em solid #fff;
min-width: 4.5em;
min-height: 4.5em;
padding: 0;
margin: 0;
_width: 4.5em;
_height: 4.5em;
}


#tabs a {
padding: 0;
}

#tabs a:link, #tabs a:visited {
text-decoration:none;
color:#fff;
}

#tabs a:hover {
text-decoration:none;
color: #bef0f8;
height: 100%;


}

#tabs a:active {
text-decoration:none;
color:#fff;
}



/* tabs div.on info in individual section css pages - so each section can have a different color */

#tabs span.tabssearch {
background-color:#266E92;
text-align:center;
border-right: 1px solid #fff;
margin-right: -.25em;
padding-top:.25em;
padding-bottom: .25em;
*padding-top: 0;
}

#tabs span.tabssearchfirst {
background-color:#266E92;
text-align:center;
border-right: 1px solid #fff;
border-left: 1px solid #fff;
margin-right: -.25em;
padding-top:.25em;
padding-bottom: .25em;
*padding-top: 0;
}

#tabs span.tabssearchsecond {
background-color:#266E92;
text-align:center;
border-right: 1px solid #fff;
padding-top:.25em;
padding-bottom: .25em;
*padding-top: 0;
*padding-bottom:.25em;
*margin-right:-.25em;
*margin-left:-.25em;
}
/*********************** text elements **********************************/

h1 {
background-image: url(http://www.buywithmi.com/images/orange_square.gif);
background-position: center left;
background-repeat: no-repeat;
padding-left: .6em;
font-size: 1.5em;
font-weight: normal;
text-transform: uppercase;
}

h2 {
/*color:#10617f;*/
color:#000;
font-size: 1.1em;
margin-bottom: -.25em;
text-transform: uppercase;
}

.sitemap h2 {
background-image: url(../images/orange_arrow.gif);
background-position: top left;
background-repeat: no-repeat;
padding-left: 1.25em;
padding-top: .1em;
}


p {
font-size: .9em;
}


.gutter{
padding: .5em;
margin: 0;
}

.clear {
clear: both;
}

ol {
font-size: .9em;
}

ol li {
line-height: 1.4em;
margin-bottom: .5em;
}


ul {
font-size: .9em;
}

ul li {
line-height: 1.4em;
margin-bottom: .5em;
}

ul.none li {
line-height: 1.4em;
margin-bottom: .5em;
list-style-type: none;
}

ul li.pdf {
line-height: 1.4em;
margin-bottom: .5em;
list-style-type: none;
margin-left: -1.5em;
}


.sitemap ul {
font-size: .9em;
}

.sitemap ul li {
line-height: 1.4em;
margin-bottom: .5em;
list-style-type: square;
color: #4ebcce;
}

.sitemap ul ul li {
line-height: 1.4em;
margin-bottom: .5em;
list-style-type: none;
}


/*** Definition List (dl, dt, dd) - this kind of list is on the MI FAQs page ***/

dl {
font-size: .9em;
}

dt {
color:#000;
font-size: 1em;
font-weight: bold;
margin-bottom: -.75em;
text-transform: uppercase;
margin-top: 1.5em;
}

dd {
margin-top: .75em;
}


a {
color: #10617f;
text-decoration:none;
}

a:hover {
color: #ed5100;
}

/*** Horizontal anchor links/subnav on top of Calc Help pages (item one | item two | item three) **/
#inline_subnav {
font-size: .9em;

}

.top{ padding:3px 20px; background-image:url(../images/icon_top.gif);background-repeat:no-repeat; background-position:0 50%;}


.mini {
font-size: .75em;
}


/***** Generic Table Formatting *****/

table.generic_form {
width: 100%;
font-size: .9em;
}

td.left {
width: 50%;
text-align: right;
vertical-align:top;
}

td.right {
width: 50%;
vertical-align:top;
text-align: left;
}


#contact {
width: 100%;
}


#contact input.buttons { 
font-size: 1em;
background-color: #2e4f89;
color: #fff;
margin-top: 4px;
margin-bottom: 2px;
text-align: center;
font-weight: bold;
width: 75px;
height: 22px;
} 

#contact input[type="submit"]:hover { 
background-color: #ed5100; 
color: #04233f;
}

#contact label {
font-weight:normal;
color: #000;
font-size: .9em;
}

#contact legend {
background-color: #fff;
padding: .2em;
font-size: .9em;
font-weight: bold;
color: #2e4f89;
text-transform: uppercase;
} 

#contact textarea {
font-family: Arial, Helvetica, sans-serif;
font-size: .9em;
}

#contact fieldset {
border: 1px solid #2e4f89;
padding: .25em;
width: 100%;
}

.required {
font-weight: bold;
font-size: 1.2em;
color: #CC0000;
}


/* Icon styles*/

.pdf { 
padding-left:2em;
background-image:url(../images/icon_pdf_sm.gif);
background-repeat:no-repeat; 
background-position:0 .1em;
list-style-type: none;
margin-left: 0;
}

.htm { 
padding-left:2em;
background-image:url(../images/icon_htm.gif);
background-repeat:no-repeat; 
background-position:0 .1em;
list-style-type: none;
margin-left: 0;
}

.ppt { padding:3px 20px; background-image:url(../images/icon_ppt.gif);background-repeat:no-repeat; background-position:0 50%;}
.xls { padding:3px 20px; background-image:url(../images/icon_xls.gif);background-repeat:no-repeat; background-position:0 50%;}
.doc { padding:3px 20px; background-image:url(../images/icon_doc.gif);background-repeat:no-repeat; background-position:0 50%;}
.top{ padding:3px 20px; background-image:url(../images/icon_top.gif);background-repeat:no-repeat; background-position:0 50%;}
.popup{ padding:3px 20px; background-image:url(../images/icon_popup.gif);background-repeat:no-repeat; background-position:0 50%;}