1. @import '~realize-common/src/app/components/themes/realize/css/variables.less';
2. @import '../assignmentViewer.common.less';
3.  
4. .av__headerNavbar {
5.     background: @white;
6.     color: @grayDark;
7.     width: 100%;
8.     z-index: 100;
9. }
10.  
11. .av__navbar--inner {
12.     display: flex;
13.     flex-direction: row;
14.     color: @grayDark;
15.     height: 40px;
16. }
17.  
18. .av__exit {
19.     font-family: @baseFontBold;
20.     font-size: @font-size-sm;
21.     padding: 13px 0 0 8px;
22.     white-space: nowrap;
23.     a {
24.         color: @grayDark;
25.         [class^="icon-"],
26.         [class*="icon-"] {
27.             font-size: @font-size-sm;
28.             vertical-align: baseline;
29.         }
30.         &:hover {
31.             color: @blueLight;
32.             text-decoration: none;
33.         }
34.     }
35. }
36.  
37. .av__exitText {
38.     padding-left: 3px;
39. }
40.  
41. .av__save {
42.     font-family: @baseFontBold;
43.     font-size: @font-size-sm;
44.     padding: 7px 0 0 8px;
45.     white-space: nowrap;
46. }
47.  
48. .btn.btn--save {
49.     font-family: @avFontHeavy;
50.     font-size: @font-size-sm;
51.     background: @white;
52.     color: @black;
53.     border-radius: 2px;
54.     border: 1px solid @black;
55.     white-space: nowrap;
56.     height: 26px;
57.     min-width: 52px;
58.     width: auto;
59.     text-shadow: none;
60.     text-align: center;
61.     &:hover {
62.         color: @white;
63.         text-decoration: none;
64.         background-color: @grayDark;
65.         background-image: -webkit-linear-gradient(top, @grayDark 0%, @black 100%);
66.     }
67. }
68.  
69. .av__assignmentTitle {
70.     padding: 13px 0 0 31px;
71.     flex-grow: 1;
72.     font-size: @font-size-sm;
73.     font-family: @avFontMedium;
74.     color: @grayDark;
75.     white-space: nowrap;
76.     overflow: hidden;
77.     text-overflow: ellipsis;
78. }
79.  
80. .av__assignmentDueMessages {
81.     padding: 13px 8px 0 0;
82.     color: @grayDarker;
83.     font-family: @avFontHeavy;
84.     white-space: nowrap;
85.     text-align: right;
86. }
87.  
88. .av__assignmentDueDate {
89.     font-size: @font-size-xs;
90.     display: flex;
91.     flex-direction: row-reverse;
92. }
93.  
94. .av__assignmentPastDueDate {
95.     font-size: @font-size-sm;
96.     color: @red;
97.     font-family: @baseFontBold;
98. }
99.  
100. .av__turnIn {
101.     padding: 5px 8px 5px;
102. }
103.  
104. .av__turnedIn {
105.     padding: 12px 14px 0 0;
106.     font-family: @avFontHeavy;
107.     color: @grayDarker;
108. }
109.  
110. @media only screen and (max-width: @mediumBreakpointMax) {
111.  
112.     .av__exit {
113.         a {
114.             padding: 5px 10px 6px;
115.             [class^="icon-"],
116.             [class*="icon-"] {
117.                 margin: 0;
118.             }
119.         }
120.     }
121. }
122.  
123. @media only screen and (max-width: @smallBreakpointMax) {
124.  
125.     .av__assignmentTitle {
126.         display: none;
127.     }
128.  
129.     .av__exitText {
130.         position: absolute;
131.         overflow: hidden;
132.         width: 0;
133.         height: 0;
134.         left: -1000px;
135.         top: 0;
136.         border: none;
137.         background:none;
138.     }
139.  
140.     .av__assignmentDueMessages {
141.         color: @grayDarker;
142.         font-family: @avFontHeavy;
143.     }
144.  
145.     .av__turnIn {
146.         padding: 5px 8px 5px;
147.         margin-left: 192px;
148.     }
149. }
150.  
151. .btn.btn--turnIn {
152.     font-family: @avFontHeavy;
153.     font-size: @font-size-sm;
154.     background: @black;
155.     color: @white;
156.     border-radius: 2px;
157.     border: 1px solid @black;
158.     white-space: nowrap;
159.     height: 30px;
160.     min-width: 87px;
161.     width: auto;
162.     text-shadow: none;
163.     text-align: center;
164.     &:hover {
165.         color: @white;
166.         text-decoration: none;
167.         background-color: @grayDark;
168.         background-image: -webkit-linear-gradient(top, @grayDark 0%, @black 100%);
169.     }
170. }
171.  
172. .av__studentStatusPanel {
173.     background-color: @white;
174.     white-space: nowrap;
175. }
176.  
177. .av__studentName {
178.     font-size: @font-size-sm;
179.     font-family: @avFontMedium;
180.     height: 16px;
181. }
182.  
183. .av__status--inProgress {
184.     padding-right: 14px;
185.     font-family: @avFontMedium;
186.     font-weight: @assignmentStatusFontWeight;
187.     font-size: @font-size-sm;
188.     color: @inProgressFontColor;
189. }
190.  
191. .av__status--completed {
192.     padding-right: 14px;
193.     font-family: @avFontMedium;
194.     font-weight: @assignmentStatusFontWeight;
195.     font-size: @font-size-sm;
196.     color: @completedFontColor;
197. }
198.  
199. .av__studentStatus {
200.     right: 10px;
201.     top: 25%;
202.     padding-top: 11px;
203.     text-align: right;
204. }
205.  
206. .turnIn__modalSpinner {
207.     align-items: center;
208.     background-color: @black;
209.     display: flex;
210.     height: 100%;
211.     justify-content: center;
212.     opacity: 0.5;
213.     position: absolute;
214.     width: 100%;
215.     z-index: 999;
216.     .icon-spinner {
217.         color: @white;
218.         font-size: 120px;
219.         padding: 0;
220.     }
221. }
222.  
223.  
224.