/*  -----------------------------
    core.css
    author: John Belflower
    http://www.johnbelflower.com
    
    req/location
      styles/core.css
    ----------------------------------------*/

/*  ------------------------------
    TOC
    1. RESET
    2. CORE
    3. LEFT COLUMN
    4. RIGHT COLUMN
    -----------------------------------------*/

    /*----- RESET SELECTORS -----*/
    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;
    }

    /* 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;
    }


    /*----- CORE SELECTORS -----*/
    body {
      background: #000 url('../images/backgrounds/bg-body.jpg') top left no-repeat fixed;
      font-family: Helvetica, Arial, sans-serif;
      font-weight: lighter;
      color: #fff;
    }
    a {
      color: #fff;
      text-decoration: none;
    }
    a:hover {
      border-bottom: 1px dotted #fff;
    }
    h6 {
      text-decoration: underline;
      margin: 10px 0;
    }
    h5 {
      text-decoration: underline;
      margin: 55px 0 15px;
    }
    h4 {
      text-decoration: underline;
      font-size: 1.5em;
      margin: 55px 0 15px;
    }
    h3 {
      text-decoration: underline;
      font-size: 3em;
      margin-bottom: 20px;
      font-weight: 100;
    }
    .right {
      float: right;
    }
    #branding {
      background: url('../images/branding/logo.png') no-repeat;
      width: 240px;
      height: 215px;
      position: absolute;
      top: 0;
      left: 10px;
      display: block;
      text-indent: -9999px;
    }
    #branding:hover {
      border: none 0px;
    }
    #title {
      margin: 20px 0;
    }
    .bordered {
      background: url('../images/backgrounds/bg-opaque.png') repeat;
      padding: 10px;
    }
    
    
    /*----- LEFT COLUMN SELECTORS -----*/
    #left-column {
      float: left;
      top: 0;
      left: 0;
      width: 270px;
      padding: 220px 0 0 20px;
      position: fixed;
    }
    #home #left-column,
    #contact #left-column {
      position: relative !important;
    }
    #left-column > a,
    #left-column > dl {
      margin-left: 10px;
    }
    #left-column > dl {
      margin-top: 20px;
    }
    #left-column dt {
      font-size: 1.4em;
      border-bottom: 1px solid #fff;
      padding-bottom: 2px;
      width: 93px;
    }
    #left-column dd {
      margin: 10px 0 10px 5px;
    }
    #about-me {
      background: transparent url(../images/backgrounds/bg-about.png) no-repeat scroll 0 0;
      font-size: 12px;
      height: 155px;
      line-height: 1.4em;
      padding: 8px 5px 0 10px;
      width: 215px;
    }
    #nav {
      margin: 15px 0 15px 10px;
    }
    #nav li {
      font-size: 2em;
      margin: 10px 0 10px;
    }
    #links {
      position: relative;
      top: 10px;
      font-size: 1.2em;
    }
    
    
    /*----- RIGHT COLUMN SELECTORS -----*/
    #right-column {
      width: 705px;
      margin: 0 0 50px 280px;
    }
    #right-column h2 {
      font-size: 4.5em;
    }
    #right-column > p {
      font-size: 1.1em;
      margin: 20px 0;
    }
    .thumbs {
      margin-bottom: 15px;
    }
    .thumbs li {
      display: inline;
      margin-left: 20px;
    }
    .first {
      margin-left: 0px !important;
    }
    .title {
      float: left;
      width: 130px;
      margin-left: 20px;
      padding-right: 15px;
    }
    .home {
      margin-top: 40px;
      width: 80px;
    }
    .description {
      float: left;
      border-left: 5px solid #8a828c;
      padding-left: 20px;
      margin-bottom: 30px;
      width: 425px;
    }
    .clients {
      margin-top: 40px;
      text-align: center;
      font-size: .8em;
      line-height: 1.2em;
      width: 545px;
    }
    .gallery > li {
      overflow: hidden;
    }
    .gallery > li > a {
      display:block;
      position:absolute;
      height: 172px;
      width: 695px;
      text-indent:-9999px;
    }
    
    
    #subnav {
      background: transparent url('../images/backgrounds/bg-about.png') no-repeat scroll 0 0;
      height: 32px;
      line-height: 1.4em;
      padding: 8px 7px 0 10px;
      width: 210px;
    }
    #subnav > a,
    #subnav > dl {
      margin-left: 10px;
    }
    #subnav > dl {
      margin-top: 10px;
    }
    #subnav dt {
      font-size: 1.4em;
      border-bottom: 1px solid #fff;
      padding-bottom: 2px;
      width: 93px;
    }
    #subnav dd {
      margin: 10px 0 10px 5px;
    }
    #subnav span {
      padding: 0 5px 0 15px;
    }
    
    
    form {
      float: left;
      width: 400px;
    }
    form label {
      margin-top: 20px;
      font-size: .9em;
      display: block;
    }
    form > p {
   	  width: 300px
    }
    form #message {
      font-size: .75em;
    }
    input,
    textarea {
      opacity: .5;
      border: none;
      margin-top: 5px;
      font-family: Helvetica, Arial, sans-serif;
    }
    input:focus,
    textarea:focus {
      opacity: .8;
      color: #000;
      background: #fff;
    }
    input {
      width: 300px;
      font-size: 1em;
      height: 24px;
      padding: 8px 0 0 6px;
    }
    textarea {
      height: 150px;
      width: 383px;
      padding: 8px 0 0 6px;
    }
    #submit-btn {
      opacity: .8;
      background: url('../images/gui/btn_send.png') no-repeat;
      width: 112px;
      height: 52px;
      padding: 2px 4px 0 0;
      font-weight: 700;
      color: #fff;
      float: right;
    }
    #submit-btn:hover {
      opacity: 1;
      cursor:pointer;
      cursor:hand;
    }
    
    
    
    #contact-info {
      width: 280px;
    }
    #contact-info ul {
      margin-bottom: 30px;
    }
    #contact-info li {
      font-size: .9em;
      height: 30px;
      padding: 13px 0 0 45px;
    }
    #phone {
      background: url('../images/gui/icon_phone.png') no-repeat;
    }
    #mail {
      background: url('../images/gui/icon_mail.png') no-repeat;
    }
    #location {
      background: url('../images/gui/icon_location.png') no-repeat;
    }
    #vcard {
      display: block;
      text-indent: -9999px;
      height: 80px;
      width: 95px;
      background: url('../images/gui/icon_vcard.png') no-repeat;
    }
    
    #error, #status {
		bottom: 0 !important;
		margin: 20px 120px 20px 0;
		padding: 10px;
		font-size: 12px;
		position: relative !important;
		right: 0 !important;
		width: auto !important;
   	}
   	#error {
   		border: 3px solid #FF0000;
   	}
   	#status {
   		border: 3px solid #00FF00;
   	}
   	.link {
   		margin: 5px 0 15px;
   		font-size: 12px;
   		float: none;
   	}
   	#linkpage .bordered {
   		width: 500px;
   	}