
/*
Theme Name: TFAL Theme 2009
Theme URI: http://thinkingfoaliving.org/
Description: The kickass TFAL Wordpress Theme
Version: 1.0
Author: Ian Coyle
Author URI: http://iancoyle.com/
Tags: Roads? Where we're going, we don't need roads.


    This theme was designed and programmed by the TFAL Network. 



*/


/* ---------------------------------- * /

/*
 *  TABLE OF CONTENTS
 *  
 *  @RESET
 *  @COLORS
 *    @COLORS:GLOBAL
 *    @COLORS:DYNAMIC
 *  @LAYOUT
 *    @LAYOUT:GRID
 *    @LAYOUT:GLOBALS
 *    @LAYOUT:COVER
 *    @LAYOUT:MASTHEAD
 *    @LAYOUT:CONTENT
 *    @LAYOUT:ENTRIES
 *    @LAYOUT:FILTERS
 *    @LAYOUT:SHELF
 *    @LAYOUT:FOOTER
 *  @PLUGINS
 *    @PLUGIN:PHOTOGALLERY
 *  @SECTIONS
 *    @SECTION:DIGEST
 *  @UI
 *    @UI:ICONS
 *    @UI:FADES
 *  @FORM
 *  @CLEAR-SELF
 *
 *
 *
 */

/* ---------------------------------- * /

/* @RESET */

html
{
  margin:         0;
  padding:        0;
  height:         100%;
  overflow-x:     hidden;
}

body
{
  margin:         0;
  padding:        0;
  min-height:     101%;
  overflow-x:     hidden;
  
}


*
{
  margin:         0;
  padding:        0;
  outline:        none;
}

body,
div,
dl,dt,dd,
ul,ol,li,
h1,h2,h3,h4,h5,h6,
pre,
form,fieldset,
input,textarea,
a,
p,blockquote,
th,td 
{ 
  margin:         0;
  padding:        0;
  vertical-align: baseline;
}
  
img 
{
 border:          0
}
  
address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var 
{
  font-style:     normal;
  font-weight:    normal;
}
  
ol,ul 
{
  list-style:     none;
}
  
h1,h2,h3,h4,h5,h6 
{
  font-size:      100%;
  font-weight:    normal;
}



/* ---------------------------------- * /

/* @COLORS */

/* @COLORS:GLOBAL */#4c3314

