* { 
    font-family: 'Segoe UI', Tahoma, sans-serif;
}



b { 
    font-family: 'Segoe UI', Tahoma, sans-serif;
}



.footnote {
    font-size:    12px;
}



code { 
    font-size:    14px;
    font-family:  "Lucida Console", Monaco, monospace;
    font-weight:  bold;
}

code.block { 
    font-size:    11px;
    font-family:  "Lucida Console", Monaco, monospace;
    padding-left: 30px;
    font-weight:  normal;
}

pre { 
    margin-left: 20px;
}


h1 {
    font-family: "Berlin Sans FB", 'Segoe UI', Tahoma, "Futura", "Arial", "Geneva", "Sans-serif";
    text-align:  center;
    font-size:   24px;
}



li {
    font-size:   16px;
    padding:     6px 0 12px 0;
}




hr {
    border:           0;
    height:           4px;
    margin:           40px 0;
    background-image: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(11, 52, 71, 1), rgba(11, 52, 71, 1), rgba(0, 0, 0, 0));
}



div.video, iframe { 
    text-align:   center;
}



div.video { 
    margin:     20 auto 75 auto;
    width:      560px;
    height:     315px;
    border:     none;
}



div.video iframe { 
    width:      560px;
    height:     315px;
    border:     none;
}



p.note {
    font-size:    13px;
    border-style: solid;
    border-width: 1px;
    border-color: #225566;
    margin:       5px 50px 50px 50px;
    padding:      15px 20px 20px 20px;
    width:        75pct;
    background:   #ffffaa;
}



/************************ GRAPHIC TABLES **************************/

table.graphic-table {
    border-collapse: collapse;
    margin:          10px auto;
    table-layout:    fixed;
}

td.graphic-table {
    vertical-align: top;
    font-size:      12px;
    text-align:     center;
    padding:        10px;
}

table.graphic-table td {
    padding:        10px;
    text-align:     center;
    font-size:      12px;
}

table.graphic-table td.stagger {
    padding:   0;
    font-size: 1px;
}



/************************ TEXT TABLES **************************/

table.text-table {
    border-collapse: collapse;
    margin:          30px 20px;
}

table.text-table tr {
    vertical-align:  top;
    text-align:      left;
}

table.text-table th {
    padding:         8px;
    border-bottom:   3px solid black;
    vertical-align:  top;
    text-align:      center;
    font-size:       13px;
    font-weight:     bold;
}

table.text-table td:first-child {
    padding:        10px 10px 10px 4px;
    border-top:     1px solid grey;
    text-align:     left;
}

table.text-table td:last-child {
    padding:        10px 4px 10px 10px;
    border-top:     1px solid grey;
    text-align:     left;
}

table.text-table td {
    padding:        10px;
    border-top:     1px solid grey;
    text-align:     left;
    font-size:       12px;
}

/* Just a shorthand for centering cells.  Not needed for
non-text-table, as they're centered by default. */

table.text-table td.c { 
    text-align: center;
}



/************************ INSTRUCTION TABLES **************************/


img.showmehow {
    width:                 120;
    border:                3px solid white;
    margin:                2px;
}

table.instructions {
    background-color:      #cfe0e5;
    border-collapse:       collapse;
}

table.instructions tr {
    background-color:      #cfe0e5;
    padding:               10px;
}

table.instructions td {
    padding:               10px;
    border-width:          3px 0px;
    border-style:          solid;
    border-color:          white;
    vertical-align:        top;
}

table.instructions ol {
    -webkit-padding-start: 20px;
}