/* @override 
	http://localhost:4000/stylesheets/style.css
	http://static.flowplayer.org/tools/css/scrollable-minimal.css
	http://relativelyearly.com/stylesheets/style.css
*/

body, html {
  padding: 0;
  margin: 0;
  width: 100%;
}
body {
  background: #222 url(/images/grass2.png) repeat-x 51% 142px;
  font: 12px/1.5em "Lucida Grande", Lucida, Verdana, sans-serif;
  color: #000;
  height: 100%;
}
#sky {
  background: url(/images/big_sky_bg.jpg) repeat-x 14px 0;
  overflow: hidden;
  padding: 0;
}
#sun {
  position: relative;
  color: #cce3ff;
  width: 330px;
  height: 142px;
  float: left;
  background: url(../images/sun_trans.png) no-repeat left 2px;
}
#header {
  padding: 0;
  height: 185px;
  text-align: center;
  background: none;
  overflow: hidden;
}

#header a#RED {
  padding-top: 0;	
  line-height: 0;
  padding: 0;
  display: block;
  margin: 10px auto -14px 0 !important;	
  position: relative;
  left: -160px;    
}

/* @group nav */

ul#nav {
  font-size: 14px;	
  list-style: none;
  padding: 0;
  width: 460px;
  margin: 8px auto;
}
ul#nav li {
  float: left;
  width:115px;
}
ul#nav li a{
  display: block;
  width:100px;
  overflow: hidden;
  color: #fff;
  border-bottom:1px solid #1b4b1e;  
  background: rgb(11, 29, 5);  
  background: rgba(0,0,0,.5);
  -webkit-box-shadow:none;
  -moz-box-shadow:none;  
  -webkit-transition: background-color .3s linear;  
  padding: .3em;
}
ul#nav li a:hover, ul#nav li a.active{
  top: 0;
  background-color: rgba(0,0,0,.7);
  border-bottom-color: #1b4b1e;
  -webkit-box-shadow:none;
  -moz-box-shadow:none;  
  -webkit-transition: background-color .3s linear;  
}



/* @end */

/* @group Portfolio */

/* @group scroller */


/* 
	root element for the scrollable. 
	when scrolling occurs this element stays still. 
*/
#main.portfolio_item div.scroller {
  width: 410px;
  text-align: center;
  margin: 1.5em auto;
}
.portfolio_item div.scrollable {
  margin: 0 auto;
}
div.scrollable {
	position:relative;
	margin-bottom: 40px;
	overflow:hidden;	 	
	width: 400px;	
	height:340px;	
	padding:0;		
	border-top: 2px solid #888;
	border-bottom: 1px solid #fff;
	border-left: 1px solid #aaa;
	border-right: 1px solid #aaa;
	-webkit-box-shadow: 0 0 5px #fff;
	-moz-box-shadow: 0 0 5px #fff;
}
div.scrollable div.items {	
	/* this cannot be too large */
	width:20000em;	
	position:absolute;
	clear:both;	
}

/* single scrollable item */
div.scrollable div.items div {
	float:left;
	/* custom decoration */
	text-align:center;
	width:400px;
	padding: 0;
	font-size:30px;
}
div.scrollable div.items div a {
  display: block;
  padding: 0;
  margin: 0;
  height: 265px;
  overflow: hidden;
}
#posts div.col.left div.scrollable div.items div a  img{
  border: none ;
  -webkit-border-radius:0;
  -moz-border-radius:0;  
}
/* active item */
div.scrollable div.items div.active {		
}
.scrollable .items .desc {
  border-top: 2px solid #ccc;
  background: #aaa url(../images/gray_gradient.png) repeat-x center 0; 
  padding-top: 20px; 
  height: 100px;
}

#frame {
  width: 355px;
  padding:28px 28px 0 22px;
  background: url(/images/frame.png) no-repeat;
  overflow: hidden;
}
h1 img {
  vertical-align: text-bottom;
}
small img {
  vertical-align: middle;
  position: relative;
  top: -4px;
  margin-right: 10px;
}
#frame .navi, #frame .next, #frame .prev {
  margin: 0 auto 10px auto;
}
.navi, .next, .prev {
  margin: 10px auto;
  position: relative;
}
#frame div.scrollable div.items div a {
  height: 235px;
}
#frame div.scrollable div.items div {
  width: 355px;
}
#frame div.scrollable div.items div a img {
  width: 355px;
}

#frame .scrollable {
  width: 355px;
  height: 296px;
  -webkit-box-shadow:none;
  -moz-box-shadow:none; 
  border: navajowhite; 
}

