/*
* Skeleton V1.1
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 8/17/2011
*/


/* Table of Contents
==================================================
    #Base 960 Grid
    #Tablet (Portrait)
    #Mobile (Portrait)
    #Mobile (Landscape)
    #Clearing */



/* #Base 960 Grid
================================================== */

    .container                                  { position: relative; width: 960px; margin: 0 auto; padding: 0; }
    .column, .columns                           { float: left; display: inline; margin-left: 10px; margin-right: 10px; }
    .row                                        { margin-bottom: 20px; }

    /* Nested Column Classes */
    .column.alpha, .columns.alpha               { margin-left: 0; }
    .column.omega, .columns.omega               { margin-right: 0; }

    /* Base Grid */
    .container .one.column                      { width: 40px;  }
    .container .two.columns                     { width: 100px; }
    .container .three.columns                   { width: 160px; }
    .container .four.columns                    { width: 220px; }
    .container .five.columns                    { width: 280px; }
    .container .six.columns                     { width: 340px; }
    .container .seven.columns                   { width: 400px; }
    .container .eight.columns                   { width: 460px; }
    .container .nine.columns                    { width: 520px; }
    .container .ten.columns                     { width: 580px; }
    .container .eleven.columns                  { width: 640px; }
    .container .twelve.columns                  { width: 700px; }
    .container .thirteen.columns                { width: 760px; }
    .container .fourteen.columns                { width: 820px; }
    .container .fifteen.columns                 { width: 880px; }
    .container .sixteen.columns                 { width: 940px; }

    .container .one-third.column                { width: 300px; }
    .container .two-thirds.column               { width: 620px; }

    /* Offsets */
    .container .offset-by-one                   { padding-left: 60px;  }
    .container .offset-by-two                   { padding-left: 120px; }
    .container .offset-by-three                 { padding-left: 180px; }
    .container .offset-by-four                  { padding-left: 240px; }
    .container .offset-by-five                  { padding-left: 300px; }
    .container .offset-by-six                   { padding-left: 360px; }
    .container .offset-by-seven                 { padding-left: 420px; }
    .container .offset-by-eight                 { padding-left: 480px; }
    .container .offset-by-nine                  { padding-left: 540px; }
    .container .offset-by-ten                   { padding-left: 600px; }
    .container .offset-by-eleven                { padding-left: 660px; }
    .container .offset-by-twelve                { padding-left: 720px; }
    .container .offset-by-thirteen              { padding-left: 780px; }
    .container .offset-by-fourteen              { padding-left: 840px; }
    .container .offset-by-fifteen               { padding-left: 900px; }



/* #Tablet (Portrait)
================================================== */

    /* Note: Design for a width of 768px */

    @media only screen and (min-width: 768px) and (max-width: 959px) {
        .container                                  { width: 768px; }
        .container .column,
        .container .columns                         { margin-left: 10px; margin-right: 10px;  }
        .column.alpha, .columns.alpha               { margin-left: 0; margin-right: 10px; }
        .column.omega, .columns.omega               { margin-right: 0; margin-left: 10px; }

        .container .one.column                      { width: 28px; }
        .container .two.columns                     { width: 76px; }
        .container .three.columns                   { width: 124px; }
        .container .four.columns                    { width: 172px; }
        .container .five.columns                    { width: 220px; }
        .container .six.columns                     { width: 268px; }
        .container .seven.columns                   { width: 316px; }
        .container .eight.columns                   { width: 364px; }
        .container .nine.columns                    { width: 412px; }
        .container .ten.columns                     { width: 460px; }
        .container .eleven.columns                  { width: 508px; }
        .container .twelve.columns                  { width: 556px; }
        .container .thirteen.columns                { width: 604px; }
        .container .fourteen.columns                { width: 652px; }
        .container .fifteen.columns                 { width: 700px; }
        .container .sixteen.columns                 { width: 748px; }

        .container .one-third.column                { width: 236px; }
        .container .two-thirds.column               { width: 492px; }

        /* Offsets */
        .container .offset-by-one                   { padding-left: 48px; }
        .container .offset-by-two                   { padding-left: 96px; }
        .container .offset-by-three                 { padding-left: 144px; }
        .container .offset-by-four                  { padding-left: 192px; }
        .container .offset-by-five                  { padding-left: 240px; }
        .container .offset-by-six                   { padding-left: 288px; }
        .container .offset-by-seven                 { padding-left: 336px; }
        .container .offset-by-eight                 { padding-left: 348px; }
        .container .offset-by-nine                  { padding-left: 432px; }
        .container .offset-by-ten                   { padding-left: 480px; }
        .container .offset-by-eleven                { padding-left: 528px; }
        .container .offset-by-twelve                { padding-left: 576px; }
        .container .offset-by-thirteen              { padding-left: 624px; }
        .container .offset-by-fourteen              { padding-left: 672px; }
        .container .offset-by-fifteen               { padding-left: 720px; }
        .container .two.columns a { font-size: 15px; }
    }


