body {
  color:#282828;
  font-family:'Rubik';
  margin:0;
  padding-top:120px;
}

*:focus {
  outline: none
}

p {
  line-height:150%
}

a {
  color:#5B91A9;
  text-decoration: none;
  transition: color .2s;
}

a:hover {
  color:#427C9F;
}

.flex {
  display:flex;
}

h1, .h1 {
  font-size: 65px;
  font-weight:400;
  text-align: center;
  margin: 0 auto;
}

h2 {
  text-align:center;
  font-weight:400;
}



.subtitle {
  font-size: 26px;
  font-weight: 300;
}

.wrap {
  max-width:1300px;
  margin:0 auto;
  position: relative;
}

input, .button {
  display:block;
}

input {
  width:100%;
  height:40px;
  margin-bottom:10px;
  border:1px solid #dadada;
  font-size:14px;
  font-family: 'Rubik';
  padding-left:10px;
  border-radius:4px;
  box-sizing: border-box;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

input:focus {
  border:1px solid #bababa;
}

.error_message {
  font-size: 14px;
  margin-top: -5px;
  margin-bottom: 10px;
  text-align: left;
  color: chocolate;
}

.button {
  line-height:40px;
  border-radius:4px;
  position: relative;
  background-color:#5931FF;
  overflow: hidden;
  color:white;
  padding:0 20px;
  display:inline-block;
  font-size:14px;
  transition: background-color .3s, transform .1s;
  cursor:pointer;
}

.button:hover {
  color: white;
  background-color:#9b4cff;
}

.button:active {
  transform: translateY(1px);
}

.button.loading {
  color:rgba(255,255,255,0.5);
  background-color: #b8a7ff;
}

.button.loading:after {
  content: "";
  height: 4px;
  background-color: #5931FF;
  width: 100%;
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  animation-name:loading;
  animation-iteration-count: infinite;
  animation-duration:0.8s;
}

.button.special.success {
  background:#D6EECE;
  color:#3B8A63;
}

.button.special, .button {
  transition: all 1s;
  font-size: 18px;
  background-color: #4652ff;
  font-size: 18px;
  background-color: #4652ff;
  position: relative;
  box-sizing: border-box;
  background: #36a9ae linear-gradient(to bottom, #37adb2, #329ca0);
  border: 1px solid #2a8387;
  border-width: 1px;
  border-style: solid;
  transition: all .2s;
}
.button.special .price {
  background: #36a9ae linear-gradient(to bottom, #3ebec3, #3ba9ad);
  border-left: 1px solid rgba(0,0,0,0.2);
  position: absolute;
  right: 0;
  top: 0;
  padding: 4px 16px;
  border-radius: 0 4px 4px 0;
}
.button.special .price .small {
  font-size: 12px;
  position: relative;
  top: -4px;
  padding: 0;
}
.button.special:hover {
  box-shadow: inset 0 0 3px rgba(255,255,255,0.2), 0 1px 2px rgba(0,0,0,0.2);
}
.discount {
  animation-name: discount;
  animation-duration:2s;
  animation-iteration-count: infinite;
  font-size: 14px;
}
@keyframes discount {
  0% { color:#00c3ff }
  50% { color:#ff00d2 }
  100% { color:#00c3ff }
}
.link, .link:hover {
  color:#0038B1;
  padding:5px 10px;
  white-space:nowrap;
  line-height:160%;
}
.link:hover .text {
  text-decoration: underline;
}
.link img {
  width:6px;
  margin-left:2px;
}
.big .link {
  font-size:18px;
}
.link.bright {
  color:#86DAFF;
}

@keyframes loading {
  0% { width:0%; left:0%; }
  50% { width:100%; left:0%;   }
  100% { width:0%; left:100%; }
}

@media screen and (max-width: 700px) {
  h1, .h1 { font-size:40px }
  .subtitle { font-size:20px; }
}