/* ============================
Title:       Montgomery Studios
URL:        montgomerystudios.com
Author:    Michael Montgomery

Created:   February 15, 2006
Modified:   September 16, 2006

Colors:     Blue: #263B85 Dark Blue: #1B2A5E Tan: #DFC97A Toupe: #978440
               Darker toupe: #66502B
=============================== */

/* ===== CSS CONTENTS =====
0: testing
1: reset
2: common formatting
3: layout
4: header
5: navigation
6: home page
7: testimonials?
8: portfolio
9: footer
10: IE hacks
==================== */

/* ===== 0: testing ===== */
/*
* { outline: 2px dotted red; }
* * { outline: 2px dotted green; }
* * * { outline: 2px dotted orange; }
* * * * { outline: 2px dotted blue; }
* * * * * { outline: 1px solid red; }
* * * * * * { outline: 1px solid green; }
* * * * * * * { outline: 1px solid orange; }
* * * * * * * * { outline: 1px solid blue; }
*/

/* ===== 1: reset ===== */
body, #content, #header, #footer, #nav, h1, h1 a, h1 a img, h2, h2 a, #footer p, #footer ul {
   border: 0;
   margin: 0;
   padding: 0;
   }
html {
   font-size: small;
   height: 100%;
   border-bottom: 1px solid #DFC97A;
}
body {
   /* 3.gif is the seal. */
   background: #DFC97A url(/images/3.gif) no-repeat 97% 400px;
   font-size: 95%; /* slight adjustment */
   height: 100%;
   }
h1 {
   /* 13.jpg is the fountain pen and handwriting. */
   background: url(/images/13.jpg) no-repeat right top;
   height: 350px;
   }
h2 {
   /* 14.gif is the slogan. */
   background: url(/images/14.gif) no-repeat left top;
   border-bottom: 7px solid #1B2A5E;
   height: 75px;
   position: relative;
   text-indent: -7000px;
   top: -75px;
   }
h3, h3 a {
   border: 0;
   font-weight: normal;
   font-family: Georgia, Times, Serif;
   font-size: 1.3em;
   margin: .3em 20px;
   }
p, blockquote, #content li, #footer li {
   font-family: Verdana, "Lucida Grande", Tahoma, Helvetica, sans-serif;
   font-size: 95%;
   line-height: 1.6em;
   text-align: left;
   margin: .5em 20px;
   }
a {
   /* ? */
   }
blockquote {
   /* margin-left: 2em;
   margin-right: 1em; */
   }
form {
   color: #1B2A5E;
   margin: 1em 10em;
   width: 42em;
   }
   form label {
      float: left;
      margin-bottom: 1em;
      padding-right: 2em;
      text-align: right;
      width: 20em;
      }
   form input, form textarea {
      float: right;
      margin-bottom: 1em;
      width: 20em;
      }
   form div p {
      clear: both;
      }
abbr, acronym, .help {
   border-bottom: 1px dotted #333;
   cursor: help;
   }
#container {
   position: relative;
   min-height: 100%;
}
#accessibility {
   position: absolute;
   top: -10000px;
}
/* Note: ul#nav li a {line-height + border-bottom} = ul#nav {height} */
/* Note: ul#nav {height + border-bottom} = #content {top} */
ul#nav {
   background: #263B85;
   border-bottom: .3em solid #1B2A5E;
   height: 1.55em;
   list-style: none;
   overflow: hidden;
   /* position: fixed; */
   position: absolute;
   top: 0;
   width: 100%;
   }
   ul#nav li {
      display: block;
      float: left;
      height: 1.5em;
      width: 25%;
      }
      ul#nav li a {
         background: #263B85;
         border-bottom: .05em solid #fff;
         border-right: 1px solid #fff;
         color: #fff;
         display: block;
         font-family: GoudySans, Tahoma, Verdana, "Trebuchet MS", Arial, sans-serif;
         font-size: 1.2em;
         line-height: 1.5em;
         text-align: center;
         text-decoration: none;
         }
         ul#nav li a:hover {
            background: #1B2A5E;
            }
body#default a#n1,
body#portfolio a#n2,
body#contact a#n3 {
   background: #1B2A5E url(/img/arrow.gif) no-repeat top center;
   text-decoration: underline;
   }
#content {
   /* bottom: 1.5em;
   left: 0;
   overflow: auto;
   position: fixed;
   right: 0;
   top: 1.85em; */
   }
#header {
   /* 10.jpg is the tan gradient and blue stripe. */
   background: url(/images/15.jpg) repeat-x left top;
   color: #000;
   height: 357px;
   left: 0;
   min-width: 650px;
   width: 100%;
   }
ul#taglines {
   margin: 0 0 50px 225px;
   position: relative;
   }
   ul#taglines li {
      display: block;
      font-family: Georgia, Times, Serif;
      font-size: 1.6em;
      letter-spacing: 1px;
      list-style: none;
      margin: 0;
      }
