/******************/
/* Pure Overrides */
/******************/

.pure-button.button-xsmall { font-size: 70%; }
.pure-button.button-small { font-size: 85%; }
.pure-button.button-large { font-size: 110%; }
.pure-button.button-xlarge { font-size: 125%; }

.pure-button.button-success,
.pure-button.button-error,
.pure-button.button-warning,
.pure-button.button-secondary,
.pure-button.button-theme-primary,
.pure-button.button-theme-secondary {
  color: white;
  border-radius: 4px;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
}

.pure-button.button-success { background: rgb(28, 184, 65); } /* this is a green */
.pure-button.button-error {  background: rgb(202, 60, 60); } /* this is a maroon */
.pure-button.button-warning { background: rgb(223, 117, 20); } /* this is an orange */
.pure-button.button-secondary { background: rgb(66, 184, 221); } /* this is a light blue */
.pure-button.button-theme-primary { background-color: #285269; } /* the start turquoise */
.pure-button.button-theme-secondary { background-color: #E2C20F; } /* the start gold */

/* Cause buttons to the right of input to line up and look like they're the same */
.pure-button.right-of-input {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  margin-left: -3px;
}

.pure-button.button-circular { border-radius: 50%; }

form.pure-form .input-and-button > input,
form.pure-form .input-and-button > select {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

form.pure-form .input-and-button > button {
  margin-left: -6px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  height: 2.3em;
  vertical-align: top;
}

.pure-menu-heading, .pure-menu-link.wrap-ok { white-space: normal; }

.break-word-wrap { word-wrap: break-word; }

@media only screen and (max-width: 480px) {
  .pure-button.right-of-input {
    margin-bottom: .3em; /* buttons must mimic input fields which do this in pure */
  }
}

.pure-visible-before-sm { display:none }
.pure-visible-before-md { display:none }
.pure-visible-before-lg { display:none }
.pure-visible-before-xl { display:none }

.pure-visible-after-sm { display:none }
.pure-visible-after-md { display:none }
.pure-visible-after-lg { display:none }
.pure-visible-after-xl { display:none }

@media screen and (min-width:568px) { /* sm */
  .pure-visible-after-sm { display: block; }

  .pure-visible-before-sm { display: none; }

  .pure-visible-before-md { display: block; }
  .pure-visible-before-lg { display: block; }
  .pure-visible-before-xl { display: block; }
}

@media screen and (min-width:768px) { /* md */
  .pure-visible-after-sm { display: block; }
  .pure-visible-after-md { display: block; }

  .pure-visible-before-sm { display: none; }
  .pure-visible-before-md { display: none; }

  .pure-visible-before-lg { display: block; }
  .pure-visible-before-xl { display: block; }
}

@media screen and (min-width:1024px) { /* lg */
 .pure-visible-after-sm { display: block; }
 .pure-visible-after-md { display: block; }
 .pure-visible-after-lg { display: block; }

 .pure-visible-before-sm { display: none; }
 .pure-visible-before-md { display: none; }
 .pure-visible-before-lg { display: none; }

 .pure-visible-before-xl { display: block; }
}

@media screen and (min-width:1280px) { /* xl+ */
  .pure-visible-after-sm { display: block; }
  .pure-visible-after-md { display: block; }
  .pure-visible-after-lg { display: block; }
  .pure-visible-after-xl { display: block; }
  .pure-visible-before-sm { display: none; }
  .pure-visible-before-md { display: none; }
  .pure-visible-before-lg { display: none; }
  .pure-visible-before-xl { display: none; }
 }