body{
background-color:#333333;
margin-top:0;
font-family:Arial,Courier;
}
a{
text-decoration:none;
color:#777777;
}
a:hover{
color:#FFFFFF;
}
.contentWrap{
width:75%;
min-width:750px;
position:relative;
margin:0px auto;
padding:10px 0 2px 0;
background-color:#2A2A2A;
vertical-align:top;

-moz-box-shadow: 1px 1px 7px 5px #222;
-webkit-box-shadow: 1px 1px 7px 5px #222;
box-shadow: 1px 1px 7px 5px #222;
}
.header{
height:200px;
}
.header h1{
margin:auto;
text-align:center;
color:#FFFFFF;
}
.menuWrap{
display:block;
}
.menuWrap ul{
margin:0;
padding:0;
list-style-type:none;
}
.menuItem{
/*width:120px;
height:120px;*/
margin:5px;
background-color:#008800;

border-radius: 4px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
-khtml-border-radius: 4px;

color:#FFFFFF;
vertical-align:bottom;
  width:80px;
  height:80px;
  display:inline-block;
}
.menuItem:hover img{
opacity:0.6;
filter:alpha(opacity=60);
}
.menuItem img{
height:70px;
width:70px;
border:none;

opacity:0.4;
filter:alpha(opacity=40);
  margin:5px 5px 0 5px;
}
.menuItem h1{
font-size:0.9em;
font-weight:bold;
text-transform:uppercase;
text-align:center;
margin:0.1em 0;
  position:relative;
  top:-40px;
}
.menuItem h2{
font-size:0.7em;
font-variant:small-caps;
text-align:center;
margin:0.2em 0;
  display:none;
}

