@import url(http://fonts.googleapis.com/css?family=Inconsolata);
@import url('http://weloveiconfonts.com/api/?family=entypo');
html,
body {
  background: rgb(22, 22, 22);
  font-family: 'Inconsolata', sans-serif;
  opacity: 0.9;
  margin: 0 auto;
  text-shadow: #0e0e0e 0px 0.5px 0px;
}

body:after {
  content: "";
  opacity: 0.8;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: -1;
  background: -webkit-radial-gradient(circle farthest-corner at 35% 90%, #fec564, rgba(0, 0, 0, 0) 50%), -webkit-radial-gradient(circle farthest-corner at 0 140%, #fec564, rgba(0, 0, 0, 0) 50%), -webkit-radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, rgba(0, 0, 0, 0) 50%), -webkit-radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, rgba(0, 0, 0, 0) 50%), -webkit-radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, rgba(0, 0, 0, 0) 50%), -webkit-radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, rgba(0, 0, 0, 0) 50%), -webkit-radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, rgba(0, 0, 0, 0)), -webkit-linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);
  background: radial-gradient(circle farthest-corner at 35% 90%, #fec564, rgba(0, 0, 0, 0) 50%), radial-gradient(circle farthest-corner at 0 140%, #fec564, rgba(0, 0, 0, 0) 50%), radial-gradient(ellipse farthest-corner at 0 -25%, #5258cf, rgba(0, 0, 0, 0) 50%), radial-gradient(ellipse farthest-corner at 20% -50%, #5258cf, rgba(0, 0, 0, 0) 50%), radial-gradient(ellipse farthest-corner at 100% 0, #893dc2, rgba(0, 0, 0, 0) 50%), radial-gradient(ellipse farthest-corner at 60% -20%, #893dc2, rgba(0, 0, 0, 0) 50%), radial-gradient(ellipse farthest-corner at 100% 100%, #d9317a, rgba(0, 0, 0, 0)), linear-gradient(#6559ca, #bc318f 30%, #e33f5f 50%, #f77638 70%, #fec66d 100%);
}

.wrap {
  top: 50%;
  left: 30%;
  width: 400px;
  height: 200px;
  margin-left: -200px;
  margin-top: -100px;
  position: absolute;
}

code {
  color: white;
}

span.blue {
  color: #48beef;
  
}


span.comment {
  color: #7f8c8d;
}

span.load {
  color: #f39c12;
}

.message-box {
  font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  height: 200px;
  width: 380px;
  position: absolute;
  top: 40%;
  left: 50%;
  margin-top: -100px;
  margin-left: 50px;
  color: #FFF;
  font-size: 25px;
  font-weight: 900;
}

.message-box h1 {
  font-size: 100px;
  line-height: 46px;
  margin-bottom: 40px;
  -webkit-animation: float 1s infinite ease-in-out alternate;
          animation: float 1s infinite ease-in-out alternate;
}

.buttons-con .action-link-wrap {
  margin-top: 40px;
}

.buttons-con .action-link-wrap a {
  background: #68c950;
  padding: 8px 25px;
  border-radius: 4px;
  color: #FFF;
  font-weight: bold;
  font-size: 14px;
  -webkit-transition: all 0.3s linear;
  transition: all 0.3s linear;
  cursor: pointer;
  text-decoration: none;
  margin-right: 10px
}

.buttons-con .action-link-wrap a:hover {
  background: #5A5C6C;
  color: #fff;
}



@-webkit-keyframes float {
  100% {
    -webkit-transform: translateY(25px);
            transform: translateY(25px);
  }
}



@keyframes float {
  100% {
    -webkit-transform: translateY(25px);
            transform: translateY(25px);
  }
}

@media (max-width: 850px) {
  .wrap {
    top: 25%;
    left: 50%;
    margin-top: -100px;
    margin-left: -190px;
  }
  .message-box {
    top: 50%;
    left: 50%;
    margin-top: -100px;
    margin-left: -190px;
    text-align: center;
  }
}


.footer {
  font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  padding: 10px 0;
  text-align: center;
  opacity: 1;
  background: black;
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
}

.footera {
  color: #0275d8;
  text-decoration: none;
}

.footer a {
  text-decoration: none;
}

.social {
  display: inline-block;
  width: 25px;
  height: 25px;
  margin: 0 1px;
  line-height: 25px;
  color: #fff;
  font-size: 20px;
  text-align: center;
  border-radius: 10%;
  background: rgba(245, 245, 245, 0.2);
  overflow: hidden;
  -webkit-transition: color .3s;
  transition: color .3s;
}

.social:hover {
  color: #59d;
  cursor: pointer;
  text-decoration: none;
}

.container {
  width: 100%;
  bottom: 5px;
}

.contact-buttons {
  padding-left: 0;
}

.contact-buttons li {
  list-style-type: none;
  list-style: none;
}