/* For 'Peter's Poem Generator'.  Author: Heather Howard, for HTML5 version */


a {font-weight: bold;  text-decoration: none;  font-size: 1rem;  vertical-align: bottom}
a:link     {color: #CC6633}
a:visited  {color: #CC6633}
a:hover    {color: #DD4400; text-decoration: underline}
a:active   {color: #DD4400}
a.footer   {font-size: 0.8rem}


body       {margin: 0;  padding: 1vh;
            font-family: Arial, Helvetica, sans-serif;  font-size: 1rem;
            color: #C0C0C0;  background-color: #000066;  text-align: center}


* {box-sizing: border-box}


form   {margin: 2px}   /* vh relates to frame height, not screen height */
input  {width: 8vw;   color: #000066;  border: 1px solid #000077;  border-radius: 5px}
input.length {width: 6vw;  border-radius: 0}
input:focus {border: 2px solid #CC6633}

    @media only screen and (max-width: 1000px)
    {
        input  {width: 21vw;  }
    }


h1 {text-align: center;  font-size: 2.5rem;  color: #CC6633}
h2 {text-align: centre;  font-size: 1.5rem;  color: #DD4400}

    @media only screen and (max-width: 1000px)
    {
        h1 {font-size: 1.25rem}
        h2 {font-size: 1.1rem}
    }


img       {max-width: 100%;  height: auto;  border: 0}


iframe.poem   {width: 100%;  height: 75vh;  border: 1px solid #CC6633}
iframe.aux    {width: 100%;  height:  8vh;  position: fixed;  bottom: 1vh; right: 1vh;  border: 1px solid #000077}


table
{
    table-layout: fixed;  max-width: 100%;  width: 95%;
    margin: auto;  margin-top: 2vh;  margin-bottom: 2vh;  padding: 1vh;
    background-color: #000077
}
table.footer_embed {background-color: #000066}
                   td {padding: 1vh}
table.frontpanel   td {border: 0;  vertical-align: top}
table.info         td {border: 1px solid #CC6633}
table.footer_embed td {border: 1px solid #000077}

    @media only screen and (min-width: 1000px)
    {
        table.info, table.footer_embed {width: 60%}
    }


/* end */