div.facebook {
              margin: 0px;
              padding: 0px;
              width: 50%;
              border: 0px;
              float: left;
              }

div.twitter {
             margin: 0px;
             padding: 0px;
             width: 50%;
             border: 0px;
             float: right;
             }

li {
    margin-top: 16px;
    }

li li {
       margin-top: 4px;
       }

table.landscape {
                 margin: 16px auto;
                 border: 1px solid #e0e0e0;
                 width: 96%;
                 }

table.portrait {
                margin: 16px auto;
                border-bottom: 1px solid #e0e0e0;
                font-size: xx-large;
                }

td.portrait_th {
                font-weight: bold;
                border-top: 1px solid #e0e0e0;
                border-left: 1px solid #e0e0e0;
                }

td.portrait_td {
                border-top: 1px solid #e0e0e0;
                border-right: 1px solid #e0e0e0;
                }

td {
    vertical-align: top;
    margin: 0px;
    padding: 8px;
    border: 0px;
    }

tr.even {
         background: #f5f5f5;
         }

img.banner {
            width: 100%;
            height: fit-content;
            margin: 0px;
            padding: 0px;
            border: 0px;
            }

a.platform {
            font-weight: bold;
            padding: 6px 8px;
            background: navy;
            color: whitesmoke;
            text-decoration: none;
            }

a:hover.platform {
                  background: whitesmoke;
                  color: navy;
                  border: 1px solid navy;
                  }

li.platform {
             font-weight: bold;
             padding: 6px 8px;
             background: navy;
             text-decoration: none;
             display: inline-block;
             color: whitesmoke;
             margin: 8px 0px;
            }

@media (orientation: portrait) {

    body {
          font-size: xx-large;
          }

    img.banner {
                content:url(images/hastings_mobile_banner.jpg);
                }

    div.title {
               position: absolute; 
               top: 8px;
               left: 8px;
               font-size: xx-large;
               font-weight: bold;
               }

    div.photo_credit {
                      position: absolute; 
                      top: 8px;
                      right: 8px;
                      font-size: x-large;
                      }

    div.col1 {
              margin: 0px;
              padding: 0px;
              width: 100%;
              border: 0px;
              }

    div.mailinglistmessage {
                            font-size: xx-large;
                            margin-bottom: 8px;
                            }

    div.col2 {
              margin: 0px;
              padding: 0px;
              width: 100%;
              border: 0px;
              text-align: center;
              }

    table.landscape {
                     display: none;
                     }

    table.portrait {
                    display: table;
                    }

    div.section {
                 color: white;
                 padding: 4px;
                 font-weight: bold;
                 font-size: xx-large;
                 }

}

@media (orientation: landscape) {

    img.banner {
                content:url(images/hastings_banner.jpg);
                }

    div.photo_credit {
                      position: absolute; 
                      bottom: 8px;
                      left: 8px;
                      font-size: large;
                      }

    div.title {
               position: absolute; 
               top: 8px;
               left: 8px;
               font-size: x-large;
               font-weight: bold;
               }

    div.col1 {
              margin: 0px;
              padding: 0px;
              width: 50%;
              border: 0px;
              float: left;
              }

    div.mailinglistmessage {
                            margin-bottom: 8px;
                            }

    div.col2 {
              margin: 0px;
              padding: 0px;
              width: 50%;
              border: 0px;
              float: right;
              text-align: center;
              }

    table.landscape {
                     display: table;
                     }

    table.portrait {
                    display: none;
                    }

    div.section {
                 color: white;
                 padding: 4px;
                 font-weight: bold;
                 font-size: x-large;
                 }

}