/*   
Theme Name: Matt Huynh website theme
Theme URI: http://matthuynh.com/
Description: Matt Huynh website theme based on Thematic Child Theme development.
Author: Tu Tak Tran
Author URI: http://tutaktran.com/
Template: thematic
Version: 1.0
Tags: Thematic
.
Thematic is © Ian Stewart http://themeshaper.com/
.
*/

/* Reset browser defaults */
@import url('../thematic/library/styles/reset.css');

/* Apply basic typography styles */
@import url('../thematic/library/styles/typography.css');

/* Apply a basic layout */
@import url('../thematic/library/layouts/2c-l-fixed.css');

/* Apply basic image styles */
@import url('../thematic/library/styles/images.css');

/* Apply default theme styles and colors */
/* It's better to actually copy over default.css into this file (or link to a copy in your child theme) if you're going to do anything outrageous */
@import url('../thematic/library/styles/default.css');

/* Prepare theme for plugins */
@import url('../thematic/library/styles/plugins.css');

/**
 * Colours
 *    gray    #939598
 */

/* Debugging grid
-------------------------------------------------------------- */
.show-grid #wrapper {
  background: transparent url(grid.png) repeat-y center 0;
}

/* Typography
-------------------------------------------------------------- */

body, input, textarea {
  font: 12px Georgia, serif;
  line-height: 15px;  
}
  body {
    background-color: #ffffff;
    color: #000000;  
  }

p, ul, ol, dd, pre {
  margin-bottom:1em;
}
pre, code {
  font:14px Monaco, monospace;
  line-height:18px;
}

a:link {
  color:#939598;
}
a:visited {
  color:#000000;
}
a:active,
a:hover {
  color: #939598;
}

/* Heading
-------------------------------------------------------------- */
#branding {
  padding: 65px 0 0;
}

#blog-title {
  font: 1.16667em Georgia, serif;
  line-height: 1.5em;  
}
#blog-title a {
  color: #000000;
  text-transform: uppercase;
}
  #blog-title a:hover {
    color: #939598;
  }
  
/* Menu
-------------------------------------------------------------- */  
#access {
  border: none;  
  height: 22px;
}

#access .sf-menu {
  margin: -18px 0 0 230px;
}

.sf-menu {
  border-right: none;
  float:left;
}
.sf-menu a {
  border: none;
  padding: 0;
  margin-right: 17px;
  text-decoration:none;
  font-size: 1.16667em;
  text-transform: uppercase;
}

.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
  color:      #000000;
}
.sf-menu li {
  background:   #ffffff;
}

.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
  background: #ffffff;
  color: #939598;
}
.sf-menu ul {
  border: none;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
  top:32px; /* overriding essential styles */
}
.sf-menu ul ul {
  margin-top:0;
}
.sf-menu ul a {
  background:#fafafa;
  border-bottom:none;
}
.sf-menu ul a:hover,
.sf-menu .current_page_item a {
    color: #939598;
}

/* Content
-------------------------------------------------------------- */

#main {
  padding: 0 0 22px;
}

#content {
  margin: 0 0 0 230px;
  width: 710px;
}

#content a:link {
  color: #000000;
}
  #content a:hover {
    color: #939598;
  }

.entry-title {
  font: 1em Georgia, serif;
  line-height: 1.25em;
  text-transform: uppercase;
  padding: 0;   
}
  /* Hide titles on pages */
  .page .entry-title {
    display: none;
  }
	.search .page .entry-title {
		display: block; /* Show title in search listings */
	}

.entry-content h1, .entry-content h2 {
  font: 1em Georgia, serif;
  padding: 18px 0 0;
  text-transform: uppercase;
}

.entry-content {
  padding: 0;  
}
  .blog .entry-content,
  .single .entry-content,
  .archive .entry-content {
    padding-top: 15px;
  }

.entry-content img { 
	max-width: 710px;
	height: auto;
}

.hentry {
  width: 710px;  
}

.entry-meta {
  font-size: 1em;
  line-height: 1.25em;    
}
.entry-meta abbr {
  color: #000000;
}

.entry-utility {
  font-size: 1em;
  line-height: 1.25em;  
}

.entry-utility a {
  font-style: normal;
  text-transform: uppercase;   
}

/* Blog
-------------------------------------------------------------- */
#comments h3 {
  font: 1em Georgia, serif;
  padding: 18px 0 0;
  text-transform: uppercase;  
}

