/* MJMapp.com 
  Refashioned by Argument from Design http://ardes.com/
  June 2009
  */

/* Zero margins & padding, which we define elsewhere, courtesy Eric Meyer */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; 	vertical-align: baseline; background: transparent;
}
body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
/* remember to define focus styles! */
:focus { outline: 0; }

/* remember to highlight inserts somehow! */
ins { 	text-decoration: none; }
del { text-decoration: line-through; }

/* tables still need 'cellspacing="0"' in the markup */
table { border-collapse: collapse; border-spacing: 0; }



/* =HTML refashioned  */
body { 
  color: #FFF; background-color: #000; 
  font: 1em "VRT", "Trebuchet MS", "Helvetica", "Arial", "Lucida Grande", "Verdana", sans-serif; 
}

@font-face {
  font-family: "VRT";
  font-style: normal;
  font-weight: normal;
  src: url('/stylesheets/vrt.ttf');
}

/* =ANCHORS */
a, a:visited { color: #99FF00; text-decoration: none; }
  a:hover, a:active { color: #FFF; text-decoration: underline; }

    div.footer p a { padding-right: 5em; text-decoration: none; /* 'Back to' lists */ }

    p.folio_nav a { padding: 0.25em; text-decoration: none; border: 1px solid #2D4F00; /* Portfolio pagination */ }
      p.folio_nav a:hover { background-color: #99FF00; color: #000; }
      p.folio_nav a.current_page { border: 1px solid #000; }

    p.sub_nav a { padding: 0.25em; /* Gen'l top of page subnav */ }
      p.sub_nav a:link, p.sub_nav a:visited { color: #FFF!important; text-decoration: none; }
      p.sub_nav a:hover, p.sub_nav a:active {
        color: #99FF00!important; text-decoration: underline;
      }
      #content p a:link span.caps, #content p a:visited span.caps, 
      #content p span span.caps a:link, #content p span span.caps a:visited 
        { color: #99FF00; }
        #content p a:hover span.caps, #content p a:active span.caps, 
        #content p span span.caps a:hover, #content p span span.caps a:active 
          { text-decoration: underline; }

      div.person a.contact, div.person a.contact:visited  { text-decoration: none; border-bottom: 1px dotted #599600; }
        div.person a.contact:visited { color: #99FF00; }
        div.person a.contact:hover { border-bottom: 1px solid #C8FF75; color: #C8FF75; }

  #nav a img, #nav a:active img, #nav a:hover img { background-color: #000; /* nav anchor gen'l */ }
    #nav li a { color: #FFF; display: block; padding-left: 1.1em; text-decoration: none!important; }
      #nav li a:active, #nav a:hover { color: #000!important; background-color: #99FF00; }
      #nav a:visited { color: #FFF; }
    #nav li li a:active, #nav li li a:hover { color: #99FF00; background-color: #000; }

    #nav li a.current_page { color: #000!important; background-color: #99FF00; /* Nav on/off effect: body ID matches nav class  */ }
    #nav ul ul a { color: #FFF!important; background-color: #000; }
    #nav ul ul a:hover, #nav ul ul a:active { color: #99FF00!important; }
        body#people.team #nav li.team a, body#people.partner #nav li.partners a { color: #99FF00!important; }

    .admin a { color: #B90000!important; }
      .admin a:hover { color: #E80000!important; text-decoration: underline!important; }



    div.help a { color: #2D5E00; text-decoration: underline; }
      a.help_link { color: #2D5E00; text-decoration: none; background-color: #FFFFD5; padding:0.1em; font-size: 0.7em; }

    form a:link, form a:visited { color: #4B7F00!important; }
      form p.admin a:link, form p a:visited { color: #B90000!important; }
        
  	  a:link.button, a:visited.button, a:hover.button, a:active.button { color: #000!important; }

    #search .result .result_info h3 a { border-bottom: 1px dotted #99FF00; }


h2, h3, h4, h5, h6, #content p, #content ol, #content ul, #content li { margin: 0.1em 0.5em 0.25em 0; }

h1, h2, h3, h4, h5, h6 { color: #99FF00; font-weight: normal; }
  h1 { font-size: 1em; margin-top: 0.5em; margin-bottom: 2.25em; margin-right: 15em; }

  h2 { font-size: 1em; padding-bottom: 0.5em; } 
    body.partner h2 { padding: 50px 0 0 105px; }
    body#press h2 { padding-bottom: 0; }
  h3 { font-size: 0.95em; padding: 0.75em 0 0.5em; }
  h4 { font-size: 0.9em; }
  h5 { font-size: 1em; font-weight: normal; }
  h6 { font-size: 1em; font-weight: normal; }
    body.partner h6 { font-size: 0.9em; color: #FFF; padding-left: 105px; padding-bottom: 1em; }

body.partner #content img { float: left;  }

img.soleimg { margin-top: 1em; }
img.icon { vertical-align: text-bottom; margin-left: 0.1em;}
img.partners { position: absolute; top: 6em; left: 11em; /* Absolute positioning for image map */ }
body#home div.presentation { width: 650px; height: 510px;  }

div.presentation img, div#partners_image img { margin-top: 0.35em; }


#content p { line-height: 1.6em; }
    #content p strong, #content li strong { color: #EBFFCD; }
    body#press #content p strong, body#press #content li strong { color: #FFF; margin-right: 0.5em; }
    body#press div.article p.title { font-size: 1.1em; }
  #content p span { color: #99FF00; }
    #content p span.caps { color: #F4FFE5; }
    #content p span span.caps { color: #99FF00; }

#content ol { list-style: decimal inside!important; width: 45%; float: left; }
#content li { font-size: 1em; margin-bottom: 0.7em; line-height: 1.5em; }

sup { font-size: 0.75em; vertical-align: top; }



/* =LAYOUTS */
#nav { background-color: inherit; color: inherit; float: left; width: 9.5em; }
#content { margin: 0em 5% 5em 10em; padding-top: 1em;  }
  #content p { margin-left: 0; margin-right: 0; }

p#footer {
  position: absolute; width: 12em; bottom: 0; left: 0; background-color: #000; padding: 1.25em 0 1.25em 1.25em;
  font-size: 0.75em; color: #99FF00; line-height: 1.3em;
}

body.portfolios div.portfolio {
  width: 13em; height: 9em; float: left; margin-top: 1em;
}
  body.portfolios div.portfolio img { width: 90px; height: 90px; float: left; margin-right: 10px; }
  body.portfolios div.portfolio p { font-size: 0.8em; margin: 0 0.5em 0 0; padding: 0; color: #99FF00; line-height: 1.6em; }

body.portfolio div.portfolio { width: auto!important; height: auto; float: none; }
  body.portfolio div.portfolio img { margin-bottom: 1em; float: left; }
  body.portfolio div.portfolio p { 
    color: #FFF!important; 
    padding-left: 360px!important; 
    padding-bottom: 1em!important; 
  }


/* =NAV */
#nav img { margin: 0; border: 0; background-color: #000; }
#nav ul { list-style: none; }
#nav ul.nav { margin-top: 1.25em!important; }
  #nav li { font-size: 1.1em; letter-spacing: 0.07em; line-height: 1.3em; }
    #nav li li { font-size: 1em; }
  #nav li ul { display: none; /* Subnav not shown unless on the correct page */  }
    body#people #nav li ul.people { display: block; /* When on a people page, show the people subnav */ }




/* =SPECIAL DECLARATIONS Where we place exceptions & non-global declarations */
.admin { color: #B90000!important; }
  div.admin { margin-left: 1em; }
    div.admin p.admin { padding-bottom: 0!important;}

  span.admin { font-size: 0.8em; padding-left: 1em; }
    span span.admin { font-size: 0.9em; }
    ul.enquiry_types span.admin { display: block; } 
      ul.enquiry_types span.admin a:link, ul.enquiry_types span.admin a:visited { color: #B90000!important;}
    
  h1 span.admin { display: block; position: absolute; left: 11.5em; }
  #nav ul.admin { font-size: 0.95em; }

span.admin { padding-left:1em; }

ul#partner_ids { margin-bottom: 1em; }

div.help { color: #000; background-color: #FFFFD5; font-size: 0.8em; padding: 0.5em; }
  div.help pre { font-size: 1.25em; }

  
.draft { background: #303030 url(/images/draft.gif) repeat; }

div.show_in_nav { text-indent: -0.5em;}

div.image { padding: 0.5em; vertical-align: text-top;}
  div.image img { padding: 0.2em; }
  div.image.main { background-color: #202020;}

p.pitch.medium { font-size: 1.2em; line-height: 1.8em; margin-right: 8em!important; margin-bottom: 1em!important; }
p.pitch.big { font-size: 2em; line-height: 1.3em!important; padding-bottom: 0.5em; margin-right: 5em!important; }


div.footer p, p.footer { font-size: 0.8em; padding-top: 1.75em; margin-left: -2em; /* Neg margin helps w/ overlapping right margins  */ }

p.folio_nav { clear: both; padding: 1em 1em 1em 0; }
p.sub_nav { padding-top: 0.25em; position: relative; left: -0.25em; }

div.article { padding-bottom: 1em; }
  div.article p { padding-bottom: 0.75em; line-height: 1.5em!important; }

div.contact { margin-top: 2em; }
  div.contact img { float: left; margin-bottom: 0.5em; }
  div.contact p { font-size: 0.9em; }
    div.contact p.contact_data { padding-left: 9em; }
      div.contact p.contact_data img { float: none; position: relative; top: 0.85em; margin-right: 0.5em; }
    div.contact p.extra { clear: left; padding-bottom: 0.25em; font-size: 0.8em;  }

#footer span.org, #footer span.street-address, #footer span.locality, #footer span.postal-code, #footer span.tel { color: #FFF; /* Use of microformats to provide address details  */ }

body#contact div.contact span.street-address, body#contact div.contact span.locality, 
body#contact div.contact span.postal-code, body#contact div.contact span.tel,
body#people div.person span.tel { color: #FFF; }

body.partner div.info { float: left; width: 45%; }
  body.partner div.info p { padding: 0 1.25em 0.75em 0; }

body#people div.person { height: 13em; width: 14.5em; margin: 5px; padding: 5px; float: left; }
  body#people div.person p { font-size: 0.9em; }
  body#people div.person span { float: left; text-align: left; width: 1.5em; }
    body#people div.person span.name { float: none; text-align: left; width: auto; border-bottom: 1px dotted #599600; }
    body#people div.person span.tel { float: none; text-align: left; width: auto; margin-left: 1em; }
  body#people div.person a img { position: relative; top: 5px; margin-left: 5px; }
   div.person div.image img, div.person div.image { margin-left: 0!important; padding-left: 0!important; }




/* =FORMS  */

/* FORMS: LAYOUT STRUCTURE 
	Basic usage:
	fieldset 
		legend
			div.field
				label(for): input
	FIELDSETS act as blocks (with exceptions)
	DIV.FIELD acts as a block for each form item, given that we're using floats
	LABELs are floated left (with exceptions) w/ a specified width 
	INPUTs (textual, that is) & TEXTAREAs are given a specific width
	CHECKBOX should use class of .tickshim for proper alignment
	SUBMIT are put in separate FIELDSET.SUBMIT, with a class of submit. This is inefficient
	There are, unfortunately, lots of exceptions to rules that arise of necessity. The biggest
	issue arises from small FIELDSETs that are best used floated, in which case we use 
	class .sidebyside. 
 */
 form { background-color: #FFF; color: #000; }
  form strong { color: #000!important; border-bottom: 1px dotted #000; }
  form input:focus { background-color: #FFFFDF; }
  fieldset { 
   border: solid 0 transparent; /* To help Opera 7 & below (necessary?!?) */
   margin: 10px; padding: 10px; 
  }
    form div.field { display: block; clear: both; padding-bottom: 15px; }
      input.submit, .button { /* Not necessary, but demonstrates you can override button look in Safari 3 */
      			font: 1em "VRT", "Trebuchet MS", "Helvetica", "Arial", "Lucida Grande", "Verdana", sans-serif; color: #000; width: auto!important; 
      			background-color: #99FF00; padding: 0.25em; margin-right: 0.5em;
      		}
      		.button { 
      		  border-top: 2px solid #BABABA; border-left: 2px solid #BABABA; 
      		  border-right: 2px solid #6C6C6C; border-bottom: 2px solid #6C6C6C; 
      		}

#quick_search { /* On every page  */
 width: 220px!important; padding: 17px!important;  margin: 0!important; 
 display: block; float: right; 
 background-color: #000;  border: 0px solid #000!important; 
}
 #quick_search input { font-size: 12px; height: 14px; width: 180px!important; float: left; }
   #quick_search input.submit {
      height: 18px; width: 18px!important; background-color: #000;
      float: right; padding: 0!important; margin: 0!important;
     }

label { float: left; text-align: right; margin-right: 1em; }
 #new_enquiry label { width: 9.5em; font-size: 1em; }
 body#contact #new_enquiry label { width: 10em; }

body#people div#enquiry_form { margin-left: 15.5em; width: 37em; /* Individual contact forms  */ }
body#contact div#enquiry_form { margin-left: 4em;  width: 31em; /* Gen'l contact */ }
  body#contact div#enquiry_form li { margin-left: 1em; }
    body#contact div#enquiry_form li label { width: auto; float: none; text-align: left; }

body#contact form p { font-size: 1em; padding-bottom: 1em; }

#new_enquiry input[type="text"] { width: 250px; }

form#new_enquiry input.submit { margin-left: 10.5em; }
  form#new_enquiry p.nb { margin-left: 10.5em!important; }
body#contact input.submit { margin-left: 11em; }
  body#contact p.nb { margin-left: 11em; }

textarea { width: 255px; }
  textarea#partner_image_map { width: 400px!important; }
  form.edit_site textarea { width: 600px!important; }

 select { background-color: #EFEFEF; }
	input.radio, input.checkbox, input.submit { width: auto; } /* This is for other browsers that don't understand attr strings */
		input.radio { /* Looks decidedly wonky in Safari **in default font** */
			float: left; margin-right: 1em;  
		}

ul#enquiry_type_ids li { border-bottom: 1px solid #FFF; }

ul.enquiry_types li { padding: 0.15em; }
  ul.enquiry_types li.selected { background-color: #E7FFC3; }


/* =ERRORS & =NOTIFICATIONS */
form div.fieldWithErrors { display: block!important; }
  form div.fieldWithErrors, div#flash span.error { background-color: #FA7474; padding: 0 0.25em 0; }
  form div.fieldWithErrors label { 
    background-color: inherit; 
    color: #AD121D; padding: 0; 
    display:inline; font-weight:bold; 
  }

div#flash { 
	top: 0; width: 100%; height: 2.5em;
	border-left-width: 0!important; border-right-width: 0!important; 
	z-index: 55; 
}
	div#flash p { font: 1em "VRT", "Trebuchet MS", "Helvetica", "Arial", "Lucida Grande", "Verdana", sans-serif; padding: 0.5em; text-align: center; color: #000; }
	div#flash p.error { border: 1px solid #AD121D; background-color: #FAB3B9; }
	div#flash p.notice { border: 1px solid #008000; background-color: #D6EED1; }
 
div.errorExplanation {
  border: 1px solid #AD121D;
  background-color: #FAB3B9;
  padding: 1em;
}
  div.errorExplanation h2 {
    color: #AD121D;
    font-size: 14px;
    line-height: 120%;
  }
  div.errorExplanation p, div.errorExplanation li {
    padding-top: 0.25em;
    color: #650A10;
  }
    div.errorExplanation ul { list-style-type: disc;  list-style-position: inside;}
    div.errorExplanation li { margin-bottom: 0!important;  }



/* =SEARCH */
#search form { color: #FFF; background-color: #000; }

#search .query {
  padding: 0em;
  text-align:center;
}

#search .search_info {
  padding: 0.5em;
  background-color: #000;
}
  #search .search_info h2, #search .search_info p, #search .results p, #search .results h2 {
    padding: 0; margin: 0
  }
  #search .search_info h2, #search .results h2 { padding-top: 0.6em;}
  #search .search_info p, #search .results p { padding-top: 0.3em; padding-left: 0.3em;}
  #search .search_info ul { 
    margin:0; padding: 0; padding-top: 0.2em; 
    list-style-type: disc; list-style-position: inside; 
  }
    #search .search_info li { margin-left: 1em; margin-bottom: 0; padding-top:0.1em;}

#search .result {
  margin: 5px;
  padding: 5px;
  min-height: 100px;
  background-color: #000;
  border: dotted #666 1px;
}
  #search .result:hover { background-color: #191919; }
    #search .result .result_image { float:left; padding: 0.25em; margin: 0 0.5em 0 0; }
    #search .result .result_info h3 { margin:0; padding: 0; }
    #search .result .result_info p {
      margin: 0; padding: 0.3em; font-size: 0.95em; }