1button,
2.button,
3.submit {
4  font-size: 1em;
5  @include fontFamilyBold;
6  text-transform: none;
7  border-radius: 3px;
8  padding: 0.5rem 2rem 0.5rem;
9  height: auto;
10  border: 0;
11  overflow: hidden;
12  &:hover {
13    cursor: pointer;
14  }
15  &.disabled {
16    pointer-events: none;
17    color: $btn__disabled-txt;
18    background-color: $btn__disabled-bg;
19    border-color: $btn__disabled-bg;
20    border-style: solid;
21    border-width: 2px;
22    &:hover {
23      cursor: default;
24      background: transparent;
25      text-decoration: none;
26    }
27  }
28}
29
30.btn-primary {
31  color: $primebtn__text;
32  background: $primebtn__bg;
33  min-height: 40px;
34  &:hover {
35    background: lighten($primebtn__bg, 8%);
36    @include fastTransition-all;
37  }
38  &.disabled {
39    background: $primebtn__disabled-bg;
40    color: $primebtn__disabled-txt;
41    @include fastTransition-all;
42    &:hover {
43      cursor: default;
44    }
45  }
46  i {
47    //button symbol
48    font-style: normal;
49    text-transform: none;
50    font-size: 1.5em;
51    transform: rotate(80deg);
52    display: inline-block;
53  }
54  img {
55    width: 18px;
56    height: 18px;
57    display: inline-block;
58  }
59}
60.btn-secondary {
61  color: $secbtn__text;
62  background: transparent;
63  border: 2px solid $secbtn__border;
64  min-height: 40px;
65  &:hover {
66    color: $secbtn__text;
67    cursor: pointer;
68    background: $secbtn__bg;
69    @include fastTransition-all;
70  }
71  &.disabled {
72    pointer-events: none;
73    color: $btn__disabled-txt;
74    background-color: $btn__disabled-bg;
75    border-color: $btn__disabled-bg;
76    border-style: solid;
77    border-width: 2px;
78    &:hover {
79      background: $btn__disabled-bg;
80    }
81  }
82  i {
83    // button symbol
84    font-style: normal;
85    font-weight: 400;
86    text-transform: none;
87    font-size: 1.5em;
88    transform: rotate(80deg) translate(-2px);
89    display: inline-block;
90    vertical-align: middle;
91  }
92  img {
93    width: 18px;
94    height: 18px;
95    display: inline-block;
96    margin-right: 0.5em;
97    margin-top: -3px;
98  }
99}
100
101.btn-pop-out {
102  position: relative;
103  padding: 0 0 1em 2em;
104  color: $black;
105  &:hover {
106    text-decoration: underline;
107  }
108  &:before {
109    content: "";
110    position: absolute;
111    left: 0;
112    top: 0px;
113    width: 25px;
114    height: 20px;
115    display: inline-block;
116    border: 1px solid $black;
117    border-top: 4px solid $black;
118  }
119  &:after {
120    content: "\2794";
121    position: absolute;
122    transform: rotate(-45deg);
123    font-size: 0.9em;
124    font-weight: 700;
125    vertical-align: middle;
126    display: inline-block;
127    left: 11px;
128    top: 0px;
129  }
130}
131