.m1{
border:1px solid #228800;
background: -webkit-gradient(linear, center top, right bottom, from(#22AA00), to(#227700));
}
.m1:hover{
border:1px solid #22AA00;
background: -webkit-gradient(linear, center top, right bottom, from(#22CC00), to(#228800));
}
.m2{
border:1px solid #669900;
background: -webkit-gradient(linear, center top, right bottom, from(#66CC00), to(#668800));
}
.m2:hover{
border:1px solid #66CC00;
background: -webkit-gradient(linear, center top, right bottom, from(#66EE00), to(#669900));
}
.m3{
border:1px solid #AA9900;
background: -webkit-gradient(linear, center top, right bottom, from(#AACC00), to(#AA8800));
}
.m3:hover{
border:1px solid #AACC00;
background: -webkit-gradient(linear, center top, right bottom, from(#AAEE00), to(#AA9900));
}

.m4{
border:1px solid #FF9900;
background: -webkit-gradient(linear, center top, right bottom, from(#FFDD00), to(#FF8800));
}
.m4:hover{
border:1px solid #FFDD00;
background: -webkit-gradient(linear, center top, right bottom, from(#FFEE00), to(#FF9900));
}
.m5{
border:1px solid #FF7700;
background: -webkit-gradient(linear, center top, right bottom, from(#FFAA00), to(#FF6600));
}
.m5:hover{
border:1px solid #FFAA00;
background: -webkit-gradient(linear, center top, right bottom, from(#FFCC00), to(#FF7700));
}
.m6{
border:1px solid #FF5500;
background: -webkit-gradient(linear, center top, right bottom, from(#FF8800), to(#FF3300));
}
.m6:hover{
border:1px solid #FF8800;
background: -webkit-gradient(linear, center top, right bottom, from(#FFAA00), to(#FF5500));
}

.mainContent{
display:inline-block;
width:calc(100% - 30px);
background-color:#222222;
vertical-align:top;
margin:10px 5px;
padding:5px 10px;

border-radius: 6px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
-khtml-border-radius: 6px;

color:#BBBBBB;
}
.mainContent h2{
/*text-transform:uppercase;*/
font-variant:small-caps;
color:#CDCDCD;
}
.mainContent .dark{
color:#777777;
}

pre.prettyprint{
margin:0;
}
.codeWrap{
width:calc(100% - 50px);
border:0px solid black;
margin: 5px auto;
}
.codeWrap pre{
background-color:#FFFFFF;
-webkit-user-select:initial;
overflow-x:auto;
}
.codeSnippet{
background-color:#FFFFFF;
color:#000000;
font-family:monospace;
font-size:1.0em;
padding:0.1em 0.2em;
border:1px solid #000000;
}

.footer{
width:90%;
background-color:#222222;
vertical-align:top;
text-align:right;
margin:6px auto;
padding:0.25em 1.0em;
font-size:0.8em;
color:#888888;

border-radius: 6px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
-khtml-border-radius: 6px;
}

.menuR{
display:inline-block;
right:0px;
position:absolute;
}
.menuL{
display:inline-block;
position:relative;
left:0px;
}

/* Blog related styles */
a h1{
color:#FFFFFF;
}
.mainContent a:hover h1{
color:#BBBBBB;
}
.mainContent a:hover .dark{
color:#999999;
}
.entryData{
font-size:0.95em;
margin:-0.4em 0 2em 1.5em;
}
.entryDataSumm{
font-size:0.95em;
float:right;
margin:1em 0.5em;
}
.sub{
font-size:0.9em;
}
.superRef{
font-size:0.6em;
vertical-align:super;
}
.bold{
font-weight:bold;
}
.center{
margin: auto;
}
.italic{
font-style:italic;
}
.definition{
color:#DDDDDD;
text-decoration:underline;
}
.description{
font-size:0.9em;
font-style:italic;
}
.references{
font-size:0.9em;
}
.noLine{
text-decoration:none;
}
li h3{
margin-bottom:0.2em;
}
li p{
margin-top:0.2em;
}
ol li{
margin-bottom:0.2em;
}
.imgWrap{
display:block;
text-align:center;
}
.imgBorderRound{
border:2px solid #000000;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
}
.contrastDesc{
background-color:#444444;
}
.tight{
margin:-0.3em 0;
}
.prevPost, .nextPost{

}
.nextPost{
float:right;
}

.blogSort{
width:20px;
height:20px;
display:inline-block;
border:1px solid #AAAAAA;
padding:2px;

float:right;

border-radius: 4px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
-khtml-border-radius: 4px;

background: -webkit-gradient(linear, center top, right bottom, from(#BBBBBB), to(#888888));
}
.blogSort:hover{
border:1px solid #CCCCCC;
background: -webkit-gradient(linear, center top, right bottom, from(#FFFFFF), to(#999999));
}
.blogSort:hover img{
opacity:0.6;
filter:alpha(opacity=60);
}
.blogSort img{
height:20px;
width:20px;
border:none;
margin:0;

opacity:0.4;
filter:alpha(opacity=40);
}

.blogPagination{
float:right;
margin:5px 20px 5px 0px;
font-weight:bold;
}
.blogPagination a{
font-weight:normal;
}
.blogSortOrder{
margin: -1em 0 1em 0;
}

.preface{
margin:1em 2em;
padding:0 0.5em;
border:2px solid #000000;
background-color:#444444;
border-radius: 4px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
-khtml-border-radius: 4px;
}
.preface h2{
font-size:1.3em;
}
.preface h2, .preface p{
margin:0.5em 0;
}

.subredditWrap{
margin-top:2.5em;
text-align:center;
}
.subredditLink{
width:9em;
height:1.2em;
display:inline-block;
border:1px solid #AAAAAA;
padding:2px;
color:#444444;
font-weight:bold;
text-align:center;
line-height:0.8em;

border-radius: 4px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
-khtml-border-radius: 4px;

background: -webkit-gradient(linear, center top, right bottom, from(#BBBBBB), to(#888888));
}
.subredditLink:hover{
border:1px solid #CCCCCC;
color:#000000;
background: -webkit-gradient(linear, center top, right bottom, from(#FFFFFF), to(#999999));
}
.subredditLink p{
display:inline-block;
margin:0 0 0 0.5em;
padding:0;
vertical-align:text-top;
}
.subredditLink img{
display:inline-block;
height:20px;
width:20px;
border:none;
margin:0;

opacity:0.4;
filter:alpha(opacity=40);
}
.subredditLink:hover img{
opacity:0.7;
filter:alpha(opacity=70);
}

/* Labs related styles */
.labsWrap{
margin:auto;
text-align:center;
display:block;
}
.labsWrap div{
margin: 0.2em auto;
}
div.labsWrap div input{
width:3em;
text-align:center;
}
canvas.labsExample{
width:400px;
height:200px;
border:2px solid #000000;
display:inline-block;
background-color:#BBBBBB;
border-radius: 6px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
-khtml-border-radius: 6px;
}

@media only screen and (max-width: 480px), only screen and (max-device-width: 480px) {
 .header{
  height:100px;
 }
 .contentWrap{
  min-width:300px;
 }
 .mainContent{
  display:block;
  width:90%;
  margin:10px 3%;
 }
 .menuR{
  position:relative;
 }

}