@font-face {
  font-family: "Adelle Basic"; font-weight: bold;
  src: url('/wikistatic/fonts/AdelleBasic_Bold.otf'); }

/* @group Fundamentals */

* { margin: 0; padding: 0 }

/* Is this portable? */
html {
  background-color: white;
  width: 100%;
  height: 100%;
}

body {
  background: white;
  color: black;
  text-align: left;
  min-height: 100%;
  position: relative;
}

p {
  margin: 0.8em 0;
}

ul, ol {
  margin: 0.8em 0 0.8em 2em;
}

dl {
  margin: 0.8em 0;
}

dt {
  font-weight: bold;
}
dd {
  margin-left: 2em;
}

a { text-decoration: none; }
a[href]:link { color: rgb(196,69,29); }
a[href]:visited { color: rgb(171,105,84); }
a[href]:hover { background: #f4f2e2; color: black;
  border-bottom: 1px solid #785; 
}
a[href].new { color: #666; }

/* @end */

/* @group Fonts & Sizes */

/* Basic technique & IE workarounds from YUI 3
   For reasons, see:
      http://yui.yahooapis.com/3.1.1/build/cssfonts/fonts.css
 */
 
h1 { font-size: 146.5%; /* 19pt */ } 
h2 { font-size: 131%;   /* 17pt */ }
h3 { font-size: 116%;   /* 15pt */ }
h4 { font-size: 100%;   /* 13pt */ }
h5 { font-size: 100%;   /* 13pt */ }

select, input, button, textarea {
	font:99% sans-serif;
}

table {
	font-size:inherit;
	font:100%;
}

pre, code, kbd, samp, tt, .src {
	font-family:monospace;
	*font-size:108%;
	line-height: 124%;
}

/* @end */

h1, h2, h3, h4, h5, h6 { 
  font-weight: bold;
  color: rgb(78,98,114);
  margin: 0.8em 0 0.4em;
}

body {
/*   font-size:13px; */
  line-height:1.4;
  font-family: "Liberation Sans", "proxima-nova-1","proxima-nova-2", "Helvetica Neue", Calibri, Arial, Helvetica, sans-serif;
  *font-size:small; /* for IE */
  *font:x-small; /* for IE in quirks mode */
  text-align: center;
  margin: 0;
  padding: 0;
  background: white;
  color: black;
}

#content { 
  background: white;
  color: black;
  font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; 
  line-height: 1.4;
  padding: 1em;
}

pre {
  line-height: 1.2;
  overflow: auto;
}

div > pre.source-haskell { margin: 0.8em }

img { border: 0; }

th { font-weight: bold; background: #eee; }
td { padding: 0 0.5em; }

a:link, a:visited { text-decoration: none; }
//a:link { color: #b33; }
a:link { color: rgb(196,69,29); }
a:visited { 
  color: rgb(196,69,29);
  //color: rgb(171,105,84);
  border-bottom: 0;
}

div.floatleft, table.floatleft {
  float: left;
  clear: left;
}

div.floatright, table.floatright {
  float: right;
  clear: right;
}

div.floatleft, table.floatleft {
  margin: 0 .5em .5em 0;
}

div.floatright, table.floatright {
  margin: 0 0 .5em .5em;
}

div.tright {
        float: right;
        clear: right;
        margin: 0.5em 0 0.8em 1.4em;
}


blockquote {
  margin-left: 2em;
}


a.new { color: #666; }
/* #content .external { border-bottom: 1px dotted #999; } */

#p-logo {
  top: 2em;
  left: 0;
  position: absolute; /*needed to use z-index */
  clear: both;
  z-index: 3;
  height: 155px;
  width: 180px;
  overflow: visible;
}
#p-logo h5 {
	display: none;
}
#p-logo a,
#p-logo a:hover {
	display: block;
	height: 155px;
	width: 100%;
	background-repeat: no-repeat;
	background-position: 35% 50% !important;
	text-decoration: none;
        background-color: inherit;
}