.navi {
  width: 200px;
  text-align: center;
}
.post .navi {
  width: 400px;
  margin: 10px 0;
}
div.navi a {
  width: 20px;
  height: 20px;
  display: inline-block;
  padding: 0;
  margin:0 5px;
}
.next {
  float: right;
  margin-right: 20px;
}
#all-port {
  display: block;
  text-align: center;
  margin: 0 auto;
  height: 1em;
  width: 5em;
  line-height: 1em;
  border-bottom: 1px solid #ccc;
}
.prev {
  float: left;
}

/* @end */

.portfolio_item h1 {
  text-align: center;
}

.portfolio_item #posts div.col.right p {
  margin-top: 2.5em;
}

/* @end */

/* @group Boxes */

#main {
  margin: 0 auto;
  border-top: 2px solid #fff;
  height: 100%;
  background: #ccc url(/images/texture_bg.png);  
  padding-bottom: 60px;
}
body.fluid #main {
  padding-bottom: 0;
}
body.page.fluid #main{
  padding-bottom: 60px;
}
#main .content.divider {
  background: url(/images/divider.png) repeat-y center 0;   
  max-width: 900px;
  _width:900px;  
}
.container.fluid, body.fluid #footer {
  min-width: 680px !important;

}
#main .content, #header.content, #footer .content {
  margin: 0 auto;  
  max-width: 900px; 
  position: relative;
}
.container {
  min-width: 900px;	 
  margin: 0 auto;
  padding: 0 20px;
  position: relative;
  z-index: 0;
}
.container .content .container {
  padding: 0;
  position: relative;
  z-index: 100;
}
.col {
  padding: 10px 0;
  max-width: 47%;  
  _width:420px;
  position: relative;
  z-index: 2 !important;
}

.col.right {
  padding-left: 30px;   
  width: 100%;
}

body.fluid #posts div.col.left{
  min-width: 60%;
}

body.page.fluid #footer .col.left {
  min-width: 50%;
}

body.page.fluid #footer .col.left{
  min-width: 20%;	
  max-width: 38%;
}
#posts.content.divider {
  background: url(/images/divider.png) repeat-y 63% 0;     
}

#portfolio {
  overflow: hidden;
}
#footer {
  position: relative;
  z-index: 0;
  padding-top: 20px;
  padding-bottom: 20px;
  background: #222;
  max-width: 100%;
  border-top: 1px solid #777;
}
#footer.container .content {
  position: relative;	
  z-index: 0 !important;
}
#footer .col.right {
  max-width: 38%;
}
#footer * {
  color: #ddd;
}
#footer p {
  color: #999;
}
img#logo {
  float: right;
}
body.fluid #footer .col.right{
  max-width: 34%;
}
body.fluid #footer .col.left{
  max-width: 55%;  
}
body.page #footer .col.left {
  max-width: 40%;
}

body.fluid .col.right {
  max-width: 34%;
}
body.page.fluid .col.right {
  max-width: 47% !important;
}
body.page.fluid #footer .col.right {
  max-width: 36% !important;
}
div#base {
  position: absolute;
  z-index: 0;
  width: 96%;
  text-align: center;
  display: block;
  margin-top: -130px;
  margin-bottom: -70px;
}
body.page.fluid #base{
  display: block;
}
body.fluid #base {
  display: none;
}
.col ul {
  padding-left: 1.4em;
}
/* @end */

/* @group framework */
.left {
  float: left;
}
.right {
  float: right;
}
tright{
  text-align: right;
}
tleft {
  text-align: left;
}
.clear {
  clear: both;
}
br.clear {
  line-height: 0;
}
.shadow {
  -webkit-box-shadow:1px 1px 2px rgba(0,0,0,.6);  
  -moz-box-shadow:1px 1px 2px rgba(0,0,0,.6);    
}
.round{
  -webkit-border-radius:6px;
  -moz-border-radius:6px;  
}
.nob {
  border: none !important;
}
/* @end */

/* @group Text */

/* @group Posts */
.post h1, .post h2 {
  width: auto;
  display: block;
}
.post h1 {
  margin-bottom: 0;  
}
.portfolio .post h1 {
  text-align: center;  
}
.post .col.right h1 {
  text-align: left;
}
.post cite {
 display: block;
 line-height: .9em;
 margin: 1em 0 .4em 0;
  font-weight: normal;
  font-style: normal;
  text-transform: uppercase;
  color: #666;  
  font-size: .8em;
}

#posts div.col.left div.post a img, .person img{
  display: block;
  margin: 0 auto;
  text-align: center;
  border: 6px solid #fff;
  -webkit-border-radius:6px;
  -moz-border-radius:6px;  
}
/* @end */
h1, h2, h3, h4 {
  margin-top: 0;
  font-family: 'Rockwell', 'Chunk', Courier;
  text-transform: uppercase;
  text-shadow: rgba(256,256,256,.4) 0 2px 1px;  
}

