@charset "UTF-8";
@import url(http://fonts.googleapis.com/css?family=Montserrat);
/* ****************** **
** Flat CSS3 Buttons
** Yunus BAŞŞAHAN
** yunusbassahan.com
** ****************** */
.flat {
  font-family: 'Montserrat';
  text-transform: uppercase;
  border: none;
  text-align: center;
  text-decoration: none;
  outline: none;
  cursor: pointer;
  color: #fafafa;
}
.flat.xs {
  padding: 3px 9px;
  font-size: 13px;
}
.flat.sm {
  padding: 9px 12px;
  font-size: 13px;
}
.flat.md {
  padding: 12px 15px;
  font-size: 13px;
}
.flat.lg {
  padding: 15px 24px;
  font-size: 15px;
}
.flat:active {
  position: relative;
  top: 2px;
}
.flat.grey {
  background-color: #5a5a5a;
  -webkit-box-shadow: 0px 3px 0px #484848;
  -moz-box-shadow: 0px 3px 0px #484848;
  box-shadow: 0px 3px 0px #484848;
}
.flat.grey:active {
  -webkit-box-shadow: 0px 1px 0px #5a5a5a;
  -moz-box-shadow: 0px 1px 0px #5a5a5a;
  box-shadow: 0px 1px 0px #5a5a5a;
}
.flat.grey:hover {
  background-color: #555555;
}
.flat.green {
  background-color: #0aa699;
  -webkit-box-shadow: 0px 3px 0px #08847a;
  -moz-box-shadow: 0px 3px 0px #08847a;
  box-shadow: 0px 3px 0px #08847a;
}
.flat.green:active {
  -webkit-box-shadow: 0px 1px 0px #0aa699;
  -moz-box-shadow: 0px 1px 0px #0aa699;
  box-shadow: 0px 1px 0px #0aa699;
}
.flat.green:hover {
  background-color: #099d91;
}
.flat.purple {
  background-color: #6a598d;
  -webkit-box-shadow: 0px 3px 0px #544770;
  -moz-box-shadow: 0px 3px 0px #544770;
  box-shadow: 0px 3px 0px #544770;
}
.flat.purple:active {
  -webkit-box-shadow: 0px 1px 0px #6a598d;
  -moz-box-shadow: 0px 1px 0px #6a598d;
  box-shadow: 0px 1px 0px #6a598d;
}
.flat.purple:hover {
  background-color: #645485;
}
.flat.navy-blue {
  background-color: #22262e;
  -webkit-box-shadow: 0px 3px 0px #1b1e24;
  -moz-box-shadow: 0px 3px 0px #1b1e24;
  box-shadow: 0px 3px 0px #1b1e24;
}
.flat.navy-blue:active {
  -webkit-box-shadow: 0px 1px 0px #22262e;
  -moz-box-shadow: 0px 1px 0px #22262e;
  box-shadow: 0px 1px 0px #22262e;
}
.flat.navy-blue:hover {
  background-color: #20242b;
}
.flat.pink {
  background-color: #9BC567;
  -webkit-box-shadow: 0px 3px 0px #000;
  -moz-box-shadow: 0px 3px 0px #000;
  box-shadow: 0px 3px 0px #B4E775;
}
.flat.pink:active {
  -webkit-box-shadow: 0px 1px 0px #f35958;
  -moz-box-shadow: 0px 1px 0px #f35958;
  box-shadow: 0px 1px 0px #f35958;
}
.flat.pink:hover {
  background-color:9BC567;
}
.flat.blue {
  background-color: #0090d9;
  -webkit-box-shadow: 0px 3px 0px #0073ad;
  -moz-box-shadow: 0px 3px 0px #0073ad;
  box-shadow: 0px 3px 0px #0073ad;
}
.flat.blue:active {
  -webkit-box-shadow: 0px 1px 0px #0090d9;
  -moz-box-shadow: 0px 1px 0px #0090d9;
  box-shadow: 0px 1px 0px #0090d9;
}
.flat.blue:hover {
  background-color: #0088ce;
}
.flat.yellow {
  background-color: #fdd01c;
  -webkit-box-shadow: 0px 3px 0px #caa616;
  -moz-box-shadow: 0px 3px 0px #caa616;
  box-shadow: 0px 3px 0px #caa616;
}
.flat.yellow:active {
  -webkit-box-shadow: 0px 1px 0px #fdd01c;
  -moz-box-shadow: 0px 1px 0px #fdd01c;
  box-shadow: 0px 1px 0px #fdd01c;
}
.flat.yellow:hover {
  background-color: #f0c51a;
}