#globalWrapper {
  margin: 0 0;
  text-align: left;
  clear: both;
  position: relative;
}

#bodyContent {
}

#siteSub {
  display: none;
}

#toc, .toc {
  background: rgb(239,238,209);
  padding: 0 1em 0.5em 1em;
  border: 1px solid rgba(196,69,29,0.2);
}

#toc h2, .toc h2 {
  display: inline;
  padding: 0;
  font-size: 100%;
  font-weight: bold;
  margin-right: 1em;
}

#toc #toctitle, .toc #toctitle {
  padding: 0.5em 0;
}

#toc ul, .toc ul { margin: 0; padding: 0; list-style: none; }
#toc ul ul, .toc ul ul { margin: 0 0 0 2em; }

.toc .toctoggle, #toc .toctoggle {
  font-size: 90%;
  color: #ccc;
}

#firstHeading {
  margin: 0.5em 0 0.25em 0;
/*  font-family: "Adelle Basic", sans-serif; */
}

#topbar { 
  background: rgb(41,56,69); 
  border-top: 5px solid rgb(78,98,114);
  color: #ddd;
  padding: 0;
  font-size: smaller;
  text-align: right;
  margin: 0 0;
  float: left;
  width:100%;
}

#topbar a:hover { color: white; background: rgb(78,98,114); }
#p-personal * { margin: 0; padding: 0; }
#p-personal { float: left; padding: 5px 0 5px 0; margin: 0 10px 0 30px;}
#p-personal h5 { display: none; }
#p-personal li { display: inline; text-align: left;}
#p-personal a { color: white; padding: 5px 10px; }

/* So that we can position #p-cactions relative to this */
#content-wrapper { position: relative; }

#p-cactions {
  background: #eee;
  position: absolute;
  right: 5px;
  float: right;
  font-size: 80%;
  margin: 5px;
}

#searchBody { float: right; padding: 2px; margin-right: 10px; }


#p-cactions {
  text-shadow: white 0 1px 0;
  border: 1px solid #eee;
}

#p-cactions .pBody { display: inline; }
#p-cactions h5 { display: none; }
#p-cactions ul {
  display: inline;
  margin: 0; padding: 0;
}

#preftoc ul { display: block; padding: 0; margin: 0; }
#preftoc li {
  list-style-type: none;
  float: left;
  padding: 1px 5px;
  border-right: 1px solid #ccc;  
}
#preftoc li.selected { background: white; }

#preferences { clear: both; }

#p-cactions ul li { display: inline; }
#p-cactions ul li a { 
  float: left; padding: 5px;
}

#p-cactions a { color: #333; }
#p-cactions .selected a { background: white; color: #999; }
#p-cactions a:hover { color: white; background: rgb(78,98,114); text-shadow: 0 0; }
#p-cactions .new a { color: #999; }

.editsection { font-size: 60%; margin-right: 1em; }
.editsection, .editsection a { 
  color: #999; font-weight: normal;
}

.printfooter { display: none; }

h1, h2, h3, h4, h5, h6 {
color: rgb(41,56,69);
}

#content h1, #content h2, #content h3, #content h4 {
  font-family: Georgia, "Times New Roman", Times, serif;
  font-weight: normal;
}

