@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@700&display=swap');
@import url("https://netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css");
*, *:before, *:after {
 margin:0;
 padding:0;
 box-sizing:border-box;
}
html, body {
 height:100%;
}
body {
 -webkit-font-smoothing:antialiased;
 -moz-osx-font-smoothing:grayscale;
}
.btn {
 display:inline-block;
 min-width:80px;
 margin:16px 8px;
 padding:12px 16px 14px;
 background:#8ba43d;
 color:#fff;
 font:700 14px/1 'Open Sans', sans-serif;
 text-shadow:0 1px 0 rgba(255, 255, 255, 0.8);
 -webkit-border-radius:6px;
 -moz-border-radius:6px;
 border-radius:6px;
 -webkit-box-shadow: 1px 2px 3px 0 rgba(0,0,0,0.2);
 -moz-box-shadow: 1px 2px 3px 0 rgba(0,0,0,0.2);
 box-shadow:1px 2px 3px 0 rgba(0,0,0,0.2), inset 0 -6px 12px rgba(0, 0, 0, 0.2);
 text-decoration:none;
 cursor:pointer;
}
.btn:hover { background:#608030; }
.btn.ico {
 position:relative;
 padding-right:42px;
}
.btn.icoi {
 position:relative;
 padding-left:42px;
}
.btn.ico:before, .btn.icoi:before {
 position:absolute;
 top:0;
 display:block;
 width:32px;
 padding:12px 0 14px;
 font-family:fontawesome;
 text-align:center;
 -webkit-border-radius:0 6px 6px 0;
 -moz-border-radius:0 6px 6px 0;
 border-radius:0 6px 6px 0;
 background:rgba(0, 0, 0, 0.16);
}
.btn.ico:before {
 right:0;
}
.btn.icoi:before {
 left:0;
}