/*
  ----------------------------------------------------------
  look: don't copy !
  ----------------------------------------------------------
  copyright (c) 2000-2008
  The Rubycon information design copyright (c) 2008
  ----------------------------------------------------------
  with thanks and credits to
  dan cederholm
  jeffrey zeldman
  jeremy koempel
  sean kelly
  drew mclellan
  jesse bennett-chamberlain
  steve smith (for the float to help 'clear'-ing)
  ----------------------------------------------------------
  site:          The Rubycon
  designer:      mark jackson
  creation:      December 2007
  modified:      February 2008
  scheme:        corporate
  version:
  palette:
  grid:          18px
  default:       16px
  multiplier:    18/16 = 1.125
  measurement:   ems
  layout:        fixed
  background:    #ffffff
  font-family:   "Lucida Grande", Verdana, sans-serif;
 */
/*
  set the default for all style definitions
  ----------------------------------------------------------
 */
* {
    font-weight:normal;
    text-align:left;
    border:0 none
}
/*
  body
  ----------------------------------------------------------
 */
body {
    margin-top:20px;
    background:#fff;
    font-size:100%;
    line-height:1.125em;
    text-align:center
/* 16x1.125=18px */
}
/*
  typographical adjustments
  ----------------------------------------------------------
 */
.hidden {
    display:none;
}
.clear {
    height:0;
    clear:both
}
:focus {
    outline:none
}
:active {
    outline:none
}
strong {
    font-weight:bold
}
.middle {
    display:inline;
    vertical-align:middle
}
/*
  dual-ply design                              inner | outer
  ----------------------------------------------------------
 */
#outer {
    width:690px;
    margin:0 auto;
}
#inner {
    width:690px;
}
#copyright #inner,
#pricing #inner,
#contact #inner,
#clients #inner,
#about #inner,
#category #inner {
    background:url(f/flag_extension.jpg) repeat-y;
}
/*
  MT category inner (case is important)
  ----------------------------------------------------------
 */
#Photography #inner {
    background:url(f/flag_photo_extension.jpg) repeat-y
}
#Portfolio #inner {
    background:url(f/flag_extension.jpg) repeat-y
}
/*
  header
  ----------------------------------------------------------
 */
#header {
    width:690px;
    background:url(f/header.gif) no-repeat;
    height:97px;
    clear:both
}
#header #logo {
    position:relative;
    top:0px;
    left:17px
}
#header #logo a {
    display:block
}
/*
  keep the home flag flying
  ----------------------------------------------------------
 */
#flag {
    min-height:271px;
    height:auto !important;
    height:271px;
    clear:both
}
#home #flag {
    background:url(f/flag_resauce.jpg) no-repeat left top;
    clear:both;
}
#copyright #flag,
#pricing #flag,
#contact #flag,
#clients #flag,
#about #flag,
#category #flag {
    background:url(f/flag_blank.jpg) no-repeat left top;
    min-height:253px;
    height:auto !important;
    height:253px;
}
#error #flag {
    background:url(f/flag_error.jpg) no-repeat left top;
    min-height:253px;
    height:auto !important;
    height:253px;
}
#portfolio #flag {
    background:url(f/flag_portfolio.jpg) no-repeat left top;
    min-height:271px;
    height:auto !important;
    height:271px;
}
#photo_collection #flag {
    background:url(f/flag_photo_collection.jpg) no-repeat left top;
    min-height:271px;
    height:auto !important;
    height:271px;
}
/*
  MT category (case is important)
  ----------------------------------------------------------
 */
#Portfolio #flag {
    background:url(f/flag_blank.jpg) no-repeat left top;
    min-height:253px;
    height:auto !important;
    height:253px;
}
#Photography #flag {
    background:url(f/flag_photography.jpg) no-repeat left top;
    min-height:253px;
    height:auto !important;
    height:253px;
}
/*
  home flag introduction
  ----------------------------------------------------------
 */
#home #flag #intro {
    margin:1em 0 0 23px;
    float:left;
    background:none;
    display:inline;
}
#home #flag #intro p {
    color:#fff;
    font-size:0.8em;
    line-height:1.636em;
    font-family:"Lucida Grande", Verdana, sans-serif;
    font-weight:normal
}
#home #flag #intro p a {
    color:#bb133e;
    line-height:1.636em;
    font-family:"Lucida Grande", Verdana, sans-serif;
    font-weight:normal
}
#home #flag #intro p a:hover {
    color:#fff;
}
#home #flag #intro ul {
    float:left;
    list-style:none;
    font-weight:normal;
    list-style-type:disc;
    list-style-position:inside
}
#home #flag #intro ul li {
    color:#fff;
    font-size:0.8em;
    font-family:"Lucida Grande", Verdana, sans-serif;
    background:url(f/sidebar_inactive_arrow.gif) no-repeat 0 50%
}
#flag blockquote {
    margin:0;
    width:400px;
    float:left;
    background:none
}
#flag blockquote p {
    margin:3em 0 0 23px;
    color:#fff;
    font-size:0.875em;
    line-height:1.636em;
    font-family:"Lucida Grande", Verdana, sans-serif;
    font-weight:normal
}
#flag blockquote p.signature {
    color:#fff;
    font-size:0.75em;
    margin:0.75em 0 0 23px;
    font-family:"Lucida Grande", Verdana, sans-serif
}
#flag blockquote p.company {
    color:#ddd;
    font-size:0.7em;
    margin:0 0 0 23px;
    font-family:"Lucida Grande", Verdana, sans-serif
}
#flag ul {
    float:left;
    list-style:none;
    font-weight:normal;
    list-style-type:disc;
    list-style-position:inside
}
#flag ul li {
    color:#555;
    font-size:0.7em;
    font-family:"Lucida Grande", Verdana, sans-serif
}
/*
  modules hold podules
  -----------------------------------------------------------
 */
