html,
body {
  height: 100%;
  margin: 0;
}

a{
  color:#0088ff;
  text-decoration:none;
}
a:hover{
  text-decoration:underline;
}

body {
  font-family: 'Open Sans', sans-serif;
  line-height:1.5;
}

.wrapper {
  min-height: 100%;
  /* Equal to height of footer */
  /* But also accounting for potential margin-bottom of last child */
  margin-bottom: -37px;
}

header {
  /*background-color: orangered;*/
  background-image:url('/img/bg.png');
}

.header-wrap {
  height: 116px;
  display: flex;
  justify-content: center;
}

.logo {
  align-self: center;
}

.logo img {
  display: block;
}

.join-link1 {
  display: none;
}

.join-link2 {
  background-color: #aa0000;
  text-align:center;
  font-weight:bold;
}

.join-link2 a{
  color:white;
}

section {
  padding: 0 20px;
}

pre {
   font-family: 'Roboto Mono', monospace;
   font-size: .9em;
   white-space: pre-wrap;
}

#menu{
	margin-bottom:30px;
}

#menu a{
font-size:large;
font-weight:bold;
}

.push {
  height: 37px;
}

footer {
  height: 37px;
  text-align: center;
  font-size: small;
}

footer a{
color:black;
text-decoration:initial;
font-size:small;
}

h1{
font-size:1.5em;
/*text-align:center;*/
}

h2{
font-size:1.3em;
/*text-align:center;*/
}

h3{
font-size:1.2em;
}

h4{
font-size:1.1em;
}

.center-img,.wide-img{
	display:block;
	margin:auto;
	padding-bottom:10px;
}

.wide-img{
	max-width: 100%;
	height: auto;
}

#springs {
  display:flex;
  flex-direction:column;
  margin:15px auto 15px auto;
  width:60%;
  border-style:solid;
  border-width:1px;
  border-color:lightblue;
}

#springs span {
  height:1.7em;
  margin-top: 2px;
  padding-left: 15px;
}

/* DESKTOP */
@media (min-width: 600px) {

  .header-wrap {
    max-width: 780px;
    width: 100%;
    justify-content: space-between;
    align-items: flex-start;
    margin-left: auto;
    margin-right: auto;	
  }

  .logo {
    margin-left: 10px;
  }

  .join-link1 {
    display: block;
	max-width:110px;
    margin-right: 35px;
	background-color: initial;
    align-self: center;
  } 
 
  .join-link1 a{
  font-size:x-large;
  font-weight:bold;
  line-height:initial;
  color:white;
  } 

  .join-link2 {
    display: none;
  }

section {
  max-width: 780px;
  width: calc(100% - 40px);
  margin-left: auto;
  margin-right: auto;
  }

#menu a{
  font-size:initial;
  font-weight:initial;
}  
  
footer {
  max-width: 900px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  }

#springs {
  width:35%;
}

}