1
2// inline confirmation message
3.inline__confirm {
4  position: absolute;
5  top: 0;
6  transform: translateY(-103%);
7  width: 100%;
8  height: 100%;
9  //margin-left: -1.8em;
10  z-index: 5;
11  background: $darkbg__primary;
12  color: $white;
13  padding: 2em 2em 1.55em 2em;
14  overflow: hidden;
15  @include fastTransition-all;
16  &.active {
17    transform: translateY(0);
18    @include fastTransition-all;
19  }
20}
21
22// Power confirmation buttons
23.inline__confirm-buttons {
24  margin-left: 1.8em;
25  .btn-primary {
26    background: transparent;
27    border: 2px solid $white;
28    padding: 1em 2.2em;
29    margin: 0 10px;
30    border-radius: 4px;
31    &:focus,
32    &:hover {
33      background: $primebtn__bg;
34      border: 2px solid $primebtn__bg;
35    }
36  }
37  @media (min-width: 900px) {
38    position: absolute;
39    right: 0;
40    top: 50%;
41    transform: translateY(-50%);
42  }
43}
44
45// confirmation message
46.inline__confirm-message {
47  display: inline-block;
48}
49
50// Power confirmation message icon
51.inline__confirm-message i::before {
52  content: '\26A0';
53  color: $status-warn;
54  display: inline-block;
55  font-size: 2em;
56  vertical-align: middle;
57  font-style: normal;
58  margin-right: 15px;
59}