/* Marketing Miracles main CSS */

/* Initialisations */
body, div, h1, h2, h3, span, ul, li, p {margin: 0; padding: 0;}
ul {list-style: none;}

/* General */
body {
background: white url(../images/bgmain.jpg) top left repeat-x;
font-family: Arial, Helvetica, sans-serif;
font-size: 90%;}

div#wrap {
width: 800px;
margin: 20px auto;
position: relative;
/*border: 1px dotted red;/**/}

/* Header section begin */
div#header {
background: white;
width: 680px;}

.hdr1 {
display: block;
background: transparent url(../images/logo.gif) 5px 5px no-repeat;
height: 140px; /* Background image height actual = 127px */
/*border: 1px dotted blue;/**/}

.contact {
color: #66CC00;
font-size: 0.9em;
position: absolute;
top: 1em;
left: 48%;}

.tel {top: 2.25em;}
.mob {top: 3.75em;}
.eml {top: 5.25em;}
.eml1 {top: 6.75em;}

/* No address or phone for now*/
.addr, .tel {display:none;}

div#navcontainer {
width: 680px;
height: 1.8em;
background: #66CC00;
border-bottom: 1px solid #77DD00;}

div#navcontainer ul {
list-style: none;
height: 1.8em;
padding: 0.4em 0;
/*border:1px dotted pink;/**/}

div#navcontainer ul li {
margin: 0 0.25em;
display: inline;
/*border:1px dotted yellow;/**/}

div#navcontainer ul li a {
text-decoration: none;
color: #CCFFCC;
/*border:1px dotted pink;/**/}

div#navcontainer ul li a span {padding: 5px 2% 5px 2.5%;}

div#navcontainer ul li#activeh a, div#navcontainer ul li a:hover {
color: #FFFFFF;
font-weight: bold;}

div#navcontainer ul li#activeh a span, div#navcontainer ul li a:hover span {
background: transparent url(../images/nav-sel.jpg) center left no-repeat;
padding: 5px 1.1% 5px 2.5%;}
/* Header section end */

/* Main content begin */
div#maincontent {
background: #0066CC;
width: 640px;
position: absolute;
top: 100%;
left: 0;
padding: 10px 20px 20px;
border-top: 1px solid #003399;
z-index: 10;}

div#foto {
text-align: justify;
font-size: 0.9em;
color: white;
float: right;
margin: 0 20% 0 2em;
width: 178px;} /* Image width + 3px border on left and right */

div#foto img {
border: 3px solid white;
margin-bottom: 0.25em;}

.hdrs span {display: none;}

.graf, .hdr2 {
color: white;
width: 500px;
line-height: 1.25em;
text-align: justify;}

.hdr2X {
display: block;
background: transparent url(../images/h2-bg.jpg) top left no-repeat;
height: 27px;} /* background image height */

.hdr2 {
display: block;
background: transparent url(../images/h2-bg.gif) top left no-repeat;
height: 27px;} /* background image height */

.hdr2A {
display: block;
background: transparent url(../images/h2-bg2.jpg) top left no-repeat;
height: 27px;} /* actual background image height is 23px */

.ahdr3 {
display: block;
padding-bottom: 0.5em;
border-bottom: 1px solid #FFCCCC;
background: transparent url(../images/ah3-bg.jpg) top right no-repeat;
height: 20px;} /* background image height */

.hdr3 {
display: block;
padding-bottom: 0.5em;
border-bottom: 1px solid #FFCCCC;
background: transparent url(../images/h3-bg1.jpg) top right no-repeat;
height: 20px;} /* background image height */

.ahdr2-1 {
display: block;
width: 200px;
background: transparent url(../images/ah2-bg1.jpg) top left no-repeat;
height: 25px;} /* background image height actual 23px*/

.ahdr2-2 {
display: block;
width: 250px;
background: transparent url(../images/ah2-bg2.jpg) top left no-repeat;
height: 25px;} /* background image height actual 24px*/

.ahdr2-3 {
display: block;
width: 200px;
background: transparent url(../images/ah2-bg3.jpg) top left no-repeat;
height: 25px;} /* background image height actual 23px*/

.graffst, .grafmid {
margin-top: 1em;
margin-bottom: 1em;}

.graffst {text-indent: 1.5em;}

.graffst:first-letter {font-size: 1.375em;}

.ulist {
margin-top: 1em;
margin-left: 1.5em;
list-style: disc;
color: white;}

div#stmtwrap {
width: 220px;
position: absolute;
top: 35px;
left: 550px;
z-index: 20;
background: transparent url(../images/stmtwrap-bg.jpg) top left repeat-y;
/*border: 1px dotted black;/**/}

div#statements {
margin-left: 15px;
padding: 10px 8px;
background: #990033;}

.stmt {
font-size: 0.9em;
color: #FFCCCC;}

.stmtfst, .stmtmid {margin-bottom: 1em;}

.stmtfst {
border-top: 1px solid #660033;
padding-top: 0.5em;}

.bstmt {
display: block;
font-size: 90%;
color: #FFCC33;
text-align: right;}

.mmform {
text-align: justify;
border-top: 1px solid #660033;}

.mmform label, .mmform input, .btns, .mmform textarea {
font-size: 0.9em;}

.mmform label {
margin-top: 0.25em;
display: block;}

.mmform input, .mmform textarea {
color: #660033;
display: block;
background: #FFCCCC;
font-family: Arial, Helvetica, sans-serif;
border: 1px solid #440011;}

.btns {
margin-top: 0.25em;
color: #660033;
font-weight: bold;
border: 1px solid black;
border-color: #DDAAAA #990066 #990066 #DDAAAA;}

.btn1 {margin-right: 0.5em;}

.mmform input:focus, .mmform textarea:focus {background: #DDAAAA;}
/* Main content end */

/* Footer section begin */
div#footer {
color: #0066CC;
position: absolute;
top: 100%;
left: 0;
width: 680px;
height: 50px;
z-index: 30;
font-size: 0.75em;
background: #FFCC00 url(../images/footer-bg.gif) top left no-repeat;
/*border: 1px dotted red;/**/}

div#footer div {display: block;}

div#footer a {
color: #0066CC;
text-decoration: underline;}

div#footer a:hover {color: #990033;}

div#navfooter {
position: inherit;
top: 8px;
left: 75px;
width: 200px;
/*border: 1px dotted red;/**/}

div#navfooter ul, div#w3clinks ul {list-style: none;}

div#navfooter ul li {
margin-right: 1em;
display: inline;}

div#navfooter ul li#activef a, div#navfooter ul li#activef a:hover {
color: #990033;
text-decoration: none;}

div#copyrite {
text-align: right;
position: inherit;
top: 8px;
right: 75px;
width: 250px;
/*border: 1px dotted red;/**/}

div#pico {
text-align: right;
position: inherit;
bottom: 8px;
right: 75px;
width: 100px;
/*border: 1px dotted red;/**/}

div#w3clinks {
position: inherit;
bottom: 8px;
right: 170px;
width: 130px;}

div#w3clinks ul li {
margin: 0;
padding: 0 0.5em;
display: inline;
/*border: 1px dotted red;/**/}

div#w3clinks ul li.linknot {padding: 0;}
.linkfst {border-right: 1px solid #0066CC;}

/* Browser hacks courtesy of CSS Browser Selector by Rafael Lima (http://rafael.adm.br) */
.safari div#footer {font-size: 0.75em;}
.safari #mmform1 input {width: 15.5em;}
.safari #mmform1 textarea {width: 15.5em;}
.opera #mmform1 input {width: 15.5em;}
.opera #mmform1 textarea {width: 15.5em;}

/* Footer section end */