/*  #Mobile (Portrait)
================================================== */

    /* Note: Design for a width of 320px */

    @media only screen and (max-width: 767px) {
        .container { width: 260px; }
        .columns, .column { margin: 0; }

        .container .one.column,
        .container .two.columns,
        .container .three.columns,
        .container .four.columns,
        .container .five.columns,
        .container .six.columns,
        .container .seven.columns,
        .container .eight.columns,
        .container .nine.columns,
        .container .ten.columns,
        .container .eleven.columns,
        .container .twelve.columns,
        .container .thirteen.columns,
        .container .fourteen.columns,
        .container .fifteen.columns,
        .container .sixteen.columns,
        .container .one-third.column,
        .container .two-thirds.column  { width: 260px; }

        .container .two.columns { width: 80px; margin: 2px 10px 5px 0; }
        .container .two.columns.follow { margin-right: 0 !important; }
        .container .two.columns a { font-size: 15px; }

        /* Offsets */
        .container .offset-by-one,
        .container .offset-by-two,
        .container .offset-by-three,
        .container .offset-by-four,
        .container .offset-by-five,
        .container .offset-by-six,
        .container .offset-by-seven,
        .container .offset-by-eight,
        .container .offset-by-nine,
        .container .offset-by-ten,
        .container .offset-by-eleven,
        .container .offset-by-twelve,
        .container .offset-by-thirteen,
        .container .offset-by-fourteen,
        .container .offset-by-fifteen { padding-left: 0; }
        .logo { margin: 0 0 0 -20px !important; }
        .header { margin-top: 15px !important; padding-top: 15px !important; }
        .sites { margin-bottom: 15px !important; }
        .sites .column .site { margin-bottom: 15px !important; }
    }


/* #Mobile (Landscape)
================================================== */

    /* Note: Design for a width of 480px */

    @media only screen and (min-width: 480px) and (max-width: 767px) {
        .container { width: 420px; }
        .columns, .column { margin: 0; }

        .container .one.column,
        .container .two.columns,
        .container .three.columns,
        .container .four.columns,
        .container .five.columns,
        .container .six.columns,
        .container .seven.columns,
        .container .eight.columns,
        .container .nine.columns,
        .container .ten.columns,
        .container .eleven.columns,
        .container .twelve.columns,
        .container .thirteen.columns,
        .container .fourteen.columns,
        .container .fifteen.columns,
        .container .sixteen.columns,
        .container .one-third.column,
        .container .two-thirds.column { width: 420px; }
        
        .header { margin-top: 15px !important; }
        .container .two.columns { width: 130px; margin: 2px 15px 5px 0; }
        
    }


/* #Clearing
================================================== */

    /* Self Clearing Goodness */
    .container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }

    /* Use clearfix class on parent to clear nested columns,
    or wrap each row of columns in a <div class="row"> */
    .clearfix:before,
    .clearfix:after,
    .row:before,
    .row:after {
      content: '\0020';
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0; }
    .row:after,
    .clearfix:after {
      clear: both; }
    .row,
    .clearfix {
      zoom: 1; }

    /* You can also use a <br class="clear" /> to clear columns */
    .clear {
      clear: both;
      display: block;
      overflow: hidden;
      visibility: hidden;
      width: 0;
      height: 0;
    }