code, pre, .inline-code, div.source-haskell li { background: #f0f0f0; }

pre {
border: 1px solid #ddd;
	margin-left: 1em;
padding: 0.3em;
}

.inline-code, .inline-code > div, .inline-code > div > div {
display: inline;
}

.inline-code .source-haskell { display: inline; }

.source-haskell .co1 { color: #999 !important; }
.source-haskell .kw1 { color: black !important; font-weight: bold; }
.source-haskell .kw3 { color: #548 !important; font-weight: inherit !important; }
.source-haskell .kw4 { color: #900 !important; }
.source-haskell .nu0 { color: #458 !important; }
.source-haskell .st0 { color: #d14 !important; background: #ddd !important; }
.source-haskell .sy0, .source-haskell .br0 {
color: #666 !important; font-weight: normal !important; }
.source-haskell .es0 { color: #a78 !important; background: #ddd !important; }

.visualClear { clear: both; }
.pad { padding: 1em; }

#column-content {
	margin-left: 160px;
	max-width: 50em;
}

#column-one {
margin: 0;
}

#footer {
  clear: both;
  background: #ddd;
  border-top: 1px solid #999;
  padding: 0.5em;
  margin: 0;
  font-size: 80%;
  min-height: 4em;
  text-align: center;
}

#footer ul li { display: inline; margin: 0.5em 1em; }

#f-poweredbyico {
display: none;
}

#f-copyrightico {
float: left;
height: 1%;
margin: 0.5em;
}

#content form {
background: #eee;
	    /*   border: 1px solid #ccc; */
	    /*   font-family: sans-serif; */
padding: 0.5em;
}

fieldset {
border: 1px solid #ddd;
margin: 0.5em;
}

textarea {
	font-size: 100%;
	font-family: monospace;
}

#jump-to-nav {
	text-align: right;
background: #f0f0f0;
float: right;
}

.intro {
  margin: 1em 10% 1em 1em;
  line-height: 1.5em;
}

.intro p { padding: 1em; margin: 0; }

.intro a:link, .intro a:visited {
 color: rgb(239,238,209);
 /* color: inherit; */
 text-decoration: none; font-weight: normal;
 border-bottom: 1px dotted rgb(239,238,209) !important;
}
.intro .external {  border-bottom: 1px dotted rgb(158,82,0) !important; }
.intro a[href]:hover { background: inherit; }


#p-navigation ul, #p-tb ul { list-style: none; margin-left: 0; padding-left: 1em; }

/*** Front page stuff ***/

.title { font-size: 200%;  margin: 0.5em 0 0.5em 0;
  font-family: "Adelle Basic", Helvetica, Arial, sans-serif; font-weight: bold;
}

.subtitle {
  font-family: "Adelle Basic", Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-size: 120%;
  color: rgb(78,98,114);
  margin: 0.5em 0;
}

.bg-image {
  background: rgb(78,98,114) repeat-x url(/wikistatic/gradient.png);
  color: white;
  padding: 0.5em 0.5em 0.5em 200px;
  position: relative;
  z-index: 0;
}

#siteNotice {
  background: rgb(255,238,209);
  border: 2px solid #900;
  color: #c00;
  padding: 0.5em;
  text-align: center;
}

.homepage #siteNotice {
  display: none;
  background: #900;
  color: white;
  border: 0;
}

.page-Haskell .homebutton { display: none; }

#contentSub {
  padding-left: 2em;
  margin-bottom: 1em;
  border-bottom: 1px solid #ccc;
  font-size: 80%;
}

.highlight {
  background: rgb(239,238,209);
}

.catlinks {
  border-top: 1px solid #ccc;
  background: #f0f0f0;
}

#contentSub2, .usermessage {
  background: rgb(255,238,209);
  padding: 0.5em;
  text-align: center;
}

.homepage #content { padding: 0; margin-top: 0; }
.homepage #firstHeading, .homepage #contentSub { display: none; }
.homepage #bodyContent > p { display: none; }
.homepage #column-one { display: none; }
.homepage #column-content {
  max-width: none; margin: 0;
}
.homepage #content .external { border-bottom: 0; }

.homepage #p-cactions {
//  display: static;
  z-index: 100;
}

.homepage #p-cactions {
  background: inherit;
  border: 0;
  color: #ccc;
  text-shadow: 0 0;
}
/* .homepage #p-cactions a { color: rgb(211,210,185); } */
.homepage #p-cactions a { color: #ccc; }
.homepage #p-cactions a:hover {
  color: white; background: rgb(78,98,114); }

.homepage #p-cactions .selected { display: none; }
.homepage #ca-talk { display: none; }

.home-content {
  clear: both;
  position: relative;
  padding: 0; margin: 0;
  border: 1px solid white;
  float: left;
  width:100%;
}

.home-static { float: left; }

