1//Fixed alerts
2
3.alert__error,
4.alert__warning,
5.alert__message {
6  color: $darkbg__primary;
7  padding: 1em;
8  margin: .5em 0;
9  position: relative;
10  display: flex;
11  justify-content: center;
12  flex-direction: column;
13  .close {
14    color: $lightbg__primary;
15    position: absolute;
16    right: 0;
17    top: 50%;
18    transform: translateY(-50%);
19    font-size: 1.5em;
20    padding: 1em;
21    box-sizing: border-box;
22    line-height: 0;
23    display: flex;
24    justify-content: center;
25    flex-direction: column;
26    background: transparent;
27    border: 0;
28    margin: 0;
29    &:hover {
30      color: $lightbg__accent;
31    }
32  }
33}
34
35.alert__error {
36  background: $alert__error;
37
38}
39
40.alert__warning {
41  background: $alert__warning;
42
43}
44.alert__message {
45  background: $alert__message;
46}
47
48// Power confirmation buttons
49.power__confirm-buttons {
50  .btn-primary {
51    background: transparent;
52    border: 2px solid $white;
53    padding: 1em 2.2em;
54    margin: 0 10px;
55    border-radius: 4px;
56    &:focus,
57    &:hover {
58      background: $primebtn__bg;
59      border: 2px solid $primebtn__bg;
60    }
61  }
62  @include mediaQuery(large) {
63    float: right;
64  }
65}
66
67
68