/*
    Document   : main.css
    Created on : Mar 3, 2011, 3:43:27 PM
    Author     : pjkix
    Description:
        Purpose of the stylesheet follows.
*/


/*reset&such*/
/*@import "boilerplate.css";*/

/* Basics */
html, body {
	color:#333;
	background-color: #F3F3F3;
    font: 12px/18px "Lucida Grande","Lucida Sans Unicode",Helvetica,Arial,Verdana,sans-serif;

/*	font: normal normal 1em/1em Helvetica, sans-serif;*/
/*	font-family: Helvetica,sans-serif;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    font-size: 1em;
	line-height: 1em;*/
}

/* links */
a:link,
a:visited
{}

a:hover,
a:active
{}

a img {border:none;}

.skip, .skip-link, .skip-links {display:none}

/* structure */
#wrapper {
	max-width: 1200px;
	margin: auto;
	padding:0 1em;
}

#header {

	height: 80px;

	border:1px solid #ccc;
	margin:1em 0 1em 0 ;
	position:relative; /*contain position*/
	overflow:hidden; /*contain floats*/

	color:#fff;

	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-box-shadow: 0 1px 3px #999;
	-webkit-box-shadow: 0 1px 3px #999;

	/*gradients*/
	background-color: #333; /* old browsers */
	background-image: -moz-linear-gradient(top, #CCC 0%, #666 65%, #333 100%); /* FF3.6 */
	background-image: -o-linear-gradient(top, #ccc 0%, #666 65%, #333 100%); /* Opera 11.10+ */
	background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#CCC), color-stop(65%,#666), color-stop(100%,#333)); /* Saf4+, Chrome */
	background-image: -webkit-linear-gradient(#ccc 0%, #666 65%, #333 100%); /* Chrome 10+, Saf5.1+ */
	background-image: linear-gradient(top, #CCC 0%, #666 65%, #333 100%); /* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#CCC', endColorstr='#333',GradientType=0 ); /* IE6–IE9 */
}

#header a {color:#fff;}
#header img {float:left;margin-right:1em;}
#header h1 {}
#header p {}


/*navigation*/
#g-nav {
	position:absolute;
	top:0;
	right:300px;

	text-shadow: rgba(0,0,0,0.75) 2px 2px 0px;
}
#g-nav ul {
	list-style: none;
}
#g-nav li {
	float:left;
	line-height: 75px;
}
#g-nav li a {
	display: block;
	height: 75px;
	padding:0 1em;
	color:#fff;
	background-color: transparent;
	border-right:1px solid #666;
	text-decoration:none;
}

/* selected tab*/
#g-nav li a:hover,
#g-nav .current a
{
	background-color: #333;
}

body.home-page .nav #n-home,
body.wordpress .nav #n-journal,
body.portfolio-page .nav #n-portfolio,
body.projects-page .nav #n-projects,
body.resume-page .nav #n-resume,
body.links-page .nav #n-links
{
	background-color:#333;
}

#search {
/*	float:right;*/
    position: absolute;
    right: 21px;
    top: 25px;
}

#search form legend,
#search form label
{
	display: none;
}

#content {
	background-color: #fff;
    color: #333;

	position:relative; /*contain position*/
	overflow:hidden; /*contain floats*/
	clear:both;

	padding: 0 50px 30px;
	margin:0 0 1em 0 ;

	border:1px solid #ccc;

     -moz-border-radius: 5px; /* FF1+ */
  -webkit-border-radius: 5px; /* Saf3-4, iOS 1+, Android 1.5+ */
          border-radius: 5px; /* Opera 10.5, IE9, Saf5, Chrome, FF4 */

     -moz-box-shadow: 0px 1px 3px #999; /* FF3.5+ */
  -webkit-box-shadow: 0px 1px 3px #999; /* Saf3.0+, Chrome */
          box-shadow: 0px 1px 3px #999; /* Opera 10.5, IE9, Chrome 10+ */


}