#personals div.person div.info h4 {
  color: #666;
}
h1 a, h2 a, h3 a, .plain, .scrollable a, .dsq-widget-comment a {
  color: #000;
  background: none;
  -moz-box-shadow:none;  
  -webkit-box-shadow:none;
  padding: 0;
}
.dsq-widget-comment a {
	font-weight: normal;
  font-family: "Lucida Grande", Lucida, Verdana, sans-serif;
}

span.dsq-widget-comment {
	padding: .5em .3em .3em 45px;
  display: block;
}


li.dsq-widget-item {
  width:100% ;
}

p.dsq-widget-meta {
  display: block;
  padding: 10px 0 0 45px !important ;
}

#dsq-post-add {
  border-bottom: 2px groove #eee;
}

#dsq-options {
  display: none;
}


p.dsq-widget-meta {
  display: block;
  padding: 10px 0 0 45px !important ;
}

#dsq-recentcomments {
  max-width: 420px;
}

ul.dsq-widget-list {
  display: block;
  margin: 0;
}
h1 a:hover, h2 a:hover, h3 a:hover, .plain:hover, .scrollable a:hover  {
  background: none;
  top: 0;
  -webkit-box-shadow:none; 
  -moz-box-shadow:none;   
  border-bottom: 4px solid #222;
  -webkit-border-radius:0;
  -moz-border-radius:0;
}
.plain:hover, .scrollable a  {
  border: none !important;
}

h1 {
  font-size: 2em;
}
h2 {
  font-size: 1.5em;	
  margin-top: .3em;
}
h3 {
  font-size: 24px;
}
h4 {
  font-size: 1em;
  margin: 0;
}
h2 img {
  vertical-align: middle;
  margin: 0 0 -10px 10px;
  position: relative;
  top: -10px;
}
.person h2 {
  margin: 0;
}
.person img {
  float: left;
  margin-right: 20px;
  vertical-align: bottom;
}  
.person {
 margin-bottom: 10px; 
}
.person .info {
  margin-left:130px;
}
.person ul {
  padding: 0;
  margin: 0;
}
.person ul li {
  text-align: left;
  list-style: none;
  padding: 0 0 0 8px;
  margin: 5px 0;
}
.person ul li a img {
	position: relative;
 top: 2px;
}
p {
  margin: 0 0 1.5em 0;	
  line-height: 1.8em;
}
a {
  color:#000; 
  text-decoration: none;
  background: #fff;
  padding: .2em .3em;
  -webkit-border-radius:6px;
  -moz-border-radius:6px;
  -webkit-box-shadow:1px 1px 2px rgba(0,0,0,.5);
  -moz-box-shadow:1px 1px 2px rgba(0,0,0,.5);
  cursor: pointer;
  position: relative;
  font-family: 'Rockwell', 'Chunk', Courier;
  font-weight: bold;
}
a img {
  border: none;
}

img.dsq-widget-avatar {
  padding-right: 10px !important;
}

body.page .col.right a.plain img {
  -webkit-box-shadow:0 0 10px #000;
  -moz-box-shadow:0 0 10px #000;  
  border: 4px solid #fff;
  -webkit-border-radius:4px;
  -moz-border-radius:4px;  
}
.button {
  padding: .5em;
  line-height: 4em;
  font-family: 'Rockwell','Chunk', Courier;
  font-weight: bold;   
}
a:hover, .navi a.active {
  background: #ddd;
  top: 1px;
  -webkit-box-shadow:0 -1px 2px rgba(0,0,0,.4);  
  -moz-box-shadow:0 -1px 2px rgba(0,0,0,.4);
  border-bottom: 1px solid #fff;
}

hr {
  margin: 20px 0;
  height: 10px;
  clear: both;
background:#ccc url(../images/hr.png) no-repeat;
border: none;
outline: none;
}
hr.double {
background: url(../images/hr_double.png) no-repeat center 0;
border: none;
outline: none;
}

#footer a{
  background: #111;
}

#footer ul {
  padding: 0 0 0 2em;
}
#footer li {
  list-style: none;
  margin-bottom: .5em;
}
#footer li img {
  vertical-align: middle;
}
#footer a:hover {
  background: #000;
  border-bottom: 1px solid #444;
}
#footer li span {
  margin-left: 5px;
}
#footer small {
  color: #444;
}
/* @end */

/* @group Images */

.col img {
  max-width: 100%;
}

/* @end */

/* @group blog */
div.post {
  margin-bottom: 1.5em;
}
#dsq-content a, .dsq-menu a{
  background: none;
  font-family: "Lucida Grande", Lucida, Verdana, sans-serif;
  top: 0;
  -webkit-box-shadow:none;
  -moz-box-shadow:none;  
}
#dsq-content a:hover{
	border: none;
	text-decoration: underline;
}	
#dsq-content h3 {
  font-size: 1em;
}	
/* @end */