@import url(reset-min.css);
@import url(fonts-min.css);

/* COLORS */
#foot { color: white; }
nav a, #home h3, #about h2, #contact #toc a, #thanks a, #contact #content a { 
    color: #094C71; } /* DULL BLUE */
#nav li { border-color: #094C71; }

#home #menu a { color: black; }

#home #quotes, #portsub h2, #portsub .quote, #contact h2, #contact #content p.phone, #westcoast, #eastcoast { 
    color: #757779; } /* LIGHT GRAY */
#home #select, #portsub h1, #about p, #portsub .types, #request p.privacy-note, #westcoast h4, #eastcoast h4 {
    color: #4B4B4D; } /* DARK GRAY */

#home #menu li { border-color: white; }
#home #menu li:hover, #home #menu li.selected, #home #menu li.hovering { background-color:#E8F0F7; }
#nav li a.selected { border-color: #FCDD58; }  /* BORING YELLOW */
#contact #toc li { border-color: white; }


#services li, #port li, #about #content {
    background-color: #F7F9FD; }  /* LIGHT LIGHT BLUE */

#request #form, #portsub #content, #contact #content {
    background-color: white; }
#services h3, #port h3, #request h2, #portsub a, #port a, #portsub #portfront ul li { 
    color: #004FA3; }  /* KINDA BRIGHTER BLUE */


/* FONTS */
a { text-decoration:none; }
strong { font-weight: bold; }
em, #home #quotes, #portsub .quote { 
    font-style: italic; }

body { font-family: trebuchet ms,trebuchet,arial; }
#home #quotes { font-family: georgia; }

#home #menu h2, #home #select h3, #services h3, #port h3, #request h2, 
#port dt, #portsub a, #about h2, #contact #toc {
    text-transform: uppercase;}
span.lowercase { text-transform: none; }

#foot { font-size: 85%; }  /* 11px */

#home #menu h2 { font-size: 138.5%; }  /* 18px */
#home #menu li, #contact #toc { font-size: 108%; line-height: 108%; }  /* 14px */
#contact #toc { line-height: 1.5em; } 
#home #select h3, #services h3, #port h3 { font-size: 131%; }  /* 17px */
#home #select p { font-size: 85%; line-height: 138.5%; }  /* 11/18px */
#request #form p, #about p { font-size: 85%; }
#about h2 { font-size: 108%; font-weight: bold; }
#services li p, #portsub p, #contact #content p, #portsub .types li { font-size: 85%; }  /* 11px */
#nav, #contact #content h2 { font-size: 116%; }  /* 15px */

#request h1, #portsub h1 { font-size: 153.9%; } /* 20px */




/* WHITE BOX POSITIONING */
#mainbox, #mainbox_top, #mainbox_bottom { margin: auto; width: 797px; }
#mainbox { background-image: url(/media/img/bkg/mainbox_bg.jpg); }
#mainbox_top { background-image: url(/media/img/bkg/mainbox_top.jpg); height: 28px; }
#mainbox_bottom { background-image: url(/media/img/bkg/mainbox_bottom.jpg); height: 39px; }

#main { padding: 10px 40px; text-align: left;}
#logo { float: left;}
#westcoast, #eastcoast { float: right; font-variant: small-caps; }
#westcoast h4, #eastcoast h4 { font-weight: bold; }
#westcoast { text-align: right; border-right: 1px solid #bbbbbb; padding-right: 5px; }
#eastcoast { padding-left: 5px; padding-right: 10px; }
body {
    text-align:center;
    margin: 20px auto;
    background-image: url(/media/img/bkg/backgrounddots.gif);
}


#foot { width: 100%; margin: auto; }
#foot img { vertical-align: middle; }
#foot img.left { padding-left: 25px; padding-right: 46px; }
#foot img.right { padding-left: 25px; padding-right: 25px; }

#nav { width: 100%; text-align:right; }
#nav ul { margin: auto; }
#nav li {
    padding: 0px 10px;
    display:inline;
    border-left-style: solid;
    border-left-width: 1px;
}
#nav li.first { border-left-style: none; }