.module {
    width:690px;
    float:left;
}
#picture {
    margin:1.5em auto;
    border:2px solid white;
    display:block;
}
#project {
    display:block;
    clear:both
}
#logotype {
    margin:1.5em auto;
    display:block;
}
/*
  podules hold content
  -----------------------------------------------------------
 */
.poduleLeft460 {
    width:460px;
    float:left
}
.podule230 {
    width:220px;
    float:left
}
.poduleLeftHalf {
    width:200px;
    float:left
}
.poduleRightHalf {
    width:180px;
    float:left;
}
h1, h2, h3, h4, h5, h6 {
    font-family: "Lucida Grande", Verdana, sans-serif;
    clear:both
}
p {
    font-family: "Lucida Grande", Verdana, sans-serif
}
h1 {
    font-size: 1em
}
h2 {
    font-size: 0.875em;
    color:#333
}
h3 {
    font-size: 0.75em;
    font-weight:bold;
    color:#333
}
.poduleLeft460 h1 {
    margin:0 5em 0 0;
    font-size:1.125em;
    line-height:2em;
    font-weight:normal;
    color:#333
}
.poduleLeft460 p {
    margin:0 5em 1em 0;
    font-size:0.75em;
    line-height:1.5em;
    font-weight:normal;
    color:#333
}
dl#details {
    width:400px
}
dl#details dt {
    margin:1em 0 0 0;
    font-family:"Lucida Grande", Verdana, sans-serif;
    font-size:0.7em;
    line-height:1.25em;
    font-weight:bold;
    color:#333;
    border-top:1px solid #ccc
}
dl#details dd {
    border:none;
    color:#333;
    font-family:"Lucida Grande", Verdana, sans-serif;
    font-size:0.7em;
    line-height:1.25em
}
img.ceasar {
    margin:0;
    padding:0 0.5em 0 0;
    display:block;
    float:left
}
/*
  specific podule styles
  -----------------------------------------------------------
 */
#wedo {
    margin:0.5em 0 0 0
}
#wedo img.me {
    margin:0;
    padding:0 0.5em 0 0;
    display:block;
    float:left
}
#wedo h1 {
    font-size:0.9em;
    line-height:2em;
    font-weight:normal;
    color:#333
}
#wedo p {
    font-size:0.7em;
    margin:0 0 1em 0;
    font-weight:normal;
    color:#333
}
#wedo ul {
    font-weight:normal;
    color:#333
}
#wedo dl {
    margin:0.5em 0 0.5em 0
}
#wedo dl dt {
    margin:1em 0 0 0;
    font-family:"Lucida Grande", Verdana, sans-serif;
    font-size:0.7em;
    line-height:1.636em;
    font-weight:bold;
    color:#333;
    border-top:1px solid #ccc
}
#wedo dl dd {
    border:none;
    color:#333;
    font-family:"Lucida Grande", Verdana, sans-serif;
    font-size:0.7em;
    line-height:1.25em
}
#wedo #navigation {
}
#wedo #navigation p.previous {
    float:left;
    line-height:100%;
    text-align:center
}
#wedo #navigation p.next {
    float:right;
    line-height:100%;
    text-align:center
}
#wedo #navigation img {
    padding:0;
    margin:0;
    line-height:100%
}
/*
  snippets of information
  -----------------------------------------------------------
 */
#snippets {
    background:#ddd url(f/snippet_fade.jpg) no-repeat left top;
    width:690px;
    float:left;
    clear:both
}
#home #snippets,
#portfolio #snippets,
#photo_collection #snippets {
    background:#ddd url(f/snippet_category_fade.jpg) no-repeat left top;
}
/*
  MT category snippets (case is important)
  ----------------------------------------------------------
 */
#Photography #snippets,
#Portfolio #snippets {
    background:#ddd url(f/snippet_fade.jpg) no-repeat left top;
}
/*
  The module inside snippets applies to non-shadow pages
  ----------------------------------------------------------
 */
