/* page */
html, body{ height: 100%; }
body{ font-family: Georgia, Palatino, Times, serif; background: url('/images/BG-top.png') #cce9ee repeat-x top; }
#page{ position: relative; min-height: 100%; }
#page-bg{ background: url('/images/BG-top-wlines.png') #cce9ee repeat-x top; position: absolute; top: 0; right: 0; height: 100%; width: 50%; }
#footer{ clear: both; }
.container{ /* width: 998px; */ min-width: 998px; max-width: 1098px; margin: 0 auto; }
#content{ padding-bottom: 40px; }
acronym{ border-bottom: 1px dotted; }

/* links */
#content a{ font-weight: bold; color: #39A7D8; text-decoration: none; font-size: 13px; }
/*#content a:hover{ text-decoration: underline; }*/

/* header */
#head{ height: 105px; position: relative; background: url('/images/BG-top-mid.gif') no-repeat 77px 0; }

/* logo */
#head h1{ background: url('/images/MM-logo.png') no-repeat; width: 228px; height: 34px; position: absolute; top: 43px; left: 31px; }
#head h1 a{ text-indent: -9999px; outline: 0; display: block; width: 100%; height: 100%; }

/* navigation */
#nav{ height: 33px; float: right; position: absolute; top: 40px; right: 111px; }
#nav li{ float: left; display: block; height: 33px; }
#nav li a{ color: #fff; font-weight: bold; text-decoration: none; font-family: Helvetica, Arial, sans-serif; line-height: 33px; display: block; height: 100%; }
#nav li a span{ width: 100%; height: 100%; text-indent: -9999px; outline: none; }
#nav-1 a{ background: url('/images/nav/home.png') no-repeat top right; width: 81px; }
#nav-2 a{ background: url('/images/nav/about.png') no-repeat top right; width: 79px; }
#nav-3 a{ background: url('/images/nav/feature.png') no-repeat top right; width: 146px; }
#nav-1.current a{ background: url('/images/nav/home-active.png') no-repeat top right; }
#nav-2.current a{ background: url('/images/nav/about-active.png') no-repeat top right; }
#nav-3.current a{ background: url('/images/nav/feature-active.png') no-repeat top right; }
#nav-1 a span{ background: url('/images/nav/home-hover.png') no-repeat top right; display: none; }
#nav-2 a span{ background: url('/images/nav/about-hover.png') no-repeat top right; display: none; }
#nav-3 a span{ background: url('/images/nav/feature-hover.png') no-repeat top right; display: none; }
#nav-2{ margin-left: -10px; }
#nav-3{ margin-left: -11px; }

/* content */
#content{ position: relative; }
#left{ background: url('/images/yellow-curtain.png') #fefefe repeat-x top left; margin: 0 396px 0 86px;  }
#left-bot{ background: url('/images/bottom-bit.png') transparent no-repeat top left; height: 20px; margin: 0 396px 0 86px; clear: both; }
#right{ position: absolute; right: 0; top: 0; width: 396px; background: url('/images/brown-gradient.png') #d4d2c5 repeat-x bottom left; }
#shad1{ position: absolute; bottom: 0; right: 0; background: url('/images/shad1.png') no-repeat left bottom; height: 5px; width: 361px; }
#shad2{ position: absolute; top: -5px; right: 0; background: url('/images/shad2.png') no-repeat 100% 5px; height: 100%; width: 5px; }



/* home */
.home #left{ padding-top: 50px; }
.home #left h2#we-make-websites{ background: url('/images/we-make-websites.png') no-repeat 35px 0; height: 26px; width: 435px; margin: 0 35px 10px 0; text-indent: -9999px; /* font-size: 34px; font-family: Helvetica, Arial, sans-serif; font-weight: bold; letter-spacing: -1px; color: #D15402;  */ }
.home #left p.large{ color: #624e3a; font-size: 16px; line-height: 20px; margin: 10px 85px 0 55px;  background: url('/images/2-lines.png') no-repeat 10px 100%; padding-bottom: 30px; }
.home #left div img{ display: block; position: absolute; top: 0; }
.home #left div h3{ color: #D15402; font-size: 16px; line-height: 20px; text-transform: lowercase; }
.home #left div p{ color: #917758; font-size: 13px; line-height: 17px; padding: 5px 10px; font-family: Arial, Helvetica, sans-serif; }
.home #left div{ clear: both; margin: 30px 40px; position: relative; }
.home #left div.image-right{ padding: 0 100px 0 40px; }
.home #left div.image-left{ padding: 0 40px 0 100px; }
.home #left div.image-left img{ left: 0; }
.home #left div.image-right img{ right: 30px; }
.home #left div.clear{ clear: both; width: 1px; height: 1px; padding: 0; margin: 0; float: none; }

.home #feature-box-container{ margin: 22px 15px 65px 20px; position: relative; padding-bottom: 5px; }

.home #feature-box{ border: 3px solid #f4edc8; background: #fff; margin: 0 5px 0 0; }
.home #feature-box .top{ border-bottom: 3px solid #f4edc8; text-align: right; position: relative; background: url('/images/feature-box-BGstrip.png') #ffffff repeat-x top left; padding-top: 45px; }
.home #feature-box .top a.banner-link{ display: block; position: absolute; top: 20px; left: 0; background: url('/images/see-Wicard.png') no-repeat; height: 39px; width: 290px; text-align: left; }
.home #feature-box .top a.banner-link span{ display: none; width: 100%; height: 100%; background: url('/images/see-Wicard-hover.png') no-repeat; text-indent: -9999px; text-align: left; }
.home #feature-box .top a.txt-link{ position: absolute; bottom: 15px; left: 15px; font-size: 13px; /* border-bottom: 1px solid #ffffff;*/ background: #ffffff; padding: 0 2px; }
.home #feature-box .bottom h4{ background: #f4edc8; margin: 3px; color: #D15402; display: block; float: left; padding: 9px; text-transform: lowercase; }
.home #feature-box .bottom ul{ clear: both; padding: 15px 0 15px 15px; }
.home #feature-box .bottom ul li a{ font-style: normal; /* border-bottom: 1px solid #ffffff;*/ background: #ffffff; padding: 0 2px; }
.home #feature-box .bottom ul li, 
.home #feature-box .bottom ul li a.stealth{ font-style: italic; color: #c8bfaf; font-size: 12px; line-height: 22px; font-weight: normal; letter-spacing: -0.1px; }

/* featured project */
.featured #left p.large{ margin: 0 80px 15px 55px; color: #624e3a; font-size: 16px; line-height: 20px; }
.featured #left p.small{ margin: 0 120px 5px 80px; color: #917758; font-size: 13px; line-height: 17px; font-family: Arial, Helvetica, sans-serif; }
.featured #left a{ /* border-bottom: 1px solid #ffffff;*/ background: #ffffff; padding: 0 2px; }
.featured #left span.shadow-top{ height: 15px; width: 1000px; background: url('/images/gallery-shadow-under50.png') no-repeat; display: block; }
.featured #left{ padding-bottom: 3px; padding-top: 55px; }
.featured #left ul{ width: 100%; overflow:hidden; margin-top: 20px; height: 490px; }
.featured #left ul li{ overflow:hidden; text-align: center; height: 60px; position: relative; margin: 0 3px; position: relative; }
.featured #left ul li span.shadow-top{ position: absolute; top: 0; left: 0; }
.featured #left ul li img{ vertical-align: middle; position: absolute; top: -95px; left: 0; }

.featured #feature-box-container{ margin: 22px 15px 15px 20px; position: relative; padding-bottom: 5px; }

.featured #feature-box{ border: 3px solid #f4edc8; background: url('/images/feature-box-BGstrip.png') #ffffff repeat-x top left; margin: 0 5px 0 0; }
.featured #feature-box h4{ background: #ffffff; margin: 3px; color: #D15402; display: block; float: left; padding: 9px; text-transform: lowercase; width: 140px; }
.featured #feature-box ul{ clear: both; list-style: none; padding: 20px 10px 40px 15px; }
.featured #feature-box li{ color: #624e3a; font-size: 13px; line-height: 17px; font-family: Arial, Helvetica, sans-serif; background: url('/images/bullet.gif') no-repeat 0 4px; padding: 0 30px 5px 20px; }
.featured #right a.banner-link{ display: block; background: url('/images/visit-site.png') no-repeat; height: 39px; width: 174px; text-align: left; margin-bottom: 50px; }
.featured #right a.banner-link span{ display: none; width: 100%; height: 100%; background: url('/images/visit-site-hover.png') no-repeat; text-indent: -9999px; text-align: left; }

/* about */
.about #left{ padding: 60px 0 160px 0; }
.about #right{ padding-bottom: 60px; }
.about #left p.large{ color: #624e3a; font-size: 16px; line-height: 20px; margin: 2px 80px 15px 55px; }
.about #left p.small{  margin: 0 120px 5px 80px; color: #917758; font-size: 13px; line-height: 17px; font-family: Arial, Helvetica, sans-serif; }

.about #left h3{ color: #D15402; font-size: 16px; line-height: 20px; text-transform: lowercase; margin: 30px 80px 15px 55px; padding-top: 50px; background: url('/images/2-lines.png') no-repeat 10px top; }
.about #left p#contact{  margin: 0 120px 5px 80px; color: #624e3a; font-size: 13px; line-height: 17px; font-family: Arial, Helvetica, sans-serif; }
.about #left p#contact a{ background: #ffffff; padding: 0 2px; margin-left: -2px; }

.about #feature-box-container{ margin: 22px 15px 15px 20px; position: relative; padding-bottom: 5px; }
.about #feature-box{ border: 3px solid #f4edc8; background: #ffffff; margin: 0 5px 0 0; }
.about #feature-box .top{ border-bottom: 3px solid #f4edc8; }
.about #feature-box .top li{ text-transform: lowercase; }
.about #feature-box h4{ background: #f4edc8; margin: 3px; color: #D15402; display: block; float: left; padding: 9px; text-transform: lowercase; width: 140px; }
.about #feature-box ul{ clear: both; list-style: none; padding: 20px 5px 20px 15px; }
.about #feature-box li{ color: #624e3a; font-size: 13px; line-height: 17px; font-family: Arial, Helvetica, sans-serif; background: url('/images/bullet.gif') no-repeat 0 4px; padding: 0 30px 5px 20px; }

.about #left p#contact a#envelope{ display: block; width: 55px; height: 43px; background: url('/images/envelopes.jpg') no-repeat 0 0; }
.about #left p#contact a#envelope:hover{ background: url('/images/envelopes.jpg') no-repeat 0 -43px; }

.about #left{ position: relative; }
#earth{ display: block; background: url('/images/earth.jpg') no-repeat; width: 205px; height: 108px; position: absolute; bottom: -13px; right: 3px; }


/* misc */
.misc #centre{ background: url('/images/yellow-curtain.png') #fefefe repeat-x top left; margin: 0 0 0 86px; padding: 40px; }
.misc #centre-bot{ background: url('/images/bottom-bit.png') transparent no-repeat top left; height: 20px; margin: 0 0 0 86px; clear: both; }
.misc #centre h2{ padding: 20px 0; font-size: 34px; font-family: Helvetica, Arial, sans-serif; font-weight: bold; letter-spacing: -1px; color: #D15402; }
.misc #centre p{ padding: 10px 0; }
.misc #centre a{ /* border-bottom: 1px solid #ffffff;*/ background: #ffffff; padding: 0 2px; }