aside, #sidebar {

	background-color:#f3f3f3;
	color:#333;

	float:right;
	width:22%;

	border:1px solid #ccc;
	margin:0 0 1em 0 ;
	padding:1em;

	position:relative; /*contain position*/
	overflow:hidden; /*contain floats*/


     -moz-border-radius: 5px; /* FF1+ */
  -webkit-border-radius: 5px; /* Saf3-4, iOS 1+, Android 1.5+ */
          border-radius: 5px; /* Opera 10.5, IE9, Saf5, Chrome, FF4 */

     -moz-box-shadow: 0px 1px 3px #999; /* FF3.5+ */
  -webkit-box-shadow: 0px 1px 3px #999; /* Saf3.0+, Chrome */
          box-shadow: 0px 1px 3px #999; /* Opera 10.5, IE9, Chrome 10+ */

}

footer, #footer, .sosumi {
	color:#ccc;
	background-color: inherit;
	font-size:0.8em;
}
#license {display:none;}


/*home*/
#welcome {
	padding:1em;
	border-bottom: 1px solid #ccc;
	margin-bottom: 1em;

}
.main-content {float:left;width:75%}

/*modules */
.mod {
	width:45%;
	margin:2%;
/*	height:25em;*/
	float:left;
	overflow: auto;
}

.mod ul {
	height:25em;
	overflow:auto;
}

.mod-head {
	border-bottom: 1px solid #333;
}
.mod-footer {
	display:none;
}



/*feeds */

.feed ul {
	list-style: square;
	margin: 0.25em;
    padding-left: 1em;
}

.photos ul {
	list-style: none;
	float:left;
	padding:0;
	margin:5px;
}

.photos img {
	border: 5px solid #FFFFFF;
	-moz-box-shadow: 2px 2px 5px #000;
	-webkit-box-shadow: 5px 5px 5px #000;
	box-shadow: 2px 2px 5px #000;
}

/*code*/
code {
	padding:1em;
	display: block;
	color:green;
	background: black;
	overflow: auto;
}

pre {
	border:1px dashed #ccc;
	padding:1em;
}


/*wordpress*/

/*
#blog-title {font:16px helvetica; text-align: left;}
#blog-description {text-align: left;}
*/
div#access {display: none;}
div#container {margin-top:0;}
div#menu {height:2em;}
.wordpress div#header {
	margin:1em 0;
	text-align:left;
}
/*posts*/
.wordpress .post {margin-bottom:1em;}
.wordpress .entry-title {border-top:1px solid #000;padding-top:1em;}
.wordpress .entry-date {}
.wordpress .entry-content {}
.wordpress .entry-meta {
	padding:0.5em;
	background:#eee;
}

/* new journal tweak */
.wordpress #nav-above, #nav-below {margin: 1em;}
.wordpress .entry-title { font-size: 2em;margin: 1em 0; }
.wordpress .entry-content img {margin: 1em;}
.wordpress .entry-content pre {clear: both; margin: 1em 0;}
.wordpress .entry-content p {margin: 1em 0;}


/* media queries
 -------------------------------------------------------------------- */

/*
Smartphone
    320px
Tablet
    768px
Netbook
    1024px
Desktop
    1600px
*/
/*smooth webkit?
* {-webkit-transition:all 1s ease-in-out;}
*/

/*iPad landscape & low rez*/
@media screen and (max-width: 1024px) {
	.main-content {width:74%;}
	#g-nav{right:250px;}
	#content {padding:0 1em;}
}
/*ipad only*/
@media only screen and (max-device-width: 1024px){
	.mod ul {height:auto;}
}
/*ipad portrait & ultra low rez */
@media screen and (max-width: 768px){
	#header {margin-bottom:30px; overflow:visible;}
	#g-nav {bottom:-26px;right:0;top:auto;height:25px; width:100%;background-color:#333;}
	#g-nav ul {margin:0;padding:0;}
	#g-nav ul li {width:16.666%;text-align:center;line-height:25px;}
	#g-nav ul li a {padding:0;height:100%;}
	#sidebar, aside {float:none;width:100%;clear:both;}
	.main-content {width:auto;float:none;}
}

/*iPhone & small screen*/
@media screen and (max-width: 480px) {
	#header h1, #header p {margin:0;}
	#search {bottom:10px;right:10px;top:auto;}
	#content{padding:0.5em;}
	.mod {width:100%;float:none;}
	.mod ul {height:auto;}
	#search input[type=submit] {display:none;}
}