.tfal,     .site-tfal      .dynamic-color { color:#cba656; font-family: Tahoma, Geneva, sans-serif; font-size: 16px; }
.features, .site-features  .dynamic-color { color:#191919 }
.curated,  .site-curated   .dynamic-color { color:#cba656; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 16px; text-transform:uppercase; font-weight:bold;}
.digest,   .site-digest    .dynamic-color { color:#cba656; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size: 16px; text-transform:uppercase; font-weight:bold; }
.shelf,    .site-shelf     .dynamic-color { color:#191919 }
.network,  .site-network   .dynamic-color { color:#191919 }


.site-tfal      .dynamic-bg    { background:#620460 }
.site-features  .dynamic-bg    { background:#620460 }
.site-curated   .dynamic-bg    { background:#c70175 }
.site-digest    .dynamic-bg    { background:#ed008c }
.site-shelf     .dynamic-bg    { background:#dd3a01 }
.site-network   .dynamic-bg    { background:#fc5a02 }




/* ---------------------------------- * /

/* @LAYOUT */

body 
{
  background: #191919 ;
}

div#wrapper
{
  height:          100%;
  padding:         20px 0 0 100px;
  overflow:        hidden
}

/* @LAYOUT:GRID */

.grid1              { width: 130px; }
.grid2              { width: 300px; }
.grid3              { width: 620px; }
.grid4              { width: 940px; }

.column             { float: left; margin: 0 20px 0 0; }
.column:last-child  { margin: 0; }


/* ---------------------------------- * /

/* @LAYOUT:GLOBALS */

* 
{
  line-height:    21px;
  font-family:    georgia;
  font-weight:    normal;
  font-size:      14px;
  color:          #cba656;
}

p
{
  margin:          0 0 21px 0;
  font-size:       14px;
  color:           #cba656;
}

a
{
  text-decoration: none;
  font-style:      italic;

}

div#content .post-content a
{
  border-bottom:   1px dotted #4c3314;
}

div#content .post-content a:hover
{
  border-bottom:   0px solid #4c3314;
}

div#content .post-content a.zoom 
{
  border:          0
}

h2
{
  font-size:       21px;
  line-height:     42px;
}

.headline
{
  margin:          0 0 10px 0;
  line-height:     21px;
}
.subhead
{
  margin:          0 0 21px 0;
}


.divide-self
{
  border-top:      1px solid #c8bab4;
  padding:         21px 0 0 0;
  margin:          21px 0 0 0;
  
}



/* ---------------------------------- * /

/* @LAYOUT:COVER */

div#covers {

}


div.cover 
{
  margin:          0 0 42px 0;
  position:        relative;
  background:      #191919;
}



  div.cover-index 
  {
    opacity:         0;
    filter:          alpha(opacity=0)
  }
  
  div.cover-index:first-child 
  {
    opacity:         1;
    filter:          alpha(opacity=100);  
  }

  div.cover h2
  {
      position:        relative;
  }
  
  div.cover h2,
  div.cover h2 * 
  {
    font-size:     48px;
    color:         #c70175;
    line-height:   63px;

  }
  
  span.q1
  {
    display:       block;
    position:      absolute;
    top:           0;
    left:          -30px;
  }


  div.cover h3
  {
    color:         #c70175;
    margin:        21px 0 42px 0;
  }

  div.cover h4
  {
    margin:        0 0 21px 0;
    font-size:     14px;
    
  }
  
div.cover-items {
  position:         relative;
  width:            100%;
  left:             -100px;
  padding:          21px 0 0 100px;
}

  div.cover-items span
  {
    opacity:        .75;
    filter:         alpha(opacity=75);
  }

  div.cover-article
  {
    margin:          0 0 21px 0;
  }
  
  div.cover-article
  {
    width:            260px;
    padding:          0 40px 0 0;
  }

  div.cover-row 
  {
    padding:          0 0 21px 0;
  }


/* ---------------------------------- * /

/* @LAYOUT:MASTHEAD */

div#masthead
{
  height:          100%;
}

  div#masthead h1
  {
    margin:        0 0 21px 0;
    font-size:     53px;
    line-height:   42px;
  }
  
  div#masthead h2
  {
    margin:        0 0 21px 0;
    font-size:     16px;
  }
  
  div.stubs
  {
    margin:        100px 0 0 0;
  }
  
  div.stub
  {
    width:         200px;
    float:         left;
    margin:        0 20px 0 0;
  }
  
  div.stub p
  {
    font-size:     16px;
  }

/* ---------------------------------- * /

/* LAYOUT:NAV */









  div#nav ul li#nav-features.active { background: url(images/arrow-features.gif) 48% 100% no-repeat; }
  div#nav ul li#nav-curated.active  { background: url(images/arrow-curated.gif) 48% 100% no-repeat; }
  div#nav ul li#nav-digest.active   { background: url(images/arrow-digest.gif) 48% 100% no-repeat; }
  div#nav ul li#nav-shelf.active    { background: url(images/arrow-shelf.gif) 48% 100% no-repeat; }
  div#nav ul li#nav-network.active  { background: url(images/arrow-network.gif) 48% 100% no-repeat; }
  
  .site-tfal     div#nav.active { border-bottom-color:#1b1464 }
  .site-features div#nav.active { border-bottom-color:#620460 }
  .site-curated  div#nav.active { border-bottom-color:#c70175 }
  .site-digest   div#nav.active { border-bottom-color:#ed008c }
  .site-shelf    div#nav.active { border-bottom-color:#dd3a01 }
  .site-network  div#nav.active { border-bottom-color:#e46539 }


/* ---------------------------------- * /

/* @LAYOUT:CONTENT */

div#content
{
  background:        #191919;
  margin:            100px 0 0 0;
  padding:           20px 0 0 0;
  min-height:        101%;
  position:          relative;

}

div#content *
{
  /*background:        #191919;*/
}

/* ---------------------------------- * /

/* @LAYOUT:ENTRIES */

.post
{
  min-height:        101%;
  min-width:         940px;
  overflow:          hidden;
  margin:            0 0 21px -100px;
  padding:           0 0 21px 100px;
}

  .post-image-wrapper
  {
    margin:          0 0 21px 0;
  }

  .post h2 
  {
    line-height:     24px;
    margin:          0 0 6px 0;
  }
  
  .post-content
  {
    
    width:           90000px;
    min-height:      100%;
  }
  
 
  
  div#content div#post-content-preloader
  {
      background:      url(../images/loader.gif) 0 0 no-repeat;
      height:          50px;
      width:           50px;
      float:           left;
  }

  /* POST INTRO */
  
  .post-headings,
  .post-intro 
  {
    margin:          21px 0 84px 0
  }
  
  .post-headings em,
  .post-intro em
  {
    display:         block;
    margin:          0 0 21px 0;
    font-size:       14px;

  }

  .post-intro h3
  {
    font-style:      italic;
    font-size:       16px;
  }
  

  .post-footer p a,
  .post-footer p 
  {
    font-size:       12px;
  }
  
  * a.permalink
  {
    font-size:       12px;
    opacity:         .7;
  }
  
  * a.permalink:hover
  {
    opacity:          1;
  }

/* ---------------------------------- * /

/* @LAYOUT:FILTERS */

div#filters
{
  
  height:         0;
  width:          100%;
  overflow:       hidden;
  margin:         -1px 0 0 -100px;
  padding:        0 0 0 100px;
  z-index:        99999;
  opacity:        .9
}

  div#filters-content
  {
    margin:       21px 0 0 0;
  }
  
  div#filters h3,
  div#filters ul {
    margin:       0 0 21px 0;
  }

  div#filters *
  {
    color:        #191919;
  }
  
  
  
  div#filters ul.filterset li a,
  div#filters ul.filterset li span
  {
    opacity:      .5;
    filter:       alpha(opacity=50);
    background:   inherit;
  }
  
  div#filters ul.filterset li a:hover
  {
    opacity:      1;
    filter:       alpha(opacity=100);
  }

  div#filters ul.issuelist li
  {
    margin:       0 0 21px 0;
  }
  
  div#filters ul.issuelist li a.author
  {
    font-style:   normal;
  }
  
  .filter-title 
  {
    font-style:   italic;
    xfont-size:    14px;
  }


  div#filters ul.filterset li
  {
  
    position:     relative;
  
  }
  
  div#filters ul.filterset li em 
  {
    
    display:      none;
    position:     absolute;
    left:         0;
    top:          0;
    width:        7px;
    height:       7px;
    margin:       7px 0 0 -15px;
    overflow:     hidden;
    background:   url(../images/btnClose.png) 50% 50% no-repeat;
    text-indent:  -900px;
    cursor:       pointer;
  }
  
  div#filters ul.filterset li.active em 
  {
    display:      block;
  }
  
  div#filters ul.filterset li.active a
  {
    opacity:      1;
    filter:       alpha(opacity:100);
  }

#nav-filter
{
  display:        none;
}

#nav-filter.active
{
  display:        block;
}

/* ---------------------------------- * /

/* @LAYOUT:PAGE */
  
div.page {
  
}
  
  * div.page ul,
  * div.page ol
  {
    margin:          0 0 21px 0;
  }
  
  div.page ol li,
  div.page ul li 
  {
    margin:          0 0 0 25px;
    padding:         0 0 0 0;
    list-style:      disc;
  
  }
  
  div.page blockquote 
  {
    margin:          21px 0 0 0;
    padding:         19px 0 19px 0;
    border-top:      1px solid #c4b1a3;
    font-style:      italic;
  }

.lead-column-1
{
  width:          640px;
  margin-right:   0;
}

/* ---------------------------------- * /

/* @LAYOUT:SHELF */

/* OVERRIDE */


.site-shelf .post,
.site-shelf .post-content
{
    width:           100%;
}

.site-shelf .post-mask { width: 95%}
  
div#shelf
{
  padding-bottom:  21px;
  margin-bottom:   21px;
  min-width: 100%;
}

  div.shelf-item
  {
    width:          160px;
    height:         210px;
    float:          left;
    text-align:     center;
    margin:         10px 0 0 0;
  }


  div.shelf-item div.shelf-post
  {
     border-bottom: 10px solid #fff;
     height:        115px;
     margin:        0 0 0 0;
     position:      relative;
     width:         100%;
  }
  
  div.shelf-item div.shelf-post div.shelf-post-content
  {
    position:      absolute;
    bottom:        0;
    margin:        0;
    padding:       0;
    text-align:    center;
    width:         100%;
    line-height:   0;
    font-size:     0;
  }
  
  div.shelf-item div.shelf-link {
    margin:        11px 0 0 0;
    text-align:    center;
  }

/* ---------------------------------- * /

/* @LAYOUT:FOOTER */

div#footer
{
  border-top:      1px solid #cba656;
  background:      #000;
  margin:          0 0 0px -100px;
  padding:         20px 0 0px 100px;
  min-width:       960px;
			height:55px;
			width:100%;
			z-index: 3;
			background:#000000 repeat;
			border-top: 1px solid #b5985a;
}

		#left-footer{

			margin-left: 20px;
			margin-bottom: 13px;
			}
		
		
		#right-footer{
			height: 14px;
			
			margin-bottom: 26px;
			font-size: 12px;
			}

  div#footer *,
  .footer *
  {
    font-size:        12px;
  }

/* ---------------------------------- * /

/* @PLUGINS */

/* @PLUGINS:PHOTOGALLERY */


div.photogallery 
{
  position:        relative;
  width:           300px;
  overflow:        hidden;
  cursor:          pointer;
  padding:         0 0 28px 0;
  margin:          0 0 21px 0;
}


div.photogallery-items 
{
  display:         block;
  width:           1200px;
  position:        absolute;
  top:             0;
}

div.photogallery-nav 
{
  position:        absolute;
  width:           100%;
  bottom:          0;
  height:          32px;
  background:      url(../images/slideshow2.gif) 0 100% no-repeat;
}

  div.photogallery-nav span
  {
    display:       block;
    margin:        4px 0 0 40px;
  }

div.photogallery img 
{
  display:         block;
  width:           300px;
  position:        absolute;
  top:             0;
  left:            0;
  opacity:         0;
  filter:          alpha(opacity=0);
  cursor:          pointer;
}

div.photogallery img:first-child 
{

  opacity:         1;
  filter:          alpha(opacit=100);

}


/* ---------------------------------- * /

/* @SECTIONS */

/* @SECTION:DIGEST */

.site-digest h3
{
  font-style:      italic;
}

.site-digest div#digest-delicious
{
  /*background:      transparent url(../images/preloader.gif) 0 0 no-repeat;*/
  min-height:      50px;
}
  
  div#digest-delicious div.delicious-link 
  {
    margin:        0 0 40px 0;
  }

  a[rev=DeliciousLink]
  {
    text-transform: capitalize;
  }

/* ---------------------------------- * /

/* @UI */

/* @UI:ICONS */

.tfal-icon
{
  padding:          0 0 0 70px;
  width:            550px;
  background:       url(lib/img/tfal_footer.gif) 0 0 no-repeat;

}

* a.zoom {

  display:          block;
  padding:          0 0 30px 0;
  background:       url(lib/img/larger_image.gif) 0 100% no-repeat;
  border:           0;

}

div#keyboard-icon
{
  position:         absolute;
  right:            13px;
  top:              49px;
  width:            60px;
  height:           50px;
  background:       url(lib/img/keyboard.gif) 50% 50% no-repeat;
    cursor:           pointer;
  z-index:          8000;
}


div#content .post-content p a.tfal-video
{
  background:       url(lib/img/video.gif) 0 100% no-repeat;
  display:          block;
  width:            300px;
  min-height:       32px;
  border:           0;
  padding:          0 0 32px 0;
}

  div#content .post-content p a.tfal-video em
  {
    display:        block;

  }

/* @UI:FADES */

div#overlay-left 
{
  width:            100px;
  height:           100%;
  background:       transparent url() 0 0 repeat-y;
  position:         absolute;
  left:             -120px;
  top:              0;
  cursor:           pointer;
  z-index:          9900;
  display:          none;
}

div#overlay-right
{
  width:            100px;
  height:           100%;
  background:       transparent url() 0 0 repeat-y;
  position:         absolute;
  right:            0;
  top:              0;
  cursor:           pointer;
  z-index:          9900;
  display:          none;
}

div#overlay-left a,
div#overlay-right a 
{
  opacity:          .25;
  filter:           alpha(opacity=25);
  position:         absolute;
  top:              200px;
  width:            60px;
  height:           60px;
  display:          block;
  text-decoration:  none;
  margin:           -30px 0 0 -30px ;
}

div#overlay-right a 
{
  right:            10px;
  background:       url(../images/arrow_right.png) 100% 50% no-repeat;
}



div#overlay-left a 
{
  right:             10px;
  background:       url(../images/arrow_left.png) 50% 50% no-repeat;
}

div#overlay-left:hover a,
div#overlay-right:hover a,
div#overlay-left a.key-active,
div#overlay-right a.key-active 
{
  opacity:          1;
  filter:           alpha(opacity=100);
}


* .ajax-loading 
{
  min-height:      50px;
  background:      url(../images/loader.gif) 0 0 no-repeat;
}


/* ---------------------------------- * /

/* @FORM */

label
{
  display:         block;
  width:           100%;
}

fieldset
{
  border:          0
}

input,
textarea
{
  display:         block;
  width:           270px;
  padding:         7px 15px;
  border:          0;
  margin:          0 0 8px 0;
  font-style:      italic;
  background:      #fefaf9;
}


input:focus,
textarea:focus
{
  font-style:      normal
}

/* ---------------------------------- * /

/* @CLEAR-SELF */

.clear-self:after 
{ 
  content:         " "; 
  display:         block; 
  clear:           both; 
  visibility:      hidden; 
  line-height:     0; 
  height:          0;
  margin-bottom:   0; 
}

.clear-self 
{ 
  display:         inline-block;
}

html[xmlns] .clear-self 
{ 
  display:         block;
}

* html .clear-self 
{ 
  height:          1%; 
}

#nav{
			margin:0px;
			height:107px;
			width:100%;
			top:0px;
			z-index: 3;
			background:#000;
			position:absolute;
			padding-right: 50px;
			margin-left: -100px;
			
		}
		
		#nav-logo{
			background:url(../images/main-logo.png) no-repeat;
			width: 200px;
			height:60px;
		
			z-index: 3;
			top: 33px;
			left: 85px;
			position:absolute;
		}
		
		#nav-links{
			position:absolute;
			top: 46px;
			left:320px;
		}
		
		#nav-links img{
		margin-right: 50px;	
		}

		.footer-text{padding-right: 16px;}
		.footer-logo{margin-right: 8px;}
		.footer-logo a {color:#fff;}
		.footer-logo img {opacity:1;-webkit-transition: opacity 0.2s linear;}
		.footer-logo img:hover {opacity: .70; /* Standard: FF gt 1.5, Opera, Safari */
		filter: alpha(opacity=70); /* IE lt 8 */
		-ms-filter: "alpha(opacity=70)"; /* IE 8 */
		-khtml-opacity: .70; /* Safari 1.x */
		-moz-opacity: .70; /* FF lt 1.5, Netscape */}
		
		#left-footer{
		
		
			}
		
		
		#right-footer{
			height: 14px;
			margin-right: 10px;
			margin-bottom: 26px;
			font-size: 12px;
			}
		#right-footer a {color:#F00;}
		#right-footer a:hover {color:#fff; text-decoration:none}