article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary { 
display: block;
background-color: #fff;
}

body { 
font-family: "Trebuchet MS",tahoma,verdana,arial,helvetica,sans-serif; 
margin-left: auto;
margin-right: auto;
width: 620px; 
background-color: #1755a6;
/* props below for nonscroll */
   margin-top: 0; 
   margin-bottom: 0; 
   padding: 0;
   height: 100%;
   overflow: hidden;
}

header { 
background-color: #1755a6;
/* props below for nonscroll */
   overflow: hidden; 
   position: absolute; 
   width: 660px; 
   height: 200px; 
}

nav {
background-color: #56c4c2;
padding-left: 3px;
-moz-border-radius-topleft: 20px;
-moz-border-radius-topright: 20px;
-webkit-border-top-left-radius: 20px;
-webkit-border-top-right-radius: 20px;
-khtml-border-top-left-radius: 20px;
-khtml-border-top-right-radius: 20px;
border-top-left-radius: 20px;
border-top-right-radius: 20px;
}

nav.cssbook {
background-color: #ffc20e;
}

nav ul {
list-style-type: none;
height: 20px;
width: 700px;
margin-left: -30px;
margin-top: 0px;
margin-bottom: 2px;
}

nav li {
float: left;
border-right: 3px solid #1755a6;
}

nav ul a {
padding-right: 30px;
padding-left: 30px;
display: block;
text-decoration: none;
font-size: 16px;
color: #fff;
border-bottom: 0px;
}

nav ul a:hover {
color: #1755a6;
border-bottom: 0px;
}

section {
padding: 10px;
-moz-border-radius-bottomleft: 20px;
-moz-border-radius-bottomright: 20px;
-webkit-border-bottom-left-radius: 20px;
-webkit-border-bottom-right-radius: 20px;
-khtml-border-bottom-left-radius: 20px;
-khtml-border-bottom-right-radius: 20px;
border-bottom-left-radius: 20px;
border-bottom-right-radius: 20px;
/* props below for nonscroll  */
/* seems to need !important?  */
overflow: auto !important;
position: absolute !important;
width: 640px !important;
top: 120px !important;
bottom: 0 !important;

}

h1 {
font-size: 180%; 
margin-top: 10px;
margin-bottom: 30px;
}

h2 {
margin-top: 40px;
margin-bottom: 0;
}

p { font-size: 100%; }


p:hover.code {
background-color: #f3f6fb;
}

p.note { 
background: url(note.jpg) no-repeat left top; 
padding-left: 32px;  
line-height: 17px; 
}

p.tip { 
background: url(tip.jpg) no-repeat left top; 
padding-left: 36px;  
line-height: 17px; 
}

table {
border-top: 3px solid #1755a6;
border-bottom: 3px solid #1755a6;
border-collapse: collapse;
}

th {
background-color: #8996cb;
}

th p {
text-align: left;
margin: 2px;
color: #fff;
}

tr {
border-bottom: 1px solid #1755a6;
vertical-align: top;
}

tr p {
margin: 2px;
}

footer {
font-size: 90%;
margin-top: 80px;
margin-bottom: -10px;
border-top: 1px solid #1755a6;
}

a {
text-decoration: none;
border-bottom: 1px dotted;
color: #1755a6;
}

a:focus { outline: none; }

a:hover {
text-decoration: none;
border-bottom: 1px dotted;
color: #56c4c2;
}

a.tipIcon {
background: url(checked_not.png) left center no-repeat; 
padding-left: 20px; 
border-bottom: 0px;
}

a.tipIcon:visited {
background: url(checked.png) left center no-repeat; 
padding-left: 20px; 
}

ul.tipList {
list-style-type: none;
text-indent: -20px;
margin-left: 0px;
padding-left: 20px;
}

ul.tipList li {
margin-bottom: 10px;
}
