@charset "UTF-8";
/* CSS Document */
*{ margin: 0; padding:0;}
img{ width:100%; height: auto; border:0;}
a{ border:0; text-decoration:none;}
a:hover{ text-decoration:none; border:0;}
::selection {background:rgba(0,0,0,0.6);}
::-moz-selection {background:rgba(0,0,0,0.6);}
body {margin:0; font-family: 'Lato', sans-serif; -webkit-text-size-adjust:none; font-weight:400; color:#FFFFFF; background-image: url("../images/bg.jpg"); background-repeat: no-repeat; background-position: center top; background-size: cover; background-attachment: fixed; height: 100%; width: 100%;}
#cont{ max-width:700px; display:block; margin:5% auto; text-align:center; width:85%; height: auto; padding:3%; box-sizing: border-box;}
img#logo{ width:100%; max-width: 330px; margin:5% auto; display:block;}
a.cta{border-radius: 25px;text-align: center; background-color: #66bfff; padding: 10px 18px; color: #FFFFFF; font-weight: 900;}

/* 404 page */
h1{ color:#FFFFFF; font-family: 'Lato', sans-serif; font-size: 24px; padding-top: 6px; text-transform: uppercase; padding: 20px 0px;}

.oops{color:#E7ECF4; font-family: 'Lato', sans-serif; font-weight: 900; font-size: 44px; padding: 0  0 15px 0 ; letter-spacing: -2px; }
.oops span {
  position: relative;
  top:10px;
  margin: 0px !important; padding: 0px !important; display:block;letter-spacing: -2px;
  display: inline-block;
  -webkit-animation: bla 0.6s ease 2 alternate;
          animation: bla 0.6s ease 2 alternate;
}

.oops span:nth-child(2) {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s;
}
.oops span:nth-child(3) {
  -webkit-animation-delay: 0.2s;
          animation-delay: 0.2s;
}
.oops span:nth-child(4) {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s;
}
.oops span:nth-child(5) {
  -webkit-animation-delay: 0.4s;
          animation-delay: 0.4s;
}
.oops span:nth-child(6) {
  -webkit-animation-delay: 0.5s;
          animation-delay: 0.5s;
}
.oops span:nth-child(7) {
  -webkit-animation-delay: 0.6s;
          animation-delay: 0.6s;
}

@-webkit-keyframes bla {
 50% {
    top: -10px;
  }
    
  0%, 100% {
    top: 10px;
  }    
}

@keyframes bla {
 50% {
    top: -10px;
    rgba(0, 0, 0, 0.2);
  }
    
  0%, 100% {
    top: 10px;
    rgba(0, 0, 0, 0.2);
  } 
}

@media screen and (max-width: 700px){ h1{ font-size: 20px;} .oops{ font-size:30px;}}
@media screen and (max-width: 600px){ h1{ font-size: 18px; } .oops{ padding-top:0px;} h3 {font-size:15px; }}

/* 404 page end */


/* Shrink */
.shrink {
  display: inline-block;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;}

.shrink:hover,
.shrink:focus,
.shrink:active {
  -webkit-transform: scale(0.95);
  transform: scale(0.95);}