#copyright #snippets.module,
#pricing #snippets.module,
#contact #snippets.module,
#clients #snippets.module,
#about #snippets.module,
#category #snippets.module,
#error #snippets.module {
    padding:18px 0 0 0
}
/*
  MT category module inside snippets (case is important)
  ----------------------------------------------------------
 */
#Photography #snippets.module,
#Portfolio #snippets.module {
    padding:18px 0 0 0
}
/*
  snippets features
  ----------------------------------------------------------
 */
#snippets dl {
    margin:0.5em 0 0.5em 0;
    padding-bottom:0.5em;
    background:url(f/snippet_divider.gif) repeat-y right top
}
#snippets dl dd {
    color:#333;
    font-family:"Lucida Grande", Verdana, sans-serif;
    font-size:0.625em;
    line-height:1.25em
}
#snippets dl dt a {
    color:#bb133e;
    text-decoration:none;
    border:none
}
#snippets dl dt a:hover {
    color:#333;
    text-decoration:none;
    border:none
}
#snippets dl#last {
    background:none;
}
#snippets dl#availability dd,
#snippets dl#prices dd,
#snippets dl#new dd,
#snippets dl#contact dd {
    text-align:center
}
#snippets dl#new {
    margin-left:0.5em;
    float:left;
    width:60px
}
#snippets dl.topic {
    margin-left:0.5em;
    float:left;
    width:180px
}
#snippets dl dt {
    font-family:"Lucida Grande", Verdana, sans-serif;
    font-size: 0.875em;
    line-height: 1.636em;
    font-weight:normal;
    color:#333
}
#snippets dl#new dt {
    text-align:center;
}
#snippets dl#contact,
#snippets dl#availability {
    float:left;
    width:80px;
    background:url(f/snippet_divider.gif) repeat-y right top
}
#snippets dl#prices {
    float:left;
    width:60px;
    background:none
}
#snippets dl#prices dt,
#snippets dl#availability dt,
#snippets dl#contact dt {
    text-align:center
}
/*
  footer
  ----------------------------------------------------------
 */
#footer {
    width:690px;
    background:#fff url(f/footer.gif);
    float:none;
    clear:both
}
#footer #footerContent {
    padding:9px 0;
    text-align:left;
    float:none;
    clear:none
}
#footer #footerContent p {
    color:#333;
    font-size: 0.625em;
    font-family: "Lucida Grande", Verdana, sans-serif;
/* 16x0.625=10px */
    clear:none
}
#footer #footerContent p.left {
    float:left
}
#footer #footerContent p.right {
    float:right
}
#footer #footerContent a {
    color:#bb133e;
    text-decoration:none
}
#footer #footerContent a:hover {
    text-decoration:none;
    color:#333;
}
#footer #footerContent a.none {
    text-decoration:none;
    background:none
}
#footer #footerContent p.right img#linkedin {
    display:inline
}
/*
  ordered list items
  ----------------------------------------------------------
 */
ol {
    color:#555;
    padding:0 60px 0 1em;
    text-indent:-1em;
    line-height: 1.636em;
    border:0px solid #ddd;
    font-size:0.75em;
    font-family:"Lucida Grande", Verdana, sans-serif;
    list-style-type:decimal;
    list-style-position:inside
}
a, a:link, a:visited, a:active {
    color: #bb133e;
    text-decoration:none;
    border-bottom:none
}
a:hover {
    color: #333;
    text-decoration: none;
    border-bottom:none
}
table a,
table a:link,
table a:visited {
    border:none
}
table img {
    border:0
}
table {
    width:400px;
    border: 1px solid #ddd;
    border-collapse:collapse;
    margin:0 0 1em 0
}
caption {
    color: #9ba9b4;
    font-size:.7em;
    letter-spacing:.1em;
    margin:1em 0 0 0;
    padding:0;
    caption-side:bottom;
    text-align:right
}
tr.odd td {
    background:#f7fbff
}
tr.odd .column1 {
    background:#f4f9fe
}
.column1 {
    background:#f9fcfe;
    font:normal 0.7em "Lucida Grande", Verdana, sans-serif
}
td {
    font:normal 0.7em "Lucida Grande", Verdana, sans-serif;
    color:#bb133e;
    border-bottom:1px solid #ddd;
    border-left:1px solid #ddd;
    padding:.3em 1em;
    text-align:center
}
th {
    font-weight:normal;
    color: #555;
    text-align:left;
    border-bottom: 1px solid #ddd;
    border-left:1px solid #ddd;
    padding:.3em 1em
}
thead th {
    background:#f4f9fe;
    text-align:center;
    font: 0.875em "Lucida Grande", Verdana, sans-serif;
    color:#555
}
tfoot th {
    text-align:center;
    background:#f4f9fe
}
tfoot th strong {
    font:bold 1em "Lucida Grande", Verdana, sans-serif;
    margin:.5em .5em .5em 0;
    color:#66a3d3
}
tfoot th em {
    color:#f03b58;
    font-weight:bold;
    font-size:1.1em;
    font-style:normal
}