/*
DC.Title       = Style Sheet for Version 1 of Mahu BusStop micro-site
DC.Subject     = Bus Stop
DC.Description = style sheet for site display
DC.Publisher   = David Neil
DC.Creator     = David Neil
DC.Date        = 2018-08-25
DC.Identifier  = http://mahu.rangi.cloud/BusStop/css/bus.css
DC.Language    = en
DC.Relation    = style for mahu.rangi BusStop micro-site
DC.Coverage    = micro-site
DC.Rights      = http://mahu.rangi.cloud/Rangiccc.html
                 All rights reserved
                 No license exists to permit others to use this software
Version 1-00-00 Aug 2018: initial version
*/


html, body,
a, div, figure, figcaption, footer, h1, h2, img, li, nav, p, section, ul {
  display:block; vertical-align:baseline;
  margin:0; padding:0; border:none; outline:0;
  color:inherit; background-color:inherit;
  }

html { color:DarkSlateGrey; background-color:LightGrey; }

body {
  height:100vh;
  padding:5px;
  /*color:DarkSlateGrey; background-color:GhostWhite;*/
  }

body>img {
  top:0; left:0; height:100vh;
  margin:auto; border-left:1px solid Black; border-right:1px solid Black;
  }

figure { top:0; }

  figure img { width:100%; }

  figure figcaption {
    margin:5px 3rem; first-line:-1rem; /*border:1px green solid;*/
    }

  figure img { border:1px solid Black; }

footer {
  position:fixed; left:0; width:100vw;
  z-index:5;
  bottom:0; height:48px;
  --webkit-box-shadow:0 0 5px rgba(0,50,0,0.2);
  --moz-box-shadow:0 0 5px rgba(0,50,0,0.2);
  box-shadow:0 0 5px rgba(0,50,0,0.2);
  color:inherit; background-color:rgb(197,193,131);
  }

  footer div {
    display:flex; flex-flow:row wrap;
    margin-top:5px;
    }

    footer div span {
      flex:1;
      /*border:solid 1px Green;*/
      /*vertical-align:middle;*/
      }

    footer div #copyright {
      flex:1 0 30vw;
      text-align:center;
      }

    footer div #site {
      padding-left:2px;
      text-align:left;
      }

    footer div #technical {
      padding-right:20px;
      text-align:right;
      }

      footer div #technical a {
        display:inline;
        }

      footer div #technical img {
        display:inline;
        vertical-align:top;
        /*position:relative; top:5px; width:222px; height:18px;*/ height:38px;
        }

/*  footer a:link,
  footer a:visited {
    color:white; background-color:inherit;
    }
  footer a:hover {
    color:blue;
    }
  footer .floatCenter { position:absolute; }
  footer #technical,
  footer #copyright,
  footer #site {
    display:inline-block; vertical-align:baseline;
    margin:0 -4px 0 -4px; border:1px dotted red; padding:0;
    }
  footer #site {
    /*display:block; clear:right; *//*****float:left;
    /*padding-top:0.5em;*//********padding-top:5px;
    text-align:left;
    }
  footer #copyright {
    padding-top:5px;
    }
  footer #technical {
    /*display:block; clear:left; *//********float:right;
    padding-top:0px;
    text-align:right;
    }
*/

h1 { /*margin:5px;*/ }

h2 { /*margin:5px;*/ margin-top:2em; }

li { display:list-item; list-style-position:inside; }

section {
  width:calc(64vw + 12px + 40px);
/*  border:red 1px solid;*/
  }

  section figure {
    display:inline-block; width:32vw;
    /*margin:0;*/ margin-bottom:25px;
    }

ul { padding-bottom:5rem; }


#Existing figure { margin-right:20px }

/*#img_only { margin:0; padding:0; }*/

#North { margin-left:calc(100vw - 64vw - 40px - 44px); }

  #North figure { margin-left:20px }

#South {
  position:relative; width:100%;
  padding-bottom:150px;
  }

  #South figcaption {
    margin-top:0;
    }

  #South .Stl { position:relative; top:0; }

  #South .Stm { position:relative; top:80px; left:-2vw; }

  #South .Str { position:relative; top:140px; left:-4vw; }