html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{
  margin:0;padding:0;border:0;vertical-align:baseline;
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{
  display:block;
}
ol,ul{
  list-style-position:inside;
}
table{
  border-collapse:collapse;border-spacing:0;
}

/************/

html {
  background:#eee;
  font-family:georgia,times,sans-serif;
  overflow-y:scroll;
}

body {
  border-top:5px solid #fa711c;
  background:#e7e7e7;
}

header, nav, section#account, footer {
  font-family:"trebuchet MS",tahoma,helvetica,sans-serif;
}

header {
  background:#94bfd5 url(images/tile.png);
  height: 160px;
  border-top:1px solid #fff;
}

header>hgroup, nav>ul, article, footer>section {
  width:940px;
  margin:0 auto;
  clear:both;
}

header>hgroup {
  background: url(images/loops.png) 100% 0 no-repeat;
  height:160px;
}

header>hgroup>h1 {
  float:left;
  font-size:1.4em;
  text-indent:-100px;
  overflow:hidden;
  background:url(images/logo.png);
  width:180px;
  line-height:140px;
  margin:10px 0;
}

header>hgroup>h2 {
  float:right;
  color:white;
  font-weight:normal;
  margin:60px 0;
  line-height:40px;
  font-size: 28px;
}

nav {
  background:#000;
  color:white;
  border-top:1px solid #fff;
  border-bottom:1px solid #fff;
  line-height:32px;
  -webkit-box-shadow:0 0 10px rgba(64, 64, 64, 0.5)
}
nav ul {
  background: url(images/loops.png) 100% -160px no-repeat;
  text-align:center;
  padding:5px 0;
}
nav ul li {
  display:inline;
  list-style:none;
  text-transform:uppercase;
  color:#94bfd5;
  font-size: 18px;
}
nav ul li:after {
  content: '//'
}
nav ul li:last-child:after {
  content: ''
}
nav ul li a {
  color:#fff;
  margin:0 1em;
  text-decoration:none;
}
nav ul li a.active {
  color:#fa711c;
}

section#account {
  float:right;
  -webkit-border-radius:4px;
  -webkit-box-shadow:0 0px 4px rgba(64, 64, 64, 0.5)
}

section#account.loggedout {
  width:280px;
  margin-left:20px;
  padding:10px;
  margin-bottom:60px;
  background:#e7e7e7;
  text-align:center;
  border:1px solid #fff;
}
section#account.loggedout ul {
  display:inline-block;
}
section#account.loggedout li {
  line-height:40px;
  list-style:none;
  text-align:left;
}
section#account.loggedout a.login {
  padding:10px;
  background-position:0 50%;
  background-repeat:no-repeat;
  padding-left:40px;
}
section#account.loggedout a.twitter {
  background-image:url(images/twitter.png);
}
section#account.loggedout a.google {
  background-image:url(images/google.png);
}

section#account.loggedin {
  margin-top:-26px;
  margin-right:-20px;
  text-align:right;
  white-space:nowrap;
  background:#000;
  color:#fff;
  font-size:0.8em;
  padding:5px;
  text-shadow:none;
}
section#account.loggedin a {
  color:#fff;
}

article {
  margin:auto;
  padding:20px;
  width:920px;
  background:#f0f0f0;
  -webkit-box-shadow:0 0 20px rgba(64, 64, 64, 0.125);
  text-shadow:0 1px 1px #fff;
  min-height:200px;
}
article:after {
  content:'';
  clear:both;
  display:block;
}

article h1, article h2, article h3 {
  padding:0.5em 0 0.2em;
}
article ul, article p {
  margin-bottom:20px;
  font-size: 18px;
}

article a {
  color:#BE490E;
  font-weight:bold;
}

ul.inline {
  margin-top:10px;
  list-style-type:none;
}
ul.inline li {
  display: inline;
}
ul.inline a {
  text-decoration: none;
  font-weight: normal;
  font-family:"trebuchet MS",tahoma,helvetica,sans-serif;
  background: #fa711c;
  color:#FFF;
  padding: 4px 8px;
  margin-right: 4px;
}

footer {
  clear:both;
  background: #fa711c;
  color:white;
  font-size:0.8em;
  text-align:center;
  border-top:1px solid #fff;
  -webkit-box-shadow:0 0 10px rgba(64, 64, 64, 0.5)
}

footer section {
  height:80px;
  background: url(images/loops.png) 50% 0 no-repeat;
  padding:10px;
}


/*verbatim*/
DT { font-weight: bold; margin-top: 6px; }
DL { font-size: 0.9em; margin-left: 20px; }
.example { font-family: monospace; }
pre.scrollcode {
	overflow-x: auto;
  overflow-y:hidden;
	border: 0;
	background: #fff;
  border:1px solid #ddd;
	font-family: monospace;
	line-height: 1em;
  padding:1em;
}

/* for mobile */
@media screen and (max-width: 900px) {
    header>hgroup, nav>ul, article, footer>section {
        width: auto;
    }
    header, header>hgroup {
        height: 80px;
    }
    header>hgroup>h1 {
        background-position: 0 -25px;
        line-height: 80px;
        margin:0;
    }
    header>hgroup>h2 {
        margin: 10px 12px 10px 0;
        line-height: 30px;
        font-size: 24px;
        width: 113px;
    }
    nav ul li {
        display: inline-block;
        white-space: nowrap;
    }
    section#account.loggedout {
        margin: 0 0 11px;
        float: none;
        padding:0;
        width: auto;
    }
    #account p {
        font-size: 14px;
        margin-bottom: 10px;
    }
    #account li {
        display: inline-block;
    }
    #account li:first-child {
        margin-right: 4px;
    }
}