* { margin: 0; padding: 0; font-weight: normal; outline: 0; font-family: arial; text-decoration: none; }
body { background:url(http://sjkdesigns.com/images/woodbg.jpg) repeat fixed; }

a { color: #36c; }
a:hover { text-decoration: underline; }

.container { background: #fff; padding: 0 15px; }

.logoctr { height: 65px; }
.logo { float: left; margin: -10px 0 0 -30px; }

.header { padding-top: 35px; margin-top: 25px; z-index: 1; box-shadow: 0 0 5px #000; }
.nav a { display: block; background: #c61717; font-size: 17px; text-align: center; color: #fff; margin: 0 0 10px 0; text-decoration: none; padding: 5px 0; border-radius: 5px; }
.nav a:hover { background: #444; }
.sites { padding-bottom: 5px; box-shadow: 0 5px 5px #000; z-index: 2; margin-bottom: 25px; }

.sites .column .site { background: #eee; margin-bottom: 20px; border-radius: 5px; border: 1px solid #ccc; display: block; *padding-top: 10px; }
.thumb { display: block; height: 170px; border-bottom: 1px solid #ccc; margin: 0 0 10px; border-radius: 5px 5px 0 0; }

.recombu .thumb { background:url(http://sjkdesigns.com/images/websites/recombu.jpg) no-repeat; background-position: -30px 0; }
.eqa .thumb{ background:url(http://sjkdesigns.com/images/websites/eqa.jpg) top left no-repeat; }
.mgl .thumb{ background:url(http://sjkdesigns.com/images/websites/mgl.jpg) top left no-repeat; }
.vb .thumb{ background:url(http://sjkdesigns.com/images/websites/vintageboutique.jpg) top left no-repeat; }
.kfs .thumb{ background:url(http://sjkdesigns.com/images/websites/kfs.jpg) top left no-repeat; }
.gm .thumb{ background:url(http://sjkdesigns.com/images/websites/golfersmate.jpg) top left no-repeat; }
.cp .thumb{ background:url(http://sjkdesigns.com/images/websites/closerphotography.jpg) top left no-repeat; }
.got .thumb{ background:url(http://sjkdesigns.com/images/websites/got.jpg) top left no-repeat; }
.jmb .thumb{ background:url(http://sjkdesigns.com/images/websites/jmb.jpg) top left no-repeat; }

.site .site-name { font-size: 17px; text-align: center; display: block; font-weight: bold; }
.site .url { font-size: 11px; text-align: center; display: block; margin: 0 0 12px; color: #555; font-weight: bold; }

#about, #contact { max-width: 500px; padding: 10px; }
#about h2, #contact h2 { font-size: 22px; color: #333; line-height: 28px; margin: 0 0 12px; }
#about p, #contact p { font-size: 13px; color: #333; line-height: 22px; }

#fancybox-loading{position:fixed;top:50%;left:50%;height:40px;width:40px;margin-top:-20px;margin-left:-20px;cursor:pointer;overflow:hidden;z-index:1104;display:none;}* html #fancybox-loading{position:absolute;margin-top:0;}#fancybox-loading div{position:absolute;top:0;left:0;width:40px;height:480px;background-image:url(/fancybox/fancybox.png);}#fancybox-overlay{position:fixed;top:0;left:0;bottom:0;right:0;background:#000;z-index:1100;display:none;}* html #fancybox-overlay{position:absolute;width:100%;}#fancybox-tmp{border:0;overflow:auto;display:none;margin:0;padding:0;}#fancybox-wrap{position:absolute;top:0;left:0;z-index:1101;display:none;margin:0;padding:20px;}#fancybox-outer{position:relative;width:100%;height:100%;background:#FFF;}#fancybox-inner{position:absolute;top:0;left:0;width:1px;height:1px;outline:none;overflow:hidden;margin:0;padding:0;}#fancybox-hide-sel-frame{position:absolute;top:0;left:0;width:100%;height:100%;background:transparent;}#fancybox-close{position:absolute;top:-15px;right:-15px;width:30px;height:30px;background-image:url(/fancybox/fancybox.png);background-position:-40px 0;cursor:pointer;z-index:1103;display:none;}#fancybox_error{color:#444;font:normal 12px/20px Arial;margin:0;padding:7px;}#fancybox-content{height:auto;width:auto;margin:0;padding:0;}#fancybox-img{width:100%;height:100%;border:none;outline:none;line-height:0;vertical-align:top;-ms-interpolation-mode:bicubic;margin:0;padding:0;}#fancybox-frame{position:relative;width:100%;height:100%;border:none;display:block;}#fancybox-title{position:absolute;bottom:0;left:0;font-family:Arial;font-size:12px;z-index:1102;}.fancybox-title-inside{text-align:center;color:#333;padding:10px 0;}.fancybox-title-outside{padding-top:5px;color:#FFF;text-align:center;font-weight:700;}.fancybox-title-over{color:#FFF;text-align:left;}#fancybox-title-over{background-image:url(/fancybox/fancy_title_over.png);display:block;padding:10px;}#fancybox-title-wrap{display:inline-block;}#fancybox-title-wrap span{height:32px;float:left;}#fancybox-title-left{padding-left:15px;background-image:url(/fancybox/fancybox.png);background-position:-40px -90px;background-repeat:no-repeat;}#fancybox-title-main{font-weight:700;line-height:29px;background-image:url(/fancybox/fancybox-x.png);background-position:0 -40px;color:#FFF;}#fancybox-title-right{padding-left:15px;background-image:url(/fancybox/fancybox.png);background-position:-55px -90px;background-repeat:no-repeat;}#fancybox-left,#fancybox-right{position:absolute;bottom:0;height:100%;width:35%;cursor:pointer;outline:none;background-image:url(/fancybox/blank.gif);z-index:1102;display:none;}#fancybox-left{left:0;}#fancybox-right{right:0;}#fancybox-left-ico,#fancybox-right-ico{position:absolute;top:50%;left:-9999px;width:30px;height:30px;margin-top:-15px;cursor:pointer;z-index:1102;display:block;}#fancybox-left-ico{background-image:url(/fancybox/fancybox.png);background-position:-40px -30px;}#fancybox-right-ico{background-image:url(/fancybox/fancybox.png);background-position:-40px -60px;}#fancybox-left:hover,#fancybox-right:hover{visibility:visible;}#fancybox-left:hover span{left:20px;}#fancybox-right:hover span{left:auto;right:20px;}.fancy-bg{position:absolute;border:0;width:20px;height:20px;z-index:1001;margin:0;padding:0;}#fancy-bg-n{top:-20px;left:0;width:100%;background-image:url(/fancybox/fancybox-x.png);}#fancy-bg-ne{top:-20px;right:-20px;background-image:url(/fancybox/fancybox.png);background-position:-40px -162px;}#fancy-bg-e{top:0;right:-20px;height:100%;background-image:url(/fancybox/fancybox-y.png);background-position:-20px 0;}#fancy-bg-se{bottom:-20px;right:-20px;background-image:url(/fancybox/fancybox.png);background-position:-40px -182px;}#fancy-bg-s{bottom:-20px;left:0;width:100%;background-image:url(/fancybox/fancybox-x.png);background-position:0 -20px;}#fancy-bg-sw{bottom:-20px;left:-20px;background-image:url(/fancybox/fancybox.png);background-position:-40px -142px;}#fancy-bg-w{top:0;left:-20px;height:100%;background-image:url(/fancybox/fancybox-y.png);}#fancy-bg-nw{top:-20px;left:-20px;background-image:url(/fancybox/fancybox.png);background-position:-40px -122px;}#fancybox-loading.fancybox-ie div{background:transparent;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_loading.png',sizingMethod='scale');}.fancybox-ie #fancybox-close{background:transparent;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_close.png',sizingMethod='scale');}.fancybox-ie #fancybox-title-over{background:transparent;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_over.png',sizingMethod='scale');zoom:1;}.fancybox-ie #fancybox-title-left{background:transparent;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_left.png',sizingMethod='scale');}.fancybox-ie #fancybox-title-main{background:transparent;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_main.png',sizingMethod='scale');}.fancybox-ie #fancybox-title-right{background:transparent;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_right.png',sizingMethod='scale');}.fancybox-ie #fancybox-left-ico{background:transparent;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_nav_left.png',sizingMethod='scale');}.fancybox-ie #fancybox-right-ico{background:transparent;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_nav_right.png',sizingMethod='scale');}.fancybox-ie .fancy-bg{background:transparent!important;}.fancybox-ie #fancy-bg-n{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_n.png',sizingMethod='scale');}.fancybox-ie #fancy-bg-ne{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_ne.png',sizingMethod='scale');}.fancybox-ie #fancy-bg-e{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_e.png',sizingMethod='scale');}.fancybox-ie #fancy-bg-se{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_se.png',sizingMethod='scale');}.fancybox-ie #fancy-bg-s{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_s.png',sizingMethod='scale');}.fancybox-ie #fancy-bg-sw{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_sw.png',sizingMethod='scale');}.fancybox-ie #fancy-bg-w{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_w.png',sizingMethod='scale');}.fancybox-ie #fancy-bg-nw{filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_nw.png',sizingMethod='scale');}