#description, #testimonial {
   margin-top: 20px;
   margin-bottom: 30px;
   display: inline;
   }
#description {
   float: left;
   margin-left: 5%;
   min-width: 4.5em;
   width: 45%;
   }
   #description a {
      color: #000;
      text-decoration: none;
      }
   #description a:hover {
      color: #fff;
      text-decoration: underline;
      }
/* Rounded Corner Boxes: */
#testimonial, #hoverbox {
   display: inline;
   float: right;
   margin-right: 10%;
   min-width: 4em;
   width: 40%;
   /* color: #fff;
   background: url("/images/22.gif") top left no-repeat;
   position:relative; */
   }
   #testimonial p {
      font-family: Georgia, Times, Serif;
      font-size: 1.4em;
      font-style: italic;
      margin: 0 10%;
      text-align: left;
      /* position:relative;
      background: url("/images/23.gif") top right no-repeat;
      padding:10px;
      padding-left:0;
      margin:0;
      right:-8px;
      top: 1px; */
      }
   #testimonial p.client {
      font-family: Verdana, "Lucida Grande", Tahoma, Helvetica, sans-serif;
      font-size: 1em;
      font-style: normal;
      line-height: 1.2;
      margin: 0 0 0 50%;
      }
   #testimonial ul {
      /* background:  url("/images/20.gif") bottom left no-repeat;
      position:relative;
      top: 21px; */
      }
   #testimonial ul li {
      font-size: 1em;
      list-style-type: none;
      padding: 0 10%;
      text-align: right;
      /* background: url("/images/21.gif") bottom right no-repeat;
      padding:15px;
      padding-left:0;
      display:block;
      margin:-2em 0 0 0;
      position:relative;
      right:-8px; */
      }
   #testimonial a {
      color: #66502B;
      font-size: .9em;
      }
   #testimonial a:hover {
      color: #fff;
      }
div.box_body {
  /* background: url("/images/24.gif") top right repeat-y;
  margin:0;
  margin-top:-2em;
  padding:15px;
  padding-left:0;
  position:relative;
  right:-8px; */
}
/* Hoverbox by Nathan Smith;
    improved by Craig Erskine and Michael Montgomery */
#hoverbox {
   list-style: none;
   margin-bottom: 30px;
   /* margin: 30px 100px 30px 10px; */
   }
   #hoverbox:after {
      clear: both;
      content: ".";
      display: block;
      height: 0;
      visibility: hidden;
      }
   #hoverbox li {
      display: inline;
      list-style: none;
      }
      #hoverbox li a {
         display: block;
         float: left;
         height: 150px;
         margin: 10px;
         position: relative;
         width: 200px;
         }
         #hoverbox li a:hover {
            font-size: 100%;
            z-index: 2;
            }
         #hoverbox li a img {
            background: #fff;
            border: 4px solid #1B2A5E;
            height: 150px;
            padding: 2px;
            position: absolute;
            width: 200px;
            }
         #hoverbox li a:hover img, #hoverbox li a:active img, #hoverbox li a:focus img {
            width: 300px;
            height: 225px;
            left: -50px;
            top: -37px;
            z-index: 1;
            }
/* ===== __: contact ===== */
.zemContactForm {
   margin: 0;
   width: 600px;
   }
.zemContactForm ol {
   list-style: none;
   }
.zemContactForm li {
   clear: both;
   }
.zemContactForm label {
   float: left;
   margin: .25em 1em 1em 0;
   text-align: right;
   width: 200px;
   }
.zemContactForm input, #zemContactForm textarea {
   float: right;
   margin: 0 0 .5em 0;
   width: 275px;
   }
.zemContactForm input.zemSubmit {
   clear: both;
   }
.zemRequired {
   font-weight: bold;
   }
.zemRequired:before {
   content: '* ';
   }
#footer {
   /* 4.gif is the footer gradient. */
   background: #DFC97A url(/images/4.gif) repeat-x left top;
   clear: both;
   height: 1.5em;
   margin-top: -3em;
   position: relative;
   padding-top: 1em;
   width: 100%;
   }
   #footer p, #footer ul li a {
      color: #66502B;
      }
   #footer p {
      float: right;
      font-size: .8em;
      padding-right: 3%;
      }
   #footer ul {
      float: left;
      padding-left: 5%;
      }
   #footer ul li {
      display: inline;
      list-style-type: none;
      margin: .5em 15px;
      }
   #footer ul li a {
      font-size: .9em;
      text-decoration: underline;
      }
   #footer ul li a:hover {
      color: #fff;
      }
   #footer ul.login {
      /* 25.gif is the ornament. */
      background: url(/images/25.gif) no-repeat 0 .25em;
      padding-left: 53px;
      }
/* Some hacks, to make IE behave */
* html #container {
   height: 100%;
}
* html #nav, * html #taglines li {
   height: 1%;
   }
* html #nav li {
   height: 1.55em;
   width: 19.9%;
   }
* html #testimonial {
   width: 35%;
   }