

/* Photos and captions */

div.photo, div.widerPhoto {margin: auto; background-color: #FFFFFF; border: 0px; }
div.photo {width: 45%}
div.widerPhoto {width: 75%}
@media screen and (max-width: 800px)
{
  div.photo {width: 100%}
  div.widerPhoto {width: 100%}
}
div.photo img, div.widerPhoto img {width: 100%; height: auto; display: block;}
div.photo p, div.widerPhoto p {width: 100%; background-color: white; padding: 10px 5px; margin: 0px; text-align: center;font-family: Verdana; font-size: 1.0em; color: black; font-weight: bold;}

/* End of Photos and captions */

/* General Start*/

header a {text-decoration: none; color: #FFFFFF}
div.headerM, div.headerU, div.headerL, h1, h2, summary, h3, p, li, form select, form label, button {font-family: Verdana, Arial, Helvetica, sans-serif;}
div.headerM, div.headerU, div.headerL {font-weight: bold; text-align: center; color: #FFFFFF; background: var(--themeColour); margin: auto;}
body {margin: 0px; padding: 0px; background: #FFFFFF;}
section {border-style: none; margin: auto;}
section a:link, section a:visited, section a:active, section a:hover {color: #000000; text-decoration: none; padding-bottom: 1px; border-bottom: 1px solid #B3B3B3; font-weight: bold}
summary {font-weight: bold;}
p.small {font-size: 0.8em;}
p.frontPage1 {font-weight: bold;}
p.frontPage2 {font-size: 1.0em}

@media screen and (min-width: 1000px)
{
  div.headerM {font-size: 1.8em; padding: 20px 0px}
  div.headerU {font-size: 1.8em; padding: 20px 0px 10px}
  div.headerL {font-size: 1.0em; padding: 0px 0px 15px}
  summary {font-size: 1.2em;}
  section {width: 60%;}
  button.displayResults {width: 25%; padding: 10px 20px 10px;}
  div.panel {border: 2px solid var(--themeColour)}
  div.smallGap {margin-top: 25px; margin-bottom: 0px;}
  div.smallerGap {margin-top: 50px; margin-bottom: 0px;}
  div.mediumGap {margin-top: 80px; margin-bottom: 0px;}
  div.gap {margin-top: 100px; margin-bottom: 100px;}
  p.frontPage1 {font-size: 1.2em}
  p.frontPage2 {font-weight: bold;}
}

@media screen and (max-width: 999px)
{
  div.headerM {font-size: 1.3em; padding: 15px 0px}
  div.headerU {font-size: 1.3em; padding: 15px 0px 8px}
  div.headerL {font-size: 0.9em; padding: 0px 0px 10px}
  summary {font-size: 1.1em;}
  section {width: 95%;}
  button.displayResults {width: 50%; padding: 8px 20px 10px; } /* Nudge up so centred on phone */
  div.panel {border: 1px solid var(--themeColour)}
  div.smallGap {margin-top: 10px; margin-bottom: 0px;}
  div.smallerGap {margin-top: 25px; margin-bottom: 0px;}
  div.mediumGap {margin-top: 50px; margin-bottom: 0px;}
  div.gap {margin-top: 70px; margin-bottom: 100px;}
  p.frontPage1 {font-size: 1.1em}
  p.frontPage2 {font-weight: medium;}
}

/* End of General */

/* Tile used for listings */

div.tile {border-top:3px solid #999999;border-bottom:1px solid #666666;padding:0px 10px 10px 10px;background-color: #F5F5F5F5}
div.tile {margin:0px 0px 15px 0px}

/* End of Tile used for listings */

/* Misc */

#ID_FIRST_NAME, #ID_LAST_NAME {display: none}

/* End of Misc */