.home-dynamic {
  background: #eeeeee repeat-x url(/wikistatic/gradient-gray.png);
}

.home-dynamic ul {
  margin-left: 0; padding-left: 1em;
}


/* Generic Column Stuff */

.cols3 {
  width: 100%; float: left; background: inherit;
  margin: 0; padding: 0; 
}

.cols3 > .c1, .cols3 > .c2, .cols3 > .c3 {
  min-height: 10em; width: 33.3%; float: left;
  margin: 0; padding: 0;
}

.w1000 { max-width: 1280px; margin: 0 auto; }

.homepage .wrap { margin: 0 auto; padding: 0 1em; max-width: 1280px; }

.content { padding: 1em; }

@media screen and (max-width: 1000px) {
  .cols3.w1000 > .c1, .cols3.w1000 > .c2, .cols3.w1000 > .c3 {
    width: 50%; }
}

@media screen and (max-width: 500px) {
  .cols3.w1000 > .c1, .cols3.w1000 > .c2, .cols3.w1000 > .c3 {
    width: 100%; }
}


@media screen and (min-width: 1024px) {
  #column-one {
     width: 199px;   // float: right;
     position: absolute; top: 80px; right: 0;
     border-left: 1px solid #ddd; padding: 0.5em;
     z-index: 1; background: white;
  }
  #column-content { margin-right: 220px; }
  #jump-to-nav { display: none; }
  #footer { padding-right: 220px; z-index: 0; }
}

@media screen and (max-width: 1023px) {
  #column-one {
    padding: 0.5em;
    border-top: 1px solid #ddd;
    background: #f0f0f0;
  }
  #column-one > div {
    margin: 0.5em;
  }

  #column-one div ul, #column-one div li { display: inline; }
  #column-one div li { margin-left: 1em; }
}

@media screen and (max-width: 800px) {
  #p-logo { display: none; }
  #topbar { background: rgb(41,56,69) url(/wikistatic/hslogo-16.png) no-repeat 5px 5px; }
  #column-content { margin-left: 0; margin-right: 0; } 
  .homepage .bg-image { padding: 0.5em 1em; }
  .homepage .intro { margin-right: 1em; }
}  

@media screen and (max-width: 500px) {
  body { font-size: 80%; }
}

.homepage #p-logo a { background-image: url(/wikistatic/haskellwiki_logo_white.png) !important; }

table#sv-ext, table#sv-software, table#sv-hooks {
  border: 1px solid #ccc;
}

/* fancy buttons for the homepage */
/* from:  http://webdesignerwall.com/tutorials/css3-gradient-buttons */

.button {
	display: inline-block;
	outline: none;
	cursor: pointer;
	text-align: center;
	text-decoration: none;
	font: 14px/100% Arial, Helvetica, sans-serif;
	padding: .4em 1.5em .4em;
	text-shadow: 0 1px 1px rgba(0,0,0,.3);
	-webkit-border-radius: .5em; 
	-moz-border-radius: .5em;
	border-radius: .5em;
	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
	box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
.button:hover {
	text-decoration: none;
}
.button:active {
	position: relative;
	top: 1px;
}

.orange {
	color: #fef4e9;
	border: solid 1px #da7c0c;
	background: #f78d1d;
	background: -webkit-gradient(linear, left top, left bottom, from(#faa51a), to(#f47a20));
	background: -moz-linear-gradient(top,  #faa51a,  #f47a20);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#faa51a', endColorstr='#f47a20');
}
.orange:hover {
	color: white !important;
	background: #f47c20 !important;
	background: -webkit-gradient(linear, left top, left bottom, from(#f88e11), to(#f06015));
	background: -moz-linear-gradient(top,  #f88e11,  #f06015);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11', endColorstr='#f06015');
}
.orange:active {
	color: #fcd3a5;
	background: -webkit-gradient(linear, left top, left bottom, from(#f47a20), to(#faa51a));
	background: -moz-linear-gradient(top,  #f47a20,  #faa51a);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f47a20', endColorstr='#faa51a');
}
.orange a { color:white; }