#comments-list li.alt {
  background: transparent;
}

#comments-list li,
#comments-list li.bypostauthor {
  background-color: #ffffff;
}

#respond {
  background: transparent;
}

.navigation a {
  font-style: normal;
}

.navigation a:active, .navigation a:hover {
  color: #939598;
}

.navigation .meta-nav {
  color: #000000;
}

.listing-navigation {
  text-align: right;  
}

.listing-navigation .nav-previous, .listing-navigation .nav-next {
  float: none;
  display: inline;
  width: auto;  
}
  .listing-navigation .nav-previous a, .listing-navigation .nav-next a {
    text-transform: uppercase;  
  }
  .listing-navigation .nav-previous .disabled, .listing-navigation .nav-next .disabled {
    text-transform: uppercase;  
    color: #333;
    cursor: default;
  }

/* Asides/Sidebars
-------------------------------------------------------------- */
.aside, .aside input {
  font-size: 1em;
  line-height: 1.25em;
  margin-bottom: 0;
}

#main .aside,
#main .main-aside {
  width: 140px;
  color: #000000;
  float: left;
}

.primary-aside { /* On the top */
  height: 355px;
  overflow: hidden;
}

#secondary {
  margin-top: 12px;
}

.aside h3 {
  font: 1em Georgia, serif;
  padding: 0 0 20px;
  text-transform: uppercase;    
}

.main-aside ul {
  padding: 0;  
}

.aside a:link {
  color: #000000;
  text-decoration: none;
}
  .aside a:hover {
    text-decoration: underline;
  }

.aside form, .aside table {
  margin-bottom: 0;  
}

#blog-page-primary ul ul {
  margin: 0;
}
.widget_archive li {
  list-style: none;
}
  
#about-page-primary p {
  margin-bottom: 0;
}

#about-page-primary ul {
  margin: 0;
}
  #about-page-primary ul li {
    list-style: none outside;    
  }

#about-page-primary .widgetcontainer {
  margin-bottom: 30px;
}

/* Recent blog post vertical scroll - using http://flowplayer.org/tools/demos/scrollable/vertical.html */

#blog-page-primary ul {
  
}

#blog-posts-container { /* root element for scrollable */ 
  position:relative; 
  overflow:hidden;  
  
  width: 140px;
  height: 240px;
  padding-bottom: 20px;  
}

#blog-posts-container .blog-posts { /* root element for scrollable items */ 
  position: absolute; 

  /* this time we have very large space for the height */ 
  height: 20000em; 
} 
  #blog-posts-container .blog-posts li {
    padding: 0 0 3px;
  }
    #blog-posts-container .blog-posts li a:hover,
    #blog-posts-container .blog-posts .current_page_item a {
      color: #939598;
      text-decoration: none;
    }
    #blog-posts-container .blog-posts li a:visited {
      text-decoration: none;
    }
    
#blog-most-recent-widget .nav {
  display: none; /* Don't display unless js is enabled */
  margin-top: 15px;
  text-align: right;
} 
  .js #blog-most-recent-widget .nav {
    display: block;  
  }

  #blog-most-recent-widget .nav a {
    color: #000000;
    text-transform: uppercase;
    cursor: pointer;
  }
    #blog-most-recent-widget .nav a:hover {
      text-decoration: none;
      color: #939598;  
    }
  #blog-most-recent-widget .nav .disabled,
  #blog-most-recent-widget .nav a:hover.disabled {
    color: #333;
    cursor: default;
  }
  
/* Search widget */
#search-widget {
  position: absolute;
  top: 335px;
}

#search-widget #searchform input {
  width: 133px;
}

/* Mailing list widget */
#mailing-list-form {
  margin-bottom: 12px;
}
#mailing-list-form input {
  width: 133px;
}

#mailing-list-submit {
  display: none;  
}  

/* Gallery
-------------------------------------------------------------- */
.flexipages_widget a:visited {
  text-decoration: none;
}  
.aside ul .flexipages_widget ul {
  margin: 0;
  list-style: none;
}

.flexipages_widget li {
  padding:0 0 3px;
}

.flexipages_widget .current_page_item a,
.flexipages_widget a:hover {
  color: #939598;
  text-decoration: none;
}

.gallery dl {
  margin: 0;
}

  
/* Footer
-------------------------------------------------------------- */  
#footer {
  border: none;
}

