@charset "UTF-8";
/*!
*	TRACK Version 1.0
*	Author: Sören Schumann
*	Copyright protectet Software
*/
* {
  font-size: 100%;
  margin: 0;
  padding: 0; }

html {
  margin-top: 0px !important; }

* html body {
  margin-top: 0px !important; }

a img, a, img {
  border: none;
  margin: 0;
  padding: 0; }

body {
  font: 100%/1.5 serif;
  /* 16px */
  font-family: 'Roboto',Tahoma, Verdana, Arial, sans-serif;
  background: #f2f2f2;
  color: #333; }

.wrapper {
  width: 340px;
  margin: 0 auto;
  text-align: center;
  overflow: hidden; }

img {
  max-width: 280px;
  margin-top: 30px; 
  font-size: 2em;
  line-height: 3em;
}

/* HELPERS */
.box {
  padding: 30px 30px 15px;
  background: #fff; }
  .box.shadow {
    margin: 60px 5px;
    // border-radius: 5px;
  }

.btn {
  width: 100%;
  padding: 5px 2em 3px;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  color: #fff;
  border: 0;
  border-top: 1px solid #00a8f0;
  border-bottom: 3px solid #007db3;
  border-radius: 2px;
  font-size: 1em !important; 
  box-sizing: border-box;
  background: #008BC5;
  display: inline-block; }

.error{
  margin: 20px 5px;
  padding: 1em;
  text-align: left;
  border-left: 5px solid #cc0000;
  background: white;
  display: block;
    -webkit-box-shadow: 0 3px 3px #bbb;
    -moz-box-shadow: 0 3px 3px #bbb;
    -ms-box-shadow: 0 3px 3px #bbb;
    -o-box-shadow: 0 3px 3px #bbb;
    box-shadow: 0 3px 3px #bbb; 
}

.message{
  margin: 20px 5px;
  padding: 1em;
  text-align: left;
  border-left: 5px solid #009933;
  background: white;
  display: block;
    -webkit-box-shadow: 0 3px 3px #bbb;
    -moz-box-shadow: 0 3px 3px #bbb;
    -ms-box-shadow: 0 3px 3px #bbb;
    -o-box-shadow: 0 3px 3px #bbb;
    box-shadow: 0 3px 3px #bbb; 
}


/* FORMS */
input,
select {
  width: 100%;
  margin-bottom: 1em;
  // margin-right: .5em;
  padding: 5px 10px;
  border: 0;
  border-radius: 2px;
  background: #f3f3f3;
  background: #f1f1f1;
  font-size: 1em; 
  box-sizing: border-box;
  -webkit-transition: all .5s ease-in-out 0s;
     -moz-transition: all .5s ease-in-out 0s;
      -ms-transition: all .5s ease-in-out 0s;
       -o-transition: all .5s ease-in-out 0s;
          transition: all .5s ease-in-out 0s;
}

input[type=text]:focus,
input[type=password]:focus,
textarea:focus{
  background: #e5e5e5;
  background: #f8f8f8;
  -webkit-box-shadow: inset 1px 1px 2px #bbb;
     -moz-box-shadow: inset 1px 1px 2px #bbb;
      -ms-box-shadow: inset 1px 1px 2px #bbb;
       -o-box-shadow: inset 1px 1px 2px #bbb;
            box-shadow: inset 1px 1px 2px #bbb;
}




@media only screen and (max-width : 580px) {
  .wrapper{
    width: 100%;
  }
}