html,body,.section,.container {
  height: 100%;
}

.container {
  height: 70%;
}

.image.is-10by1 img, .image.is-20by3 img {
   bottom: 0;
   left: 0;
   position: absolute;
   right: 0;
   top: 0;
   height: 100%;
   width: 100%;
}

.image.is-10by1 {
   padding-top: 10%;
}

.image.is-20by3 {
   padding-top: 15%;
}

hr {
  margin: 0 0 15px 0;
}

hr.top {
  margin: 0 0 0 0;
}

.signup-box {
  margin: auto;
  width: 300px;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.3);
  border-radius: 10px;
}

.block-link {
    text-decoration: none !important;
}

/**
 * * The CSS shown here will not be introduced in the Quickstart guide, but
 * * shows how you can use CSS to style your Element's container.
 * */
input,
.StripeElement {
  height: 40px;
  padding: 10px 12px;

  color: #32325d;
  background-color: white;
  border: 1px solid transparent;
  border-radius: 4px;

  box-shadow: 0 1px 3px 0 #e6ebf1;
  -webkit-transition: box-shadow 150ms ease;
  transition: box-shadow 150ms ease;
}

input:focus,
.StripeElement--focus {
  box-shadow: 0 1px 3px 0 #cfd7df;
}

.StripeElement--invalid {
  border-color: #fa755a;
}

.StripeElement--webkit-autofill {
  background-color: #fefde5 !important;
}

.checkboxes input {
  vertical-align: middle;
}

.checkboxes label span {
  vertical-align: middle;
  margin-left: 5px;
}

.map {
  height: 300px;
}

.mapbig {
  height: 100%;
}

.slidecontainer {
  width: 100%;
  margin-top: 10px;
  margin-bottom: 10px;
}

.slider {
  -webkit-appearance: none;
  width: 100%;
  height: 15px;
  border-radius: 5px;  
  background: #d3d3d3;
  outline: none;
  opacity: 0.7;
  -webkit-transition: .2s;
  transition: opacity .2s;
  padding: 0 0;
}

.slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 25px;
  height: 25px;
  border-radius: 50%; 
  background: #4CAF50;
  cursor: pointer;
}

.slider::-moz-range-thumb {
  width: 25px;
  height: 25px;
  border-radius: 50%;
  background: #4CAF50;
  cursor: pointer;
}