address,article,aside,canvas,figcaption,figure,footer,header,hgroup,nav,section,summary {
    display: block;
}
@media screen and (max-width: 600px)   {
    body {
        background: #000;
    }
}
@media screen and (min-width: 900px)  {
    body {
        background: #aaa;
        background-size: 100%;
    }
}
@font-face {
    font-family: avalonregular;
    src: url('http://www.rodmoorhead.com/fonts/avalonn-webfont.eot');
    src: url('http://www.rodmoorhead.com/fonts/avalonn-webfont.woff') ;
    font-weight: normal;
    font-style: normal;
}
body {
    font-family: avalonregular, Helvetica, Arial, Verdana,  sans-serif;
    font-size: 16px;
    line-height: 24px;
    color: gray;
    font-weight: 300;
    text-align: center	;
}
a {
    text-decoration: none;
}
a:link {
    color: gray;
}
a:visited {
    color: gray;
}
a:hover {
    color: burlywood;
    text-decoration: none;
}
a:active {
    color: burlywood;
}
article {
    width: 70%;
    margin: 10% auto 0 auto;
}
.bold {
    font-weight: 600;
}
.avalon {
    font-family: avalonregular;
    font-size: 20px;
}
.rotateR {
    -ms-transform: rotate(90deg)  ;
    -moz-transform: rotate(90deg)  ;
    -webkit-transform: rotate(90deg)  ;
    -o-transform: rotate(90deg)  ;
    transform: rotate(90deg);
}
img.v {
    width: 200px ;
}
img.h {
    width: 300px   ;
}
img.s {
    width: 250px      ;
}
img.zoom {
    height: auto;
    border: 0;
    display: inline-block;
    padding: 0px;
    cursor: hand;
    cursor: pointer;
    position: relative;
    z-index: 99;
    transition: transform 0.4s ;
    -webkit-transition: -webkit-transform 0.4s ;
    -o-transition: -o-transform 0.4s ;
    transition-duration: 0.4s;
    -moz-transition-property: -moz-transform ;
    -moz-transition-duration: .4s;
    transition-timing-function: ease-in;
}
img.zoom:hover {
    transform: scale(1.5);
    -moz-transform: scale(1.5) ;
    -webkit-transform: scale(1.5) ;
    -o-transform: scale(1.5) ;
    transform: scale(1.5,1.5);
    position: relative;
    z-index: 100;
}
h1 {
    width 100%;
    margin: 0 0 7% 0;
    font-family: 'avalonregular';
    text-align: center;
    font-size: 64px;
    letter-spacing: 22px;
}
h2 {
    width 100%;
    margin: auto;
    font-family: 'avalonregular';
    text-align: center;
    font-size: 24px;
    letter-spacing: 38px;
    line-height: 30px;
    color: #ccc;
}
h3 {
    width 100%;
    margin: auto ;
    font-family: 'avalonregular';
    text-align: center;
    font-size: 16px;
    letter-spacing: 5px;
    white-space: pre;
}
.info {
    white-space: pre;
    margin: 0 auto 0 auto;
    color: #ddd;
    font-size: 20px;
}
.contact {
    display: inline-block;
    vertical-align: top;
    margin: 5% auto 0 auto;
    height: 25px;
    width 50px;
    overflow: hidden;
    white-space: pre;
}
.contact:hover {
    height: auto;
    cursor: pointer;
    cursor: hand;
    overflow: visible;
}
.clipbox {
    display: inline-block;
    vertical-align: top;
    width: 200px;
    height: 200px;
    overflow: hidden;
    z-index: 99;
    margin: 0 -3px 0 -3px;
}
.clipbox:hover {
    overflow: visible;
    z-index: 100;
}
.textbox {
    display: inline-block;
    vertical-align: top  ;
    width: 200px;
    height: 200px;
    background-color: #333;
    margin: 0 -3px 0 -3px;
}
.tablecell {
    display: table-cell;
    vertical-align: bottom;
    width: 200px;
    height: 195px;
    margin: 10px;
    font-family: 'avalonregular';
}
#back {
    margin-top: 5%;
    font-weight: 600;
    text-align: left;
}