1.modal-overlay {
2  width: 100%;
3  height: 100%;
4  z-index: -1;
5  background-color: $primary-dark;
6  position: fixed;
7  top: 0;
8  left: 0;
9  margin: 0;
10  padding: 0;
11  opacity: 0;
12}
13
14.modal-overlay.active{
15  z-index: 100;
16  opacity: .5;
17  display: block;
18  @include fastTransition-all;
19}
20
21.modal:not(.uib-modal) {
22  width: auto;
23  height: auto;
24  left: 50%;
25  top: 50%;
26  transform: translate(-50%,-50%);
27  max-width: 850px;
28  min-width: 450px;
29  padding: .8em 1.5em;
30  border: thin $primary-dark solid;
31  background-color :$background-01;
32  z-index: 101;
33  position: fixed;
34  overflow: hidden;
35  @include fastTransition-all;
36  @include mediaQuery(medium) {
37    padding: 2.5em;
38  }
39}
40
41.modal.active{
42  @include fastTransition-all;
43  display: block;
44}
45
46.modal .page-header {
47  padding-bottom: .7em;
48}
49
50.screen-reader-offscreen {
51  position: absolute;
52  left: -999px;
53  width: 1px;
54  height: 1px;
55  top: auto;
56}
57.modal__content {
58  border-bottom: 1px solid $border-color-02;
59  padding-bottom: 1em;
60  margin-bottom: 2em;
61}
62.modal__link {
63  display: block;
64  margin: .8em 0 1em;
65  @include mediaQuery(medium) {
66    display: inline-block;
67    margin: .6em 0;
68  }
69}
70.modal__button-wrapper {
71  float: right;
72  button {
73    margin-bottom: .8em;
74    margin-right: .8em;
75    display: inline-block;
76    @include mediaQuery(medium) {
77      margin-left: .8em;
78      margin-right: 0;
79    }
80  }
81}
82
83.uib-modal.fade.in {
84  opacity: 1;
85}
86.uib-modal.in .modal-dialog {
87  transform: translate(0, 10vh);
88  margin-top: 50px;
89  .icon__close {
90    margin: 0;
91    padding: 0;
92  }
93  .modal-content {
94    border-radius: 0;
95    border-color: $primary-dark;
96  }
97}
98
99.modal-backdrop.in {
100  opacity: 0.5;
101}
102.uib-modal__content {
103  padding: 1em;
104}
105