@font-face {
    font-family: 'Ubuntu';
    font-weight: normal;
    font-style: normal;

}

/*body {
  background: #ddd;
    width: 100%;
  margin: 70px;
}*/

button {
  /*width:100px;
  height:100px;*/
  display:inline-block;
  position:absolute;
  font-family:Arial, "Helvetica", sans-serif;
  font-size:16px;
  font-weight:bold;
  color:#fff;
  text-decoration:none;
  text-transform:uppercase;
  text-align:center;
  text-shadow:1px 1px 0px #07624e;
  /*padding-top:0.3em;*/
  margin: 0.1em;
  margin-left: 0.5em;
  margin-bottom: 0.5em;
  margin-top: 0.5em;
  /*float: left;
  left:30px;
  position:relative;*/
  cursor:pointer;
  width: 2em;
  height: 2em;
  border: 1px;
  border-radius: 0.2em;
  background: #b99468;
  background-image: url("data:image/jpeg;base64, /9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAAgICAgJCAkKCgkNDgwODRMREBARExwUFhQWFBwrGx8bGx8bKyYuJSMlLiZENS8vNUROQj5CTl9VVV93cXecnNEBCAgICAkICQoKCQ0ODA4NExEQEBETHBQWFBYUHCsbHxsbHxsrJi4lIyUuJkQ1Ly81RE5CPkJOX1VVX3dxd5yc0f/CABEIAGAAgAMBIgACEQEDEQH/xAAZAAEBAQEBAQAAAAAAAAAAAAACAQADBAb/2gAIAQEAAAAA+x6ZWUDSUDj3de15jryu5jn6c3juZ6CnnB0vR0PkUcRB6NVRZiaTNc3gzYOgAtVUjNA6gnaq7MLllCZbVtdBqTjbXtcZpJhqks+c2OJOTVt5a4mE/wD/xAAWAQEBAQAAAAAAAAAAAAAAAAAAAQX/2gAIAQIQAAAAyAllQRUAJFWSC2SC/wD/xAAXAQEBAQEAAAAAAAAAAAAAAAABAAIE/9oACAEDEAAAAO9ZipmolqiWoF0TnLpSP//EACIQAAIDAAICAwEBAQAAAAAAAAABAhEhEDESQSJRcTJhgf/aAAgBAQABPwCEhyJPEJ/JE3af4J6eT8hyqY2J4xz7+6HKkvyhE3pY3n/SKkh3g/Qno3rExPSUvlX+Cdtniq7M8h+hsk9XDPNNl6hvRdvhPWJ6x/0LCxMskyTLG9HFpiuxvRS0bxiffD/oimpPce/g2WOVDl0N4yxvTz8tZejeiejeEX2OXxJPUWSbStH0SJC6YukNahPC22i+xPRsiej2kWTeCfDE9E8G+hdcXon8iTF0WX8iybIyu/0bL09kRssvUXonrJCecLssk9FSQ3heH2JjfF6i9E9JMR5YIvS9LxkniJOkN8XiEy+i9F2SI9sreLL4b1EtiytG9Gxce0J6yXRHseFnvl98NlkmJiZeoXfCxk5I7LrstcXw2N9Emf/EABsRAAIDAAMAAAAAAAAAAAAAAAARARAwICFB/9oACAECAQE/AHux5ejH0RUZzT4f/8QAGxEAAgIDAQAAAAAAAAAAAAAAARAAESAwMUH/2gAIAQMBAT8ApiFDAQKnSHNHkAg7CjpCCpmf/9k=");
  box-shadow: inset 0px 1px 0px #b08460, 0px 5px 0px 0px #a99078, 0px 10px 5px #666;
}

button:active {
  /*top:3px;*/
  box-shadow: inset 0px 1px 0px #a58057, 0px 2px 0px 0px #a28370, 0px 5px 3px #555;
}

button:before {
  /*font-family: 'socialfont';
  font-size: 50px;*/
  line-height: 1em;
  font-weight: normal;
  color: #fff;
  /*width:85px;
  height:90px;*/
  display:block;
  padding-bottom:10px;
  /*top:10px;*/
  text-shadow: 1px 1px 2px #07526e;

}

button:active:before {
  top: 7px;
  /*font-size: 50px;*/
  text-shadow: 0px 3px 0px #07526e, 0px 5px 1px #07526e;/*, 3px 0px 1px #07526e, 3px 3px 1px #07526e,
     -2px 0px 1px #68cff2*/;
}

.vimeo:before{
  content:"\F024";
 
}