PluginProbe
AWSM Team – Team Showcase Plugin / 1.1
AWSM Team – Team Showcase Plugin v1.1
trunk 1.0 1.1 1.1.2 1.2.1 1.3.0 1.3.1 1.3.2 1.3.3 1.3.4
awsm-team / css / team.css

team.css in AWSM Team – Team Showcase Plugin 1.1, at css/team.css

1,302 lines 25.5 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 .awsm-grid-wrapper,
2 .awsm-grid-wrapper *,
3 .awsm-grid-wrapper::before,
4 .awsm-grid-wrapper::after {
5 -moz-box-sizing: border-box;
6 -webkit-box-sizing: border-box;
7 box-sizing: border-box;
8 }
9
10 .awsm-grid-wrapper figcaption,
11 .awsm-grid-wrapper figure {
12 display: block;
13 }
14
15 .awsm-grid-wrapper figure {
16 margin: 0;
17 -webkit-margin-before: 0;
18 -webkit-margin-after: 0;
19 -webkit-margin-start: 0;
20 -webkit-margin-end: 0;
21 }
22
23 html.awsm-popup-on{
24 height: 100%;
25 overflow: hidden;
26 }
27
28 .awsm-personal-info,
29 .awsm-contact-info,
30 .awsm-flip-front,
31 .awsm-flip-back-inner {
32 display: block;
33 }
34
35 .awsm-grid-wrapper a {
36 color: #aaa;
37 text-decoration: none;
38 }
39
40 .awsm-grid-wrapper a:hover,
41 .awsm-grid-wrapper a:active {
42 color: #333;
43 }
44
45 .grid-style,
46 .circles-style {
47 line-height: 1.2;
48 }
49
50 .clearfix::after,
51 .awsm-grid::after {
52 content: "";
53 clear: both;
54 display: block;
55 }
56
57 .awsm-grid-wrapper .awsm-grid {
58 list-style: none;
59 padding: 30px 0;
60 margin: 0 -15px;
61 }
62
63 .awsm-grid-wrapper .awsm-grid.drawer-style {
64 margin: 0;
65 }
66
67 .awsm-grid-wrapper .awsm-grid > .awsm-grid-card {
68 float: left;
69 width: 25%;
70 padding: 0 15px;
71 margin: 0 0 30px;
72 clear: none;
73 }
74
75 .awsm-grid-wrapper .grid-2-col > .awsm-grid-card {
76 width: 50%;
77 }
78
79 .awsm-grid-wrapper .grid-3-col > .awsm-grid-card {
80 width: 33.33%;
81 }
82
83 .awsm-grid-wrapper .grid-4-col > .awsm-grid-card {
84 width: 25%;
85 }
86
87 .awsm-grid-wrapper .grid-5-col > .awsm-grid-card {
88 width: 20%;
89 }
90
91 figure {
92 overflow: hidden;
93 }
94
95 .awsm-grid-wrapper a {
96 text-decoration: none;
97 box-shadow: none;
98 border-bottom: 0;
99 outline: none;
100 }
101
102 .awsm-grid-wrapper p {
103 line-height: 1.4;
104 }
105
106 .awsm-grid figure {
107 position: relative;
108 margin: 0;
109 }
110
111 .awsm-grid figure img {
112 width: 100%;
113 display: block;
114 position: relative;
115 margin: 0;
116 border: none;
117 }
118
119 .awsm-grid-wrapper .awsm-grid h3 {
120 margin: 0 0 3px;
121 padding: 0;
122 font-size: 1.17em;
123 line-height: 1.4;
124 color: #1f1f1f;
125 }
126
127 .awsm-grid-wrapper ul {
128 list-style: none;
129 line-height: normal;
130 }
131
132 .awsm-grid-wrapper .awsm-social-icons {
133 padding: 0;
134 margin: 0 -5px;
135 }
136
137 .awsm-social-icons span {
138 display: inline-block;
139 padding: 0 5px;
140 margin-bottom: 2px;
141 }
142
143 .awsm-social-icons a {
144 display: block;
145 -webkit-transition: -webkit-transform 0.3s;
146 -moz-transition: -moz-transform 0.3s;
147 transition: transform 0.3s;
148 line-height: 1;
149 }
150
151 .awsm-social-icons a:hover {
152 -moz-transform: translateY(-4px);
153 -webkit-transform: translateY(-4px);
154 transform: translateY(-4px);
155 }
156
157 .awsm-grid-wrapper .awsm-contact-details {
158 margin-bottom: 20px;
159 }
160
161 .awsm-contact-details > p {
162 padding: 10px 0;
163 margin: 0 !important;
164 border-bottom: 1px dotted rgba(35, 35, 35, 0.2);
165 }
166
167 .awsm-contact-details span {
168 min-width: 100px;
169 margin-right: 6px;
170 }
171
172 figcaption p {
173 font-size: 14px;
174 }
175
176 figure figcaption a,
177 .awsm-popup-details a,
178 .awsm-popup-items a,
179 .drawer-style a {
180 box-shadow: none;
181 border-bottom: 0;
182 }
183
184 .awsm-grid-nav {
185 display: none !important;
186 }
187
188 .awsm-content-scrollbar {
189 padding-right: 30px;
190 }
191
192 .awsm-personal-details {
193 max-height: 293px;
194 overflow: hidden;
195 }
196
197 .awsm-personal-info {
198 position: relative;
199 margin-bottom: 15px;
200 }
201
202 .awsm-personal-info span {
203 text-transform: uppercase;
204 font-size: 0.815em;
205 line-height: 1.4;
206 display: block;
207 }
208
209 .awsm-contact-info p {
210 margin: 0 0 15px;
211 line-height: normal;
212 color: #1f1f1f;
213 }
214
215 .awsm-coming-soon {
216 text-align: center;
217 color: #333;
218 }
219
220 .awsm-grid-wrapper a.awsm-nav-item,
221 .awsm-grid-wrapper a.awsm-modal-close,
222 .awsm-grid-wrapper .awsm-contact-details a,
223 .awsm-grid-wrapper .awsm-social-icons a {
224 text-decoration: none;
225 border: none;
226 }
227
228 @media (max-width:1230px) {
229 .awsm-grid-wrapper .grid-5-col > .awsm-grid-card {
230 width: 25%;
231 }
232
233 }
234
235 @media (max-width:1024px) {
236 .awsm-grid-wrapper .awsm-grid > .awsm-grid-card {
237 width: 33.333%;
238 }
239
240 .awsm-grid-wrapper .grid-2-col > .awsm-grid-card {
241 width: 50%;
242 }
243
244 }
245
246 @media (max-width:992px) {
247 .awsm-grid-wrapper .awsm-grid > .awsm-grid-card {
248 width: 50%;
249 }
250
251 }
252
253 @media (max-width:830px) {
254 .awsm-popup-on body {
255 overflow: auto;
256 }
257
258 }
259
260 @media (max-width:678px) {
261 .awsm-grid-wrapper .awsm-grid > .awsm-grid-card {
262 width: 100%;
263 }
264
265 }
266 @font-face {
267 font-family: 'icomoon';
268 src: url('fonts/icomoon.eot');
269 src: url('fonts/icomoon.eot') format('embedded-opentype'), url('fonts/icomoon.ttf') format('truetype'), url('fonts/icomoon.woff') format('woff'), url('fonts/icomoon.svg') format('svg');
270 font-weight: normal;
271 font-style: normal;
272 }
273
274 [class^="awsm-icon-"],
275 [class*=" awsm-icon-"] {
276
277 /* use !important to prevent issues with browser extensions that change fonts */
278 font-family: 'icomoon' !important;
279 speak: none;
280 font-style: normal;
281 font-weight: normal;
282 font-variant: normal;
283 text-transform: none;
284 line-height: 1; /* Better Font Rendering =========== */
285 -webkit-font-smoothing: antialiased;
286 -moz-osx-font-smoothing: grayscale;
287 }
288
289 .awsm-icon-yelp:before {
290 content: "\e900";
291 }
292 .awsm-icon-flattr:before {
293 content: "\e902";
294 }
295 .awsm-icon-xing:before {
296 content: "\e903";
297 }
298 .awsm-icon-xing2:before {
299 content: "\e904";
300 }
301 .awsm-icon-stumbleupon:before {
302 content: "\e905";
303 }
304 .awsm-icon-stumbleupon2:before {
305 content: "\e906";
306 }
307 .awsm-icon-delicious:before {
308 content: "\e907";
309 }
310 .awsm-icon-lastfm:before {
311 content: "\e908";
312 }
313 .awsm-icon-lastfm2:before {
314 content: "\e909";
315 }
316 .awsm-icon-hackernews:before {
317 content: "\e90a";
318 }
319 .awsm-icon-reddit:before {
320 content: "\e90b";
321 }
322 .awsm-icon-soundcloud:before {
323 content: "\e90c";
324 }
325 .awsm-icon-soundcloud2:before {
326 content: "\e90d";
327 }
328 .awsm-icon-yahoo:before {
329 content: "\e90e";
330 }
331 .awsm-icon-blogger2:before {
332 content: "\e90f";
333 }
334 .awsm-icon-ello:before {
335 content: "\e910";
336 }
337 .awsm-icon-wordpress2:before {
338 content: "\e911";
339 }
340 .awsm-icon-steam:before {
341 content: "\e912";
342 }
343 .awsm-icon-steam2:before {
344 content: "\e913";
345 }
346 .awsm-icon-500px:before {
347 content: "\e914";
348 }
349 .awsm-icon-deviantart:before {
350 content: "\e915";
351 }
352 .awsm-icon-twitch:before {
353 content: "\e916";
354 }
355 .awsm-icon-feed:before {
356 content: "\e917";
357 }
358 .awsm-icon-feed2:before {
359 content: "\e918";
360 }
361 .awsm-icon-sina-weibo:before {
362 content: "\e919";
363 }
364 .awsm-icon-renren:before {
365 content: "\e91a";
366 }
367 .awsm-icon-vk:before {
368 content: "\e91b";
369 }
370 .awsm-icon-vine:before {
371 content: "\e91c";
372 }
373 .awsm-icon-telegram:before {
374 content: "\e91d";
375 }
376 .awsm-icon-spotify:before {
377 content: "\e91e";
378 }
379 .awsm-icon-mail2:before {
380 content: "\e91f";
381 }
382 .awsm-icon-mail3:before {
383 content: "\e920";
384 }
385 .awsm-icon-arrow-down:before {
386 content: "\e60f";
387 }
388 .awsm-icon-arrow-left:before {
389 content: "\e610";
390 }
391 .awsm-icon-arrow-right:before {
392 content: "\e611";
393 }
394 .awsm-icon-close:before {
395 content: "\e612";
396 }
397 .awsm-icon-github:before {
398 content: "\e901";
399 }
400 .awsm-icon-mail:before {
401 content: "\e945";
402 }
403 .awsm-icon-link:before {
404 content: "\e9cb";
405 }
406 .awsm-icon-google-plus:before {
407 content: "\ea8b";
408 }
409 .awsm-icon-google-plus2:before {
410 content: "\ea8c";
411 }
412 .awsm-icon-hangouts:before {
413 content: "\ea8e";
414 }
415 .awsm-icon-google-drive:before {
416 content: "\ea8f";
417 }
418 .awsm-icon-facebook:before {
419 content: "\ea90";
420 }
421 .awsm-icon-facebook2:before {
422 content: "\ea91";
423 }
424 .awsm-icon-instagram:before {
425 content: "\ea92";
426 }
427 .awsm-icon-whatsapp:before {
428 content: "\ea93";
429 }
430 .awsm-icon-twitter:before {
431 content: "\ea96";
432 }
433 .awsm-icon-youtube:before {
434 content: "\ea9d";
435 }
436 .awsm-icon-vimeo:before {
437 content: "\eaa0";
438 }
439 .awsm-icon-vimeo2:before {
440 content: "\eaa1";
441 }
442 .awsm-icon-flickr:before {
443 content: "\eaa3";
444 }
445 .awsm-icon-flickr2:before {
446 content: "\eaa4";
447 }
448 .awsm-icon-dribbble:before {
449 content: "\eaa7";
450 }
451 .awsm-icon-behance:before {
452 content: "\eaa8";
453 }
454 .awsm-icon-behance2:before {
455 content: "\eaa9";
456 }
457 .awsm-icon-dropbox:before {
458 content: "\eaae";
459 }
460 .awsm-icon-wordpress:before {
461 content: "\eab4";
462 }
463 .awsm-icon-blogger:before {
464 content: "\eab8";
465 }
466 .awsm-icon-tumblr:before {
467 content: "\eab9";
468 }
469 .awsm-icon-tumblr2:before {
470 content: "\eaba";
471 }
472 .awsm-icon-skype:before {
473 content: "\eac5";
474 }
475 .awsm-icon-linkedin2:before {
476 content: "\eac9";
477 }
478 .awsm-icon-linkedin:before {
479 content: "\eaca";
480 }
481 .awsm-icon-stackoverflow:before {
482 content: "\ead0";
483 }
484 .awsm-icon-pinterest2:before {
485 content: "\ead1";
486 }
487 .awsm-icon-pinterest:before {
488 content: "\ead2";
489 }
490 .awsm-icon-foursquare:before {
491 content: "\ead6";
492 }
493
494 /****************** Presets ***********************/
495
496 /*------------- Cards 1-----------*/
497 .cards-style.style-1 figure {
498 overflow: hidden;
499 padding: 30px 0 100px;
500 background: #fff;
501 border: 1px solid rgba(0, 0, 0, 0.1);
502 }
503
504 .cards-style.style-1 figure::before {
505 content: "";
506 background: rgba(255, 255, 255, 0.9);
507 background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.6) 37%, rgba(255, 255, 255, 1) 78%, rgba(255, 255, 255, 1) 100%); /* FF3.6-15 */
508 background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.6) 37%, rgba(255, 255, 255, 1) 78%, rgba(255, 255, 255, 1) 100%); /* Chrome10-25,Safari5.1-6 */
509 background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.6) 37%, rgba(255, 255, 255, 1) 78%, rgba(255, 255, 255, 1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
510 position: absolute;
511 top: 0;
512 right: 0;
513 bottom: 0;
514 left: 0;
515 -moz-transform: translateY(100%) translateY(-90px);
516 -webkit-transform: translateY(100%) translateY(-90px);
517 -o-transform: translateY(100%) translateY(-90px);
518 -ms-transform: translateY(100%) translateY(-90px);
519 transform: translateY(100%) translateY(-90px);
520 -webkit-transition: -webkit-transform 0.4s;
521 -moz-transition: -moz-transform 0.4s;
522 transition: transform 0.4s;
523 z-index: 1;
524 }
525
526 .cards-style.style-1 figure img {
527 -webkit-transition: -webkit-transform 0.8s;
528 -moz-transition: -moz-transform 0.8s;
529 transition: transform 0.8s;
530 border-radius: 50%;
531 -webkit-border-radius: 50%;
532 max-width: 160px;
533 margin: 0 auto;
534 display: block;
535 }
536
537 .cards-style.style-1 figcaption {
538 bottom: 0;
539 left: 0;
540 right: 0;
541 position: absolute;
542 padding: 30px 20px;
543 -webkit-backface-visibility: hidden;
544 -moz-backface-visibility: hidden;
545 backface-visibility: hidden;
546 -moz-transform: translateY(calc(100% - 100px));
547 -webkit-transform: translateY(calc(100% - 100px));
548 -o-transform: translateY(calc(100% - 100px));
549 -ms-transform: translateY(calc(100% - 100px));
550 transform: translateY(calc(100% - 100px));
551 -webkit-transition: -webkit-transform 0.4s;
552 -moz-transition: -moz-transform 0.4s;
553 transition: transform 0.4s;
554 text-align: center;
555 z-index: 2;
556 color: #000;
557 }
558
559 .cards-style.style-1 figcaption a {
560 color: #000;
561 }
562
563 .cards-style.style-1 figcaption p {
564 font-size: 14px;
565 }
566
567 .cards-style.style-1 .awsm-contact-info {
568 -webkit-transform: translateY(100%);
569 -moz-transform: translateY(100%);
570 -ms-transform: translateY(100%);
571 transform: translateY(100%);
572 -webkit-backface-visibility: hidden;
573 -moz-backface-visibility: hidden;
574 backface-visibility: hidden;
575 -webkit-transition: -webkit-transform 0.4s;
576 -moz-transition: -moz-transform 0.4s;
577 transition: transform 0.4s;
578 opacity: 0;
579 visibility: hidden;
580 }
581
582 .no-touchevents .cards-style.style-1 figure:hover img,
583 .cards-style.style-1 figure.cs-hover img {
584 -webkit-transform: scale(1.1);
585 -moz-transform: scale(1.1);
586 -ms-transform: scale(1.1);
587 transform: scale(1.1);
588 }
589
590 .no-touchevents .cards-style.style-1 figure:hover figcaption,
591 .cards-style.style-1 figure.cs-hover figcaption,
592 .no-touchevents .cards-style.style-1 figure:hover::before,
593 .cards-style.style-1 figure.cs-hover::before {
594 -webkit-transform: translateY(0px) translateY(0px);
595 -moz-transform: translateY(0px) translateY(0px);
596 -ms-transform: translateY(0px) translateY(0px);
597 transform: translateY(0px) translateY(0px);
598 }
599
600 .no-touchevents .cards-style.style-1 figure:hover .awsm-contact-info,
601 .cards-style.style-1 figure.cs-hover .awsm-contact-info {
602 -webkit-transform: translateY(0px);
603 -moz-transform: translateY(0px);
604 -ms-transform: translateY(0px);
605 transform: translateY(0px);
606 opacity: 1;
607 visibility: visible;
608 }
609
610 /*------------- Cards 2-----------*/
611 .cards-style .awsm-flip-back {
612 font-size: 0;
613 }
614
615 .cards-style figcaption::after {
616 content: "";
617 height: 100%;
618 display: inline-block;
619 vertical-align: middle;
620 width: 1px;
621 }
622
623 .cards-style .awsm-flip-back-inner {
624 display: inline-block;
625 width: calc(100% - 1px);
626 vertical-align: middle;
627 font-size: 14px;
628 }
629
630 .cards-style.style-2 figure {
631 overflow: hidden;
632 text-align: center;
633 }
634
635 .cards-style.style-2 figure {
636 transform-style: preserve-3d;
637 }
638
639 .cards-style.style-2 figure img {
640 border-radius: 50%;
641 -webkit-border-radius: 50%;
642 max-width: 160px;
643 margin: 0 auto;
644 display: block;
645 }
646
647 .cards-style.style-2 .awsm-flip-front,
648 .cards-style.style-2 figcaption {
649 -webkit-backface-visibility: hidden;
650 -moz-backface-visibility: hidden;
651 backface-visibility: hidden;
652 padding: 30px 20px;
653 background: #fff;
654 border: 1px solid rgba(0, 0, 0, 0.1);
655 color: #000;
656 -webkit-transition: -webkit-transform 0.6s, z-index 0.7s;
657 -moz-transition: -moz-transform 0.6s, z-index 0.7s;
658 transition: transform 0.6s, z-index 0.7s;
659 }
660
661 .cards-style.style-2 .awsm-flip-front {
662 -moz-transform: rotateY(0deg);
663 -webkit-transform: rotateY(0deg);
664 -o-transform: rotateY(0deg);
665 -ms-transform: rotateY(0deg);
666 transform: rotateY(0deg);
667 position: relative;
668 }
669
670 .cards-style.style-2 .awsm-flip-front .awsm-personal-info {
671 padding-top: 20px;
672 }
673
674 .cards-style.style-2 figcaption {
675 -moz-transform: rotateY(180deg);
676 -webkit-transform: rotateY(180deg);
677 -o-transform: rotateY(180deg);
678 -ms-transform: rotateY(180deg);
679 transform: rotateY(180deg);
680 position: absolute;
681 left: 0;
682 top: 0;
683 right: 0;
684 bottom: 0;
685 }
686
687 .cards-style.style-2 figcaption a {
688 color: #000;
689 }
690
691 .no-touchevents .cards-style.style-2 figure:hover .awsm-flip-front,
692 .cards-style.style-2 figure.cs-hover .awsm-flip-front {
693 -moz-transform: rotateY(180deg);
694 -webkit-transform: rotateY(180deg);
695 -o-transform: rotateY(180deg);
696 -ms-transform: rotateY(180deg);
697 transform: rotateY(180deg);
698 }
699
700 .no-touchevents .cards-style.style-2 figure:hover figcaption,
701 .cards-style.style-2 figure.cs-hover figcaption {
702 -moz-transform: rotateY(0deg);
703 -webkit-transform: rotateY(0deg);
704 -o-transform: rotateY(0deg);
705 -ms-transform: rotateY(0deg);
706 transform: rotateY(0deg);
707 }
708
709 /*------------- Cards 3-----------*/
710 .cards-style.style-3 figure {
711 overflow: hidden;
712 padding: 20px 20px 100px;
713 background: #fff;
714 border: 1px solid rgba(0, 0, 0, 0.1);
715 }
716
717 .cards-style.style-3 figure::before {
718 content: "";
719 background: rgba(255, 255, 255, 0.9);
720 background: -moz-linear-gradient(top, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.6) 20%, rgba(255, 255, 255, 1) 78%, rgba(255, 255, 255, 1) 100%); /* FF3.6-15 */
721 background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.6) 20%, rgba(255, 255, 255, 1) 78%, rgba(255, 255, 255, 1) 100%); /* Chrome10-25,Safari5.1-6 */
722 background: linear-gradient(to bottom, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.6) 20%, rgba(255, 255, 255, 1) 78%, rgba(255, 255, 255, 1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
723 position: absolute;
724 top: 0;
725 right: 0;
726 bottom: 0;
727 left: 0;
728 -moz-transform: translateY(100%) translateY(-90px);
729 -webkit-transform: translateY(100%) translateY(-90px);
730 -o-transform: translateY(100%) translateY(-90px);
731 -ms-transform: translateY(100%) translateY(-90px);
732 transform: translateY(100%) translateY(-90px);
733 -webkit-transition: -webkit-transform 0.4s;
734 -moz-transition: -moz-transform 0.4s;
735 transition: transform 0.4s;
736 z-index: 1;
737 }
738
739 .cards-style.style-3 figure img {
740 -webkit-transition: -webkit-transform 0.8s;
741 -moz-transition: -moz-transform 0.8s;
742 transition: transform 0.8s;
743 }
744
745 .cards-style.style-3 figcaption {
746 bottom: 0;
747 left: 0;
748 right: 0;
749 position: absolute;
750 padding: 30px 20px;
751 -webkit-backface-visibility: hidden;
752 -moz-backface-visibility: hidden;
753 backface-visibility: hidden;
754 -moz-transform: translateY(100%) translateY(-100px);
755 -webkit-transform: translateY(100%) translateY(-100px);
756 -o-transform: translateY(100%) translateY(-100px);
757 -ms-transform: translateY(100%) translateY(-100px);
758 transform: translateY(100%) translateY(-100px);
759 -webkit-transition: -webkit-transform 0.4s;
760 -moz-transition: -moz-transform 0.4s;
761 transition: transform 0.4s;
762 text-align: center;
763 z-index: 2;
764 color: #000;
765 }
766
767 .cards-style.style-3 figcaption a {
768 color: #000;
769 }
770
771 .cards-style.style-3 figcaption p {
772 font-size: 14px;
773 }
774
775 .cards-style.style-3 .awsm-contact-info {
776 -webkit-transform: translateY(100%);
777 -moz-transform: translateY(100%);
778 -ms-transform: translateY(100%);
779 transform: translateY(100%);
780 -webkit-backface-visibility: hidden;
781 -moz-backface-visibility: hidden;
782 backface-visibility: hidden;
783 -webkit-transition: -webkit-transform 0.4s;
784 -moz-transition: -moz-transform 0.4s;
785 transition: transform 0.4s;
786 opacity: 0;
787 visibility: hidden;
788 }
789
790 .no-touchevents .cards-style.style-3 figure:hover img,
791 .cards-style.style-3 figure.cs-hover img {
792 -webkit-transform: scale(1.1);
793 -moz-transform: scale(1.1);
794 -ms-transform: scale(1.1);
795 transform: scale(1.1);
796 }
797
798 .no-touchevents .cards-style.style-3 figure:hover figcaption,
799 .cards-style.style-3 figure.cs-hover figcaption,
800 .no-touchevents .cards-style.style-3 figure:hover::before,
801 .cards-style.style-3 figure.cs-hover::before {
802 -webkit-transform: translateY(0px) translateY(0px);
803 -moz-transform: translateY(0px) translateY(0px);
804 -ms-transform: translateY(0px) translateY(0px);
805 transform: translateY(0px) translateY(0px);
806 }
807
808 .no-touchevents .cards-style.style-3 figure:hover .awsm-contact-info,
809 .cards-style.style-3 figure.cs-hover .awsm-contact-info {
810 -webkit-transform: translateY(0px);
811 -moz-transform: translateY(0px);
812 -ms-transform: translateY(0px);
813 transform: translateY(0px);
814 opacity: 1;
815 visibility: visible;
816 }
817
818 /*------------- Cards 4 -----------*/
819 .cards-style.style-4 {
820 display: -webkit-box;
821 display: -moz-box;
822 display: -ms-flexbox;
823 display: -webkit-flex;
824 display: flex;
825 flex-flow: row wrap;
826 -webkit-flex-flow: row wrap;
827 }
828
829 .cards-style.style-4::after {
830 display: none;
831 }
832
833 .cards-style.style-4 figure {
834 padding: 20px 20px 0;
835 background: #fff;
836 border: 1px solid rgba(0, 0, 0, 0.1);
837 position: relative;
838 }
839
840 .cards-style.style-4 figure img {
841 -webkit-transition: -webkit-transform 0.5s;
842 -moz-transition: -moz-transform 0.5s;
843 transition: transform 0.5s;
844 }
845
846 .cards-style.style-4 figcaption {
847 padding: 20px;
848 text-align: center;
849 z-index: 2;
850 color: #000;
851 }
852
853 .cards-style.style-4 figcaption a {
854 color: #000;
855 }
856
857 .cards-style.style-4 figcaption p {
858 font-size: 14px;
859 }
860
861 .no-touchevents .cards-style.style-4 figure:hover img,
862 .cards-style.style-4 figure.cs-hover img {
863 -webkit-transform: scale(1.05);
864 -moz-transform: scale(1.05);
865 -ms-transform: scale(1.05);
866 transform: scale(1.05);
867 }
868
869
870
871 .drawer-style.style-1 figcaption {
872 position: absolute;
873 left: 25px;
874 right: 25px;
875 top: 25px;
876 bottom: 25px;
877 padding: 30px;
878 background: rgba(35, 35, 35, 0.8);
879 color: #fff;
880 text-align: center;
881 opacity: 0;
882 -webkit-backface-visibility: hidden;
883 -moz-backface-visibility: hidden;
884 backface-visibility: hidden;
885 transform: scale(0.6);
886 -webkit-transform: scale(0.6);
887 -moz-transform: scale(0.6);
888 -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
889 -moz-transition: -moz-transform 0.2s, opacity 0.2s;
890 transition: transform 0.2s, opacity 0.2s;
891 font-size: 0;
892 }
893
894 /*------------- List 4-----------*/
895 .list-style figure img {
896 max-width: 300px;
897 }
898
899 .awsm-grid.list-style figcaption {
900 overflow: hidden;
901 }
902
903 .awsm-grid.list-style > .awsm-grid-card {
904 width: 100%;
905 float: none;
906 border-bottom: 1px solid rgba(35, 35, 35, 0.2);
907 padding: 0 0 40px 0;
908 margin-bottom: 40px;
909 }
910
911 .awsm-grid.list-style > li:last-child {
912 border-bottom: 0;
913 margin-bottom: 0;
914 }
915
916 .awsm-grid.list-style h3 {
917 font-size: 36px;
918 margin: 0 0 10px;
919 line-height: 1.1;
920 }
921
922 .awsm-grid.list-style .awsm-personal-info span {
923 font-size: 14px;
924 }
925
926 .awsm-grid-wrapper .awsm-grid.list-style {
927 margin: 0;
928 padding: 0;
929 }
930
931 .list-style .awsm-personal-info h3 {
932 font-size: 18px;
933 margin: 0 0 5px;
934 line-height: 1.1;
935 }
936
937 .list-style figure {
938 color: #111;
939 }
940
941 .list-style figcaption p {
942 font-size: 16px;
943 }
944
945 .list-style .awsm-social-icons span {
946 border: 1px solid;
947 margin: 0 5px 2px 5px;
948 text-align: center;
949 padding: 0;
950 }
951
952 .list-style .awsm-contact-info a {
953 color: #111;
954 padding: 10px 0;
955 width: 40px;
956 }
957
958 .list-style.style-1 .awsm-contact-info {
959 font-size: 16px;
960 }
961
962 .list-style.style-1 figure img {
963 float: left;
964 margin-right: 30px;
965 }
966
967 /*------------- List 2-----------*/
968 .list-style.style-2 figure img {
969 float: right;
970 margin-left: 30px;
971 }
972
973
974 /*------------ Table 1 -----------*/
975 .awsm-table {
976 display: table;
977 width: 100%;
978 color: #111;
979 }
980
981 .awsm-table-row {
982 display: table-row;
983 }
984
985 .awsm-table-cell {
986 display: table-cell;
987 padding: 10px;
988 vertical-align: middle;
989 }
990
991 .awsm-table-row.awsm-table-head .awsm-table-cell {
992 border: none;
993 }
994
995 .awsm-table-cell .awsm-table-cell-inner {
996 max-width: 400px;
997 }
998
999 .table-style .awsm-table-img-holder {
1000 max-width: 75px;
1001 }
1002
1003 .awsm-table-cell .awsm-social-icons a {
1004 color: #111;
1005 }
1006
1007 .table-style .awsm-table-cell h3 {
1008 font-size: 16px;
1009 font-weight: normal;
1010 margin: 0;
1011 padding: 0;
1012 line-height: 1.235;
1013 }
1014
1015 .table-style .awsm-table-cell h2 {
1016 font-size: 16px;
1017 margin: 0;
1018 padding: 0;
1019 line-height: 1.235;
1020 }
1021
1022 .table-style .awsm-table-cell p {
1023 margin-bottom: 10px;
1024 }
1025
1026 .awsm-table-description .awsm-table-cell-inner {
1027 min-width: 240px;
1028 }
1029
1030 .awsm-table.style-1 .awsm-table-row.awsm-table-head .awsm-table-cell {
1031 border-bottom: 2px solid #ccc;
1032 }
1033
1034 .awsm-table.style-1 .awsm-table-cell {
1035 border-bottom: 1px solid #ccc;
1036 }
1037
1038 /*------------ Table 2 -----------*/
1039 .awsm-table.style-2 .awsm-table-row.awsm-table-head .awsm-table-cell {
1040 border-bottom: none;
1041 }
1042
1043 .awsm-table.style-2 .awsm-table-cell {
1044 border-bottom: none;
1045 }
1046
1047 .awsm-table.style-2 .awsm-table-row:nth-child(2n+1) {
1048 background-color: rgba(113, 113, 113, 0.04);
1049 }
1050
1051 .awsm-table.style-2 .awsm-table-row.awsm-table-head {
1052 background-color: #eee;
1053 }
1054
1055 /*------------ Table 3 -----------*/
1056 .awsm-table.style-3 .awsm-table-row.awsm-table-head .awsm-table-cell {
1057 background-color: #eee;
1058 }
1059
1060 .awsm-table.style-3 .awsm-table-cell {
1061 border-bottom: 1px solid #ddd;
1062 }
1063
1064 .awsm-table.style-3 .awsm-table-row:first-child .awsm-table-cell {
1065 border-top: 1px solid #ddd;
1066 }
1067
1068 .awsm-table.style-3 .awsm-table-row .awsm-table-cell:first-child {
1069 border-left: 1px solid #ddd;
1070 }
1071
1072 .awsm-table.style-3 .awsm-table-row .awsm-table-cell:last-child {
1073 border-right: 1px solid #ddd;
1074 }
1075
1076 @keyframes DownMove {
1077 0% {
1078 top: 50%;
1079 }
1080
1081 5% {
1082 top: 60%;
1083 }
1084
1085 10% {
1086 top: 50%;
1087 }
1088
1089 15% {
1090 top: 60%;
1091 }
1092
1093 20% {
1094 top: 50%;
1095 }
1096
1097 }
1098
1099 @-webkit-keyframes DownMove {
1100 0% {
1101 top: 50%;
1102 }
1103
1104 5% {
1105 top: 60%;
1106 }
1107
1108 10% {
1109 top: 50%;
1110 }
1111
1112 15% {
1113 top: 60%;
1114 }
1115
1116 20% {
1117 top: 50%;
1118 }
1119
1120 }
1121
1122 @-moz-keyframes DownMove {
1123 0% {
1124 top: 50%;
1125 }
1126
1127 5% {
1128 top: 60%;
1129 }
1130
1131 10% {
1132 top: 50%;
1133 }
1134
1135 15% {
1136 top: 60%;
1137 }
1138
1139 20% {
1140 top: 50%;
1141 }
1142
1143 }
1144
1145 @media screen and (max-width:830px) {
1146
1147 .awsm-table-description .awsm-table-cell-inner {
1148 min-width: unset;
1149 }
1150
1151 }
1152
1153 @media screen and (max-width:700px) {
1154 .awsm-grid.list-style figcaption {
1155 overflow: visible;
1156 }
1157
1158 .list-style.style-2 figure img,
1159 .list-style.style-1 figure img {
1160 float: none;
1161 margin: 0 0 30px 0;
1162 }
1163
1164 .awsm-table,
1165 .awsm-table-row,
1166 .awsm-table-cell {
1167 display: block;
1168 }
1169
1170 .awsm-table.style-1 .awsm-table-row {
1171 padding-bottom: 20px;
1172 border-bottom: 1px solid #ccc;
1173 margin-bottom: 20px;
1174 }
1175
1176 .awsm-table-row.awsm-table-head {
1177 display: none;
1178 }
1179
1180 .awsm-table-cell {
1181 padding: 0;
1182 border: none;
1183 }
1184
1185 .table-style .awsm-table-img-holder {
1186 float: left;
1187 margin-right: 20px;
1188 margin-bottom: 20px;
1189 }
1190
1191 .awsm-table-designation,
1192 .awsm-table-name {
1193 overflow: hidden;
1194 }
1195
1196 .awsm-table-description {
1197 clear: both;
1198 }
1199
1200 .awsm-table .awsm-table-cell h2 {
1201 margin-bottom: 10px;
1202 }
1203
1204 .awsm-table .awsm-table-cell h3 {
1205 margin-top: 0;
1206 }
1207
1208 /*********** Clear Border and Styles *************/
1209 .awsm-table.style-1 .awsm-table-cell {
1210 border: none;
1211 }
1212
1213 .awsm-table-cell .awsm-table-cell-inner {
1214 max-width: none;
1215 }
1216
1217 .awsm-table.style-2 .awsm-table-row {
1218 padding: 20px 15px;
1219 }
1220
1221 .awsm-table.style-3 {
1222 border: 1px solid #ccc;
1223 }
1224
1225 .awsm-table.style-3 .awsm-table-row {
1226 padding: 20px 15px;
1227 border-bottom: 1px solid #ccc;
1228 }
1229
1230 .awsm-table.style-3 .awsm-table-row:last-child {
1231 border-bottom: none;
1232 }
1233
1234 .awsm-table.style-3 .awsm-table-cell {
1235 border: none !important;
1236 }
1237
1238 }
1239
1240 @media screen and (max-width:650px) {
1241
1242 .awsm-personal-details{
1243 max-height: 100%;
1244 overflow: visible;
1245 }
1246 }
1247
1248 /* IE 10 and IE 11 Fix */
1249 @media screen and (-ms-high-contrast:active), (-ms-high-contrast:none) {
1250 .cards-style.style-1 figure::before {
1251 -ms-transform: translateY(0px);
1252 transform: translateY(0px);
1253 opacity: 0;
1254 visibility: hidden;
1255 transition: opacity 0.4s, visibility 0.4s;
1256 }
1257
1258 .no-touchevents .cards-style.style-1 figure:hover::before,
1259 .cards-style.style-1 figure.cs-hover::before {
1260 -ms-transform: translateY(0px);
1261 transform: translateY(0px);
1262 opacity: 1;
1263 visibility: visible;
1264 }
1265
1266 .cards-style.style-2 .awsm-flip-front,
1267 .cards-style.style-2 figcaption {
1268 -webkit-transition: -webkit-transform 0.6s, z-index 0.7s;
1269 -moz-transition: -moz-transform 0.6s, z-index 0.7s;
1270 transition: transform 0.6s, z-index 0.7s;
1271 -webkit-backface-visibility: visible;
1272 -moz-backface-visibility: visible;
1273 backface-visibility: visible;
1274 }
1275
1276 .cards-style.style-2 figcaption {
1277 z-index: 1;
1278 }
1279
1280 .cards-style.style-2 .awsm-flip-front {
1281 z-index: 2;
1282 }
1283
1284 .no-touchevents .cards-style.style-2 figure:hover figcaption,
1285 .cards-style.style-2 figure.cs-hover figcaption {
1286 z-index: 3;
1287 }
1288
1289 }
1290
1291 /* IE 9 fix */
1292 :root .cards-style.style-2 figcaption {
1293 z-index: 1;
1294 }
1295
1296 :root .cards-style.style-2 .awsm-flip-front {
1297 z-index: 2;
1298 }
1299
1300 :root .cards-style.style-2 figure:hover figcaption {
1301 z-index: 3;
1302 }