1 aside, header, #nav-events-link, #nav-search-box, #nav-admin-link, #activitiy-by-date-tab, #shared-links-tab,
7 width: calc(100% - 105px);
11 box-sizing: border-box;
18 body, section, nav .nav-menu, div.pager, ul.tabs {
22 .wall-item-container .wall-item-ago, .wall-item-network,.type-link blockquote, .type-video blockquote {
30 .wall-item-container .wall-item-content {
33 text-overflow: ellipsis;
34 /* margin-left: -70px;
43 .wall-item-container .wall-item-content img,
44 .children .wall-item-container .wall-item-item .wall-item-content img,
45 .wall-item-container .wall-item-content .type-link img.attachment-image, .type-link img.attachment-image, .type-video img.attachment-image {
49 @media screen and (max-width: 800px) {
50 .wall-item-container .wall-item-content img,
51 .children .wall-item-container .wall-item-item .wall-item-content img,
52 .wall-item-container .wall-item-content .type-link img.attachment-image, .type-link img.attachment-image, .type-video img.attachment-image {
57 @media screen and (max-width: 600px) {
58 .wall-item-container .wall-item-content img,
59 .children .wall-item-container .wall-item-item .wall-item-content img,
60 .wall-item-container .wall-item-content .type-link img.attachment-image, .type-link img.attachment-image, .type-video img.attachment-image {
63 a.desktop-view { display: none; }
64 a.mobile-view { display: initial; }
65 #nav-apps-link { display: none; }
67 .wall-item-container .wall-item-info { width: auto; }
68 .contact-photo-wrapper { width: 55px; }
71 .type-link > a { height: 120px; width: 100%; overflow: hidden; display: block; }
72 .type-link > a > img { display: block; max-width: 100%!important; width: 100% !important; height: 100% !important; object-fit: cover !important; }
84 width: 100% !important;
85 height: 100% !important;
86 max-width: 100% !important;
87 object-fit: cover !important;
90 background-image: none !important; background-color: transparent !important;
91 width: 100% !important; height: 110px !important;
94 #login-extra-links, #login-form {
103 @media screen and (max-width: 480px) {
104 .wall-item-container .wall-item-content img,
105 .wall-item-container .wall-item-content .type-link img.attachment-image, .type-link img.attachment-image, .type-video img.attachment-image {
108 /* fix img width in threaded view - maybe there exists a better possibility to do this
109 maybe this needs also to be done for tablet view*/
110 .children .wall-item-container .wall-item-item .wall-item-content img {
113 iframe.embed_rich { width: 100% !important }
114 /* TODO: check if this is needed.
115 * oembedded iframe usually have "width" and "height" as attributes
116 * that override this rule */
122 /* the top-nav notfication menu */
123 nav #nav-notifications-linkmenu .menu-popup {
137 .wall-item-container.thread_level_2,
138 .wall-item-container.thread_level_3,
139 .wall-item-container.thread_level_4,
140 .wall-item-container.thread_level_5,
141 .wall-item-container.thread_level_6,
142 .wall-item-container.thread_level_7 {
144 width: calc(100% - 10px);
147 .wall-item-container.thread_level_2 .wall-item-content,
148 .wall-item-container.thread_level_3 .wall-item-content,
149 .wall-item-container.thread_level_4 .wall-item-content,
150 .wall-item-container.thread_level_5 .wall-item-content,
151 .wall-item-container.thread_level_6 .wall-item-content,
152 .wall-item-container.thread_level_7 .wall-item-content {
157 .mobile-aside-toggle {
158 display: block !important;
160 .mobile-aside-toggle a {
164 .mobile-aside-toggle a i {
175 -webkit-transition: left 0.5s;
176 -moz-transition: left 0.5s;
177 -o-transition: left 0.5s;
178 transition: left 0.5s;
186 .tabs { position: relative; height: 25px!important; }
187 .tabs li { width: 100%; }
188 .tabs .tab { display: none;}
189 .tabs .tab.active { display: block; }
191 font-family: FontAwesome;
196 left: 0; right:0; top: 0; bottom: 0;
197 padding: 8px 2px 0 0;
207 height: auto !important;
208 border: 1px solid #ccc;
210 .tabs.show::after { display: none; }
211 .tabs.show .tab { display: block; }
221 #profile-jot-submit-wrapper > div {
224 #profile-jot-submit-wrapper > div#profile-jot-perms { margin: 0; }
227 #profile-jot-acl-wrapper, #profile-jot-acl-wrapper * { box-sizing: border-box; }
228 #acl-wrapper { width: 100%; float: none; }
229 #acl-search { width: 100%; float: none; padding-right: 0px; margin-bottom: 1em; }
230 #acl-showall { width: 100%; height: 48px; margin-bottom: 1em; }
231 .acl-list-item { width: auto; float: none; height: auto; overflow: hidden; position: relative;}
232 .acl-list-item img { width: 48px; height: 48px; }
233 .acl-list-item p { height: auto; font-size: inherit; }
240 padding: 10px 2px 2px 2px;
244 background-position: center 5px;
246 .acl-list-item a.acl-button-hide { right: 25%; }
247 /* flexbox for ACL window */
249 #cboxLoadedContent > div,
251 display: -ms-Flexbox !important;
252 -ms-box-orient: vertival;
254 display: -webkit-flex !important;
255 display: -moz-flex !important;
256 display: -ms-flex !important;
257 display: flex !important;
259 -webkit-flex-flow: column;
260 -moz-flex-flow: column;
261 -ms-flex-flow: column;
264 -webkit-flex: 1 100%;
270 -webkit-flex: 1 1 auto;
276 /** input elements **/
281 border: 1px solid #888;
287 box-shadow: 1px 1px 10px rgba(46, 151, 255, 0.62);
290 .field, .field > * { box-sizing: border-box; }
291 .field label { width: 100%; float: none; display: block; }
292 .field input, .field textarea, .field select { max-width: 100%; width: 100%; }
294 .field.checkbox input { width: auto; float: right; }
296 .field.checkbox label { width: 70%; float: left; }
297 .field .field_help { margin: 0; }
300 .event-start, .event-end { width: auto; }
301 .event-start .dtstart, .event-end .dtend { float: none; display: block; }