#nav li a.selected { 
    padding-bottom: 3px;
    border-bottom-style: solid;
    border-bottom-width: 3px;
}

#home #overview {
    height: 339px;
    width: 672px;
    margin-top: 20px; 
    padding: 15px 25px 0px 10px;
    background: url(/media/img/bkg/lightbluebox.gif) top left;
}

/*  LIST OF MARKETS  */
#home #menu {
    float:left;
    width:230px;
    padding-top:15px;
}
#home #menu li {
    padding: 7px 0px 7px 10px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
}
#home #menu li.default { line-height: 1.5em; border: none; }
#home #menu li.first { 
    border-top-width: 1px;
    border-top-style: solid;
}
#home #menu img { margin: 20px 0px 0px 10px; }

/*  SELECTED MARKET */
#home #select {
    float:right;
    width: 411px;
    height: 314px;
    background-image: url(/media/img/bkg/yellowbox.gif); 
    padding:5px;
}
#home #select h3, #home #select p {
    padding: 4px 20px;
}
#home #select h3 { padding-top: 15px; }
#home #select p { padding-bottom: 20px; }

#home #select .text { height: 136px; }
#home #select .more { font-weight: bold; text-align: right; margin-bottom: 8px; margin-right: 20px; }
#home #select .more a { text-decoration: underline; }

#home #select li { display:none; }
#home #select li.default { display: list-item; }


/*  ROTATING QUOTES */
#home #quotes { 
    height: 6em;
    margin: auto 30px;
    line-height:1.3em;
}
#home #quotes .author { text-align: right; line-height: 2em; }
#home #quotes span.quotationmark {
    display:block;
    position:relative;
    top: 30px;
    left: -30px;
    font-size: 450%; 
}

#home #quotes div {
    display: none;
}


/* arbitrary height light blue box */
.sub, .sub_body, .sub_outter, .sub_inner { 
    background: transparent url(/media/img/bkg/lbbox.gif) no-repeat bottom right; 
} 
.sub { 
    width: 691px !important; 
    width: 677px; 
    padding-right: 15px; 
    margin: 20px auto;
    text-align: left;
}
.sub_outter { 
    background-position: top right; 
    margin-right: -15px; 
    padding-right: 40px;
}
.sub_inner { 
    margin: 0;
    border: 0;
    background-position: top left; 
    padding: 0px 0 0px 40px; 
    height: auto !important; 
    height: 1%;
}
.sub_body { 
    background-position: bottom left; 
    margin-right: 10px;
    padding: 0px 0 25px 40px;
} 
p.clear, div.clear { 
    height: 0px;
    clear: both;
}



#services li, #port li {
    clear:both;
    margin:10px 10px 20px;
    width: 545px;
    padding: 20px 30px;
}
#services li div.copy { float: left; width: 319px; }
#services li div.image { float: left; margin-right: 30px; width: 196px; }
#services li img { height: 130px; width: 192px; border: 2px solid #cddff0;}
#services li h3, #port li h3 { line-height:1; }
#services li p { padding: 5px 20px 0 0; }
#services li p.getquote { margin-top: 8px; text-align: right; font-size: 13px; }
#services li p.getquote a { text-decoration: underline; }

#request #form, #portsub #content, #about #content { 
    text-align:center;
    margin: 10px 20px 0px 0px; 
    padding: 10px 0px 20px;
}
#request h2 { 
    text-align:left; 
    margin: 10px 0px 10px 40px;
    padding-left: 20px;
    padding-top: 10px;
    background: transparent url(/media/img/bkg/bluefade.gif) repeat-x;
}
#request li {
    text-align:left;
    padding: 4px;
}
#request label {
    display:block;
    float:left;
    width: 200px;
    text-align:right;
    padding-right: 10px;
}
#request ul.box { margin-left: 210px;}
#request ul.box label {
    text-align: left;
    width: 300px; 
}
#request ul input, #request textarea {
    border: 2px silver solid;
}
#request ul input { width: 15em; }
#request ul.box input { border: none; width: 13px; margin-right: 5px; float: left; }
#request p {
    text-align:left;
    margin: auto 60px;
}
#request p.privacy-note {
    margin-top: 12px;
}
#request textarea {
    margin: 20px 0px 20px 154px;
    height: 8em;
    width: 25em;
}
#request #id_captcha { display: none; }
#request .submit {
    text-align:left;
    margin-left: 214px;
}
#thanks p { margin: 30px auto 0px; text-align:center; }

