/* hoylen.com site.css */

body {
 font-family: "Lucida Grande", verdana, sans-serif;
}
h1, h2, h3, div#nav, p.rss-chicklet, #footer {
 font-family: "Lucida Grande", verdana, sans-serif;
}
code, p.code {
 font-family: Consolas, Monaco, "Courier New", monospace;
}

body {
 margin: 0; border: 0; padding: 0;
 background: white;
 color: black;
 font-size: normal;
 min-width: 910px;
}
/* Trebuchet MS, Helvetica, sans-serif */

h1 {
 margin: 0;
 border: 0;
 padding: 2ex 1em 3ex 1em;
 color: white;
 background: black;
 background-image: url(bg1.png);
 background-position: top left;
 background-repeat: repeat-x;
 font-size: x-large;
 font-weight: bold;
}

h2 {
 margin-top: 2ex;
 color: #06c;
 clear: both;
 font-size: x-large;
 font-weight: bold;
}

h3 {
 color: black;
 font-size: large;
 clear: both;
 font-size: large;
 font-weight: bold;
}

div.img {
  text-align: center;
}

a {
  color: #06c;
}
a:visited {
  color: #006;
}
a:hover {
 color: #f60;
}

a.newwin {
 font-size: smaller;
}

dt {
 margin: 1ex 0em 0.5ex 0em;
}


p.code {
 color: #060;
}

/* Two column layout code from http://matthewjamestaylor.com */

div.content {
 position:relative; /* This fixes the IE7 overflow hidden bug
                       and stops the layout jumping out of place */
 clear:both;
 float:left;
 width:100%;		/* width of whole page */
 overflow:visible;

 background: white;
 color: black;
}

/* Two column right menu settings */

.content .colleft {
 float:left;
 width:200%;
 margin-left:-17em; /* moves main and sidebar */
 position:relative;
 right:100%;
}

.content .col1wrap {
 float:left;
 width:50%;
 position:relative;
 left:50%;
 padding-bottom:2em;
}

.content .main {
 margin:0 1em 0 19em; /* change width of main */
 overflow:visible;
}

.content .sidebar {
 float:right;
 width:14em; /* change width of sidebar */
 position:relative;
 left:15em; /* moves sidebar */
 margin-top:1em;
 padding-bottom:2em;
}

/*----------------------------------------------------------------*/
/* Footer styles */

#footer {
 clear:both;
 float:left;
 width:100%;
 margin: 0;
 border: 0;
 padding: 2ex 0em;
 background: white;
 color: #999;
 text-align: center;
 font-size: x-small;
}

#footer p {
 padding:0px;
 margin: 0 1em;
}

#footer span.email {
 color: #999;
}

#footer a {
 color: #999;
 text-decoration: none;
}
#footer a:hover {
 color: #fc0;
 text-decoration: none;
}

@media screen {
 .maincolumn {
  width:100%;
 }
}

/*----------------------------------------------------------------*/
/* Navigation */

div#nav {
 display: block;
 position: absolute;
 top: 0em;
 right: 0em;
 width: 100%;
 margin:0;
 border: 0;
 padding: 0;
}

ul#toplevel {
 float: right;
 margin: 0;
 border: 0;
 padding: 1ex 1em 0em 0.5em;
 font-size: x-small;
}
ul#toplevel li {
 display: inline;
}
ul#toplevel a {
 display: inline-block;
 margin: 0;
 border: 1px;
 padding: 0.5ex 1em;
 color: #ccc;
 font-weight: bold;
 text-decoration: none;
 text-transform: uppercase;
}
ul#toplevel a:hover {
 color: #f90;
}
ul#toplevel a.self {
 color: #666;
}

ul#breadcrumbs {
 float: left;
 margin: 0;
 border: 0;
 padding: 1ex 0.5em 0em 0.5em;
 font-size: x-small;
}
ul#breadcrumbs li {
 display: inline;
}
ul#breadcrumbs a {
 display: inline-block;
 margin: 0;
 padding: 0.5ex 0em;
 color: #999;
 text-decoration: none;
}
ul#breadcrumbs a:before {
 content: "/ ";
}
ul#breadcrumbs a:hover {
 color: #f90;
}

/*----------------------------------------------------------------*/
/* Blog */

div.blog h2 {
 color: #ccc;
 font-size: large;
}

div.blog-article {
 margin: 0;
 border: 0;
 padding: 0;
 border-bottom: thin dotted #666;
}
div.blog-article h3 a {
 color: black;
 text-decoration: none;
}
div.blog-article h3 a:hover {
 color: #f90;
 text-decoration: underline;
}

p.blog-metadata {
 margin-top: 0;
 padding-top: 0;
 color: #999;
 font-size: x-small;
 text-align: right;
}
p.blog-metadata a {
 color: #999;
 text-decoration: none;
}
p.blog-metadata a:hover {
 color: black;
 text-decoration: underline;
}
a.blog-category {
  margin-right: 2em;
}

ul.blog-categories-nav {
 margin: 0; border: 0; padding: 0;
 font-size: small;
 text-align: right;
}
ul.blog-categories-nav li {
 display: block;
}
ul.blog-categories-nav a {
 display: inline-block;
 margin: 0;
 border: 1px;
 border-radius: 1ex; -webkit-border-radius: 1ex; -moz-border-radius: 1ex;
 padding: 0.5ex 0em;
 color: #333;
 font-weight: bold;
 text-decoration: none;
 text-transform: uppercase;
}
ul.blog-categories-nav a:hover {
 color: #f60;

}
ul.blog-categories-nav a.self {
 background: #0cc;
 color: black;
}

p.rss-chicklet {
 text-align: right;
}
a.rss-chicklet {
 margin: 0;
 border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px;
 padding: 0.2ex 0.5em;
 color: white;
 background: #f90;
 font-size: small;
 text-decoration: none;
}
a.rss-chicklet:hover {
 color: black;
 background: #f60;
}

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

@media print {
 body {
  background: white;
  color: black;
 }

 div.colleft, div.col1wrap, div.main {
  float: none;
  width: 100%;
  margin: none;
  position: relative;
 }

 div.sidebar { display: none; }

 div#nav { display: none; }

 h1 {
  background: white;
  color: black;
 }
 #footer, #footer a, #footer a:visited {
  border: 0;
  background: inherit;
  color: #ccc;
 }
}

/*EOF*/