#port li div.portlist, #port li div.portnav { float: left; }
#port li div.portlist { width: 262px; }
#port li div.portnav { width: 323px; margin-left: -40px; }
#port li h3 { margin-top: 8px; margin-bottom: 10px; }
#port li img { margin-top: 5px; border: 2px solid #cddff0; }
#port li a img { margin-left: 200px; margin-top: 0px; border: none; }
#port li li {
    margin: 0px;
    padding: 2px 50px 2px 18px;
    width: auto;
    height: auto;
    font-size: 108%;
}

#portsub #content { margin-top: 0px; padding: 10px; text-align: left;}
#portsub #portfront { background-image: url(/media/img/bkg/yellowgradient.gif); }
#portsub #portfront ul { float: left; margin-left: 35px; width: 200px; }
#portsub #portfront img { float: right; margin-right: 25px; }
#portsub #portfront h1 { padding-left: 25px; padding-top: 25px; padding-bottom: 15px; }
#portsub #portfront p { padding-top: 5px; padding-left: 25px; }
#portsub #portfront li { font-size: 108%; }
#portsub h1 { margin-bottom: 0px; padding-bottom: 0px; }
#portsub h2 a { font-weight: bold; }
#portsub p { margin-top: 10px; }
#portsub img { border: 2px solid #cddff0; }
#portsub ul.clients { margin-bottom: 20px; }
#portsub ul.clients li { 
    margin-top: 10px;
    padding: 20px;
    height: 160px; 
    background-image: url(/media/img/bkg/portfoliogrey.gif);
    clear: both; 
}
#portsub ul.clients li.first { margin-top: 0px; }
#portsub ul.clients img { display:block; height: 150px; width: 150px; }
#portsub p.thumb { margin: 5px 20px 5px 5px; float:left; }
#portsub p.quote span { display:block; }
#portsub .viewpdf { margin-top: 0px; font-style: italic; }

#about #content { padding: 20px 15px; }
#about li { margin-top: 50px; }
#about li.logo-offset, #about li.first { margin-top: 0px; }
#about li div.images { float: left; width: 144px; }
#about li div.images img { margin-bottom: 5px; }
#about li.logo-offset div.images { margin-top: 25px; }
#about li div.copy { float: left; width: 430px; margin-left: 16px; text-align: left; }
#about li div.copy p { margin-top: 10px; }

#contact #toc { float:left; width: 250px; margin-left: -20px; margin-top: 10px; }
#contact #toc li { text-indent: 10px; border-bottom-width: 1px; border-bottom-style: solid; }

#contact #content { 
    margin-left: 325px; 
    height: 460px; 
    background: white url(/media/img/bkg/contactgradient.gif) top left repeat-x;
}

#contact #content ul { padding-top: 1px; }
#contact #content li { margin: 10px 10px 20px 30px; }

#contact #content ul#main li { margin: 0px 0px 30px 0px; }
#contact #content ul p { margin-bottom: 0px; }
#contact #content ul p.name { font-size: 12px; }
#contact #content ul#main p { margin: 5px 0px; }
#contact #content ul#main { padding: 20px 10px 20px 30px; }
#contact #content ul p#ceo { font-size: 12px; }
#contact #content ul p#ceo a { text-decoration: underline; }

#contact #image { position: relative; top: -249px; left: -330px; *top: -260px; }
