/* @import '../dependencies/fontawesome/css/all.min.css'; */ /** * Swiper 4.5.0 * Most modern mobile touch slider and framework with hardware accelerated transitions * http://www.idangero.us/swiper/ * * Copyright 2014-2019 Vladimir Kharlampidi * * Released under the MIT License * * Released on: February 22, 2019 */ .swiper-container{margin:0 auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;} .swiper-container-no-flexbox .swiper-slide{float:left} .swiper-container-vertical>.swiper-wrapper{-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column} .swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform,-webkit-transform;-webkit-box-sizing:content-box;box-sizing:content-box} .swiper-container-android .swiper-slide,.swiper-wrapper{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)} .swiper-container-multirow>.swiper-wrapper{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap} .swiper-container-free-mode>.swiper-wrapper{-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out;margin:0 auto} .swiper-slide{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;width:100%;height:100%;position:relative;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform,-webkit-transform} .swiper-slide-invisible-blank{visibility:hidden} .swiper-container-autoheight,.swiper-container-autoheight .swiper-slide{height:auto} .swiper-container-autoheight .swiper-wrapper{-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;-webkit-transition-property:height,-webkit-transform;transition-property:height,-webkit-transform;-o-transition-property:transform,height;transition-property:transform,height;transition-property:transform,height,-webkit-transform} .swiper-container-3d{-webkit-perspective:1200px;perspective:1200px} .swiper-container-3d .swiper-cube-shadow,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-wrapper{-webkit-transform-style:preserve-3d;transform-style:preserve-3d} .swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10;} .swiper-container-3d .swiper-slide-shadow-left{background-image:-webkit-gradient(linear,right top,left top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))} .swiper-container-3d .swiper-slide-shadow-right{background-image:-webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))} .swiper-container-3d .swiper-slide-shadow-top{background-image:-webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))} .swiper-container-3d .swiper-slide-shadow-bottom{background-image:-webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))} .swiper-container-wp8-horizontal,.swiper-container-wp8-horizontal>.swiper-wrapper{-ms-touch-action:pan-y;touch-action:pan-y} .swiper-container-wp8-vertical,.swiper-container-wp8-vertical>.swiper-wrapper{-ms-touch-action:pan-x;touch-action:pan-x} .swiper-button-next,.swiper-button-prev{position:absolute;top:50%;width:27px;height:44px;margin-top:-22px;z-index:10;cursor:pointer;background-size:27px 44px;background-position:center;background-repeat:no-repeat} .swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none} .swiper-button-prev,.swiper-container-rtl .swiper-button-next{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");left:10px;right:auto} .swiper-button-next,.swiper-container-rtl .swiper-button-prev{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");right:10px;left:auto} .swiper-button-prev.swiper-button-white,.swiper-container-rtl .swiper-button-next.swiper-button-white{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")} .swiper-button-next.swiper-button-white,.swiper-container-rtl .swiper-button-prev.swiper-button-white{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")} .swiper-button-prev.swiper-button-black,.swiper-container-rtl .swiper-button-next.swiper-button-black{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")} .swiper-button-next.swiper-button-black,.swiper-container-rtl .swiper-button-prev.swiper-button-black{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")} .swiper-button-lock{display:none} .swiper-pagination{position:absolute;text-align:center;-webkit-transition:.3s opacity;-o-transition:.3s opacity;transition:.3s opacity;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);z-index:10;} .swiper-pagination.swiper-pagination-hidden{opacity:0} .swiper-container-horizontal>.swiper-pagination-bullets,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:10px;left:0;width:100%} .swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0} .swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33);position:relative} .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)} .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)} .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{-webkit-transform:scale(.66);-ms-transform:scale(.66);transform:scale(.66)} .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33)} .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{-webkit-transform:scale(.66);-ms-transform:scale(.66);transform:scale(.66)} .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33)} .swiper-pagination-bullet{width:8px;height:8px;display:inline-block;border-radius:100%;background:#000;opacity:.2} button.swiper-pagination-bullet{border:none;margin:0;padding:0;-webkit-box-shadow:none;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none} .swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer} .swiper-pagination-bullet-active{opacity:1;background:#007aff} .swiper-container-vertical>.swiper-pagination-bullets{right:10px;top:50%;-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)} .swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:6px 0;display:block} .swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);width:8px} .swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;-webkit-transition:.2s top,.2s -webkit-transform;transition:.2s top,.2s -webkit-transform;-o-transition:.2s transform,.2s top;transition:.2s transform,.2s top;transition:.2s transform,.2s top,.2s -webkit-transform} .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 4px} .swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);white-space:nowrap} .swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:.2s left,.2s -webkit-transform;transition:.2s left,.2s -webkit-transform;-o-transition:.2s transform,.2s left;transition:.2s transform,.2s left;transition:.2s transform,.2s left,.2s -webkit-transform} .swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:.2s right,.2s -webkit-transform;transition:.2s right,.2s -webkit-transform;-o-transition:.2s transform,.2s right;transition:.2s transform,.2s right;transition:.2s transform,.2s right,.2s -webkit-transform} .swiper-pagination-progressbar{background:rgba(0,0,0,.25);position:absolute} .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:#007aff;position:absolute;left:0;top:0;width:100%;height:100%;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-transform-origin:left top;-ms-transform-origin:left top;transform-origin:left top} .swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{-webkit-transform-origin:right top;-ms-transform-origin:right top;transform-origin:right top} .swiper-container-horizontal>.swiper-pagination-progressbar,.swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:4px;left:0;top:0} .swiper-container-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-container-vertical>.swiper-pagination-progressbar{width:4px;height:100%;left:0;top:0} .swiper-pagination-white .swiper-pagination-bullet-active{background:#fff} .swiper-pagination-progressbar.swiper-pagination-white{background:rgba(255,255,255,.25)} .swiper-pagination-progressbar.swiper-pagination-white .swiper-pagination-progressbar-fill{background:#fff} .swiper-pagination-black .swiper-pagination-bullet-active{background:#000} .swiper-pagination-progressbar.swiper-pagination-black{background:rgba(0,0,0,.25)} .swiper-pagination-progressbar.swiper-pagination-black .swiper-pagination-progressbar-fill{background:#000} .swiper-pagination-lock{display:none} .swiper-scrollbar{border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0,0,0,.1)} .swiper-container-horizontal>.swiper-scrollbar{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%} .swiper-container-vertical>.swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%} .swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0,0,0,.5);border-radius:10px;left:0;top:0} .swiper-scrollbar-cursor-drag{cursor:move} .swiper-scrollbar-lock{display:none} .swiper-zoom-container{width:100%;height:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;text-align:center} .swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;-o-object-fit:contain;object-fit:contain} .swiper-slide-zoomed{cursor:move} .swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;-webkit-transform-origin:50%;-ms-transform-origin:50%;transform-origin:50%;-webkit-animation:swiper-preloader-spin 1s steps(12,end) infinite;animation:swiper-preloader-spin 1s steps(12,end) infinite} .swiper-lazy-preloader:after{display:block;content:'';width:100%;height:100%;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");background-position:50%;background-size:100%;background-repeat:no-repeat} .swiper-lazy-preloader-white:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")} @-webkit-keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}} @keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}} .swiper-container .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000;} .swiper-container-fade.swiper-container-free-mode .swiper-slide{-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out} .swiper-container-fade .swiper-slide{pointer-events:none;-webkit-transition-property:opacity;-o-transition-property:opacity;transition-property:opacity} .swiper-container-fade .swiper-slide .swiper-slide{pointer-events:none} .swiper-container-fade .swiper-slide-active,.swiper-container-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto} .swiper-container-cube{overflow:visible} .swiper-container-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;-webkit-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0;width:100%;height:100%} .swiper-container-cube .swiper-slide .swiper-slide{pointer-events:none} .swiper-container-cube.swiper-container-rtl .swiper-slide{-webkit-transform-origin:100% 0;-ms-transform-origin:100% 0;transform-origin:100% 0} .swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto} .swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-next,.swiper-container-cube .swiper-slide-next+.swiper-slide,.swiper-container-cube .swiper-slide-prev{pointer-events:auto;visibility:visible} .swiper-container-cube .swiper-slide-shadow-bottom,.swiper-container-cube .swiper-slide-shadow-left,.swiper-container-cube .swiper-slide-shadow-right,.swiper-container-cube .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden} .swiper-container-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0;width:100%;height:100%;background:#000;opacity:.6;-webkit-filter:blur(50px);filter:blur(50px);z-index:0;} .swiper-container-flip{overflow:visible} .swiper-container-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;} .swiper-container-flip .swiper-slide .swiper-slide{pointer-events:none} .swiper-container-flip .swiper-slide-active,.swiper-container-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto} .swiper-container-flip .swiper-slide-shadow-bottom,.swiper-container-flip .swiper-slide-shadow-left,.swiper-container-flip .swiper-slide-shadow-right,.swiper-container-flip .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden} .swiper-container-coverflow .swiper-wrapper{-ms-perspective:1200px} /*! Animate.css - http://daneden.me/animate Licensed under the MIT license Copyright (c) 2013 Daniel Eden Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ .animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .animated.hinge { -webkit-animation-duration: 2s; animation-duration: 2s; } @-webkit-keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); transform: translateY(0); } 40% { -webkit-transform: translateY(-30px); transform: translateY(-30px); } 60% { -webkit-transform: translateY(-15px); transform: translateY(-15px); } } @keyframes bounce { 0%, 20%, 50%, 80%, 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 40% { -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } 60% { -webkit-transform: translateY(-15px); -ms-transform: translateY(-15px); transform: translateY(-15px); } } .bounce { -webkit-animation-name: bounce; animation-name: bounce; } @-webkit-keyframes flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } @keyframes flash { 0%, 50%, 100% { opacity: 1; } 25%, 75% { opacity: 0; } } .flash { -webkit-animation-name: flash; animation-name: flash; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes pulse { 0% { -webkit-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.1); transform: scale(1.1); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes pulse { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } 100% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } .pulse { -webkit-animation-name: pulse; animation-name: pulse; } @-webkit-keyframes shake { 0%, 100% { -webkit-transform: translateX(0); transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translateX(-10px); transform: translateX(-10px); } 20%, 40%, 60%, 80% { -webkit-transform: translateX(10px); transform: translateX(10px); } } @keyframes shake { 0%, 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 10%, 30%, 50%, 70%, 90% { -webkit-transform: translateX(-10px); -ms-transform: translateX(-10px); transform: translateX(-10px); } 20%, 40%, 60%, 80% { -webkit-transform: translateX(10px); -ms-transform: translateX(10px); transform: translateX(10px); } } .shake { -webkit-animation-name: shake; animation-name: shake; } @-webkit-keyframes swing { 20% { -webkit-transform: rotate(15deg); transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); transform: rotate(-5deg); } 100% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } } @keyframes swing { 20% { -webkit-transform: rotate(15deg); -ms-transform: rotate(15deg); transform: rotate(15deg); } 40% { -webkit-transform: rotate(-10deg); -ms-transform: rotate(-10deg); transform: rotate(-10deg); } 60% { -webkit-transform: rotate(5deg); -ms-transform: rotate(5deg); transform: rotate(5deg); } 80% { -webkit-transform: rotate(-5deg); -ms-transform: rotate(-5deg); transform: rotate(-5deg); } 100% { -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } } .swing { -webkit-transform-origin: top center; -ms-transform-origin: top center; transform-origin: top center; -webkit-animation-name: swing; animation-name: swing; } @-webkit-keyframes tada { 0% { -webkit-transform: scale(1); transform: scale(1); } 10%, 20% { -webkit-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% { -webkit-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% { -webkit-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } @keyframes tada { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 10%, 20% { -webkit-transform: scale(0.9) rotate(-3deg); -ms-transform: scale(0.9) rotate(-3deg); transform: scale(0.9) rotate(-3deg); } 30%, 50%, 70%, 90% { -webkit-transform: scale(1.1) rotate(3deg); -ms-transform: scale(1.1) rotate(3deg); transform: scale(1.1) rotate(3deg); } 40%, 60%, 80% { -webkit-transform: scale(1.1) rotate(-3deg); -ms-transform: scale(1.1) rotate(-3deg); transform: scale(1.1) rotate(-3deg); } 100% { -webkit-transform: scale(1) rotate(0); -ms-transform: scale(1) rotate(0); transform: scale(1) rotate(0); } } .tada { -webkit-animation-name: tada; animation-name: tada; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes wobble { 0% { -webkit-transform: translateX(0%); transform: translateX(0%); } 15% { -webkit-transform: translateX(-25%) rotate(-5deg); transform: translateX(-25%) rotate(-5deg); } 30% { -webkit-transform: translateX(20%) rotate(3deg); transform: translateX(20%) rotate(3deg); } 45% { -webkit-transform: translateX(-15%) rotate(-3deg); transform: translateX(-15%) rotate(-3deg); } 60% { -webkit-transform: translateX(10%) rotate(2deg); transform: translateX(10%) rotate(2deg); } 75% { -webkit-transform: translateX(-5%) rotate(-1deg); transform: translateX(-5%) rotate(-1deg); } 100% { -webkit-transform: translateX(0%); transform: translateX(0%); } } @keyframes wobble { 0% { -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); } 15% { -webkit-transform: translateX(-25%) rotate(-5deg); -ms-transform: translateX(-25%) rotate(-5deg); transform: translateX(-25%) rotate(-5deg); } 30% { -webkit-transform: translateX(20%) rotate(3deg); -ms-transform: translateX(20%) rotate(3deg); transform: translateX(20%) rotate(3deg); } 45% { -webkit-transform: translateX(-15%) rotate(-3deg); -ms-transform: translateX(-15%) rotate(-3deg); transform: translateX(-15%) rotate(-3deg); } 60% { -webkit-transform: translateX(10%) rotate(2deg); -ms-transform: translateX(10%) rotate(2deg); transform: translateX(10%) rotate(2deg); } 75% { -webkit-transform: translateX(-5%) rotate(-1deg); -ms-transform: translateX(-5%) rotate(-1deg); transform: translateX(-5%) rotate(-1deg); } 100% { -webkit-transform: translateX(0%); -ms-transform: translateX(0%); transform: translateX(0%); } } .wobble { -webkit-animation-name: wobble; animation-name: wobble; } @-webkit-keyframes bounceIn { 0% { opacity: 0; -webkit-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; -webkit-transform: scale(1.05); transform: scale(1.05); } 70% { -webkit-transform: scale(.9); transform: scale(.9); } 100% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes bounceIn { 0% { opacity: 0; -webkit-transform: scale(.3); -ms-transform: scale(.3); transform: scale(.3); } 50% { opacity: 1; -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); } 70% { -webkit-transform: scale(.9); -ms-transform: scale(.9); transform: scale(.9); } 100% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } .bounceIn { -webkit-animation-name: bounceIn; animation-name: bounceIn; } @-webkit-keyframes bounceInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); transform: translateY(30px); } 80% { -webkit-transform: translateY(-10px); transform: translateY(-10px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes bounceInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 60% { opacity: 1; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); } 80% { -webkit-transform: translateY(-10px); -ms-transform: translateY(-10px); transform: translateY(-10px); } 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .bounceInDown { -webkit-animation-name: bounceInDown; animation-name: bounceInDown; } @-webkit-keyframes bounceInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); transform: translateX(30px); } 80% { -webkit-transform: translateX(-10px); transform: translateX(-10px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes bounceInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 60% { opacity: 1; -webkit-transform: translateX(30px); -ms-transform: translateX(30px); transform: translateX(30px); } 80% { -webkit-transform: translateX(-10px); -ms-transform: translateX(-10px); transform: translateX(-10px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .bounceInLeft { -webkit-animation-name: bounceInLeft; animation-name: bounceInLeft; } @-webkit-keyframes bounceInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } 60% { opacity: 1; -webkit-transform: translateX(-30px); transform: translateX(-30px); } 80% { -webkit-transform: translateX(10px); transform: translateX(10px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes bounceInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } 60% { opacity: 1; -webkit-transform: translateX(-30px); -ms-transform: translateX(-30px); transform: translateX(-30px); } 80% { -webkit-transform: translateX(10px); -ms-transform: translateX(10px); transform: translateX(10px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .bounceInRight { -webkit-animation-name: bounceInRight; animation-name: bounceInRight; } @-webkit-keyframes bounceInUp { 0% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } 60% { opacity: 1; -webkit-transform: translateY(-30px); transform: translateY(-30px); } 80% { -webkit-transform: translateY(10px); transform: translateY(10px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes bounceInUp { 0% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } 60% { opacity: 1; -webkit-transform: translateY(-30px); -ms-transform: translateY(-30px); transform: translateY(-30px); } 80% { -webkit-transform: translateY(10px); -ms-transform: translateY(10px); transform: translateY(10px); } 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .bounceInUp { -webkit-animation-name: bounceInUp; animation-name: bounceInUp; } @-webkit-keyframes bounceOut { 0% { -webkit-transform: scale(1); transform: scale(1); } 25% { -webkit-transform: scale(.95); transform: scale(.95); } 50% { opacity: 1; -webkit-transform: scale(1.1); transform: scale(1.1); } 100% { opacity: 0; -webkit-transform: scale(.3); transform: scale(.3); } } @keyframes bounceOut { 0% { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 25% { -webkit-transform: scale(.95); -ms-transform: scale(.95); transform: scale(.95); } 50% { opacity: 1; -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } 100% { opacity: 0; -webkit-transform: scale(.3); -ms-transform: scale(.3); transform: scale(.3); } } .bounceOut { -webkit-animation-name: bounceOut; animation-name: bounceOut; } @-webkit-keyframes bounceOutDown { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } } @keyframes bounceOutDown { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } } .bounceOutDown { -webkit-animation-name: bounceOutDown; animation-name: bounceOutDown; } @-webkit-keyframes bounceOutLeft { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes bounceOutLeft { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } .bounceOutLeft { -webkit-animation-name: bounceOutLeft; animation-name: bounceOutLeft; } @-webkit-keyframes bounceOutRight { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } } @keyframes bounceOutRight { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 20% { opacity: 1; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } } .bounceOutRight { -webkit-animation-name: bounceOutRight; animation-name: bounceOutRight; } @-webkit-keyframes bounceOutUp { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes bounceOutUp { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 20% { opacity: 1; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } .bounceOutUp { -webkit-animation-name: bounceOutUp; animation-name: bounceOutUp; } @-webkit-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } .fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn; } @-webkit-keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInDown { -webkit-animation-name: fadeInDown; animation-name: fadeInDown; } @-webkit-keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInDownBig { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInDownBig { -webkit-animation-name: fadeInDownBig; animation-name: fadeInDownBig; } @-webkit-keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInLeft { 0% { opacity: 0; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInLeft { -webkit-animation-name: fadeInLeft; animation-name: fadeInLeft; } @-webkit-keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInLeftBig { 0% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInLeftBig { -webkit-animation-name: fadeInLeftBig; animation-name: fadeInLeftBig; } @-webkit-keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInRight { 0% { opacity: 0; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInRight { -webkit-animation-name: fadeInRight; animation-name: fadeInRight; } @-webkit-keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes fadeInRightBig { 0% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } 100% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .fadeInRightBig { -webkit-animation-name: fadeInRightBig; animation-name: fadeInRightBig; } @-webkit-keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInUp { 0% { opacity: 0; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInUp { -webkit-animation-name: fadeInUp; animation-name: fadeInUp; } @-webkit-keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes fadeInUpBig { 0% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } 100% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .fadeInUpBig { -webkit-animation-name: fadeInUpBig; animation-name: fadeInUpBig; } @-webkit-keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } } @keyframes fadeOut { from { opacity: 1; } to { opacity: 0; } } .fadeOut { -webkit-animation-name: fadeOut; animation-name: fadeOut; } @-webkit-keyframes fadeOutDown { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(20px); transform: translateY(20px); } } @keyframes fadeOutDown { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); } } .fadeOutDown { -webkit-animation-name: fadeOutDown; animation-name: fadeOutDown; } @-webkit-keyframes fadeOutDownBig { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(2000px); transform: translateY(2000px); } } @keyframes fadeOutDownBig { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(2000px); -ms-transform: translateY(2000px); transform: translateY(2000px); } } .fadeOutDownBig { -webkit-animation-name: fadeOutDownBig; animation-name: fadeOutDownBig; } @-webkit-keyframes fadeOutLeft { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-20px); transform: translateX(-20px); } } @keyframes fadeOutLeft { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-20px); -ms-transform: translateX(-20px); transform: translateX(-20px); } } .fadeOutLeft { -webkit-animation-name: fadeOutLeft; animation-name: fadeOutLeft; } @-webkit-keyframes fadeOutLeftBig { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes fadeOutLeftBig { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } .fadeOutLeftBig { -webkit-animation-name: fadeOutLeftBig; animation-name: fadeOutLeftBig; } @-webkit-keyframes fadeOutRight { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(20px); transform: translateX(20px); } } @keyframes fadeOutRight { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(20px); -ms-transform: translateX(20px); transform: translateX(20px); } } .fadeOutRight { -webkit-animation-name: fadeOutRight; animation-name: fadeOutRight; } @-webkit-keyframes fadeOutRightBig { 0% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } } @keyframes fadeOutRightBig { 0% { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } } .fadeOutRightBig { -webkit-animation-name: fadeOutRightBig; animation-name: fadeOutRightBig; } @-webkit-keyframes fadeOutUp { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px); } } @keyframes fadeOutUp { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-20px); -ms-transform: translateY(-20px); transform: translateY(-20px); } } .fadeOutUp { -webkit-animation-name: fadeOutUp; animation-name: fadeOutUp; } @-webkit-keyframes fadeOutUpBig { 0% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes fadeOutUpBig { 0% { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } .fadeOutUpBig { -webkit-animation-name: fadeOutUpBig; animation-name: fadeOutUpBig; } @-webkit-keyframes flip { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } @keyframes flip { 0% { -webkit-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(0) scale(1); transform: perspective(400px) translateZ(0) rotateY(0) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 40% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } 50% { -webkit-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -ms-transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 80% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } 100% { -webkit-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -ms-transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } } .animated.flip { -webkit-backface-visibility: visible; -ms-backface-visibility: visible; backface-visibility: visible; -webkit-animation-name: flip; animation-name: flip; } @-webkit-keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% { -webkit-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% { -webkit-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } } @keyframes flipInX { 0% { -webkit-transform: perspective(400px) rotateX(90deg); -ms-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateX(-10deg); -ms-transform: perspective(400px) rotateX(-10deg); transform: perspective(400px) rotateX(-10deg); } 70% { -webkit-transform: perspective(400px) rotateX(10deg); -ms-transform: perspective(400px) rotateX(10deg); transform: perspective(400px) rotateX(10deg); } 100% { -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } } .flipInX { -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInX; animation-name: flipInX; } @-webkit-keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateY(-10deg); transform: perspective(400px) rotateY(-10deg); } 70% { -webkit-transform: perspective(400px) rotateY(10deg); transform: perspective(400px) rotateY(10deg); } 100% { -webkit-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; } } @keyframes flipInY { 0% { -webkit-transform: perspective(400px) rotateY(90deg); -ms-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } 40% { -webkit-transform: perspective(400px) rotateY(-10deg); -ms-transform: perspective(400px) rotateY(-10deg); transform: perspective(400px) rotateY(-10deg); } 70% { -webkit-transform: perspective(400px) rotateY(10deg); -ms-transform: perspective(400px) rotateY(10deg); transform: perspective(400px) rotateY(10deg); } 100% { -webkit-transform: perspective(400px) rotateY(0deg); -ms-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; } } .flipInY { -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipInY; animation-name: flipInY; } @-webkit-keyframes flipOutX { 0% { -webkit-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } } @keyframes flipOutX { 0% { -webkit-transform: perspective(400px) rotateX(0deg); -ms-transform: perspective(400px) rotateX(0deg); transform: perspective(400px) rotateX(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateX(90deg); -ms-transform: perspective(400px) rotateX(90deg); transform: perspective(400px) rotateX(90deg); opacity: 0; } } .flipOutX { -webkit-animation-name: flipOutX; animation-name: flipOutX; -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; } @-webkit-keyframes flipOutY { 0% { -webkit-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } } @keyframes flipOutY { 0% { -webkit-transform: perspective(400px) rotateY(0deg); -ms-transform: perspective(400px) rotateY(0deg); transform: perspective(400px) rotateY(0deg); opacity: 1; } 100% { -webkit-transform: perspective(400px) rotateY(90deg); -ms-transform: perspective(400px) rotateY(90deg); transform: perspective(400px) rotateY(90deg); opacity: 0; } } .flipOutY { -webkit-backface-visibility: visible !important; -ms-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: flipOutY; animation-name: flipOutY; } @-webkit-keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -webkit-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -webkit-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } } @keyframes lightSpeedIn { 0% { -webkit-transform: translateX(100%) skewX(-30deg); -ms-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } 60% { -webkit-transform: translateX(-20%) skewX(30deg); -ms-transform: translateX(-20%) skewX(30deg); transform: translateX(-20%) skewX(30deg); opacity: 1; } 80% { -webkit-transform: translateX(0%) skewX(-15deg); -ms-transform: translateX(0%) skewX(-15deg); transform: translateX(0%) skewX(-15deg); opacity: 1; } 100% { -webkit-transform: translateX(0%) skewX(0deg); -ms-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } } .lightSpeedIn { -webkit-animation-name: lightSpeedIn; animation-name: lightSpeedIn; -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out; } @-webkit-keyframes lightSpeedOut { 0% { -webkit-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -webkit-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } } @keyframes lightSpeedOut { 0% { -webkit-transform: translateX(0%) skewX(0deg); -ms-transform: translateX(0%) skewX(0deg); transform: translateX(0%) skewX(0deg); opacity: 1; } 100% { -webkit-transform: translateX(100%) skewX(-30deg); -ms-transform: translateX(100%) skewX(-30deg); transform: translateX(100%) skewX(-30deg); opacity: 0; } } .lightSpeedOut { -webkit-animation-name: lightSpeedOut; animation-name: lightSpeedOut; -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in; } @-webkit-keyframes rotateIn { 0% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateIn { 0% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(-200deg); -ms-transform: rotate(-200deg); transform: rotate(-200deg); opacity: 0; } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } .rotateIn { -webkit-animation-name: rotateIn; animation-name: rotateIn; } @-webkit-keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateInDownLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } .rotateInDownLeft { -webkit-animation-name: rotateInDownLeft; animation-name: rotateInDownLeft; } @-webkit-keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateInDownRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } .rotateInDownRight { -webkit-animation-name: rotateInDownRight; animation-name: rotateInDownRight; } @-webkit-keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateInUpLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } .rotateInUpLeft { -webkit-animation-name: rotateInUpLeft; animation-name: rotateInUpLeft; } @-webkit-keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } } @keyframes rotateInUpRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } } .rotateInUpRight { -webkit-animation-name: rotateInUpRight; animation-name: rotateInUpRight; } @-webkit-keyframes rotateOut { 0% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } @keyframes rotateOut { 0% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-transform: rotate(200deg); -ms-transform: rotate(200deg); transform: rotate(200deg); opacity: 0; } } .rotateOut { -webkit-animation-name: rotateOut; animation-name: rotateOut; } @-webkit-keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutDownLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } .rotateOutDownLeft { -webkit-animation-name: rotateOutDownLeft; animation-name: rotateOutDownLeft; } @-webkit-keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutDownRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } .rotateOutDownRight { -webkit-animation-name: rotateOutDownRight; animation-name: rotateOutDownRight; } @-webkit-keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } @keyframes rotateOutUpLeft { 0% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: left bottom; -ms-transform-origin: left bottom; transform-origin: left bottom; -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); opacity: 0; } } .rotateOutUpLeft { -webkit-animation-name: rotateOutUpLeft; animation-name: rotateOutUpLeft; } @-webkit-keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } @keyframes rotateOutUpRight { 0% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); opacity: 1; } 100% { -webkit-transform-origin: right bottom; -ms-transform-origin: right bottom; transform-origin: right bottom; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); opacity: 0; } } .rotateOutUpRight { -webkit-animation-name: rotateOutUpRight; animation-name: rotateOutUpRight; } @-webkit-keyframes slideInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes slideInDown { 0% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } 100% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .slideInDown { -webkit-animation-name: slideInDown; animation-name: slideInDown; } @-webkit-keyframes slideInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes slideInLeft { 0% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .slideInLeft { -webkit-animation-name: slideInLeft; animation-name: slideInLeft; } @-webkit-keyframes slideInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } 100% { -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes slideInRight { 0% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } 100% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } } .slideInRight { -webkit-animation-name: slideInRight; animation-name: slideInRight; } @-webkit-keyframes slideOutLeft { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); transform: translateX(-2000px); } } @keyframes slideOutLeft { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(-2000px); -ms-transform: translateX(-2000px); transform: translateX(-2000px); } } .slideOutLeft { -webkit-animation-name: slideOutLeft; animation-name: slideOutLeft; } @-webkit-keyframes slideOutRight { 0% { -webkit-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); transform: translateX(2000px); } } @keyframes slideOutRight { 0% { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } 100% { opacity: 0; -webkit-transform: translateX(2000px); -ms-transform: translateX(2000px); transform: translateX(2000px); } } .slideOutRight { -webkit-animation-name: slideOutRight; animation-name: slideOutRight; } @-webkit-keyframes slideOutUp { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); transform: translateY(-2000px); } } @keyframes slideOutUp { 0% { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } 100% { opacity: 0; -webkit-transform: translateY(-2000px); -ms-transform: translateY(-2000px); transform: translateY(-2000px); } } .slideOutUp { -webkit-animation-name: slideOutUp; animation-name: slideOutUp; } @-webkit-keyframes hinge { 0% { -webkit-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40% { -webkit-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 80% { -webkit-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 100% { -webkit-transform: translateY(700px); transform: translateY(700px); opacity: 0; } } @keyframes hinge { 0% { -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 20%, 60% { -webkit-transform: rotate(80deg); -ms-transform: rotate(80deg); transform: rotate(80deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 40% { -webkit-transform: rotate(60deg); -ms-transform: rotate(60deg); transform: rotate(60deg); -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 80% { -webkit-transform: rotate(60deg) translateY(0); -ms-transform: rotate(60deg) translateY(0); transform: rotate(60deg) translateY(0); opacity: 1; -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; } 100% { -webkit-transform: translateY(700px); -ms-transform: translateY(700px); transform: translateY(700px); opacity: 0; } } .hinge { -webkit-animation-name: hinge; animation-name: hinge; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollIn { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } } @keyframes rollIn { 0% { opacity: 0; -webkit-transform: translateX(-100%) rotate(-120deg); -ms-transform: translateX(-100%) rotate(-120deg); transform: translateX(-100%) rotate(-120deg); } 100% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } } .rollIn { -webkit-animation-name: rollIn; animation-name: rollIn; } /* originally authored by Nick Pettit - https://github.com/nickpettit/glide */ @-webkit-keyframes rollOut { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg); } } @keyframes rollOut { 0% { opacity: 1; -webkit-transform: translateX(0px) rotate(0deg); -ms-transform: translateX(0px) rotate(0deg); transform: translateX(0px) rotate(0deg); } 100% { opacity: 0; -webkit-transform: translateX(100%) rotate(120deg); -ms-transform: translateX(100%) rotate(120deg); transform: translateX(100%) rotate(120deg); } } .rollOut { -webkit-animation-name: rollOut; animation-name: rollOut; } @-webkit-keyframes zoomIn { from { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 50% { opacity: 1; } } @keyframes zoomIn { from { opacity: 0; -webkit-transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); } 50% { opacity: 1; } } .zoomIn { -webkit-animation-name: zoomIn; animation-name: zoomIn; } .animated.fast { -webkit-animation-duration: 800ms; animation-duration: 800ms; } .animated.faster { -webkit-animation-duration: 500ms; animation-duration: 500ms; } /* Magnific Popup CSS */ .mfp-bg { top: 0; left: 0; width: 100%; height: 100%; z-index: 100042; overflow: hidden; position: fixed; background: #0b0b0b; opacity: 0.8; } .mfp-wrap { top: 0; left: 0; width: 100%; height: 100%; z-index: 100043; position: fixed; outline: none !important; -webkit-backface-visibility: hidden; } .mfp-container { text-align: center; position: absolute; width: 100%; height: 100%; left: 0; top: 0; padding: 0 8px; box-sizing: border-box; } .mfp-container:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; } .mfp-align-top .mfp-container:before { display: none; } .mfp-content { position: relative; display: inline-block; vertical-align: middle; margin: 0 auto; text-align: left; z-index: 100045; } .mfp-inline-holder .mfp-content, .mfp-ajax-holder .mfp-content { width: 100%; cursor: auto; } .mfp-ajax-cur { cursor: progress; } .mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close { cursor: -moz-zoom-out; cursor: -webkit-zoom-out; cursor: zoom-out; } .mfp-zoom { cursor: pointer; cursor: -webkit-zoom-in; cursor: -moz-zoom-in; cursor: zoom-in; } .mfp-auto-cursor .mfp-content { cursor: auto; } .mfp-close, .mfp-arrow, .mfp-preloader, .mfp-counter { -webkit-user-select: none; -moz-user-select: none; user-select: none; } .mfp-loading.mfp-figure { display: none; } .mfp-hide { display: none !important; } .mfp-preloader { color: #CCC; position: absolute; top: 50%; width: auto; text-align: center; margin-top: -0.8em; left: 8px; right: 8px; z-index: 100044; } .mfp-preloader a { color: #CCC; } .mfp-preloader a:hover { color: #FFF; } .mfp-s-ready .mfp-preloader { display: none; } .mfp-s-error .mfp-content { display: none; } button.mfp-close, button.mfp-arrow { overflow: visible; cursor: pointer; background: transparent; border: 0; -webkit-appearance: none; display: block; outline: none; padding: 0; z-index: 100046; box-shadow: none; touch-action: manipulation; } button::-moz-focus-inner { padding: 0; border: 0; } .mfp-close { width: 44px; height: 44px; line-height: 44px; position: absolute; right: 0; top: 0; text-decoration: none; text-align: center; opacity: 0.65; padding: 0 0 18px 10px; color: #FFF; font-style: normal; font-size: 28px; font-family: Arial, Baskerville, monospace; } .mfp-close:hover, .mfp-close:focus { opacity: 1; } .mfp-close:active { top: 1px; } .mfp-close-btn-in .mfp-close { color: #333; } .mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close { color: #FFF; right: -6px; text-align: right; padding-right: 6px; width: 100%; } .mfp-counter { position: absolute; top: 0; right: 0; color: #CCC; font-size: 12px; line-height: 18px; white-space: nowrap; } .mfp-arrow { position: absolute; opacity: 0.65; margin: 0; top: 50%; margin-top: -55px; padding: 0; width: 90px; height: 110px; -webkit-tap-highlight-color: transparent; } .mfp-arrow:active { margin-top: -54px; } .mfp-arrow:hover, .mfp-arrow:focus { opacity: 1; } .mfp-arrow:before, .mfp-arrow:after { content: ''; display: block; width: 0; height: 0; position: absolute; left: 0; top: 0; margin-top: 35px; margin-left: 35px; border: medium inset transparent; } .mfp-arrow:after { border-top-width: 13px; border-bottom-width: 13px; top: 8px; } .mfp-arrow:before { border-top-width: 21px; border-bottom-width: 21px; opacity: 0.7; } .mfp-arrow-left { left: 0; } .mfp-arrow-left:after { border-right: 17px solid #FFF; margin-left: 31px; } .mfp-arrow-left:before { margin-left: 25px; border-right: 27px solid #3F3F3F; } .mfp-arrow-right { right: 0; } .mfp-arrow-right:after { border-left: 17px solid #FFF; margin-left: 39px; } .mfp-arrow-right:before { border-left: 27px solid #3F3F3F; } .mfp-iframe-holder { padding-top: 40px; padding-bottom: 40px; } .mfp-iframe-holder .mfp-content { line-height: 0; width: 100%; max-width: 900px; } .mfp-iframe-holder .mfp-close { top: -40px; } .mfp-iframe-scaler { width: 100%; height: 0; overflow: hidden; padding-top: 56.25%; } .mfp-iframe-scaler iframe { position: absolute; display: block; top: 0; left: 0; width: 100%; height: 100%; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #000; } /* Main image in popup */ img.mfp-img { width: auto; max-width: 100%; height: auto; display: block; line-height: 0; box-sizing: border-box; padding: 40px 0 40px; margin: 0 auto; } /* The shadow behind the image */ .mfp-figure { line-height: 0; } .mfp-figure:after { content: ''; position: absolute; left: 0; top: 40px; bottom: 40px; display: block; right: 0; width: auto; height: auto; z-index: -1; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #444; } .mfp-figure small { color: #BDBDBD; display: block; font-size: 12px; line-height: 14px; } .mfp-figure figure { margin: 0; } .mfp-bottom-bar { margin-top: -36px; position: absolute; top: 100%; left: 0; width: 100%; cursor: auto; } .mfp-title { text-align: left; line-height: 18px; color: #F3F3F3; word-wrap: break-word; padding-right: 36px; } .mfp-image-holder .mfp-content { max-width: 100%; } .mfp-gallery .mfp-image-holder .mfp-figure { cursor: pointer; } @media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) { /** * Remove all paddings around the image on small screen */ .mfp-img-mobile .mfp-image-holder { padding-left: 0; padding-right: 0; } .mfp-img-mobile img.mfp-img { padding: 0; } .mfp-img-mobile .mfp-figure:after { top: 0; bottom: 0; } .mfp-img-mobile .mfp-figure small { display: inline; margin-left: 5px; } .mfp-img-mobile .mfp-bottom-bar { background: rgba(0, 0, 0, 0.6); bottom: 0; margin: 0; top: auto; padding: 3px 5px; position: fixed; box-sizing: border-box; } .mfp-img-mobile .mfp-bottom-bar:empty { padding: 0; } .mfp-img-mobile .mfp-counter { right: 5px; top: 3px; } .mfp-img-mobile .mfp-close { top: 0; right: 0; width: 35px; height: 35px; line-height: 35px; background: rgba(0, 0, 0, 0.6); position: fixed; text-align: center; padding: 0; } } @media all and (max-width: 900px) { .mfp-arrow { -webkit-transform: scale(0.75); transform: scale(0.75); } .mfp-arrow-left { -webkit-transform-origin: 0; transform-origin: 0; } .mfp-arrow-right { -webkit-transform-origin: 100%; transform-origin: 100%; } .mfp-container { padding-left: 6px; padding-right: 6px; } } .glyph { font-size: 16px; width: 4em; padding-bottom: 1em; margin-right: 1.5em; float: left; overflow: hidden; } .liga { width: 80%; width: calc(100% - 2.5em); } @font-face { font-family: 'Linearicons'; src: url('./../fonts/Linearicons.ttf') format('truetype'); font-weight: normal; font-style: normal; } [class^="li-"], [class*=" li-"] { font-family: 'Linearicons'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Enable Ligatures ================ */ -webkit-font-feature-settings: "liga"; -moz-font-feature-settings: "liga=1"; -moz-font-feature-settings: "liga"; -ms-font-feature-settings: "liga" 1; -o-font-feature-settings: "liga"; font-feature-settings: "liga"; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .li-home:before { content: "\e600"; } .li-home2:before { content: "\e601"; } .li-home3:before { content: "\e602"; } .li-home4:before { content: "\e603"; } .li-home5:before { content: "\e604"; } .li-home6:before { content: "\e605"; } .li-bathtub:before { content: "\e606"; } .li-toothbrush:before { content: "\e607"; } .li-bed:before { content: "\e608"; } .li-couch:before { content: "\e609"; } .li-chair:before { content: "\e60a"; } .li-city:before { content: "\e60b"; } .li-apartment:before { content: "\e60c"; } .li-pencil:before { content: "\e60d"; } .li-pencil2:before { content: "\e60e"; } .li-pen:before { content: "\e60f"; } .li-pencil3:before { content: "\e610"; } .li-eraser:before { content: "\e611"; } .li-pencil4:before { content: "\e612"; } .li-pencil5:before { content: "\e613"; } .li-feather:before { content: "\e614"; } .li-feather2:before { content: "\e615"; } .li-feather3:before { content: "\e616"; } .li-pen2:before { content: "\e617"; } .li-pen-add:before { content: "\e618"; } .li-pen-remove:before { content: "\e619"; } .li-vector:before { content: "\e61a"; } .li-pen3:before { content: "\e61b"; } .li-blog:before { content: "\e61c"; } .li-brush:before { content: "\e61d"; } .li-brush2:before { content: "\e61e"; } .li-spray:before { content: "\e61f"; } .li-paint-roller:before { content: "\e620"; } .li-stamp:before { content: "\e621"; } .li-tape:before { content: "\e622"; } .li-desk-tape:before { content: "\e623"; } .li-texture:before { content: "\e624"; } .li-eye-dropper:before { content: "\e625"; } .li-palette:before { content: "\e626"; } .li-color-sampler:before { content: "\e627"; } .li-bucket:before { content: "\e628"; } .li-gradient:before { content: "\e629"; } .li-gradient2:before { content: "\e62a"; } .li-magic-wand:before { content: "\e62b"; } .li-magnet:before { content: "\e62c"; } .li-pencil-ruler:before { content: "\e62d"; } .li-pencil-ruler2:before { content: "\e62e"; } .li-compass:before { content: "\e62f"; } .li-aim:before { content: "\e630"; } .li-gun:before { content: "\e631"; } .li-bottle:before { content: "\e632"; } .li-drop:before { content: "\e633"; } .li-drop-crossed:before { content: "\e634"; } .li-drop2:before { content: "\e635"; } .li-snow:before { content: "\e636"; } .li-snow2:before { content: "\e637"; } .li-fire:before { content: "\e638"; } .li-lighter:before { content: "\e639"; } .li-knife:before { content: "\e63a"; } .li-dagger:before { content: "\e63b"; } .li-tissue:before { content: "\e63c"; } .li-toilet-paper:before { content: "\e63d"; } .li-poop:before { content: "\e63e"; } .li-umbrella:before { content: "\e63f"; } .li-umbrella2:before { content: "\e640"; } .li-rain:before { content: "\e641"; } .li-tornado:before { content: "\e642"; } .li-wind:before { content: "\e643"; } .li-fan:before { content: "\e644"; } .li-contrast:before { content: "\e645"; } .li-sun-small:before { content: "\e646"; } .li-sun:before { content: "\e647"; } .li-sun2:before { content: "\e648"; } .li-moon:before { content: "\e649"; } .li-cloud:before { content: "\e64a"; } .li-cloud-upload:before { content: "\e64b"; } .li-cloud-download:before { content: "\e64c"; } .li-cloud-rain:before { content: "\e64d"; } .li-cloud-hailstones:before { content: "\e64e"; } .li-cloud-snow:before { content: "\e64f"; } .li-cloud-windy:before { content: "\e650"; } .li-sun-wind:before { content: "\e651"; } .li-cloud-fog:before { content: "\e652"; } .li-cloud-sun:before { content: "\e653"; } .li-cloud-lightning:before { content: "\e654"; } .li-cloud-sync:before { content: "\e655"; } .li-cloud-lock:before { content: "\e656"; } .li-cloud-gear:before { content: "\e657"; } .li-cloud-alert:before { content: "\e658"; } .li-cloud-check:before { content: "\e659"; } .li-cloud-cross:before { content: "\e65a"; } .li-cloud-crossed:before { content: "\e65b"; } .li-cloud-database:before { content: "\e65c"; } .li-database:before { content: "\e65d"; } .li-database-add:before { content: "\e65e"; } .li-database-remove:before { content: "\e65f"; } .li-database-lock:before { content: "\e660"; } .li-database-refresh:before { content: "\e661"; } .li-database-check:before { content: "\e662"; } .li-database-history:before { content: "\e663"; } .li-database-upload:before { content: "\e664"; } .li-database-download:before { content: "\e665"; } .li-server:before { content: "\e666"; } .li-shield:before { content: "\e667"; } .li-shield-check:before { content: "\e668"; } .li-shield-alert:before { content: "\e669"; } .li-shield-cross:before { content: "\e66a"; } .li-lock:before { content: "\e66b"; } .li-rotation-lock:before { content: "\e66c"; } .li-unlock:before { content: "\e66d"; } .li-key:before { content: "\e66e"; } .li-key-hole:before { content: "\e66f"; } .li-toggle-off:before { content: "\e670"; } .li-toggle-on:before { content: "\e671"; } .li-cog:before { content: "\e672"; } .li-cog2:before { content: "\e673"; } .li-wrench:before { content: "\e674"; } .li-screwdriver:before { content: "\e675"; } .li-hammer-wrench:before { content: "\e676"; } .li-hammer:before { content: "\e677"; } .li-saw:before { content: "\e678"; } .li-axe:before { content: "\e679"; } .li-axe2:before { content: "\e67a"; } .li-shovel:before { content: "\e67b"; } .li-pickaxe:before { content: "\e67c"; } .li-factory:before { content: "\e67d"; } .li-factory2:before { content: "\e67e"; } .li-recycle:before { content: "\e67f"; } .li-trash:before { content: "\e680"; } .li-trash2:before { content: "\e681"; } .li-trash3:before { content: "\e682"; } .li-broom:before { content: "\e683"; } .li-game:before { content: "\e684"; } .li-gamepad:before { content: "\e685"; } .li-joystick:before { content: "\e686"; } .li-dice:before { content: "\e687"; } .li-spades:before { content: "\e688"; } .li-diamonds:before { content: "\e689"; } .li-clubs:before { content: "\e68a"; } .li-hearts:before { content: "\e68b"; } .li-heart:before { content: "\e68c"; } .li-star:before { content: "\e68d"; } .li-star-half:before { content: "\e68e"; } .li-star-empty:before { content: "\e68f"; } .li-flag:before { content: "\e690"; } .li-flag2:before { content: "\e691"; } .li-flag3:before { content: "\e692"; } .li-mailbox-full:before { content: "\e693"; } .li-mailbox-empty:before { content: "\e694"; } .li-at-sign:before { content: "\e695"; } .li-envelope:before { content: "\e696"; } .li-envelope-open:before { content: "\e697"; } .li-paperclip:before { content: "\e698"; } .li-paper-plane:before { content: "\e699"; } .li-reply:before { content: "\e69a"; } .li-reply-all:before { content: "\e69b"; } .li-inbox:before { content: "\e69c"; } .li-inbox2:before { content: "\e69d"; } .li-outbox:before { content: "\e69e"; } .li-box:before { content: "\e69f"; } .li-archive:before { content: "\e6a0"; } .li-archive2:before { content: "\e6a1"; } .li-drawers:before { content: "\e6a2"; } .li-drawers2:before { content: "\e6a3"; } .li-drawers3:before { content: "\e6a4"; } .li-eye:before { content: "\e6a5"; } .li-eye-crossed:before { content: "\e6a6"; } .li-eye-plus:before { content: "\e6a7"; } .li-eye-minus:before { content: "\e6a8"; } .li-binoculars:before { content: "\e6a9"; } .li-binoculars2:before { content: "\e6aa"; } .li-hdd:before { content: "\e6ab"; } .li-hdd-down:before { content: "\e6ac"; } .li-hdd-up:before { content: "\e6ad"; } .li-floppy-disk:before { content: "\e6ae"; } .li-disc:before { content: "\e6af"; } .li-tape2:before { content: "\e6b0"; } .li-printer:before { content: "\e6b1"; } .li-shredder:before { content: "\e6b2"; } .li-file-empty:before { content: "\e6b3"; } .li-file-add:before { content: "\e6b4"; } .li-file-check:before { content: "\e6b5"; } .li-file-lock:before { content: "\e6b6"; } .li-files:before { content: "\e6b7"; } .li-copy:before { content: "\e6b8"; } .li-compare:before { content: "\e6b9"; } .li-folder:before { content: "\e6ba"; } .li-folder-search:before { content: "\e6bb"; } .li-folder-plus:before { content: "\e6bc"; } .li-folder-minus:before { content: "\e6bd"; } .li-folder-download:before { content: "\e6be"; } .li-folder-upload:before { content: "\e6bf"; } .li-folder-star:before { content: "\e6c0"; } .li-folder-heart:before { content: "\e6c1"; } .li-folder-user:before { content: "\e6c2"; } .li-folder-shared:before { content: "\e6c3"; } .li-folder-music:before { content: "\e6c4"; } .li-folder-picture:before { content: "\e6c5"; } .li-folder-film:before { content: "\e6c6"; } .li-scissors:before { content: "\e6c7"; } .li-paste:before { content: "\e6c8"; } .li-clipboard-empty:before { content: "\e6c9"; } .li-clipboard-pencil:before { content: "\e6ca"; } .li-clipboard-text:before { content: "\e6cb"; } .li-clipboard-check:before { content: "\e6cc"; } .li-clipboard-down:before { content: "\e6cd"; } .li-clipboard-left:before { content: "\e6ce"; } .li-clipboard-alert:before { content: "\e6cf"; } .li-clipboard-user:before { content: "\e6d0"; } .li-register:before { content: "\e6d1"; } .li-enter:before { content: "\e6d2"; } .li-exit:before { content: "\e6d3"; } .li-papers:before { content: "\e6d4"; } .li-news:before { content: "\e6d5"; } .li-reading:before { content: "\e6d6"; } .li-typewriter:before { content: "\e6d7"; } .li-document:before { content: "\e6d8"; } .li-document2:before { content: "\e6d9"; } .li-graduation-hat:before { content: "\e6da"; } .li-license:before { content: "\e6db"; } .li-license2:before { content: "\e6dc"; } .li-medal-empty:before { content: "\e6dd"; } .li-medal-first:before { content: "\e6de"; } .li-medal-second:before { content: "\e6df"; } .li-medal-third:before { content: "\e6e0"; } .li-podium:before { content: "\e6e1"; } .li-trophy:before { content: "\e6e2"; } .li-trophy2:before { content: "\e6e3"; } .li-music-note:before { content: "\e6e4"; } .li-music-note2:before { content: "\e6e5"; } .li-music-note3:before { content: "\e6e6"; } .li-playlist:before { content: "\e6e7"; } .li-playlist-add:before { content: "\e6e8"; } .li-guitar:before { content: "\e6e9"; } .li-trumpet:before { content: "\e6ea"; } .li-album:before { content: "\e6eb"; } .li-shuffle:before { content: "\e6ec"; } .li-repeat-one:before { content: "\e6ed"; } .li-repeat:before { content: "\e6ee"; } .li-headphones:before { content: "\e6ef"; } .li-headset:before { content: "\e6f0"; } .li-loudspeaker:before { content: "\e6f1"; } .li-equalizer:before { content: "\e6f2"; } .li-theater:before { content: "\e6f3"; } .li-3d-glasses:before { content: "\e6f4"; } .li-ticket:before { content: "\e6f5"; } .li-presentation:before { content: "\e6f6"; } .li-play:before { content: "\e6f7"; } .li-film-play:before { content: "\e6f8"; } .li-clapboard-play:before { content: "\e6f9"; } .li-media:before { content: "\e6fa"; } .li-film:before { content: "\e6fb"; } .li-film2:before { content: "\e6fc"; } .li-surveillance:before { content: "\e6fd"; } .li-surveillance2:before { content: "\e6fe"; } .li-camera:before { content: "\e6ff"; } .li-camera-crossed:before { content: "\e700"; } .li-camera-play:before { content: "\e701"; } .li-time-lapse:before { content: "\e702"; } .li-record:before { content: "\e703"; } .li-camera2:before { content: "\e704"; } .li-camera-flip:before { content: "\e705"; } .li-panorama:before { content: "\e706"; } .li-time-lapse2:before { content: "\e707"; } .li-shutter:before { content: "\e708"; } .li-shutter2:before { content: "\e709"; } .li-face-detection:before { content: "\e70a"; } .li-flare:before { content: "\e70b"; } .li-convex:before { content: "\e70c"; } .li-concave:before { content: "\e70d"; } .li-picture:before { content: "\e70e"; } .li-picture2:before { content: "\e70f"; } .li-picture3:before { content: "\e710"; } .li-pictures:before { content: "\e711"; } .li-book:before { content: "\e712"; } .li-audio-book:before { content: "\e713"; } .li-book2:before { content: "\e714"; } .li-bookmark:before { content: "\e715"; } .li-bookmark2:before { content: "\e716"; } .li-label:before { content: "\e717"; } .li-library:before { content: "\e718"; } .li-library2:before { content: "\e719"; } .li-contacts:before { content: "\e71a"; } .li-profile:before { content: "\e71b"; } .li-portrait:before { content: "\e71c"; } .li-portrait2:before { content: "\e71d"; } .li-user:before { content: "\e71e"; } .li-user-plus:before { content: "\e71f"; } .li-user-minus:before { content: "\e720"; } .li-user-lock:before { content: "\e721"; } .li-users:before { content: "\e722"; } .li-users2:before { content: "\e723"; } .li-users-plus:before { content: "\e724"; } .li-users-minus:before { content: "\e725"; } .li-group-work:before { content: "\e726"; } .li-woman:before { content: "\e727"; } .li-man:before { content: "\e728"; } .li-baby:before { content: "\e729"; } .li-baby2:before { content: "\e72a"; } .li-baby3:before { content: "\e72b"; } .li-baby-bottle:before { content: "\e72c"; } .li-walk:before { content: "\e72d"; } .li-hand-waving:before { content: "\e72e"; } .li-jump:before { content: "\e72f"; } .li-run:before { content: "\e730"; } .li-woman2:before { content: "\e731"; } .li-man2:before { content: "\e732"; } .li-man-woman:before { content: "\e733"; } .li-height:before { content: "\e734"; } .li-weight:before { content: "\e735"; } .li-scale:before { content: "\e736"; } .li-button:before { content: "\e737"; } .li-bow-tie:before { content: "\e738"; } .li-tie:before { content: "\e739"; } .li-socks:before { content: "\e73a"; } .li-shoe:before { content: "\e73b"; } .li-shoes:before { content: "\e73c"; } .li-hat:before { content: "\e73d"; } .li-pants:before { content: "\e73e"; } .li-shorts:before { content: "\e73f"; } .li-flip-flops:before { content: "\e740"; } .li-shirt:before { content: "\e741"; } .li-hanger:before { content: "\e742"; } .li-laundry:before { content: "\e743"; } .li-store:before { content: "\e744"; } .li-haircut:before { content: "\e745"; } .li-store-24:before { content: "\e746"; } .li-barcode:before { content: "\e747"; } .li-barcode2:before { content: "\e748"; } .li-barcode3:before { content: "\e749"; } .li-cashier:before { content: "\e74a"; } .li-bag:before { content: "\e74b"; } .li-bag2:before { content: "\e74c"; } .li-cart:before { content: "\e74d"; } .li-cart-empty:before { content: "\e74e"; } .li-cart-full:before { content: "\e74f"; } .li-cart-plus:before { content: "\e750"; } .li-cart-plus2:before { content: "\e751"; } .li-cart-add:before { content: "\e752"; } .li-cart-remove:before { content: "\e753"; } .li-cart-exchange:before { content: "\e754"; } .li-tag:before { content: "\e755"; } .li-tags:before { content: "\e756"; } .li-receipt:before { content: "\e757"; } .li-wallet:before { content: "\e758"; } .li-credit-card:before { content: "\e759"; } .li-cash-dollar:before { content: "\e75a"; } .li-cash-euro:before { content: "\e75b"; } .li-cash-pound:before { content: "\e75c"; } .li-cash-yen:before { content: "\e75d"; } .li-bag-dollar:before { content: "\e75e"; } .li-bag-euro:before { content: "\e75f"; } .li-bag-pound:before { content: "\e760"; } .li-bag-yen:before { content: "\e761"; } .li-coin-dollar:before { content: "\e762"; } .li-coin-euro:before { content: "\e763"; } .li-coin-pound:before { content: "\e764"; } .li-coin-yen:before { content: "\e765"; } .li-calculator:before { content: "\e766"; } .li-calculator2:before { content: "\e767"; } .li-abacus:before { content: "\e768"; } .li-vault:before { content: "\e769"; } .li-telephone:before { content: "\e76a"; } .li-phone-lock:before { content: "\e76b"; } .li-phone-wave:before { content: "\e76c"; } .li-phone-pause:before { content: "\e76d"; } .li-phone-outgoing:before { content: "\e76e"; } .li-phone-incoming:before { content: "\e76f"; } .li-phone-in-out:before { content: "\e770"; } .li-phone-error:before { content: "\e771"; } .li-phone-sip:before { content: "\e772"; } .li-phone-plus:before { content: "\e773"; } .li-phone-minus:before { content: "\e774"; } .li-voicemail:before { content: "\e775"; } .li-dial:before { content: "\e776"; } .li-telephone2:before { content: "\e777"; } .li-pushpin:before { content: "\e778"; } .li-pushpin2:before { content: "\e779"; } .li-map-marker:before { content: "\e77a"; } .li-map-marker-user:before { content: "\e77b"; } .li-map-marker-down:before { content: "\e77c"; } .li-map-marker-check:before { content: "\e77d"; } .li-map-marker-crossed:before { content: "\e77e"; } .li-radar:before { content: "\e77f"; } .li-compass2:before { content: "\e780"; } .li-map:before { content: "\e781"; } .li-map2:before { content: "\e782"; } .li-location:before { content: "\e783"; } .li-road-sign:before { content: "\e784"; } .li-calendar-empty:before { content: "\e785"; } .li-calendar-check:before { content: "\e786"; } .li-calendar-cross:before { content: "\e787"; } .li-calendar-31:before { content: "\e788"; } .li-calendar-full:before { content: "\e789"; } .li-calendar-insert:before { content: "\e78a"; } .li-calendar-text:before { content: "\e78b"; } .li-calendar-user:before { content: "\e78c"; } .li-mouse:before { content: "\e78d"; } .li-mouse-left:before { content: "\e78e"; } .li-mouse-right:before { content: "\e78f"; } .li-mouse-both:before { content: "\e790"; } .li-keyboard:before { content: "\e791"; } .li-keyboard-up:before { content: "\e792"; } .li-keyboard-down:before { content: "\e793"; } .li-delete:before { content: "\e794"; } .li-spell-check:before { content: "\e795"; } .li-escape:before { content: "\e796"; } .li-enter2:before { content: "\e797"; } .li-screen:before { content: "\e798"; } .li-aspect-ratio:before { content: "\e799"; } .li-signal:before { content: "\e79a"; } .li-signal-lock:before { content: "\e79b"; } .li-signal-80:before { content: "\e79c"; } .li-signal-60:before { content: "\e79d"; } .li-signal-40:before { content: "\e79e"; } .li-signal-20:before { content: "\e79f"; } .li-signal-0:before { content: "\e7a0"; } .li-signal-blocked:before { content: "\e7a1"; } .li-sim:before { content: "\e7a2"; } .li-flash-memory:before { content: "\e7a3"; } .li-usb-drive:before { content: "\e7a4"; } .li-phone:before { content: "\e7a5"; } .li-smartphone:before { content: "\e7a6"; } .li-smartphone-notification:before { content: "\e7a7"; } .li-smartphone-vibration:before { content: "\e7a8"; } .li-smartphone-embed:before { content: "\e7a9"; } .li-smartphone-waves:before { content: "\e7aa"; } .li-tablet:before { content: "\e7ab"; } .li-tablet2:before { content: "\e7ac"; } .li-laptop:before { content: "\e7ad"; } .li-laptop-phone:before { content: "\e7ae"; } .li-desktop:before { content: "\e7af"; } .li-launch:before { content: "\e7b0"; } .li-new-tab:before { content: "\e7b1"; } .li-window:before { content: "\e7b2"; } .li-cable:before { content: "\e7b3"; } .li-cable2:before { content: "\e7b4"; } .li-tv:before { content: "\e7b5"; } .li-radio:before { content: "\e7b6"; } .li-remote-control:before { content: "\e7b7"; } .li-power-switch:before { content: "\e7b8"; } .li-power:before { content: "\e7b9"; } .li-power-crossed:before { content: "\e7ba"; } .li-flash-auto:before { content: "\e7bb"; } .li-lamp:before { content: "\e7bc"; } .li-flashlight:before { content: "\e7bd"; } .li-lampshade:before { content: "\e7be"; } .li-cord:before { content: "\e7bf"; } .li-outlet:before { content: "\e7c0"; } .li-battery-power:before { content: "\e7c1"; } .li-battery-empty:before { content: "\e7c2"; } .li-battery-alert:before { content: "\e7c3"; } .li-battery-error:before { content: "\e7c4"; } .li-battery-low1:before { content: "\e7c5"; } .li-battery-low2:before { content: "\e7c6"; } .li-battery-low3:before { content: "\e7c7"; } .li-battery-mid1:before { content: "\e7c8"; } .li-battery-mid2:before { content: "\e7c9"; } .li-battery-mid3:before { content: "\e7ca"; } .li-battery-full:before { content: "\e7cb"; } .li-battery-charging:before { content: "\e7cc"; } .li-battery-charging2:before { content: "\e7cd"; } .li-battery-charging3:before { content: "\e7ce"; } .li-battery-charging4:before { content: "\e7cf"; } .li-battery-charging5:before { content: "\e7d0"; } .li-battery-charging6:before { content: "\e7d1"; } .li-battery-charging7:before { content: "\e7d2"; } .li-chip:before { content: "\e7d3"; } .li-chip-x64:before { content: "\e7d4"; } .li-chip-x86:before { content: "\e7d5"; } .li-bubble:before { content: "\e7d6"; } .li-bubbles:before { content: "\e7d7"; } .li-bubble-dots:before { content: "\e7d8"; } .li-bubble-alert:before { content: "\e7d9"; } .li-bubble-question:before { content: "\e7da"; } .li-bubble-text:before { content: "\e7db"; } .li-bubble-pencil:before { content: "\e7dc"; } .li-bubble-picture:before { content: "\e7dd"; } .li-bubble-video:before { content: "\e7de"; } .li-bubble-user:before { content: "\e7df"; } .li-bubble-quote:before { content: "\e7e0"; } .li-bubble-heart:before { content: "\e7e1"; } .li-bubble-emoticon:before { content: "\e7e2"; } .li-bubble-attachment:before { content: "\e7e3"; } .li-phone-bubble:before { content: "\e7e4"; } .li-quote-open:before { content: "\e7e5"; } .li-quote-close:before { content: "\e7e6"; } .li-dna:before { content: "\e7e7"; } .li-heart-pulse:before { content: "\e7e8"; } .li-pulse:before { content: "\e7e9"; } .li-syringe:before { content: "\e7ea"; } .li-pills:before { content: "\e7eb"; } .li-first-aid:before { content: "\e7ec"; } .li-lifebuoy:before { content: "\e7ed"; } .li-bandage:before { content: "\e7ee"; } .li-bandages:before { content: "\e7ef"; } .li-thermometer:before { content: "\e7f0"; } .li-microscope:before { content: "\e7f1"; } .li-brain:before { content: "\e7f2"; } .li-beaker:before { content: "\e7f3"; } .li-skull:before { content: "\e7f4"; } .li-bone:before { content: "\e7f5"; } .li-construction:before { content: "\e7f6"; } .li-construction-cone:before { content: "\e7f7"; } .li-pie-chart:before { content: "\e7f8"; } .li-pie-chart2:before { content: "\e7f9"; } .li-graph:before { content: "\e7fa"; } .li-chart-growth:before { content: "\e7fb"; } .li-chart-bars:before { content: "\e7fc"; } .li-chart-settings:before { content: "\e7fd"; } .li-cake:before { content: "\e7fe"; } .li-gift:before { content: "\e7ff"; } .li-balloon:before { content: "\e800"; } .li-rank:before { content: "\e801"; } .li-rank2:before { content: "\e802"; } .li-rank3:before { content: "\e803"; } .li-crown:before { content: "\e804"; } .li-lotus:before { content: "\e805"; } .li-diamond:before { content: "\e806"; } .li-diamond2:before { content: "\e807"; } .li-diamond3:before { content: "\e808"; } .li-diamond4:before { content: "\e809"; } .li-linearicons:before { content: "\e80a"; } .li-teacup:before { content: "\e80b"; } .li-teapot:before { content: "\e80c"; } .li-glass:before { content: "\e80d"; } .li-bottle2:before { content: "\e80e"; } .li-glass-cocktail:before { content: "\e80f"; } .li-glass2:before { content: "\e810"; } .li-dinner:before { content: "\e811"; } .li-dinner2:before { content: "\e812"; } .li-chef:before { content: "\e813"; } .li-scale2:before { content: "\e814"; } .li-egg:before { content: "\e815"; } .li-egg2:before { content: "\e816"; } .li-eggs:before { content: "\e817"; } .li-platter:before { content: "\e818"; } .li-steak:before { content: "\e819"; } .li-hamburger:before { content: "\e81a"; } .li-hotdog:before { content: "\e81b"; } .li-pizza:before { content: "\e81c"; } .li-sausage:before { content: "\e81d"; } .li-chicken:before { content: "\e81e"; } .li-fish:before { content: "\e81f"; } .li-carrot:before { content: "\e820"; } .li-cheese:before { content: "\e821"; } .li-bread:before { content: "\e822"; } .li-ice-cream:before { content: "\e823"; } .li-ice-cream2:before { content: "\e824"; } .li-candy:before { content: "\e825"; } .li-lollipop:before { content: "\e826"; } .li-coffee-bean:before { content: "\e827"; } .li-coffee-cup:before { content: "\e828"; } .li-cherry:before { content: "\e829"; } .li-grapes:before { content: "\e82a"; } .li-citrus:before { content: "\e82b"; } .li-apple:before { content: "\e82c"; } .li-leaf:before { content: "\e82d"; } .li-landscape:before { content: "\e82e"; } .li-pine-tree:before { content: "\e82f"; } .li-tree:before { content: "\e830"; } .li-cactus:before { content: "\e831"; } .li-paw:before { content: "\e832"; } .li-footprint:before { content: "\e833"; } .li-speed-slow:before { content: "\e834"; } .li-speed-medium:before { content: "\e835"; } .li-speed-fast:before { content: "\e836"; } .li-rocket:before { content: "\e837"; } .li-hammer2:before { content: "\e838"; } .li-balance:before { content: "\e839"; } .li-briefcase:before { content: "\e83a"; } .li-luggage-weight:before { content: "\e83b"; } .li-dolly:before { content: "\e83c"; } .li-plane:before { content: "\e83d"; } .li-plane-crossed:before { content: "\e83e"; } .li-helicopter:before { content: "\e83f"; } .li-traffic-lights:before { content: "\e840"; } .li-siren:before { content: "\e841"; } .li-road:before { content: "\e842"; } .li-engine:before { content: "\e843"; } .li-oil-pressure:before { content: "\e844"; } .li-coolant-temperature:before { content: "\e845"; } .li-car-battery:before { content: "\e846"; } .li-gas:before { content: "\e847"; } .li-gallon:before { content: "\e848"; } .li-transmission:before { content: "\e849"; } .li-car:before { content: "\e84a"; } .li-car-wash:before { content: "\e84b"; } .li-car-wash2:before { content: "\e84c"; } .li-bus:before { content: "\e84d"; } .li-bus2:before { content: "\e84e"; } .li-car2:before { content: "\e84f"; } .li-parking:before { content: "\e850"; } .li-car-lock:before { content: "\e851"; } .li-taxi:before { content: "\e852"; } .li-car-siren:before { content: "\e853"; } .li-car-wash3:before { content: "\e854"; } .li-car-wash4:before { content: "\e855"; } .li-ambulance:before { content: "\e856"; } .li-truck:before { content: "\e857"; } .li-trailer:before { content: "\e858"; } .li-scale-truck:before { content: "\e859"; } .li-train:before { content: "\e85a"; } .li-ship:before { content: "\e85b"; } .li-ship2:before { content: "\e85c"; } .li-anchor:before { content: "\e85d"; } .li-boat:before { content: "\e85e"; } .li-bicycle:before { content: "\e85f"; } .li-bicycle2:before { content: "\e860"; } .li-dumbbell:before { content: "\e861"; } .li-bench-press:before { content: "\e862"; } .li-swim:before { content: "\e863"; } .li-football:before { content: "\e864"; } .li-baseball-bat:before { content: "\e865"; } .li-baseball:before { content: "\e866"; } .li-tennis:before { content: "\e867"; } .li-tennis2:before { content: "\e868"; } .li-ping-pong:before { content: "\e869"; } .li-hockey:before { content: "\e86a"; } .li-8ball:before { content: "\e86b"; } .li-bowling:before { content: "\e86c"; } .li-bowling-pins:before { content: "\e86d"; } .li-golf:before { content: "\e86e"; } .li-golf2:before { content: "\e86f"; } .li-archery:before { content: "\e870"; } .li-slingshot:before { content: "\e871"; } .li-soccer:before { content: "\e872"; } .li-basketball:before { content: "\e873"; } .li-cube:before { content: "\e874"; } .li-3d-rotate:before { content: "\e875"; } .li-puzzle:before { content: "\e876"; } .li-glasses:before { content: "\e877"; } .li-glasses2:before { content: "\e878"; } .li-accessibility:before { content: "\e879"; } .li-wheelchair:before { content: "\e87a"; } .li-wall:before { content: "\e87b"; } .li-fence:before { content: "\e87c"; } .li-wall2:before { content: "\e87d"; } .li-icons:before { content: "\e87e"; } .li-resize-handle:before { content: "\e87f"; } .li-icons2:before { content: "\e880"; } .li-select:before { content: "\e881"; } .li-select2:before { content: "\e882"; } .li-site-map:before { content: "\e883"; } .li-earth:before { content: "\e884"; } .li-earth-lock:before { content: "\e885"; } .li-network:before { content: "\e886"; } .li-network-lock:before { content: "\e887"; } .li-planet:before { content: "\e888"; } .li-happy:before { content: "\e889"; } .li-smile:before { content: "\e88a"; } .li-grin:before { content: "\e88b"; } .li-tongue:before { content: "\e88c"; } .li-sad:before { content: "\e88d"; } .li-wink:before { content: "\e88e"; } .li-dream:before { content: "\e88f"; } .li-shocked:before { content: "\e890"; } .li-shocked2:before { content: "\e891"; } .li-tongue2:before { content: "\e892"; } .li-neutral:before { content: "\e893"; } .li-happy-grin:before { content: "\e894"; } .li-cool:before { content: "\e895"; } .li-mad:before { content: "\e896"; } .li-grin-evil:before { content: "\e897"; } .li-evil:before { content: "\e898"; } .li-wow:before { content: "\e899"; } .li-annoyed:before { content: "\e89a"; } .li-wondering:before { content: "\e89b"; } .li-confused:before { content: "\e89c"; } .li-zipped:before { content: "\e89d"; } .li-grumpy:before { content: "\e89e"; } .li-mustache:before { content: "\e89f"; } .li-tombstone-hipster:before { content: "\e8a0"; } .li-tombstone:before { content: "\e8a1"; } .li-ghost:before { content: "\e8a2"; } .li-ghost-hipster:before { content: "\e8a3"; } .li-halloween:before { content: "\e8a4"; } .li-christmas:before { content: "\e8a5"; } .li-easter-egg:before { content: "\e8a6"; } .li-mustache2:before { content: "\e8a7"; } .li-mustache-glasses:before { content: "\e8a8"; } .li-pipe:before { content: "\e8a9"; } .li-alarm:before { content: "\e8aa"; } .li-alarm-add:before { content: "\e8ab"; } .li-alarm-snooze:before { content: "\e8ac"; } .li-alarm-ringing:before { content: "\e8ad"; } .li-bullhorn:before { content: "\e8ae"; } .li-hearing:before { content: "\e8af"; } .li-volume-high:before { content: "\e8b0"; } .li-volume-medium:before { content: "\e8b1"; } .li-volume-low:before { content: "\e8b2"; } .li-volume:before { content: "\e8b3"; } .li-mute:before { content: "\e8b4"; } .li-lan:before { content: "\e8b5"; } .li-lan2:before { content: "\e8b6"; } .li-wifi:before { content: "\e8b7"; } .li-wifi-lock:before { content: "\e8b8"; } .li-wifi-blocked:before { content: "\e8b9"; } .li-wifi-mid:before { content: "\e8ba"; } .li-wifi-low:before { content: "\e8bb"; } .li-wifi-low2:before { content: "\e8bc"; } .li-wifi-alert:before { content: "\e8bd"; } .li-wifi-alert-mid:before { content: "\e8be"; } .li-wifi-alert-low:before { content: "\e8bf"; } .li-wifi-alert-low2:before { content: "\e8c0"; } .li-stream:before { content: "\e8c1"; } .li-stream-check:before { content: "\e8c2"; } .li-stream-error:before { content: "\e8c3"; } .li-stream-alert:before { content: "\e8c4"; } .li-communication:before { content: "\e8c5"; } .li-communication-crossed:before { content: "\e8c6"; } .li-broadcast:before { content: "\e8c7"; } .li-antenna:before { content: "\e8c8"; } .li-satellite:before { content: "\e8c9"; } .li-satellite2:before { content: "\e8ca"; } .li-mic:before { content: "\e8cb"; } .li-mic-mute:before { content: "\e8cc"; } .li-mic2:before { content: "\e8cd"; } .li-spotlights:before { content: "\e8ce"; } .li-hourglass:before { content: "\e8cf"; } .li-loading:before { content: "\e8d0"; } .li-loading2:before { content: "\e8d1"; } .li-loading3:before { content: "\e8d2"; } .li-refresh:before { content: "\e8d3"; } .li-refresh2:before { content: "\e8d4"; } .li-undo:before { content: "\e8d5"; } .li-redo:before { content: "\e8d6"; } .li-jump2:before { content: "\e8d7"; } .li-undo2:before { content: "\e8d8"; } .li-redo2:before { content: "\e8d9"; } .li-sync:before { content: "\e8da"; } .li-repeat-one2:before { content: "\e8db"; } .li-sync-crossed:before { content: "\e8dc"; } .li-sync2:before { content: "\e8dd"; } .li-repeat-one3:before { content: "\e8de"; } .li-sync-crossed2:before { content: "\e8df"; } .li-return:before { content: "\e8e0"; } .li-return2:before { content: "\e8e1"; } .li-refund:before { content: "\e8e2"; } .li-history:before { content: "\e8e3"; } .li-history2:before { content: "\e8e4"; } .li-self-timer:before { content: "\e8e5"; } .li-clock:before { content: "\e8e6"; } .li-clock2:before { content: "\e8e7"; } .li-clock3:before { content: "\e8e8"; } .li-watch:before { content: "\e8e9"; } .li-alarm2:before { content: "\e8ea"; } .li-alarm-add2:before { content: "\e8eb"; } .li-alarm-remove:before { content: "\e8ec"; } .li-alarm-check:before { content: "\e8ed"; } .li-alarm-error:before { content: "\e8ee"; } .li-timer:before { content: "\e8ef"; } .li-timer-crossed:before { content: "\e8f0"; } .li-timer2:before { content: "\e8f1"; } .li-timer-crossed2:before { content: "\e8f2"; } .li-download:before { content: "\e8f3"; } .li-upload:before { content: "\e8f4"; } .li-download2:before { content: "\e8f5"; } .li-upload2:before { content: "\e8f6"; } .li-enter-up:before { content: "\e8f7"; } .li-enter-down:before { content: "\e8f8"; } .li-enter-left:before { content: "\e8f9"; } .li-enter-right:before { content: "\e8fa"; } .li-exit-up:before { content: "\e8fb"; } .li-exit-down:before { content: "\e8fc"; } .li-exit-left:before { content: "\e8fd"; } .li-exit-right:before { content: "\e8fe"; } .li-enter-up2:before { content: "\e8ff"; } .li-enter-down2:before { content: "\e900"; } .li-enter-vertical:before { content: "\e901"; } .li-enter-left2:before { content: "\e902"; } .li-enter-right2:before { content: "\e903"; } .li-enter-horizontal:before { content: "\e904"; } .li-exit-up2:before { content: "\e905"; } .li-exit-down2:before { content: "\e906"; } .li-exit-left2:before { content: "\e907"; } .li-exit-right2:before { content: "\e908"; } .li-cli:before { content: "\e909"; } .li-bug:before { content: "\e90a"; } .li-code:before { content: "\e90b"; } .li-file-code:before { content: "\e90c"; } .li-file-image:before { content: "\e90d"; } .li-file-zip:before { content: "\e90e"; } .li-file-audio:before { content: "\e90f"; } .li-file-video:before { content: "\e910"; } .li-file-preview:before { content: "\e911"; } .li-file-charts:before { content: "\e912"; } .li-file-stats:before { content: "\e913"; } .li-file-spreadsheet:before { content: "\e914"; } .li-link:before { content: "\e915"; } .li-unlink:before { content: "\e916"; } .li-link2:before { content: "\e917"; } .li-unlink2:before { content: "\e918"; } .li-thumbs-up:before { content: "\e919"; } .li-thumbs-down:before { content: "\e91a"; } .li-thumbs-up2:before { content: "\e91b"; } .li-thumbs-down2:before { content: "\e91c"; } .li-thumbs-up3:before { content: "\e91d"; } .li-thumbs-down3:before { content: "\e91e"; } .li-share:before { content: "\e91f"; } .li-share2:before { content: "\e920"; } .li-share3:before { content: "\e921"; } .li-magnifier:before { content: "\e922"; } .li-file-search:before { content: "\e923"; } .li-find-replace:before { content: "\e924"; } .li-zoom-in:before { content: "\e925"; } .li-zoom-out:before { content: "\e926"; } .li-loupe:before { content: "\e927"; } .li-loupe-zoom-in:before { content: "\e928"; } .li-loupe-zoom-out:before { content: "\e929"; } .li-cross:before { content: "\e92a"; } .li-menu:before { content: "\e92b"; } .li-list:before { content: "\e92c"; } .li-list2:before { content: "\e92d"; } .li-list3:before { content: "\e92e"; } .li-menu2:before { content: "\e92f"; } .li-list4:before { content: "\e930"; } .li-menu3:before { content: "\e931"; } .li-exclamation:before { content: "\e932"; } .li-question:before { content: "\e933"; } .li-check:before { content: "\e934"; } .li-cross2:before { content: "\e935"; } .li-plus:before { content: "\e936"; } .li-minus:before { content: "\e937"; } .li-percent:before { content: "\e938"; } .li-chevron-up:before { content: "\e939"; } .li-chevron-down:before { content: "\e93a"; } .li-chevron-left:before { content: "\e93b"; } .li-chevron-right:before { content: "\e93c"; } .li-chevrons-expand-vertical:before { content: "\e93d"; } .li-chevrons-expand-horizontal:before { content: "\e93e"; } .li-chevrons-contract-vertical:before { content: "\e93f"; } .li-chevrons-contract-horizontal:before { content: "\e940"; } .li-arrow-up:before { content: "\e941"; } .li-arrow-down:before { content: "\e942"; } .li-arrow-left:before { content: "\e943"; } .li-arrow-right:before { content: "\e944"; } .li-arrow-up-right:before { content: "\e945"; } .li-arrows-merge:before { content: "\e946"; } .li-arrows-split:before { content: "\e947"; } .li-arrow-divert:before { content: "\e948"; } .li-arrow-return:before { content: "\e949"; } .li-expand:before { content: "\e94a"; } .li-contract:before { content: "\e94b"; } .li-expand2:before { content: "\e94c"; } .li-contract2:before { content: "\e94d"; } .li-move:before { content: "\e94e"; } .li-tab:before { content: "\e94f"; } .li-arrow-wave:before { content: "\e950"; } .li-expand3:before { content: "\e951"; } .li-expand4:before { content: "\e952"; } .li-contract3:before { content: "\e953"; } .li-notification:before { content: "\e954"; } .li-warning:before { content: "\e955"; } .li-notification-circle:before { content: "\e956"; } .li-question-circle:before { content: "\e957"; } .li-menu-circle:before { content: "\e958"; } .li-checkmark-circle:before { content: "\e959"; } .li-cross-circle:before { content: "\e95a"; } .li-plus-circle:before { content: "\e95b"; } .li-circle-minus:before { content: "\e95c"; } .li-percent-circle:before { content: "\e95d"; } .li-arrow-up-circle:before { content: "\e95e"; } .li-arrow-down-circle:before { content: "\e95f"; } .li-arrow-left-circle:before { content: "\e960"; } .li-arrow-right-circle:before { content: "\e961"; } .li-chevron-up-circle:before { content: "\e962"; } .li-chevron-down-circle:before { content: "\e963"; } .li-chevron-left-circle:before { content: "\e964"; } .li-chevron-right-circle:before { content: "\e965"; } .li-backward-circle:before { content: "\e966"; } .li-first-circle:before { content: "\e967"; } .li-previous-circle:before { content: "\e968"; } .li-stop-circle:before { content: "\e969"; } .li-play-circle:before { content: "\e96a"; } .li-pause-circle:before { content: "\e96b"; } .li-next-circle:before { content: "\e96c"; } .li-last-circle:before { content: "\e96d"; } .li-forward-circle:before { content: "\e96e"; } .li-eject-circle:before { content: "\e96f"; } .li-crop:before { content: "\e970"; } .li-frame-expand:before { content: "\e971"; } .li-frame-contract:before { content: "\e972"; } .li-focus:before { content: "\e973"; } .li-transform:before { content: "\e974"; } .li-grid:before { content: "\e975"; } .li-grid-crossed:before { content: "\e976"; } .li-layers:before { content: "\e977"; } .li-layers-crossed:before { content: "\e978"; } .li-toggle:before { content: "\e979"; } .li-rulers:before { content: "\e97a"; } .li-ruler:before { content: "\e97b"; } .li-funnel:before { content: "\e97c"; } .li-flip-horizontal:before { content: "\e97d"; } .li-flip-vertical:before { content: "\e97e"; } .li-flip-horizontal2:before { content: "\e97f"; } .li-flip-vertical2:before { content: "\e980"; } .li-angle:before { content: "\e981"; } .li-angle2:before { content: "\e982"; } .li-subtract:before { content: "\e983"; } .li-combine:before { content: "\e984"; } .li-intersect:before { content: "\e985"; } .li-exclude:before { content: "\e986"; } .li-align-center-vertical:before { content: "\e987"; } .li-align-right:before { content: "\e988"; } .li-align-bottom:before { content: "\e989"; } .li-align-left:before { content: "\e98a"; } .li-align-center-horizontal:before { content: "\e98b"; } .li-align-top:before { content: "\e98c"; } .li-square:before { content: "\e98d"; } .li-plus-square:before { content: "\e98e"; } .li-minus-square:before { content: "\e98f"; } .li-percent-square:before { content: "\e990"; } .li-arrow-up-square:before { content: "\e991"; } .li-arrow-down-square:before { content: "\e992"; } .li-arrow-left-square:before { content: "\e993"; } .li-arrow-right-square:before { content: "\e994"; } .li-chevron-up-square:before { content: "\e995"; } .li-chevron-down-square:before { content: "\e996"; } .li-chevron-left-square:before { content: "\e997"; } .li-chevron-right-square:before { content: "\e998"; } .li-check-square:before { content: "\e999"; } .li-cross-square:before { content: "\e99a"; } .li-menu-square:before { content: "\e99b"; } .li-prohibited:before { content: "\e99c"; } .li-circle:before { content: "\e99d"; } .li-radio-button:before { content: "\e99e"; } .li-ligature:before { content: "\e99f"; } .li-text-format:before { content: "\e9a0"; } .li-text-format-remove:before { content: "\e9a1"; } .li-text-size:before { content: "\e9a2"; } .li-bold:before { content: "\e9a3"; } .li-italic:before { content: "\e9a4"; } .li-underline:before { content: "\e9a5"; } .li-strikethrough:before { content: "\e9a6"; } .li-highlight:before { content: "\e9a7"; } .li-text-align-left:before { content: "\e9a8"; } .li-text-align-center:before { content: "\e9a9"; } .li-text-align-right:before { content: "\e9aa"; } .li-text-align-justify:before { content: "\e9ab"; } .li-line-spacing:before { content: "\e9ac"; } .li-indent-increase:before { content: "\e9ad"; } .li-indent-decrease:before { content: "\e9ae"; } .li-text-wrap:before { content: "\e9af"; } .li-pilcrow:before { content: "\e9b0"; } .li-direction-ltr:before { content: "\e9b1"; } .li-direction-rtl:before { content: "\e9b2"; } .li-page-break:before { content: "\e9b3"; } .li-page-break2:before { content: "\e9b4"; } .li-sort-alpha-asc:before { content: "\e9b5"; } .li-sort-alpha-desc:before { content: "\e9b6"; } .li-sort-numeric-asc:before { content: "\e9b7"; } .li-sort-numeric-desc:before { content: "\e9b8"; } .li-sort-amount-asc:before { content: "\e9b9"; } .li-sort-amount-desc:before { content: "\e9ba"; } .li-sort-time-asc:before { content: "\e9bb"; } .li-sort-time-desc:before { content: "\e9bc"; } .li-sigma:before { content: "\e9bd"; } .li-pencil-line:before { content: "\e9be"; } .li-hand:before { content: "\e9bf"; } .li-pointer-up:before { content: "\e9c0"; } .li-pointer-right:before { content: "\e9c1"; } .li-pointer-down:before { content: "\e9c2"; } .li-pointer-left:before { content: "\e9c3"; } .li-finger-tap:before { content: "\e9c4"; } .li-fingers-tap:before { content: "\e9c5"; } .li-reminder:before { content: "\e9c6"; } .li-fingers-crossed:before { content: "\e9c7"; } .li-fingers-victory:before { content: "\e9c8"; } .li-gesture-zoom:before { content: "\e9c9"; } .li-gesture-pinch:before { content: "\e9ca"; } .li-fingers-scroll-horizontal:before { content: "\e9cb"; } .li-fingers-scroll-vertical:before { content: "\e9cc"; } .li-fingers-scroll-left:before { content: "\e9cd"; } .li-fingers-scroll-right:before { content: "\e9ce"; } .li-hand2:before { content: "\e9cf"; } .li-pointer-up2:before { content: "\e9d0"; } .li-pointer-right2:before { content: "\e9d1"; } .li-pointer-down2:before { content: "\e9d2"; } .li-pointer-left2:before { content: "\e9d3"; } .li-finger-tap2:before { content: "\e9d4"; } .li-fingers-tap2:before { content: "\e9d5"; } .li-reminder2:before { content: "\e9d6"; } .li-gesture-zoom2:before { content: "\e9d7"; } .li-gesture-pinch2:before { content: "\e9d8"; } .li-fingers-scroll-horizontal2:before { content: "\e9d9"; } .li-fingers-scroll-vertical2:before { content: "\e9da"; } .li-fingers-scroll-left2:before { content: "\e9db"; } .li-fingers-scroll-right2:before { content: "\e9dc"; } .li-fingers-scroll-vertical3:before { content: "\e9dd"; } .li-border-style:before { content: "\e9de"; } .li-border-all:before { content: "\e9df"; } .li-border-outer:before { content: "\e9e0"; } .li-border-inner:before { content: "\e9e1"; } .li-border-top:before { content: "\e9e2"; } .li-border-horizontal:before { content: "\e9e3"; } .li-border-bottom:before { content: "\e9e4"; } .li-border-left:before { content: "\e9e5"; } .li-border-vertical:before { content: "\e9e6"; } .li-border-right:before { content: "\e9e7"; } .li-border-none:before { content: "\e9e8"; } .li-ellipsis:before { content: "\e9e9"; } .li-uni21:before { content: "\21"; } .li-uni22:before { content: "\22"; } .li-uni23:before { content: "\23"; } .li-uni24:before { content: "\24"; } .li-uni25:before { content: "\25"; } .li-uni26:before { content: "\26"; } .li-uni27:before { content: "\27"; } .li-uni28:before { content: "\28"; } .li-uni29:before { content: "\29"; } .li-uni2a:before { content: "\2a"; } .li-uni2b:before { content: "\2b"; } .li-uni2c:before { content: "\2c"; } .li-uni2d:before { content: "\2d"; } .li-uni2e:before { content: "\2e"; } .li-uni2f:before { content: "\2f"; } .li-uni30:before { content: "\30"; } .li-uni31:before { content: "\31"; } .li-uni32:before { content: "\32"; } .li-uni33:before { content: "\33"; } .li-uni34:before { content: "\34"; } .li-uni35:before { content: "\35"; } .li-uni36:before { content: "\36"; } .li-uni37:before { content: "\37"; } .li-uni38:before { content: "\38"; } .li-uni39:before { content: "\39"; } .li-uni3a:before { content: "\3a"; } .li-uni3b:before { content: "\3b"; } .li-uni3c:before { content: "\3c"; } .li-uni3d:before { content: "\3d"; } .li-uni3e:before { content: "\3e"; } .li-uni3f:before { content: "\3f"; } .li-uni40:before { content: "\40"; } .li-uni41:before { content: "\41"; } .li-uni42:before { content: "\42"; } .li-uni43:before { content: "\43"; } .li-uni44:before { content: "\44"; } .li-uni45:before { content: "\45"; } .li-uni46:before { content: "\46"; } .li-uni47:before { content: "\47"; } .li-uni48:before { content: "\48"; } .li-uni49:before { content: "\49"; } .li-uni4a:before { content: "\4a"; } .li-uni4b:before { content: "\4b"; } .li-uni4c:before { content: "\4c"; } .li-uni4d:before { content: "\4d"; } .li-uni4e:before { content: "\4e"; } .li-uni4f:before { content: "\4f"; } .li-uni50:before { content: "\50"; } .li-uni51:before { content: "\51"; } .li-uni52:before { content: "\52"; } .li-uni53:before { content: "\53"; } .li-uni54:before { content: "\54"; } .li-uni55:before { content: "\55"; } .li-uni56:before { content: "\56"; } .li-uni57:before { content: "\57"; } .li-uni58:before { content: "\58"; } .li-uni59:before { content: "\59"; } .li-uni5a:before { content: "\5a"; } .li-uni5b:before { content: "\5b"; } .li-uni5c:before { content: "\5c"; } .li-uni5d:before { content: "\5d"; } .li-uni5e:before { content: "\5e"; } .li-uni5f:before { content: "\5f"; } .li-uni60:before { content: "\60"; } .li-uni61:before { content: "\61"; } .li-uni62:before { content: "\62"; } .li-uni63:before { content: "\63"; } .li-uni64:before { content: "\64"; } .li-uni65:before { content: "\65"; } .li-uni66:before { content: "\66"; } .li-uni67:before { content: "\67"; } .li-uni68:before { content: "\68"; } .li-uni69:before { content: "\69"; } .li-uni6a:before { content: "\6a"; } .li-uni6b:before { content: "\6b"; } .li-uni6c:before { content: "\6c"; } .li-uni6d:before { content: "\6d"; } .li-uni6e:before { content: "\6e"; } .li-uni6f:before { content: "\6f"; } .li-uni70:before { content: "\70"; } .li-uni71:before { content: "\71"; } .li-uni72:before { content: "\72"; } .li-uni73:before { content: "\73"; } .li-uni74:before { content: "\74"; } .li-uni75:before { content: "\75"; } .li-uni76:before { content: "\76"; } .li-uni77:before { content: "\77"; } .li-uni78:before { content: "\78"; } .li-uni79:before { content: "\79"; } .li-uni7a:before { content: "\7a"; } .li-uni7b:before { content: "\7b"; } .li-uni7c:before { content: "\7c"; } .li-uni7d:before { content: "\7d"; } .li-uni7e:before { content: "\7e"; } .li-copyright:before { content: "\a9"; } @font-face{font-family:'ElegantIcons';src:url('./../fonts/ElegantIcons.eot');src:url('./../fonts/ElegantIcons.eot') format('embedded-opentype'),url('./../fonts/ElegantIcons.woff') format('woff'),url('./../fonts/ElegantIcons.ttf') format('truetype'),url('./../fonts/ElegantIcons.svg') format('svg');font-weight:normal;font-style:normal} .ei{font-family:"ElegantIcons";font-style:normal;font-variant:normal;font-weight:normal;line-height:1;speak:none;text-transform:none} .ei-arrow_up::before,.ei-icon_arrow_up::before{content:'\21'} .ei-arrow_down::before,.ei-icon_arrow_down::before{content:'\22'} .ei-arrow_left::before,.ei-icon_arrow_left::before{content:'\23'} .ei-arrow_right::before,.ei-icon_arrow_right::before{content:'\24'} .ei-arrow_left-up::before,.ei-icon_arrow_left-up::before{content:'\25'} .ei-arrow_right-up::before,.ei-icon_arrow_right-up::before{content:'\26'} .ei-arrow_right-down::before,.ei-icon_arrow_right-down::before{content:'\27'} .ei-arrow_left-down::before,.ei-icon_arrow_left-down::before{content:'\28'} .ei-arrow-up-down::before,.ei-icon_arrow-up-down::before{content:'\29'} .ei-arrow_up-down_alt::before,.ei-icon_arrow_up-down_alt::before{content:'\2a'} .ei-arrow_left-right_alt::before,.ei-icon_arrow_left-right_alt::before{content:'\2b'} .ei-arrow_left-right::before,.ei-icon_arrow_left-right::before{content:'\2c'} .ei-arrow_expand_alt2::before,.ei-icon_arrow_expand_alt2::before{content:'\2d'} .ei-arrow_expand_alt::before,.ei-icon_arrow_expand_alt::before{content:'\2e'} .ei-arrow_condense::before,.ei-icon_arrow_condense::before{content:'\2f'} .ei-arrow_expand::before,.ei-icon_arrow_expand::before{content:'\30'} .ei-arrow_move::before,.ei-icon_arrow_move::before{content:'\31'} .ei-arrow_carrot-up::before,.ei-icon_arrow_carrot-up::before{content:'\32'} .ei-arrow_carrot-down::before,.ei-icon_arrow_carrot-down::before{content:'\33'} .ei-arrow_carrot-left::before,.ei-icon_arrow_carrot-left::before{content:'\34'} .ei-arrow_carrot-right::before,.ei-icon_arrow_carrot-right::before{content:'\35'} .ei-arrow_carrot-2up::before,.ei-icon_arrow_carrot-2up::before{content:'\36'} .ei-arrow_carrot-2down::before,.ei-icon_arrow_carrot-2down::before{content:'\37'} .ei-arrow_carrot-2left::before,.ei-icon_arrow_carrot-2left::before{content:'\38'} .ei-arrow_carrot-2right::before,.ei-icon_arrow_carrot-2right::before{content:'\39'} .ei-arrow_carrot-up_alt2::before,.ei-icon_arrow_carrot-up_alt2::before{content:'\3a'} .ei-arrow_carrot-down_alt2::before,.ei-icon_arrow_carrot-down_alt2::before{content:'\3b'} .ei-arrow_carrot-left_alt2::before,.ei-icon_arrow_carrot-left_alt2::before{content:'\3c'} .ei-arrow_carrot-right_alt2::before,.ei-icon_arrow_carrot-right_alt2::before{content:'\3d'} .ei-arrow_carrot-2up_alt2::before,.ei-icon_arrow_carrot-2up_alt2::before{content:'\3e'} .ei-arrow_carrot-2down_alt2::before,.ei-icon_arrow_carrot-2down_alt2::before{content:'\3f'} .ei-arrow_carrot-2left_alt2::before,.ei-icon_arrow_carrot-2left_alt2::before{content:'\40'} .ei-arrow_carrot-2right_alt2::before,.ei-icon_arrow_carrot-2right_alt2::before{content:'\41'} .ei-arrow_triangle-up::before,.ei-icon_arrow_triangle-up::before{content:'\42'} .ei-arrow_triangle-down::before,.ei-icon_arrow_triangle-down::before{content:'\43'} .ei-arrow_triangle-left::before,.ei-icon_arrow_triangle-left::before{content:'\44'} .ei-arrow_triangle-right::before,.ei-icon_arrow_triangle-right::before{content:'\45'} .ei-arrow_triangle-up_alt2::before,.ei-icon_arrow_triangle-up_alt2::before{content:'\46'} .ei-arrow_triangle-down_alt2::before,.ei-icon_arrow_triangle-down_alt2::before{content:'\47'} .ei-arrow_triangle-left_alt2::before,.ei-icon_arrow_triangle-left_alt2::before{content:'\48'} .ei-arrow_triangle-right_alt2::before,.ei-icon_arrow_triangle-right_alt2::before{content:'\49'} .ei-arrow_back::before,.ei-icon_arrow_back::before{content:'\4a'} .ei-minus-06::before,.ei-icon_minus-06::before{content:'\4b'} .ei-plus::before,.ei-icon_plus::before{content:'\4c'} .ei-close::before,.ei-icon_close::before{content:'\4d'} .ei-check::before,.ei-icon_check::before{content:'\4e'} .ei-minus_alt2::before,.ei-icon_minus_alt2::before{content:'\4f'} .ei-plus_alt2::before,.ei-icon_plus_alt2::before{content:'\50'} .ei-close_alt2::before,.ei-icon_close_alt2::before{content:'\51'} .ei-check_alt2::before,.ei-icon_check_alt2::before{content:'\52'} .ei-zoom-out_alt::before,.ei-icon_zoom-out_alt::before{content:'\53'} .ei-zoom-in_alt::before,.ei-icon_zoom-in_alt::before{content:'\54'} .ei-search::before,.ei-icon_search::before{content:'\55'} .ei-box-empty::before,.ei-icon_box-empty::before{content:'\56'} .ei-box-selected::before,.ei-icon_box-selected::before{content:'\57'} .ei-minus-box::before,.ei-icon_minus-box::before{content:'\58'} .ei-plus-box::before,.ei-icon_plus-box::before{content:'\59'} .ei-box-checked::before,.ei-icon_box-checked::before{content:'\5a'} .ei-circle-empty::before,.ei-icon_circle-empty::before{content:'\5b'} .ei-circle-slelected::before,.ei-icon_circle-slelected::before{content:'\5c'} .ei-circle-selected::before,.ei-icon_circle-selected::before{content:'\5c'} .ei-stop_alt2::before,.ei-icon_stop_alt2::before{content:'\5d'} .ei-stop::before,.ei-icon_stop::before{content:'\5e'} .ei-pause_alt2::before,.ei-icon_pause_alt2::before{content:'\5f'} .ei-pause::before,.ei-icon_pause::before{content:'\60'} .ei-menu::before,.ei-icon_menu::before{content:'\61'} .ei-menu-square_alt2::before,.ei-icon_menu-square_alt2::before{content:'\62'} .ei-menu-circle_alt2::before,.ei-icon_menu-circle_alt2::before{content:'\63'} .ei-ul::before,.ei-icon_ul::before{content:'\64'} .ei-ol::before,.ei-icon_ol::before{content:'\65'} .ei-adjust-horiz::before,.ei-icon_adjust-horiz::before{content:'\66'} .ei-adjust-vert::before,.ei-icon_adjust-vert::before{content:'\67'} .ei-document_alt::before,.ei-icon_document_alt::before{content:'\68'} .ei-documents_alt::before,.ei-icon_documents_alt::before{content:'\69'} .ei-pencil::before,.ei-icon_pencil::before{content:'\6a'} .ei-pencil-edit_alt::before,.ei-icon_pencil-edit_alt::before{content:'\6b'} .ei-pencil-edit::before,.ei-icon_pencil-edit::before{content:'\6c'} .ei-folder-alt::before,.ei-icon_folder-alt::before{content:'\6d'} .ei-folder-open_alt::before,.ei-icon_folder-open_alt::before{content:'\6e'} .ei-folder-add_alt::before,.ei-icon_folder-add_alt::before{content:'\6f'} .ei-info_alt::before,.ei-icon_info_alt::before{content:'\70'} .ei-error-oct_alt::before,.ei-icon_error-oct_alt::before{content:'\71'} .ei-error-circle_alt::before,.ei-icon_error-circle_alt::before{content:'\72'} .ei-error-triangle_alt::before,.ei-icon_error-triangle_alt::before{content:'\73'} .ei-question_alt2::before,.ei-icon_question_alt2::before{content:'\74'} .ei-question::before,.ei-icon_question::before{content:'\75'} .ei-comment_alt::before,.ei-icon_comment_alt::before{content:'\76'} .ei-chat_alt::before,.ei-icon_chat_alt::before{content:'\77'} .ei-vol-mute_alt::before,.ei-icon_vol-mute_alt::before{content:'\78'} .ei-volume-low_alt::before,.ei-icon_volume-low_alt::before{content:'\79'} .ei-volume-high_alt::before,.ei-icon_volume-high_alt::before{content:'\7a'} .ei-quotations::before,.ei-icon_quotations::before{content:'\7b'} .ei-quotations_alt2::before,.ei-icon_quotations_alt2::before{content:'\7c'} .ei-clock_alt::before,.ei-icon_clock_alt::before{content:'\7d'} .ei-lock_alt::before,.ei-icon_lock_alt::before{content:'\7e'} .ei-lock-open_alt::before,.ei-icon_lock-open_alt::before{content:'\e000'} .ei-key_alt::before,.ei-icon_key_alt::before{content:'\e001'} .ei-cloud_alt::before,.ei-icon_cloud_alt::before{content:'\e002'} .ei-cloud-upload_alt::before,.ei-icon_cloud-upload_alt::before{content:'\e003'} .ei-cloud-download_alt::before,.ei-icon_cloud-download_alt::before{content:'\e004'} .ei-image::before,.ei-icon_image::before{content:'\e005'} .ei-images::before,.ei-icon_images::before{content:'\e006'} .ei-lightbulb_alt::before,.ei-icon_lightbulb_alt::before{content:'\e007'} .ei-gift_alt::before,.ei-icon_gift_alt::before{content:'\e008'} .ei-house_alt::before,.ei-icon_house_alt::before{content:'\e009'} .ei-genius::before,.ei-icon_genius::before{content:'\e00a'} .ei-mobile::before,.ei-icon_mobile::before{content:'\e00b'} .ei-tablet::before,.ei-icon_tablet::before{content:'\e00c'} .ei-laptop::before,.ei-icon_laptop::before{content:'\e00d'} .ei-desktop::before,.ei-icon_desktop::before{content:'\e00e'} .ei-camera_alt::before,.ei-icon_camera_alt::before{content:'\e00f'} .ei-mail_alt::before,.ei-icon_mail_alt::before{content:'\e010'} .ei-cone_alt::before,.ei-icon_cone_alt::before{content:'\e011'} .ei-ribbon_alt::before,.ei-icon_ribbon_alt::before{content:'\e012'} .ei-bag_alt::before,.ei-icon_bag_alt::before{content:'\e013'} .ei-creditcard::before,.ei-icon_creditcard::before{content:'\e014'} .ei-cart_alt::before,.ei-icon_cart_alt::before{content:'\e015'} .ei-paperclip::before,.ei-icon_paperclip::before{content:'\e016'} .ei-tag_alt::before,.ei-icon_tag_alt::before{content:'\e017'} .ei-tags_alt::before,.ei-icon_tags_alt::before{content:'\e018'} .ei-trash_alt::before,.ei-icon_trash_alt::before{content:'\e019'} .ei-cursor_alt::before,.ei-icon_cursor_alt::before{content:'\e01a'} .ei-mic_alt::before,.ei-icon_mic_alt::before{content:'\e01b'} .ei-compass_alt::before,.ei-icon_compass_alt::before{content:'\e01c'} .ei-pin_alt::before,.ei-icon_pin_alt::before{content:'\e01d'} .ei-pushpin_alt::before,.ei-icon_pushpin_alt::before{content:'\e01e'} .ei-map_alt::before,.ei-icon_map_alt::before{content:'\e01f'} .ei-drawer_alt::before,.ei-icon_drawer_alt::before{content:'\e020'} .ei-toolbox_alt::before,.ei-icon_toolbox_alt::before{content:'\e021'} .ei-book_alt::before,.ei-icon_book_alt::before{content:'\e022'} .ei-calendar::before,.ei-icon_calendar::before{content:'\e023'} .ei-film::before,.ei-icon_film::before{content:'\e024'} .ei-table::before,.ei-icon_table::before{content:'\e025'} .ei-contacts_alt::before,.ei-icon_contacts_alt::before{content:'\e026'} .ei-headphones::before,.ei-icon_headphones::before{content:'\e027'} .ei-lifesaver::before,.ei-icon_lifesaver::before{content:'\e028'} .ei-piechart::before,.ei-icon_piechart::before{content:'\e029'} .ei-refresh::before,.ei-icon_refresh::before{content:'\e02a'} .ei-link_alt::before,.ei-icon_link_alt::before{content:'\e02b'} .ei-link::before,.ei-icon_link::before{content:'\e02c'} .ei-loading::before,.ei-icon_loading::before{content:'\e02d'} .ei-blocked::before,.ei-icon_blocked::before{content:'\e02e'} .ei-archive_alt::before,.ei-icon_archive_alt::before{content:'\e02f'} .ei-heart_alt::before,.ei-icon_heart_alt::before{content:'\e030'} .ei-star_alt::before,.ei-icon_star_alt::before{content:'\e031'} .ei-star-half_alt::before,.ei-icon_star-half_alt::before{content:'\e032'} .ei-star::before,.ei-icon_star::before{content:'\e033'} .ei-star-half::before,.ei-icon_star-half::before{content:'\e034'} .ei-tools::before,.ei-icon_tools::before{content:'\e035'} .ei-tool::before,.ei-icon_tool::before{content:'\e036'} .ei-cog::before,.ei-icon_cog::before{content:'\e037'} .ei-cogs::before,.ei-icon_cogs::before{content:'\e038'} .ei-arrow_up_alt::before,.ei-icon_arrow_up_alt::before{content:'\e039'} .ei-arrow_down_alt::before,.ei-icon_arrow_down_alt::before{content:'\e03a'} .ei-arrow_left_alt::before,.ei-icon_arrow_left_alt::before{content:'\e03b'} .ei-arrow_right_alt::before,.ei-icon_arrow_right_alt::before{content:'\e03c'} .ei-arrow_left-up_alt::before,.ei-icon_arrow_left-up_alt::before{content:'\e03d'} .ei-arrow_right-up_alt::before,.ei-icon_arrow_right-up_alt::before{content:'\e03e'} .ei-arrow_right-down_alt::before,.ei-icon_arrow_right-down_alt::before{content:'\e03f'} .ei-arrow_left-down_alt::before,.ei-icon_arrow_left-down_alt::before{content:'\e040'} .ei-arrow_condense_alt::before,.ei-icon_arrow_condense_alt::before{content:'\e041'} .ei-arrow_expand_alt3::before,.ei-icon_arrow_expand_alt3::before{content:'\e042'} .ei-arrow_carrot_up_alt::before,.ei-icon_arrow_carrot_up_alt::before{content:'\e043'} .ei-arrow_carrot-down_alt::before,.ei-icon_arrow_carrot-down_alt::before{content:'\e044'} .ei-arrow_carrot-left_alt::before,.ei-icon_arrow_carrot-left_alt::before{content:'\e045'} .ei-arrow_carrot-right_alt::before,.ei-icon_arrow_carrot-right_alt::before{content:'\e046'} .ei-arrow_carrot-2up_alt::before,.ei-icon_arrow_carrot-2up_alt::before{content:'\e047'} .ei-arrow_carrot-2dwnn_alt::before,.ei-icon_arrow_carrot-2dwnn_alt::before{content:'\e048'} .ei-arrow_carrot-2left_alt::before,.ei-icon_arrow_carrot-2left_alt::before{content:'\e049'} .ei-arrow_carrot-2right_alt::before,.ei-icon_arrow_carrot-2right_alt::before{content:'\e04a'} .ei-arrow_triangle-up_alt::before,.ei-icon_arrow_triangle-up_alt::before{content:'\e04b'} .ei-arrow_triangle-down_alt::before,.ei-icon_arrow_triangle-down_alt::before{content:'\e04c'} .ei-arrow_triangle-left_alt::before,.ei-icon_arrow_triangle-left_alt::before{content:'\e04d'} .ei-arrow_triangle-right_alt::before,.ei-icon_arrow_triangle-right_alt::before{content:'\e04e'} .ei-minus_alt::before,.ei-icon_minus_alt::before{content:'\e04f'} .ei-plus_alt::before,.ei-icon_plus_alt::before{content:'\e050'} .ei-close_alt::before,.ei-icon_close_alt::before{content:'\e051'} .ei-check_alt::before,.ei-icon_check_alt::before{content:'\e052'} .ei-zoom-out::before,.ei-icon_zoom-out::before{content:'\e053'} .ei-zoom-in::before,.ei-icon_zoom-in::before{content:'\e054'} .ei-stop_alt::before,.ei-icon_stop_alt::before{content:'\e055'} .ei-menu-square_alt::before,.ei-icon_menu-square_alt::before{content:'\e056'} .ei-menu-circle_alt::before,.ei-icon_menu-circle_alt::before{content:'\e057'} .ei-document::before,.ei-icon_document::before{content:'\e058'} .ei-documents::before,.ei-icon_documents::before{content:'\e059'} .ei-pencil_alt::before,.ei-icon_pencil_alt::before{content:'\e05a'} .ei-folder::before,.ei-icon_folder::before{content:'\e05b'} .ei-folder-open::before,.ei-icon_folder-open::before{content:'\e05c'} .ei-folder-add::before,.ei-icon_folder-add::before{content:'\e05d'} .ei-folder_upload::before,.ei-icon_folder_upload::before{content:'\e05e'} .ei-folder_download::before,.ei-icon_folder_download::before{content:'\e05f'} .ei-info::before,.ei-icon_info::before{content:'\e060'} .ei-error-circle::before,.ei-icon_error-circle::before{content:'\e061'} .ei-error-oct::before,.ei-icon_error-oct::before{content:'\e062'} .ei-error-triangle::before,.ei-icon_error-triangle::before{content:'\e063'} .ei-question_alt::before,.ei-icon_question_alt::before{content:'\e064'} .ei-comment::before,.ei-icon_comment::before{content:'\e065'} .ei-chat::before,.ei-icon_chat::before{content:'\e066'} .ei-vol-mute::before,.ei-icon_vol-mute::before{content:'\e067'} .ei-volume-low::before,.ei-icon_volume-low::before{content:'\e068'} .ei-volume-high::before,.ei-icon_volume-high::before{content:'\e069'} .ei-quotations_alt::before,.ei-icon_quotations_alt::before{content:'\e06a'} .ei-clock::before,.ei-icon_clock::before{content:'\e06b'} .ei-lock::before,.ei-icon_lock::before{content:'\e06c'} .ei-lock-open::before,.ei-icon_lock-open::before{content:'\e06d'} .ei-key::before,.ei-icon_key::before{content:'\e06e'} .ei-cloud::before,.ei-icon_cloud::before{content:'\e06f'} .ei-cloud-upload::before,.ei-icon_cloud-upload::before{content:'\e070'} .ei-cloud-download::before,.ei-icon_cloud-download::before{content:'\e071'} .ei-lightbulb::before,.ei-icon_lightbulb::before{content:'\e072'} .ei-gift::before,.ei-icon_gift::before{content:'\e073'} .ei-house::before,.ei-icon_house::before{content:'\e074'} .ei-camera::before,.ei-icon_camera::before{content:'\e075'} .ei-mail::before,.ei-icon_mail::before{content:'\e076'} .ei-cone::before,.ei-icon_cone::before{content:'\e077'} .ei-ribbon::before,.ei-icon_ribbon::before{content:'\e078'} .ei-bag::before,.ei-icon_bag::before{content:'\e079'} .ei-cart::before,.ei-icon_cart::before{content:'\e07a'} .ei-tag::before,.ei-icon_tag::before{content:'\e07b'} .ei-tags::before,.ei-icon_tags::before{content:'\e07c'} .ei-trash::before,.ei-icon_trash::before{content:'\e07d'} .ei-cursor::before,.ei-icon_cursor::before{content:'\e07e'} .ei-mic::before,.ei-icon_mic::before{content:'\e07f'} .ei-compass::before,.ei-icon_compass::before{content:'\e080'} .ei-pin::before,.ei-icon_pin::before{content:'\e081'} .ei-pushpin::before,.ei-icon_pushpin::before{content:'\e082'} .ei-map::before,.ei-icon_map::before{content:'\e083'} .ei-drawer::before,.ei-icon_drawer::before{content:'\e084'} .ei-toolbox::before,.ei-icon_toolbox::before{content:'\e085'} .ei-book::before,.ei-icon_book::before{content:'\e086'} .ei-contacts::before,.ei-icon_contacts::before{content:'\e087'} .ei-archive::before,.ei-icon_archive::before{content:'\e088'} .ei-heart::before,.ei-icon_heart::before{content:'\e089'} .ei-profile::before,.ei-icon_profile::before{content:'\e08a'} .ei-group::before,.ei-icon_group::before{content:'\e08b'} .ei-grid-2x2::before,.ei-icon_grid-2x2::before{content:'\e08c'} .ei-grid-3x3::before,.ei-icon_grid-3x3::before{content:'\e08d'} .ei-music::before,.ei-icon_music::before{content:'\e08e'} .ei-pause_alt::before,.ei-icon_pause_alt::before{content:'\e08f'} .ei-phone::before,.ei-icon_phone::before{content:'\e090'} .ei-upload::before,.ei-icon_upload::before{content:'\e091'} .ei-download::before,.ei-icon_download::before{content:'\e092'} .ei-social_facebook::before,.ei-icon_social_facebook::before{content:'\e093'} .ei-social_twitter::before,.ei-icon_social_twitter::before{content:'\e094'} .ei-social_pinterest::before,.ei-icon_social_pinterest::before{content:'\e095'} .ei-social_googleplus::before,.ei-icon_social_googleplus::before{content:'\e096'} .ei-social_tumblr::before,.ei-icon_social_tumblr::before{content:'\e097'} .ei-social_tumbleupon::before,.ei-icon_social_tumbleupon::before{content:'\e098'} .ei-social_wordpress::before,.ei-icon_social_wordpress::before{content:'\e099'} .ei-social_instagram::before,.ei-icon_social_instagram::before{content:'\e09a'} .ei-social_dribbble::before,.ei-icon_social_dribbble::before{content:'\e09b'} .ei-social_vimeo::before,.ei-icon_social_vimeo::before{content:'\e09c'} .ei-social_linkedin::before,.ei-icon_social_linkedin::before{content:'\e09d'} .ei-social_rss::before,.ei-icon_social_rss::before{content:'\e09e'} .ei-social_deviantart::before,.ei-icon_social_deviantart::before{content:'\e09f'} .ei-social_share::before,.ei-icon_social_share::before{content:'\e0a0'} .ei-social_myspace::before,.ei-icon_social_myspace::before{content:'\e0a1'} .ei-social_skype::before,.ei-icon_social_skype::before{content:'\e0a2'} .ei-social_youtube::before,.ei-icon_social_youtube::before{content:'\e0a3'} .ei-social_picassa::before,.ei-icon_social_picassa::before{content:'\e0a4'} .ei-social_googledrive::before,.ei-icon_social_googledrive::before{content:'\e0a5'} .ei-social_flickr::before,.ei-icon_social_flickr::before{content:'\e0a6'} .ei-social_blogger::before,.ei-icon_social_blogger::before{content:'\e0a7'} .ei-social_spotify::before,.ei-icon_social_spotify::before{content:'\e0a8'} .ei-social_delicious::before,.ei-icon_social_delicious::before{content:'\e0a9'} .ei-social_facebook_circle::before,.ei-icon_social_facebook_circle::before{content:'\e0aa'} .ei-social_twitter_circle::before,.ei-icon_social_twitter_circle::before{content:'\e0ab'} .ei-social_pinterest_circle::before,.ei-icon_social_pinterest_circle::before{content:'\e0ac'} .ei-social_googleplus_circle::before,.ei-icon_social_googleplus_circle::before{content:'\e0ad'} .ei-social_tumblr_circle::before,.ei-icon_social_tumblr_circle::before{content:'\e0ae'} .ei-social_stumbleupon_circle::before,.ei-icon_social_stumbleupon_circle::before{content:'\e0af'} .ei-social_wordpress_circle::before,.ei-icon_social_wordpress_circle::before{content:'\e0b0'} .ei-social_instagram_circle::before,.ei-icon_social_instagram_circle::before{content:'\e0b1'} .ei-social_dribbble_circle::before,.ei-icon_social_dribbble_circle::before{content:'\e0b2'} .ei-social_vimeo_circle::before,.ei-icon_social_vimeo_circle::before{content:'\e0b3'} .ei-social_linkedin_circle::before,.ei-icon_social_linkedin_circle::before{content:'\e0b4'} .ei-social_rss_circle::before,.ei-icon_social_rss_circle::before{content:'\e0b5'} .ei-social_deviantart_circle::before,.ei-icon_social_deviantart_circle::before{content:'\e0b6'} .ei-social_share_circle::before,.ei-icon_social_share_circle::before{content:'\e0b7'} .ei-social_myspace_circle::before,.ei-icon_social_myspace_circle::before{content:'\e0b8'} .ei-social_skype_circle::before,.ei-icon_social_skype_circle::before{content:'\e0b9'} .ei-social_youtube_circle::before,.ei-icon_social_youtube_circle::before{content:'\e0ba'} .ei-social_picassa_circle::before,.ei-icon_social_picassa_circle::before{content:'\e0bb'} .ei-social_googledrive_alt2::before,.ei-icon_social_googledrive_alt2::before{content:'\e0bc'} .ei-social_flickr_circle::before,.ei-icon_social_flickr_circle::before{content:'\e0bd'} .ei-social_blogger_circle::before,.ei-icon_social_blogger_circle::before{content:'\e0be'} .ei-social_spotify_circle::before,.ei-icon_social_spotify_circle::before{content:'\e0bf'} .ei-social_delicious_circle::before,.ei-icon_social_delicious_circle::before{content:'\e0c0'} .ei-social_facebook_square::before,.ei-icon_social_facebook_square::before{content:'\e0c1'} .ei-social_twitter_square::before,.ei-icon_social_twitter_square::before{content:'\e0c2'} .ei-social_pinterest_square::before,.ei-icon_social_pinterest_square::before{content:'\e0c3'} .ei-social_googleplus_square::before,.ei-icon_social_googleplus_square::before{content:'\e0c4'} .ei-social_tumblr_square::before,.ei-icon_social_tumblr_square::before{content:'\e0c5'} .ei-social_stumbleupon_square::before,.ei-icon_social_stumbleupon_square::before{content:'\e0c6'} .ei-social_wordpress_square::before,.ei-icon_social_wordpress_square::before{content:'\e0c7'} .ei-social_instagram_square::before,.ei-icon_social_instagram_square::before{content:'\e0c8'} .ei-social_dribbble_square::before,.ei-icon_social_dribbble_square::before{content:'\e0c9'} .ei-social_vimeo_square::before,.ei-icon_social_vimeo_square::before{content:'\e0ca'} .ei-social_linkedin_square::before,.ei-icon_social_linkedin_square::before{content:'\e0cb'} .ei-social_rss_square::before,.ei-icon_social_rss_square::before{content:'\e0cc'} .ei-social_deviantart_square::before,.ei-icon_social_deviantart_square::before{content:'\e0cd'} .ei-social_share_square::before,.ei-icon_social_share_square::before{content:'\e0ce'} .ei-social_myspace_square::before,.ei-icon_social_myspace_square::before{content:'\e0cf'} .ei-social_skype_square::before,.ei-icon_social_skype_square::before{content:'\e0d0'} .ei-social_youtube_square::before,.ei-icon_social_youtube_square::before{content:'\e0d1'} .ei-social_picassa_square::before,.ei-icon_social_picassa_square::before{content:'\e0d2'} .ei-social_googledrive_square::before,.ei-icon_social_googledrive_square::before{content:'\e0d3'} .ei-social_flickr_square::before,.ei-icon_social_flickr_square::before{content:'\e0d4'} .ei-social_blogger_square::before,.ei-icon_social_blogger_square::before{content:'\e0d5'} .ei-social_spotify_square::before,.ei-icon_social_spotify_square::before{content:'\e0d6'} .ei-social_delicious_square::before,.ei-icon_social_delicious_square::before{content:'\e0d7'} .ei-printer::before,.ei-icon_printer::before{content:'\e103'} .ei-calulator::before,.ei-icon_calulator::before{content:'\e0ee'} .ei-building::before,.ei-icon_building::before{content:'\e0ef'} .ei-floppy::before,.ei-icon_floppy::before{content:'\e0e8'} .ei-drive::before,.ei-icon_drive::before{content:'\e0ea'} .ei-search-2::before,.ei-icon_search-2::before{content:'\e101'} .ei-id::before,.ei-icon_id::before{content:'\e107'} .ei-id-2::before,.ei-icon_id-2::before{content:'\e108'} .ei-puzzle::before,.ei-icon_puzzle::before{content:'\e102'} .ei-like::before,.ei-icon_like::before{content:'\e106'} .ei-dislike::before,.ei-icon_dislike::before{content:'\e0eb'} .ei-mug::before,.ei-icon_mug::before{content:'\e105'} .ei-currency::before,.ei-icon_currency::before{content:'\e0ed'} .ei-wallet::before,.ei-icon_wallet::before{content:'\e100'} .ei-pens::before,.ei-icon_pens::before{content:'\e104'} .ei-easel::before,.ei-icon_easel::before{content:'\e0e9'} .ei-flowchart::before,.ei-icon_flowchart::before{content:'\e109'} .ei-datareport::before,.ei-icon_datareport::before{content:'\e0ec'} .ei-briefcase::before,.ei-icon_briefcase::before{content:'\e0fe'} .ei-shield::before,.ei-icon_shield::before{content:'\e0f6'} .ei-percent::before,.ei-icon_percent::before{content:'\e0fb'} .ei-globe::before,.ei-icon_globe::before{content:'\e0e2'} .ei-globe-2::before,.ei-icon_globe-2::before{content:'\e0e3'} .ei-target::before,.ei-icon_target::before{content:'\e0f5'} .ei-hourglass::before,.ei-icon_hourglass::before{content:'\e0e1'} .ei-balance::before,.ei-icon_balance::before{content:'\e0ff'} .ei-rook::before,.ei-icon_rook::before{content:'\e0f8'} .ei-printer-alt::before,.ei-icon_printer-alt::before{content:'\e0fa'} .ei-calculator_alt::before,.ei-icon_calculator_alt::before{content:'\e0e7'} .ei-building_alt::before,.ei-icon_building_alt::before{content:'\e0fd'} .ei-floppy_alt::before,.ei-icon_floppy_alt::before{content:'\e0e4'} .ei-drive_alt::before,.ei-icon_drive_alt::before{content:'\e0e5'} .ei-search_alt::before,.ei-icon_search_alt::before{content:'\e0f7'} .ei-id_alt::before,.ei-icon_id_alt::before{content:'\e0e0'} .ei-id-2_alt::before,.ei-icon_id-2_alt::before{content:'\e0fc'} .ei-puzzle_alt::before,.ei-icon_puzzle_alt::before{content:'\e0f9'} .ei-like_alt::before,.ei-icon_like_alt::before{content:'\e0dd'} .ei-dislike_alt::before,.ei-icon_dislike_alt::before{content:'\e0f1'} .ei-mug_alt::before,.ei-icon_mug_alt::before{content:'\e0dc'} .ei-currency_alt::before,.ei-icon_currency_alt::before{content:'\e0f3'} .ei-wallet_alt::before,.ei-icon_wallet_alt::before{content:'\e0d8'} .ei-pens_alt::before,.ei-icon_pens_alt::before{content:'\e0db'} .ei-easel_alt::before,.ei-icon_easel_alt::before{content:'\e0f0'} .ei-flowchart_alt::before,.ei-icon_flowchart_alt::before{content:'\e0df'} .ei-datareport_alt::before,.ei-icon_datareport_alt::before{content:'\e0f2'} .ei-briefcase_alt::before,.ei-icon_briefcase_alt::before{content:'\e0f4'} .ei-shield_alt::before,.ei-icon_shield_alt::before{content:'\e0d9'} .ei-percent_alt::before,.ei-icon_percent_alt::before{content:'\e0da'} .ei-globe_alt::before,.ei-icon_globe_alt::before{content:'\e0de'} .ei-clipboard::before,.ei-icon_clipboard::before{content:'\e0e6'} /* Slider */ .slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; } .slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; } .slick-list:focus { outline: none; } .slick-list.dragging { cursor: pointer; cursor: hand; } .slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .slick-track { position: relative; top: 0; left: 0; display: block; } .slick-track:before, .slick-track:after { display: table; content: ''; } .slick-track:after { clear: both; } .slick-loading .slick-track { visibility: hidden; } .slick-slide { display: none; float: left; height: 100%; min-height: 1px; } .slick-slide:focus { outline: none; } [dir='rtl'] .slick-slide { float: right; } .slick-slide img { display: block; } .slick-slide.slick-loading img { display: none; } .slick-slide.dragging img { pointer-events: none; } .slick-initialized .slick-slide { display: block; } .slick-loading .slick-slide { visibility: hidden; } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; } .slick-arrow.slick-hidden { display: none; } /* Slider */ .slick-loading .slick-list { background: #fff url('../ajax-loader.gif') center center no-repeat; } /* Icons */ @font-face { font-family: 'slick'; font-weight: normal; font-style: normal; src: url('./fonts/slick.eot'); src: url('./fonts/slick.eot?#iefix') format('embedded-opentype'), url('./fonts/slick.woff') format('woff'), url('./fonts/slick.ttf') format('truetype'), url('./fonts/slick.svg#slick') format('svg'); } /* Arrows */ .slick-prev, .slick-next { font-size: 0; line-height: 0; position: absolute; top: 50%; display: block; width: 20px; height: 20px; padding: 0; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; color: transparent; border: none; outline: none; background: transparent; } .slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus { color: transparent; outline: none; background: transparent; } .slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before { opacity: 1; } .slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: 1; } .slick-prev:before, .slick-next:before { line-height: 1; opacity: 1; color: white; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .slick-prev { left: 10px; } [dir='rtl'] .slick-prev { right: -25px; left: auto; } .slick-prev:before { content: ''; } [dir='rtl'] .slick-prev:before { content: ''; } .slick-next { right: 10px; } [dir='rtl'] .slick-next { right: auto; left: -25px; } .slick-next:before { content: ''; } [dir='rtl'] .slick-next:before { content: ''; } /* Dots */ .slick-dotted.slick-slider { margin-bottom: 0; } .slick-dots { display: none; position: absolute; bottom: 50px; display: block; width: 100%; padding: 0; margin: 0; list-style: none; text-align: center; } .slick-dots li { position: relative; display: inline-block; width: 20px; height: 20px; margin: 0 5px; padding: 0; cursor: pointer; } .slick-dots li button { font-size: 0; line-height: 0; display: block; width: 20px; height: 20px; padding: 5px; cursor: pointer; color: transparent; border: 0; outline: none; background: transparent; } .slick-dots li button:hover, .slick-dots li button:focus { outline: none; } .slick-dots li button:hover:before, .slick-dots li button:focus:before { opacity: 1; } .slick-dots li button:before { font-family: 'fontawesome'; font-size: 14px; line-height: 20px; position: absolute; top: 0; left: 0; width: 20px; height: 20px; content: '\f111'; text-align: center; opacity: .25; color: white; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } .slick-dots li.slick-active button:before { opacity: 1; color: white; } /* ------------------- PRODUCT CARDS --------------------*/ .floating-cards { position: relative; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-transition: all 1s; -moz-transition: all 1s; transition: all 1s; -webkit-transform: all 1s; -moz-transform: all 1s; transform: all 1s; -webkit-perspective: 800px; perspective: 800px; z-index: 2; } figure .card { position: relative; -webkit-box-shadow: 1px 1px 5px 0 rgba(26,26,67,.05), 39px 62.5px 125px -25px rgba(50,50,93,.5), 23.4px 37.5px 75px -37.5px rgba(0,0,0,.6); box-shadow: 1px 1px 5px 0 rgba(26,26,67,.05), 39px 62.5px 125px -25px rgba(50,50,93,.5), 23.4px 37.5px 75px -37.5px rgba(0,0,0,.6); background: #e6e9ed top no-repeat; padding: 6.5% 0 0; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; overflow: hidden; -webkit-transition: all 1s; -moz-transition: all 1s; transition: all 1s; -webkit-transform: all 1s; -moz-transform: all 1s; transform: all 1s; } figure .card .screen-img { position: absolute; -webkit-backface-visibility: hidden; outline: 1px solid transparent; z-index: 1; } .angle-skew { -moz-transform: scale(.95) translateX(0px) translateY(0) rotateY(-15deg) rotateX(4deg) rotate(1deg); -webkit-transform: scale(.95) translateX(0px) translateY(0) rotateY(-15deg) rotateX(4deg) rotate(1deg); transform: scale(.95) translateX(0px) translateY(0) rotateY(-15deg) rotateX(4deg) rotate(1deg); } .angle-skew-left { position: relative; -moz-transform: scale(.95) translateX(50px) translateY(0) rotateY(20deg) rotateX(0deg) rotate(0deg); -webkit-transform: scale(.95) translateX(50px) translateY(0) rotateY(20deg) rotateX(0deg) rotate(0deg); transform: scale(.95) translateX(50px) translateY(0) rotateY(20deg) rotateX(0deg) rotate(0deg); -webkit-box-shadow: -20px 20px 50px 0px rgba(0,0,0,0.15); -moz-box-shadow: -20px 20px 50px 0px rgba(0,0,0,0.15); box-shadow: -20px 20px 50px 0px rgba(0,0,0,0.15); -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; } .angle-skew-right { position: relative; -moz-transform: scale(.95) translateX(-50px) translateY(0) rotateY(-20deg) rotateX(0deg) rotate(0deg); -webkit-transform: scale(.95) translateX(-50px) translateY(0) rotateY(-20deg) rotateX(0deg) rotate(0deg); transform: scale(.95) translateX(-50px) translateY(0) rotateY(-20deg) rotateX(0deg) rotate(0deg); -webkit-box-shadow: 20px 20px 50px 0px rgba(0,0,0,0.15); -moz-box-shadow: 20px 20px 50px 0px rgba(0,0,0,0.15); box-shadow: 20px 20px 50px 0px rgba(0,0,0,0.15); -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; } .floating-cards .shine { position: absolute; left: 0; right: 0; top: 0; bottom: 0; pointer-events: none; background: -webkit-gradient(linear,left bottom,right top,color-stop(20%,hsla(0,0%,100%,0)),color-stop(70%,hsla(0,0%,100%,.5)),to(#fff)); background: linear-gradient(to top right,hsla(0,0%,100%,0) 20%,hsla(0,0%,100%,.5) 70%,#fff); opacity: .2; } /* ------------------- PULSE SCREEN --------------------*/ .pulse-screen { position: relative; display: flex; width: 100%; height: 550px; background-color: #f1f3f6; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; overflow: hidden; -webkit-transition: all 1s; -moz-transition: all 1s; transition: all 1s; -webkit-transform: all 1s; -moz-transform: all 1s; transform: all 1s; z-index: 2; } .screen-shadow { -webkit-box-shadow: 1px 1px 5px 0 rgba(26,26,67,.05), 39px 62.5px 125px -150px rgba(50,50,93,.25), 23.4px 37.5px 75px -37.5px rgba(0,0,0,.25); box-shadow: 1px 1px 5px 0 rgba(26,26,67,.05), 39px 62.5px 125px -150px rgba(50,50,93,.25), 23.4px 37.5px 75px -37.5px rgba(0,0,0,.25); } .screen-shadow-left { -webkit-box-shadow: -10px 10px 20px 0px rgba(0,0,0,0.05); -moz-box-shadow: -10px 10px 20px 0px rgba(0,0,0,0.05); box-shadow: -10px 10px 20px 0px rgba(0,0,0,0.05); } .screen-shadow-right { -webkit-box-shadow: 10px 10px 20px 0px rgba(0,0,0,0.05); -moz-box-shadow: 10px 10px 20px 0px rgba(0,0,0,0.05); box-shadow: 10px 10px 20px 0px rgba(0,0,0,0.05); } /* ------------------- TOP NAV --------------------*/ .pulse-screen .top-nav { position: relative; width: 100%; height: 30px; background-color: #fff; -webkit-border-radius: 6px 6px 0 0; -moz-border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0; border-bottom: 1px solid #f5f7fa; z-index: 2; } .pulse-screen .top-nav .school { display: inline-block; } .pulse-screen .top-nav .school-logo { float: left; margin: 4px 8px; width: 20px; height: 20px; background-color: #2F5479; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .pulse-screen .top-nav .school-name { float: left; margin: 2px 8px 4px 0; color: #333; font-size: 8px; } .pulse-screen .top-nav .nav-item { float: right; height: 100%; padding: 3px 6px 0 6px; border-left: 1px solid #f5f7fa; color: #aab2bd; font-size: 11px; } /* ------------------- HEADER --------------------*/ .pulse-screen .header { position: relative; width: 100%; height: 30px; padding: 2px 8px; background-color: #fff; border-bottom: 1px solid #e6e9ed; z-index: 2; } .pulse-screen .header .title { float: left; font-size: 10px; color: #333; } .pulse-screen .header .pulse-title { margin-top: 10px; width: 15%; height: 6px; float: left; display: inline-block; background-color: #e6e9ed; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } .pulse-screen .header .pulse-breadcrumb { margin-top: 10px; width: 20%; height: 6px; float: right; display: inline-block; background-color: #f5f7fa; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } /* ------------------- MENU --------------------*/ .pulse-screen .menu { position: relative; float: left; top: 0; width: 20%; height: 100%; padding: 0 10px 10px 10px; background-color: #2f5479; -webkit-border-radius: 6px 0 0 6px; -moz-border-radius: 6px 0 0 6px; border-radius: 6px 0 0 6px; z-index: 3; text-align: left; } .pulse-screen .right-content { width: 100%; } .pulse-screen .menu .menu-container { position: relative; z-index: 2; } .pulse-screen .menu .avatar { position: relative; width: 30px; height: 30px; margin: 35px 0 10px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; border: 1px solid rgba(255,255,255,.25); background-color: #f5f7fa; z-index: 2; } .pulse-screen .menu .button { position: relative; width: 100%; height: 20px; margin: 13px 0 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; z-index: 2; } .pulse-screen .menu .menu-item { width: 100%; height: 20px; } .pulse-screen .menu .icon { width: 6px; height: 6px; display: inline-block; margin-right: 3px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; background-color: rgba(255,255,255,.25); } .pulse-screen .menu .menu-text { width: 70%; height: 6px; display: inline-block; background-color: rgba(255,255,255,.25); -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } .pulse-screen .menu .selected { position: absolute; top: 123px; left: 0; width: 100%; height: 21px; background-color: rgba(0,0,0,.25); z-index: 1; } .pulse-screen .menu .white-selected { background-color: rgba(255,255,255,.5); } .pulse-screen .menu .profile-box { position: absolute; left: 0; top: 29px; width: 100%; height: 75px; /*background-color: rgba(0,0,0,.5);*/ background: #102032; background: -moz-linear-gradient(30deg, rgba(0,0,0,.4) 0%, rgba(0,0,0,.4) 50%, rgba(0,0,0,.25) 51%, rgba(0,0,0,.25) 100%); background: -webkit-linear-gradient(30deg, rgba(0,0,0,.4) 0%,rgba(0,0,0,.4) 50%,rgba(0,0,0,.25) 51%,rgba(0,0,0,.25) 100%); background: linear-gradient(30deg, rgba(0,0,0,.4) 0%,rgba(0,0,0,.4) 50%,rgba(0,0,0,.25) 51%,rgba(0,0,0,.25) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000', endColorstr='#142941',GradientType=1 ); z-index: 1; } .pulse-screen .menu .satchel-one { position: absolute; left: 0; top: 0; width: 100%; height: 29px; padding: 5px 0 0 10px; /*background: #142941;*/ background-color: rgba(0,0,0,.25); font-family: 'Heebo'; font-weight: 500; font-size: 14px; color: #fff; z-index: 1; } .pulse-screen .header .title { } /* ------------------- WHITE SCREEN --------------------*/ .satchel-one-screen .white-menu { background-color: #ffffff; border-right: 1px solid #e6e9ed; } .satchel-one-screen .menu .icon { background-color: #0e79c9; } .satchel-one-screen .white-menu .menu-text { background-color: rgba(0,0,0,.15); } .satchel-one-screen .white-menu .satchel-one { background-color: #0e79c9; } .satchel-one-screen .white-menu .profile-box { background: #fff; } .satchel-one-screen .top-nav { background-color: #0e79c9; border-radius: 0; } .satchel-one-screen { background-color: #fff; } .satchel-one-screen .satchel-one span, .satchel-one-screen .school, .satchel-one-screen .nav-item, .satchel-one-screen .header .pulse-breadcrumb { display: none; } .satchel-one-screen .header { height: 50px; background-color: #fafafa; } .satchel-one-screen .action-bar { background-color: #fff!important; border-top: 1px solid #e6e9ed; border-bottom: 1px solid #e6e9ed; } .satchel-one-screen .header .title { position: relative; top: 10px; font-size: 14px; } /* ------------------- CANVAS --------------------*/ .feature-hero .fix-height { height: 230px!important; } .pulse-screen .canvas-holder { position: relative; padding: 15px 25px; z-index: 1; } .pulse-screen .canvas-holder .col-md-6 { padding: 0 11px; } .pulse-screen .canvas { position: relative; margin-bottom: 15px; padding: 60px 20px 20px; background-color: #fff; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; text-align: left; } .pulse-screen .button-holder .blue-btn { background-color: #0e79c9; color: #fff; } .jscolor { border: 1px solid #eee; border-radius: 4px; padding: 5px 10px; } .pulse-screen .app-card { padding: 10px 20px; text-align: center; } .pulse-screen .app-card h3 { display: block; margin: 0 0 8px; font-size: 8px; font-weight: normal; line-height: 20px; } .pulse-screen .app-card p { display: block; margin: 0 0 10px; font-size: 7px; font-weight: normal; text-align: center!important; line-height: 10px; } .pulse-screen .app-card img { display: block; margin: 0 auto 10px; } .pulse-screen .app-card .button { position: relative; width: fit-content; padding: 0 10px; margin: 13px auto 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; font-size: 8px; color: #fff; text-align: center; } .pulse-screen .action-bar { position: relative; top: -1px; width: 100%; height: 37px; padding: 8px; background-color: #fff; border-top: 1px solid #f5f7fa; border-bottom: 1px solid #e6e9ed; z-index: 2; } .pulse-screen .canvas .action-bar { position: absolute; left: 0; top: 0; width: 100%; height: 39px; padding: 9px; background-color: #fff; -webkit-border-radius: 6px 6px 0 0; -moz-border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0; border-bottom: 1px solid #f5f7fa; } .pulse-screen .action-bar .outline { display: inline-block; height: 20px; padding: 0 8px; border: 1px solid #e6e9ed; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .pulse-screen .action-bar .outline p, .pulse-screen .action-bar .outline span, .pulse-screen .action-bar .outline i { position: relative; top: -4px; margin: 0; padding: 0; font-size: 8px; } .pulse-screen .action-bar .outline span, .pulse-screen .action-bar .outline i { top: -8px; } .pulse-screen .action-bar .dropdown { display: inline-block; width: 23%; height: 20px; margin: 0 0.5%; border: 1px solid #e6e9ed; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; background-color: #fff; } .pulse-screen .action-bar .dropdown span { position: relative; top: -8px; left: 6px; font-size: 8px; color: #aab2bd; } .pulse-screen .action-bar .dropdown i { position: relative; float: right; top: 4px; right: 6px; font-size: 8px; } .pulse-screen .blue-btn { height: 20px; margin: 0 auto 10px; padding: 0 8px; border: 1px solid #0e79c9; background-color: #0e79c9; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; width: fit-content; font-size: 8px; color: #fff; } .pulse-screen .blue-btn p { margin: 0; line-height: 18px; } .pulse-screen .canvas .action-bar-tabs { position: absolute; left: 0; top: 30px; width: 100%; height: 50px; padding: 15px 20px; background-color: #fff; -webkit-border-radius: 6px 6px 0 0; -moz-border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0; } .pulse-screen .canvas .action-bar-tabs .pulse-btn { float: right; display: inline-block; width: 10%; margin: 0; } .pulse-screen .canvas .action-bar-tabs .dropdown { display: inline-block; width: 20%; height: 20px; margin-right: 1%; border: 1px solid #e6e9ed; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .pulse-screen .canvas .action-bar .back-btn { display: inline-block; width: 40px; height: 15px; border: 1px solid #e6e9ed; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .pulse-screen .canvas .action-bar .view-switcher { float: right; } .pulse-screen .canvas .action-bar .view-btn { display: inline-block; width: 40px; height: 15px; background-color: #f5f7fa; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; } .pillar-container { display: flex; } .pillar-container .pillar-title { margin: 0 0 10px; font-size: 10px; line-height: 14px; } .pulse-screen .canvas .column { flex: 6; margin: 0 10px; text-align: center; color: #fc6e51; } .pulse-screen .canvas .pillar { position: relative; height: 150px; margin: 0 10px; border-left: 1px solid #e6e9ed; border-right: 1px solid #e6e9ed; border-bottom: 1px solid #e6e9ed; background-color: transparent; } .pulse-screen .canvas .pillar .score { position: absolute; bottom: 0px; width: 100%; height: 0px; -webkit-transition: all 0.8s ease-in-out; -moz-transition: all 0.8s ease-in-out; transition: all 0.8s ease-in-out; } .pulse-screen .pillar-details { display: inline-block; width: 100%; vertical-align: top; } .pulse-screen .pillar-text { /*position: absolute; left: 80px; top: 63px;*/ float: left; width: 40%; padding-left: 20px; } .pulse-screen .pillar-text .pillar-title { width: 80%; height: 8px; margin-bottom: 10px; background-color: #e6e9ed; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } .pulse-screen .text-line { margin-bottom: 4px; width: 100%; height: 4px; background-color: #f5f7fa; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } .pulse-screen .title-line { margin: 10px 0 4px 0; width: 25%; height: 4px; background-color: #e6e9ed; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } .pulse-screen .pillar-text .pillar-btn, .pulse-screen .pulse-btn { display: block; width: 50px; height: 20px; margin: 10px 0 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .pulse-screen .pillar-details .pillar-chart-holder { float: right; width: 48%; padding-left: 12px; } .pulse-screen .pillar-details .pillar-chart { position: relative; width: 100%; } .pulse-screen .pillar-details .pillar-chart .chart-details { position: absolute; height: 100%; overflow: hidden; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; } .pulse-screen .pillar-details .pillar-chart .details { width: 210px; } .feature-hero .pillar-details .pillar-chart .details { width: 182px; } .pulse-screen .pulse-actions { height: 95px; padding-top: 44px; } .pulse-screen .canvas .pulse-tabs { position: absolute; left: 0; top: 0; width: 100%; height: 30px; padding: 11px; background-color: #f5f7fa; -webkit-border-radius: 6px 6px 0 0; -moz-border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0; border-bottom: 1px solid #f5f7fa; } .pulse-screen .pulse-tabs .tab-text-holder { position: absolute; left: 65px; } .pulse-screen .pulse-tabs .tab-text { float: left; width: 30px; height: 4px; margin: 2px 20px 0 0; background-color: #e6e9ed; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } .pulse-screen .canvas .pulse-tabs .selected-tab { position: absolute; left: 0; top: 0; width: 50px; height: 30px; padding: 11px; background-color: #fff; -webkit-border-radius: 6px 6px 0 0; -moz-border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0; border-bottom: 1px solid #fff; } .pulse-screen .pulse-table-header { width: 100%; height: 20px; background-color: #f5f7fa; border-bottom: 1px solid #e6e9ed; } .pulse-screen .pulse-table-row { width: 100%; height: 32px; background-color: #fff; border-bottom: 1px solid #f5f7fa; } .pulse-screen .pulse-table-row .row-text { display: inline-block; width: 10%; height: 4px; background-color: #f5f7fa; -webkit-border-radius: 6px 6px 0 0; -moz-border-radius: 6px 6px 0 0; border-radius: 6px 6px 0 0; } .pulse-screen .pulse-table-row .row-avatar { position: relative; top: 5px; display: inline-block; width: 15px; height: 15px; margin: 0 5% 0 0; background-color: #f5f7fa; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .pulse-screen .pulse-table-row .action-avatar { margin: 0 0 0 5%; } .grow-20 { height: 20%!important; } .grow-30 { height: 30%!important; } .grow-40 { height: 40%!important; } .grow-50 { height: 50%!important; } .grow-60 { height: 60%!important; } .grow-70 { height: 70%!important; } .grow-80 { height: 80%!important; } .grow-90 { height: 90%!important; } .grow-270 { height: 270px!important; } .move-down { bottom: -80px!important; } .width-40 { width: 40%!important; } .width-50 { width: 50%!important; margin: 0 5%; } .width-60 { width: 60%!important; } .width-70 { width: 70%!important; } .width-80 { width: 80%!important; } .width-100 { width: 100%!important; } .left-40 { left: 40%!important; } .left-60 { left: 60%!important; } .left-80 { left: 80%!important; } .pulse-screen .pillar-details .pillar-chart .chart-details { animation: revealIn 1.5s 1; } @keyframes revealIn { from { width: 0%; } to { width: 100%; } } .pulse-screen .canvasScrollDown { animation: scrollDown 6s 1; } .pulse-hero .canvas-holder { /* animation: scrollDown 6s 1; animation-delay: 5s; */ } @keyframes scrollDown { 0% { top: 0; } 40% { top: -140px; } 60% { top: -140px; } 100% { top: 0; } } /* ------------------- PIE CHART --------------------*/ .row-pie-chart { position: relative; display: inline-block; top: 5px; left: -5px; } /* ------------------- ACTION CHART --------------------*/ .actions-screen .progress-container { background-color: #f1f3f6; width: 100%; height: 15px; -moz-border-radius: 4px; border-radius: 4px; margin-bottom: 5px; color: #fff; position: relative; overflow: hidden; } .actions-screen .progress-container .progress-fill { background-color: #8cc152; height: 100%; -moz-border-radius-topleft: 4px; border-top-left-radius: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-left-radius: 4px; width: 0; -moz-transition: width .5s; transition: width .5s; } .actions-screen .action-chart .pillar-chart .details { width: 100%!important; } .actions-screen .chat-container { width: 100%; padding: 10px; background-color: #f1f3f6; } .actions-screen .canvas .pulse-input { display: inline-block; width: 100%; height: 20px; background-color: #fff; border: 1px solid #e6e9ed; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; } .actions-screen .status-bar { background-color: #f1f3f6; width: 100%; height: 20px; -moz-border-radius: 4px; border-radius: 4px; margin-bottom: 10px; opacity: 0.15; filter: alpha(opacity=15); /* For IE8 and earlier */ } .actions-screen .pillar-text { width: 48%; padding-left: 0; } /* ------------------- SURVEY --------------------*/ .survey { display: block; background-color: #fff; } .button-container { position: relative; top: -25px; text-align: center; } .reset { position: absolute; left: 20px; bottom: 20px; background-color: transparent; border: none; font-size: 24px; color: #aab2bd; z-index: 2; } .reset:hover { color: #0e79c9; } .button-container .start-survey { width: 150px; height: 150px; margin-bottom: 20px; } .button-container h4 { font-weight: bold; color: #656d78; } .start-survey-animation { width: 150px; height: 190px; margin: 0 auto 30px; -moz-background-size: cover; background-size: cover; } .start-survey-button:focus { outline: none; } .start-survey-button { background-color: rgb(252, 110, 81); background-image: none; border-bottom-color: rgb(255, 255, 255); border-bottom-left-radius: 30px; border-bottom-right-radius: 30px; border-bottom-style: none; border-bottom-width: 0px; border-image-outset: 0px; border-image-repeat: stretch; border-image-slice: 100%; border-image-source: none; border-image-width: 1; border-left-color: rgb(255, 255, 255); border-left-style: none; border-left-width: 0px; border-right-color: rgb(255, 255, 255); border-right-style: none; border-right-width: 0px; border-top-color: rgb(255, 255, 255); border-top-left-radius: 30px; border-top-right-radius: 30px; border-top-style: none; border-top-width: 0px; box-shadow: none; box-sizing: border-box; color: rgb(255, 255, 255); cursor: pointer; display: inline-block; font-family: "Noto Sans", sans-serif; font-size: 16px; font-stretch: 100%; font-style: normal; font-variant-caps: normal; font-variant-east-asian: normal; font-variant-ligatures: normal; font-variant-numeric: normal; font-weight: 400; height: 52px; letter-spacing: normal; line-height: 12px; overflow-x: visible; overflow-y: visible; padding-bottom: 20px; padding-left: 25px; padding-right: 25px; padding-top: 20px; text-align: center; text-indent: 0px; text-rendering: auto; text-shadow: none; text-size-adjust: 100%; text-transform: none; touch-action: manipulation; transition-delay: 0s; transition-duration: 0.5s; transition-property: opacity; transition-timing-function: ease; user-select: none; white-space: nowrap; width: 155.531px; word-spacing: 0px; writing-mode: horizontal-tb; -webkit-appearance: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-border-image: none; } .questions-completed-bar-container { padding: 0 20px; } .questions-completed-bar { margin: 30px auto; box-sizing: border-box; color: rgb(103, 127, 148); display: flex; font-family: "Noto Sans", sans-serif; font-size: 14px; height: 9px; line-height: 22px; text-align: left; text-size-adjust: 100%; transition-delay: 0s; transition-duration: 0.5s; transition-property: opacity; transition-timing-function: ease; width: 100%; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .questions-completed-bar-item { background-color: rgb(230, 234, 237); border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; border-top-left-radius: 20px; border-top-right-radius: 20px; box-sizing: border-box; color: rgb(103, 127, 148); display: block; flex-grow: 1; float: none; font-family: "Noto Sans", sans-serif; font-size: 14px; height: 9px; line-height: 22px; margin-right: 8px; text-align: left; text-size-adjust: 100%; transition-delay: 0s; transition-duration: 0.5s; transition-property: opacity; transition-timing-function: ease; width: 158.672px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .questions-completed-bar-item.completed { background-color: rgb(252, 110, 81); } .question-details { position: absolute; width: 100%; top: 80px; padding: 0 20px; text-align: left; } .question-details h3 { margin: 0; color: #fc6e51; padding-top: 4px; font-size: 18px; font-weight: 300; } .question-details p { margin: 10px 0 100px; line-height: 26px; padding-top: 4px; font-size: 18px; font-weight: 300; } @media (max-width: 991px) { .question-details p { margin: 10px 0 98px; } } .survey-interface { box-sizing: border-box; color: rgb(103, 127, 148); display: block; font-family: "Noto Sans", sans-serif; font-size: 14px; line-height: 22px; text-align: left; text-size-adjust: 100%; transition-delay: 0s; transition-duration: 0.5s; transition-property: opacity; transition-timing-function: ease; user-select: none; visibility: visible; width: 100%; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .scale-items { box-sizing: border-box; color: rgb(103, 127, 148); display: block; font-family: "Noto Sans", sans-serif; font-size: 14px; line-height: 22px; /*padding-top: 90px;*/ position: relative; text-align: left; text-size-adjust: 100%; transition-delay: 0s; transition-duration: 0.5s; transition-property: opacity; transition-timing-function: ease; user-select: none; visibility: visible; width: 100%; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .dots { align-items: center; background-color: rgb(242, 243, 247); border-bottom-left-radius: 40px; border-bottom-right-radius: 40px; border-top-left-radius: 40px; border-top-right-radius: 40px; box-sizing: border-box; color: rgb(103, 127, 148); display: flex; font-family: "Noto Sans", sans-serif; font-size: 14px; height: 38px; justify-content: space-between; line-height: 22px; padding-left: 15px; padding-right: 15px; text-align: left; text-size-adjust: 100%; transition-delay: 0s; transition-duration: 0.5s; transition-property: opacity; transition-timing-function: ease; user-select: none; visibility: visible; width: 100%; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .scale-tick-container { box-sizing: border-box; color: rgb(103, 127, 148); display: block; font-family: "Noto Sans", sans-serif; font-size: 14px; height: 0px; line-height: 22px; text-align: left; text-size-adjust: 100%; transition-delay: 0s; transition-duration: 0.5s; transition-property: opacity; transition-timing-function: ease; user-select: none; visibility: visible; width: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .tick { box-sizing: border-box; color: rgb(103, 127, 148); display: block; font-family: "Noto Sans", sans-serif; font-size: 14px; height: 0px; line-height: 22px; text-align: left; text-size-adjust: 100%; transition-delay: 0s; transition-duration: 0.5s; transition-property: opacity; transition-timing-function: ease; user-select: none; visibility: visible; width: 0px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .dot-container { position: relative; top: 2px; box-sizing: border-box; color: rgb(103, 127, 148); display: block; font-family: "Noto Sans", sans-serif; font-size: 14px; height: 22px; line-height: 22px; text-align: center; text-size-adjust: 100%; transition-delay: 0s; transition-duration: 0.5s; transition-property: opacity; transition-timing-function: ease; user-select: none; visibility: visible; width: 30px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .dot { background-color: rgb(202, 209, 217); border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; border-top-left-radius: 20px; border-top-right-radius: 20px; box-sizing: border-box; color: rgb(103, 127, 148); display: inline-block; font-family: "Noto Sans", sans-serif; font-size: 14px; height: 14px; line-height: 22px; text-align: center; text-size-adjust: 100%; transition-delay: 0s; transition-duration: 0.5s; transition-property: opacity; transition-timing-function: ease; user-select: none; visibility: visible; width: 14px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .toggle-handle-bubble { background-color: rgb(237, 85, 101); border-bottom-left-radius: 65px; border-bottom-right-radius: 65px; border-top-left-radius: 65px; border-top-right-radius: 65px; box-sizing: border-box; display: none; color: rgb(103, 127, 148); font-family: "Noto Sans", sans-serif; font-size: 14px; height: 65px; line-height: 22px; overflow-x: hidden; overflow-y: hidden; position: absolute; text-align: left; text-size-adjust: 100%; top: -77px; left: 6px; transition-delay: 0s; transition-duration: 0.5s; transition-property: opacity; transition-timing-function: ease; user-select: none; width: 65px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .toggle-handle-angle { border-bottom-color: rgba(0, 0, 0, 0); border-bottom-style: solid; border-bottom-width: 8px; border-image-outset: 0px; border-image-repeat: stretch; border-image-slice: 100%; border-image-source: none; border-image-width: 1; border-left-color: rgba(0, 0, 0, 0); border-left-style: solid; border-left-width: 8px; border-right-color: rgba(0, 0, 0, 0); border-right-style: solid; border-right-width: 8px; border-top-color: rgb(252, 110, 81); border-top-style: solid; border-top-width: 8px; box-sizing: border-box; color: rgb(103, 127, 148); content: ""; display: none; font-family: "Noto Sans", sans-serif; font-size: 14px; height: 16px; left: 31px; line-height: 22px; position: absolute; text-align: left; text-size-adjust: 100%; top: -13px; transition-delay: 0s; transition-duration: 0.5s; transition-property: opacity; transition-timing-function: ease; user-select: none; visibility: visible; width: 16px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .toggle-handle { background-color: #fff; border-color: #cad1d9; border-bottom-left-radius: 56px; border-bottom-right-radius: 56px; border-bottom-style: solid; border-bottom-width: 10px; border-image-outset: 0px; border-image-repeat: stretch; border-image-slice: 100%; border-image-source: none; border-image-width: 1; border-left-style: solid; border-left-width: 10px; border-right-style: solid; border-right-width: 10px; border-top-left-radius: 56px; border-top-right-radius: 56px; border-top-style: solid; border-top-width: 10px; box-shadow: rgb(170, 178, 189) 0px -1px 1px 0px; box-sizing: border-box; color: rgb(103, 127, 148); display: block; font-family: "Noto Sans", sans-serif; font-size: 14px; height: 56px; left: 39px; line-height: 22px; position: absolute; text-align: left; text-size-adjust: 100%; transform: matrix(1, 0, 0, 1, -28, 0); user-select: none; visibility: visible; width: 56px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-transition: all 0.3s ease-in-out!important; -o-transition: all 0.3s ease-in-out!important; transition: all 0.3s ease-in-out!important; } .faces { box-sizing: border-box; color: rgb(103, 127, 148); display: block; font-family: "Noto Sans", sans-serif; font-size: 14px; height: 858px; line-height: 22px; position: absolute; text-align: left; text-size-adjust: 100%; top: 0px; transition-delay: 0s; transition-duration: 0.5s; transition-property: opacity; transition-timing-function: ease; user-select: none; width: 65px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-user-drag: none; } .faces img { width: 65px; } .toggle { box-sizing: border-box; color: rgb(103, 127, 148); display: block; font-family: "Noto Sans", sans-serif; font-size: 14px; height: 65px; line-height: 22px; position: absolute; text-align: left; text-size-adjust: 100%; top: 90px; transform: matrix(1, 0, 0, 1, -7, 0); user-select: none; visibility: visible; width: 65px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-transition: all 0.3s ease-in-out!important; -o-transition: all 0.3s ease-in-out!important; transition: all 0.3s ease-in-out!important; left: 0; } .scale-ticks { box-sizing: border-box; color: rgb(103, 127, 148); display: flex; font-family: "Noto Sans", sans-serif; font-size: 14px; height: 0px; justify-content: space-between; line-height: 22px; padding-left: 15px; padding-right: 15px; text-align: center; text-size-adjust: 100%; transition-delay: 0s; transition-duration: 0.5s; transition-property: opacity; transition-timing-function: ease; user-select: none; visibility: visible; width: 100%; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .scales { box-sizing: border-box; color: rgb(103, 127, 148); display: flex; font-family: "Noto Sans", sans-serif; font-size: 14px; height: 27px; justify-content: space-between; line-height: 22px; margin-top: 10px; min-height: 27px; padding-left: 15px; padding-right: 15px; text-align: left; text-size-adjust: 100%; transition-delay: 0s; transition-duration: 0.5s; transition-property: opacity; transition-timing-function: ease; user-select: none; visibility: visible; width: 100%; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .scale-number { box-sizing: border-box; color: rgb(103, 127, 148); display: none; font-family: "Noto Sans", sans-serif; font-size: 14px; height: 27px; line-height: 22px; text-align: center; text-size-adjust: 100%; transition-delay: 0s; transition-duration: 0.5s; transition-property: opacity; transition-timing-function: ease; user-select: none; visibility: visible; width: 30px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .scale-number.highlighted { font-size: 30px; margin-top: 5px; font-weight: 700; } .sub-texts { display: flex!important; box-sizing: border-box; color: rgb(103, 127, 148); font-family: "Noto Sans", sans-serif; font-size: 14px; height: 54px; justify-content: space-between; line-height: 22px; margin-top: 10px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px; text-align: left; text-size-adjust: 100%; transition-delay: 0s; transition-duration: 0.5s; transition-property: opacity; transition-timing-function: ease; user-select: none; visibility: visible; width: 100%; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .sub-text { flex: 1; box-sizing: border-box; color: rgb(103, 127, 148); display: block; font-family: "Noto Sans", sans-serif; font-size: 14px; height: 54px; line-height: 22px; min-height: 1px; position: relative; text-align: left; text-size-adjust: 100%; transition-delay: 0s; transition-duration: 0.5s; transition-property: opacity; transition-timing-function: ease; user-select: none; visibility: visible; width: 60px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .sub-text .tick { background-color: rgb(202, 209, 217); box-sizing: border-box; color: rgb(103, 127, 148); display: block; font-family: "Noto Sans", sans-serif; font-size: 14px; height: 10px; left: 50%; line-height: 22px; position: absolute; text-align: left; text-size-adjust: 100%; transition-delay: 0s; transition-duration: 0.5s; transition-property: opacity; transition-timing-function: ease; user-select: none; visibility: visible; width: 1px; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } .sub-text .text { margin-top: 10px; text-align: center; } .survey-label { flex: 8; } .survey-label span { color: #f3a100; background-color: #fdf0da; padding: 0.625rem 1.25em; border-radius: 1.5em; position: relative; top: 5px; } .survey-footer { padding: 20px 60px; background-color: #f1f3f6; position: absolute; border-top: 1px solid #e6e9ed; bottom: 0; width: 100%; display: -webkit-flex; display: -moz-box; display: flex; -webkit-justify-content: space-between; -moz-box-pack: justify; justify-content: space-between; -webkit-animation-name: surveyFooter; -moz-animation-name: surveyFooter; animation-name: surveyFooter; -webkit-animation-duration: .5s; -moz-animation-duration: .5s; animation-duration: .5s; height: 80px; z-index: 1; } @keyframes surveyFooter { 0% { bottom: -110px; } 100% { bottom: 0; } } @media (max-width: 768px) { .survey-footer { display: none; } .idea-title { } } @media (max-width: 479px) { .idea-title { } } /* ------------------- EVALUATION HERO --------------------*/ .evaluation-hero .canvas { margin-bottom: 15px; padding: 0px; display: flex; } .evaluation-hero .standard-tab { position: relative; width: 30px; -webkit-border-radius: 4px 0 0 4px; -moz-border-radius: 4px 0 0 4px; border-radius: 4px 0 0 4px; color: #fff; font-size: 12px; font-weight: bold; } .evaluation-hero .p15 { float: left; width: 100%; height: 100%; } .evaluation-hero .text-line { float: left; width: 50%; height: 6px; margin: 0; opacity: .10; filter: alpha(opacity=10); /* For IE8 and earlier */ } .evaluation-hero .judgement { float: right; width: 15%; opacity: .2; filter: alpha(opacity=20); /* For IE8 and earlier */ } .evaluation-hero { } .evaluation-hero { } /* ------------------- FOOTER --------------------*/ .pulse-screen .pulse-footer { position: absolute; bottom: 10px; right: 10px; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; } .pulse-screen .pulse-footer .footer-item { margin-top: 10px; width: 30px; height: 6px; margin-left: 3px; display: inline-block; background-color: #e6e9ed; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } .pulse-screen .pulse-footer img { position: relative; bottom: 5px; margin-left: 5px; } @media (max-width: 1200px) { .pulse-screen { height: 450px; } .pulse-screen .pillar-details .pillar-chart-holder { width: 47%; } .feature-hero .pillar-details .pillar-chart-holder { width: 48%; } .pulse-screen .pillar-details .pillar-chart .details { width: 158px; } .feature-hero .pillar-details .pillar-chart .details { width: 130px; } .pulse-screen .canvas .pillar { height: 110px; } .feature-hero .fix-height { height: 215px!important; } .feature-hero .canvas .column { margin: 0 3px; } .pulse-screen .canvas .pillar-title { font-size: 9px; } } @media (max-width: 991px) { .pulse-screen { width: 535px; } } @media (max-width: 768px) { .feature-logo { top: 50%; left: 50%; transform: translate(-50%, 0%); } .floating-cards { margin-left: -8%; padding-left: 0!important; transform: scale(0.90); } .pulse-screen { margin: auto; } .pulse-screen .pillar-details .pillar-chart .details { width: 100%; } } @media (max-width: 570px) { .floating-cards { position: relative; /*transform: scale(0.80);*/ margin-left: -15%; } .pulse-screen { width: 535px; } .header-home .scene { display: none; } } /* ------------------- ZOOMED SCREENS --------------------*/ .pulse-close-up { position: relative; width: 100%; height: 500px; /*padding: 20px;*/ /*background-color: #f1f3f6;*/ -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; overflow: hidden; -webkit-transition: all 1s; -moz-transition: all 1s; transition: all 1s; -webkit-transform: all 1s; -moz-transform: all 1s; transform: all 1s; } .pulse-close-up .panel { width: 100%; height: fit-content; margin-bottom: 30px; padding: 20px; background-color: #fff; border: 1px solid #e6e9ed; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; -moz-box-shadow: 0 1px 1px rgba(0,0,0,.05); box-shadow: 0 1px 1px rgba(0,0,0,.05); text-align: left; } .pulse-close-up .flex-container { display: -webkit-flex; display: -moz-box; display: flex; -webkit-align-items: flex-start; -moz-box-align: start; align-items: flex-start; width: 100%; } .pulse-close-up .x-tooltip.inline-tooltip { display: inline-block; } .pulse-close-up .x-tooltip { position: relative; } .pulse-close-up .x-tooltip .x-tooltip-body { bottom: 100%; margin-bottom: 7px; visibility: hidden; position: absolute; color: #fff; z-index: 1051; background-color: #3f4041; opacity: .9; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); transform: translateX(-50%); left: 50%; text-align: center; border: 1px solid #3f4041; padding: 10px; -moz-border-radius: 4px; border-radius: 4px; } /* ------------------- INSIGHTS DASHBOARD --------------------*/ .pulse-dashboard .menu .selected { top: 104px; } .pulse-dashboard .canvas { margin-bottom: 14px; } .pulse-close-up .panel .pillar-name { margin-bottom: 20px; font-weight: 700; } .pulse-screen .pillar-name { position: relative; margin: 5px 0 13px; font-size: 8px; font-weight: 700; line-height: 11px; } .insights-screen .pillar-name { position: absolute; margin: 0; font-size: 8px; font-weight: 700; line-height: 11px; } .pulse-screen .p10-20 { padding: 10px 15px; } .pulse-close-up .panel .user-results, .pulse-screen .user-results { display: -webkit-flex; display: -moz-box; display: flex; width: 100%; } .pulse-close-up .user-results .progress-bar-container, .pulse-screen .user-results .progress-bar-container { -webkit-flex-grow: 1; -moz-box-flex: 1; flex-grow: 1; position: relative; } .pulse-close-up .with-marks, .pulse-screen .with-marks { margin-bottom: 32px; } .pulse-close-up .progress-container, .pulse-screen .progress-container { background-color: #f2f3f7; width: 100%; height: 30px; -moz-border-radius: 4px; border-radius: 4px; margin-bottom: 5px; color: #fff; line-height: 30px; position: relative; } .pulse-screen .pillar-text .progress-container { height: 15px; } .pulse-screen .pillar-text .progress-fill { border: none; } .pulse-close-up .marks, .pulse-screen .marks { position: relative; display: -webkit-flex; display: -moz-box; display: flex; width: 100%; -webkit-justify-content: space-between; -moz-box-pack: justify; justify-content: space-between; bottom: 0; color: #cdd1d9; } .pulse-close-up .marks .mark-number, .pulse-screen .marks .mark-number { display: inline-block; margin-left: -7px; margin-right: -7px; width: 16px; text-align: center; } .pulse-screen .marks .mark-number { font-size: 8px; } .pulse-close-up .marks .mark-number:before, .pulse-screen .marks .mark-number:before { display: block; content: ''; margin-left: 50%; width: 1px; height: 12px; background-color: #ebedf0; } .pulse-screen .marks .mark-number:before { height: 5px; } .pulse-close-up .user-results .progress-bar-container .progress-container, .pulse-screen .user-results .progress-bar-container .progress-container { margin-right: 0; margin-bottom: 0; } .pulse-close-up .progress-container .progress-fill, .pulse-screen .progress-container .progress-fill { background-color: #8cc152; width: 0%; height: 100%; -moz-border-radius-topleft: 4px; border-top-left-radius: 4px; -moz-border-radius-bottomleft: 4px; border-bottom-left-radius: 4px; -moz-box-shadow: inset grey -1px 0 3px -1px; box-shadow: inset grey -1px 0 3px -1px; width: 0; -moz-transition: width .5s; transition: width .5s; } .pulse-close-up .progress-fill, .pulse-screen .progress-fill { border-right: 1px dashed; border-color: #cad1d9; } .pulse-close-up .progress-fill.normal, .pulse-screen .progress-fill.normal { border-color: #f3a100; } .pulse-close-up .pillar-result-progress .progress-container .progress-fill, .pulse-screen .pillar-result-progress .progress-container .progress-fill { -moz-box-shadow: none; box-shadow: none; } .pulse-close-up .pillar-result-progress .progress-container .progress-fill.normal, .pulse-screen .pillar-result-progress .progress-container .progress-fill.normal { background-color: #fbe6c4; } .pulse-close-up .result-progress .text, .pulse-screen .result-progress .text { display: none; } .pulse-close-up .progress-container .text, .pulse-screen .progress-container .text { text-align: center; display: none; } .pulse-close-up .user-results .progress-bar-container .pillar-result, .pulse-screen .user-results .progress-bar-container .pillar-result { position: absolute; } .pulse-close-up .pillar-result.normal, .pulse-screen .pillar-result.normal { background-color: #f3a100; } .pulse-close-up .pillar-result-progress .progress-container .progress-fill.very-good, .pulse-screen .pillar-result-progress .progress-container .progress-fill.very-good { background-color: #e3eed6; } .pulse-close-up .pillar-result-progress .progress-container .progress-fill.bad, .pulse-screen .pillar-result-progress .progress-container .progress-fill.bad { background-color: #fddbd5; } .pulse-close-up .pillar-result, .pulse-screen .pillar-result { margin-left: -20px; top: -12px; left: 0; -moz-transition: left .5s; transition: left .5s; -moz-border-radius: 20px; border-radius: 20px; color: #fff; width: 40px; height: 40px; text-align: center; display: inline-block; line-height: 38px; background-color: #cad1d9; z-index: 1; } .pulse-screen .pillar-result { margin-left: -8px; top: -5px; width: 20px; height: 20px; } .pulse-close-up .very-good, .pulse-screen .very-good { background-color: #8cc152; } .pulse-close-up .bad, .pulse-screen .bad { background-color: #fc6e51; } .pulse-close-up .pillar-result-progress .progress-container{ height: 16px; } .pulse-screen .pillar-result-progress .progress-container { height: 10px; } .pulse-close-up .user-results .icons, .pulse-close-up .question-result-info .flex-item:not(:first-child), .pulse-screen .question-result-info .flex-item:not(:first-child) { position: relative; top: -7px; margin-left: 15px; } .pulse-close-up .user-results .icons .x-tooltip { margin-left: 5px; } .pulse-close-up .user-results .icons .x-tooltip a { width: 34px; height: 34px; border: 1px solid #e6e9ed; -moz-border-radius: 34px; border-radius: 34px; padding: 4px 7px; font-size: 16px; display: inline-block; text-align: center; text-decoration: none; } @media (max-width: 1200px) { .survey-footer { display: none; } } @media (max-width: 991px) { .pulse-screen { width: 535px; } .survey { width: auto; } .insights-screen .user-results .icons { display: none; } .survey-footer { display: none; } } @media (max-width: 768px) { .pulse-screen { width: 535px; } .survey { width: auto; } .pulse-close-up, .survey { height: 306px; } .insights-screen .user-results .icons { display: inline-block; } .questions-completed .center-hv { width: 200px; } .questions-completed-bar { opacity: 1; } .question-details p { margin: 0 0 107px; } .toggle-handle { width: 48px; height: 48px; } .toggle { top: 102px; } .dot-container { position: relative; top: 2px; } .question-details { top: 70px; } .question-details h3 { margin-bottom: 10px; } .question-details p { line-height: 28px; } .progress-fill.normal { width: 60%!important; } .progress-fill.very-good { width: 80%!important; } .result-1 { left: 60%!important; } .result-2 { left: 80%!important; } } @media (max-width: 479px) { .survey { width: auto; } .insights-screen .user-results .icons { display: none; } .pulse-close-up .pillar-name { font-size: 14px; } } @media (max-width: 471px) { .toggle { top: 130px; } } /* ------------------- STAFF IDEAS --------------------*/ .ideas-screen .flex-container { position: relative; border-bottom: 1px solid #e6e9ed; -webkit-align-items: center; -moz-box-align: center; align-items: center; } .ideas-screen .flex-item { padding: 20px 15px; } .ideas-screen .rank { position: relative; top: -5px; display: inline-block; padding: 2px 5px; min-width: 27px; } .ideas-screen .rank.rank-top { background-color: #ffce63; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; color: #333; } .ideas-screen .rank-diff { position: relative; top: -5px; display: inline-block; font-size: 18px; vertical-align: baseline; margin-left: 5px; } .ideas-screen .text-success { color: #a2df8d; } .ideas-screen .text-danger { color: #da4453; } .ideas-screen .text-neutral { color: #e6e9ed; } .ideas-screen .like-tooltip-container { display: inline-block; margin-left: 25px; } .ideas-screen .like-link { position: relative; color: #8b919f; font-size: 23px; } .ideas-screen .staff-idea-likes-count { display: inline-block; position: relative; top: -5px; } .ideas-screen .likes-count-tooltip { margin-left: 5px; padding-top: 4px; padding-bottom: 4px; } .ideas-screen .likes-count-tooltip .likes-count { border-bottom: 1px dashed #656d78; cursor: pointer; display: inline-block; cursor: default; } .x-tooltip:hover:not(.invisible-tooltip) .x-tooltip-body { visibility: visible; } .x-tooltip.x-tooltip-bottom .x-tooltip-body { bottom: auto; top: 100%; } .ideas-screen .x-tooltip.x-tooltip-bottom .x-tooltip-body { bottom: auto; top: 100%; } .ideas-screen .x-tooltip .x-tooltip-body.x-tooltip-white { max-height: 200px; opacity: 1; padding: 0; background-color: #fff; color: #656d78; text-align: center; border: 1px solid #cad1d9!important; -moz-box-shadow: 0 1px 1px rgba(0,0,0,.05); box-shadow: 0 1px 1px rgba(0,0,0,.05); -moz-border-radius: 4px; border-radius: 4px; overflow: scroll; } .ideas-screen .x-tooltip.x-tooltip-bottom .x-tooltip-body:before { top: -16px; border: 8px solid transparent; border-bottom: 8px solid #cad1d9; } .x-tooltip.x-tooltip-bottom .x-tooltip-body:after { top: -15px; border: 8px solid transparent; border-bottom: 8px solid #fff; } .ideas-screen .x-tooltip.x-tooltip-bottom .x-tooltip-body:after, .ideas-screen .x-tooltip.x-tooltip-bottom .x-tooltip-body:before { left: 50%; -webkit-transform: translateX(-8px); -moz-transform: translateX(-8px); transform: translateX(-8px); } .ideas-screen .x-tooltip.x-tooltip-bottom .x-tooltip-body:after, .ideas-screen .x-tooltip.x-tooltip-bottom .x-tooltip-body:before, .ideas-screen .x-tooltip.x-tooltip-left .x-tooltip-body:after, .ideas-screen .x-tooltip.x-tooltip-left .x-tooltip-body:before, .ideas-screen .x-tooltip.x-tooltip-right .x-tooltip-body:after, .ideas-screen .x-tooltip.x-tooltip-right .x-tooltip-body:before { width: 15px; height: 15px; display: block; position: absolute; content: ''; } .ideas-screen .likes-count-tooltip .likes-count-users { max-height: 250px; overflow: scroll; text-align: left; padding: 15px; } .ideas-screen .x-tooltip .x-tooltip-body.x-tooltip-white .tooltip-body { padding: 10px; font-weight: 400; white-space: nowrap; } .ideas-screen .likes-count-tooltip .likes-count-users>div .avatar { -moz-border-radius: 15px; border-radius: 15px; height: 30px; width: 30px; border: 2px solid #fff; margin-right: 13px; } .ideas-screen .flex-container>.flex-item.idea-info { -webkit-flex-grow: 1; -moz-box-flex: 1; flex-grow: 1; text-align: left; } .ideas-screen .avatar-container { float: left; margin-right: 13px; } .ideas-screen .avatar-picture { -moz-border-radius: 25px; border-radius: 25px; height: 50px; width: 50px; border: 2px solid #fff; margin-right: 0; } .ideas-screen .idea-info .idea-title { margin-bottom: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .ideas-screen .pillar-linked-to-component { display: inline-block; } .ideas-screen .user-line { margin: 5px; } .ideas-screen .icobutton { margin: 0; padding: 0; color: #c0c1c3; border: 0; background: none; overflow: visible; -webkit-tap-highlight-color: rgba(0,0,0,0); font-size: 40px; } .ideas-screen .thumb-pulse { -webkit-animation-name: thumb-pulse; -moz-animation-name: thumb-pulse; animation-name: thumb-pulse; -webkit-animation-duration: 3s; -moz-animation-duration: 3s; animation-duration: 3s; -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-iteration-count: infinite; } @keyframes thumb-pulse { 0%, 20% { -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1); } 10% { -webkit-transform: scale(1.4); -moz-transform: scale(1.4); transform: scale(1.4); } } @media (max-width: 991px) { .ideas-screen .idea-rank { padding-left: 0; } .ideas-screen .idea-info { padding-right: 0; overflow: hidden; } .ideas-screen .staff-idea-likes-count { left: 36px; } .ideas-screen .pillar-linked-to-component { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } } @media (max-width: 768px) { .ideas-screen .staff-idea-likes-count { left: 0; } .ideas-screen .pillar-linked-to-component { display: inline-block; } } @media (max-width: 600px) { .pulse-close-up .x-tooltip.inline-tooltip { display: none; } } @media (max-width: 479px) { .pulse-close-up .x-tooltip.inline-tooltip { display: inline-block; } .ideas-screen .idea-rank { width: 600px; } .ideas-screen .like-tooltip-container { margin-left: 15px; } .ideas-screen .pillar-linked-to-component { display: block; } .ideas-screen .idea-table-line { -webkit-align-items: left; -moz-box-align: left; align-items: left; text-align: left; } .ideas-screen .idea-info .avatar-container { display: none!important; } .ideas-screen .idea-info { width: 300px; } .sip-close-up .idea-info { width: auto; } } @media (max-width: 390px) { .ideas-screen .idea-rank { width: 800px; } .ideas-screen .idea-info { width: 250px; } .idea-card-description .xxs-screen { display: none; } .sip-status-container { position: relative; top: 10px!important; } .sip-status-container .pulse-amber-bg { display: none!important; } .sip-status-container .pulse-green-bg { margin-left: 10px!important; } } /* ------------------- RESOURCES --------------------*/ .resources-screen .panel { position: relative; display: inline-block; width: 47%; height: auto; padding: 0; } .resources-screen .idea-card-content, .resources-screen .resource-details { padding: 20px; } .resources-screen .panel .title { display: block; margin-top: 10px; font-size: 20px; line-height: 23px; color: #333; font-weight: 700; text-decoration: none; } .resources-screen .resource-thumb { width: 100%; height: 150px; background-size: cover; background-repeat: no-repeat; background-position: center center; } .resources-screen .culture-img { background-image: url('https://satchel-pulse.s3.amazonaws.com/uploads/attachment/file/55335fc64fa946ea43180641031eaa367f7b0625/idea_image_Close_20up_20of_20color_20pencils_20organized_20in_20a_20box.jpeg'); } .resources-screen .job-sat-img { background-image: url('https://satchel-pulse.s3.amazonaws.com/uploads/attachment/file/c478940a166cb528d3ba2f20ba5cd6b53ffe7276/idea_image_6-Amazing-Benefits-Of-Employee-Engagement-og.png'); } .idea-card-bottom { border-top: 1px solid #e6e9ed; height: 50px; padding-left: 20px; padding-right: 20px; padding-top: 13px; } .idea-card-description .read-more { display: block; margin-top: 10px; text-decoration: none; } .direct-message-link, .like-resource { display: inline-block; } .direct-message-link { margin-right: 5px; } @media (max-width: 991px) { .resources-screen .panel { width: 100%; } } @media (max-width: 768px) { .resources-screen .panel { width: 47%; } .resources-screen .resource-thumb { height: 100px; } } @media (max-width: 730px) { .resources-screen .panel { width: 100%; max-width: 300px; float: none!important; } .resources-screen .small-hide { display: none!important; } } @media (max-width: 479px) { .resources-screen .panel { width: 100%; } } /* ------------------- ACTIONS --------------------*/ .actions-close-up .pill { display: inline-block; margin-right: 7px; background-color: #f4f8fb; -moz-border-radius: 15px; border-radius: 15px; padding: 2px 13px; font-size: 14px; } .actions-close-up .pillar-linked-to-component { font-size: 14px; } .actions-close-up .avatar-picture { position: relative; top: 3px; margin-right: 10px; } .actions-close-up .row-pie-chart { position: relative; top: 13px; margin-right: 20px; } .actions-close-up .row-pie-chart svg { width: 36px; height: 36px; } .actions-close-up .row-pie-chart p { position: relative; top: -15px; display: inline-block; margin-left: 5px; font-size: 14px; } .actions-close-up .idea-title a, .ideas-screen .idea-title a { text-decoration: none; } .actions-close-up .related-actions { position: relative; float: right; margin-right: 20px; } @media (max-width: 991px) { .actions-close-up .pill { display: none; } .actions-close-up .row-pie-chart svg { } .actions-close-up .row-pie-chart p { display: none; } .actions-close-up .row-pie-chart { top: 5px; width: 100px; text-align: right; } } @media (max-width: 768px) { .actions-close-up, .sip-close-up, .resources-screen { height: 380px; } } @media (max-width: 479px) { .actions-close-up .avatar-container { display: none!important; } } /* ------------------- SIP --------------------*/ .sip-close-up .sip-title, .actions-close-up .sip-title, .sip-close-up .sip-status { display: inline-block; } .sip-close-up .related-actions { position: relative; left: 187px; } .sip-close-up .sip-status { position: relative; top: 6px; width: 100px; margin-right: 20px; } .sip-close-up .circle { width: 30px; height: 30px; } .sip-close-up .sip-status .circle, .sip-close-up .sip-status p { display: inline-block; vertical-align: initial; } .sip-close-up .sip-status .circle { vertical-align: middle; } .sip-close-up .sip-status p { margin-left: 5px; vertical-align: initial; font-size: 14px; } @media (max-width: 1200px) { .sip-close-up .ide-info { padding-right: 0; } .sip-close-up .sip-status-container { margin-right: 10px; text-align: center; } .sip-close-up .related-actions { left: 120px; } .sip-close-up .sip-status { top: 5px; width: 100px; margin-right: 0px; } } @media (max-width: 991px) { .sip-close-up .sip-status-container { width: 170px; margin-right: 10px; text-align: right; } .sip-close-up .related-actions { left: 95px; } .sip-close-up .sip-status p { display: none; } .sip-close-up .sip-status { top: -1px; width: auto; margin-right: 10px; } } @media (max-width: 768px) { .sip-close-up .related-actions { position: relative; float: right; margin-right: 20px; } .sip-close-up .related-actions { left: auto; } .sip-close-up .sip-status-container { width: 350px; } .sip-close-up .sip-status p { display: inline-block; } } @media (max-width: 600px) { .sip-close-up .related-actions { left: auto; } .sip-close-up .sip-status-container { width: 200px; } .sip-close-up .sip-status p { display: none; } } /* ------------------- EVALUATION HERO --------------------*/ .sef-screen .canvas { display: flex; margin: 1px 1px 15px 1px; padding: 0px; border: 1px solid #e6e9ed; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; text-align: left; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; } .sef-screen .standard-panel { height: 192px; } .sef-screen .standard-grow { height: 265px; } .sef-screen .canvas h3 { margin: 0 0 10px; font-weight: normal; font-size: 18px; line-height: 28px; color: #0e79c9; } .sef-screen .standard-tab, .sef-screen .criteria-tab { position: relative; width: 50px; padding: 16px 0 0; -webkit-border-radius: 4px 0 0 4px; -moz-border-radius: 4px 0 0 4px; border-radius: 4px 0 0 4px; color: #fff; font-weight: bold; text-align: center; } .sef-screen .criteria-tab { padding: 21px 0 0; color: #656d78; background-color: #f1f3f6; border-right: 1px solid #e6e9ed; font-weight: normal; } .sef-screen .evaluation-details, .sef-screen .evaluate { float: left; width: 100%; height: 100%; } .sef-screen .evaluate .btn { padding: 10px 15px; background: #8cc152; border: 1px solid #719947; font-weight: normal; color: #fff; } .sef-screen .evaluate .btn:hover { background-color: #82cc44; border: 1px solid #68a336; } .sef-screen .evaluation-area { padding: 20px; background-color: #f0f7e8; border: 1px solid #8cc152; border-left: none; -webkit-border-radius: 0 0 6px 0; -moz-border-radius: 0 0 6px 0; border-radius: 0 0 6px 0; } .sef-screen .avatar-container { float: left; margin-right: 13px; } .sef-screen .avatar-container img { width: 50px; height: 50px; } .sef-screen .evaluation-area .judgement { margin: 0 0 2px; } .sef-screen .pill { display: inline-block; margin: 0 0 15px; background-color: #f4f8fb; -moz-border-radius: 15px; border-radius: 15px; padding: 2px 13px; font-size: 14px; font-weight: bold; color: #fff; } .sef-screen .btn-pulse { -webkit-animation-name: btn-pulse; -moz-animation-name: btn-pulse; animation-name: btn-pulse; -webkit-animation-duration: 3s; -moz-animation-duration: 3s; animation-duration: 3s; -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-iteration-count: infinite; } .pulse-screen .canvas table th { background-color: #f5f7fa; text-align: left; } @keyframes btn-pulse { 0%, 20% { -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1); } 10% { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); transform: scale(1.1); } } @media (max-width: 1200px) { .sef-screen .standard-grow { height: 290px; } } @media (max-width: 991px) { .sef-screen .standard-panel { height: 245px; } .sef-screen .standard-grow { height: 368px; } } @media (max-width: 479px) { .sef-screen { height: auto; } } /* ------------------- SEL DASHBOARD --------------------*/ .pulse-screen .sel-canvas { position: relative; margin-bottom: 15px; background-color: #fff; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; text-align: left; } .pulse-screen .sel-canvas p { margin: 0; } .pulse-screen .sel-dashboard-header { position: relative; padding: 10px; font-size: 8px; color: #fff; line-height: 14px; vertical-align: top; } .pulse-screen .sel-dashboard-header .header-text { display: inline-block; vertical-align: top; } .pulse-screen .sel-dashboard-header .view-btn { position: relative; float: right; display: inline-block; padding: 5px 8px; background-color: #fff; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; vertical-align: top; } .pulse-screen .sel-dashboard-header .tier { font-size: 10px; font-weight: bold; } .pulse-screen .sel-dashboard-body { padding: 5px 10px; font-size: 8px; } .pulse-screen .sel-dashboard-body .tier-row { width: 100%; border-bottom: 1px solid #f5f7fa; } .pulse-screen .sel-dashboard-body .tier-row p { display: inline-block; vertical-align: middle; } .pulse-screen .sel-dashboard-body .tier-row p span { margin: 0 2px; font-size: 10px; vertical-align: middle; } .pulse-screen .sel-dashboard-body .tier-row p i { font-size: 11px; vertical-align: middle; } .pulse-screen .sel-dashboard-body .tier-row p i.grey { color: #ccd1d9; } .pulse-screen .sel-card { position: relative; margin-bottom: 15px; background-color: #fff; padding: 10px 10px 5px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; text-align: left; } .pulse-screen .sel-card p { margin: 0; font-size: 8px } .pulse-screen .sel-card .circle { display: inline-block; position: relative; margin: 0; background-color: #f5f7fa; margin-left: 10px; width: 25px; height: 25px; z-index: 1; } .pulse-screen .sel-card .circle i { position: absolute; top: -6px; left: -6px; font-size: 22px; color: #aab2bd; z-index: 2; } .pulse-screen .sel-card .sel-card-title { margin-bottom: 20px; font-size: 8px; line-height: 12px; color: #333; } .pulse-screen .sel-card .sel-card-body .count { display: inline-block; position: relative; top: -2px; float: right; } .pulse-screen .sel-card .sel-card-body .count p { margin: 0; font-size: 22px; line-height: 22px; color: #333; } .pulse-screen .sel-card .sel-card-body .count p span { margin: 0; font-size: 8px; line-height: 8px; } .pulse-screen .yellow-banner { position: relative; width: 100%; margin-bottom: 15px; background-color: #fefaf2; border: 1px solid #f3ca7b; padding: 10px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-transition: all 0.6s ease-in-out; -moz-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; text-align: left; vertical-align: top; } .pulse-screen .yellow-banner p { margin: 0; line-height: 18px; } .pulse-screen .yellow-banner .banner-text { position: relative; display: inline-block; width: 70%; font-size: 8px; vertical-align: top; } .pulse-screen .yellow-banner .banner-text .banner-info { line-height: 11px; } .pulse-screen .yellow-banner .banner-text .banner-title { font-size: 10px; font-weight: bold; } .pulse-screen .yellow-banner .banner-btn { position: relative; float: right; display: inline-block; padding: 5px 8px; background-color: #8cc152; border: 1px solid #6d993e; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; font-size: 8px; color: #fff; vertical-align: top; } .staff-qa-screen .staff-card { padding: 5px 15px 10px; } .staff-qa-screen .staff-card ul { margin: 0; padding: 0; } .staff-qa-screen .staff-card ul li { display: inline-block; margin-right: 5px; list-style: none; font-size: 10px; color: #aab2bd; } .staff-qa-screen .staff-card h4 { margin-bottom: 5px; font-size: 12px; color: #333; } .staff-qa-screen .staff-card .idea-box { display: inline-block; padding: 4px 8px 6px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; background-color: #ccd1d9; line-height: 10px; } .staff-qa-screen .staff-card .on { background-color: #f3a100; } .staff-qa-screen .staff-card .idea-box i { font-size: 10px; color: #fff; } .staff-qa-screen .q-details { display: flex; padding: 0; border: none; } .staff-qa-screen .q-details .card-info { flex: 1; max-width: 60px; padding: 10px; background-image: -moz-linear-gradient(left, #34a7fc, #2fa3fc); background-image: linear-gradient(to right, #34a7fc, #2fa3fc); vertical-align: top; border-radius: 4px 0px 0px 4px; -moz-border-radius: 4px 0px 0px 4px; -webkit-border-radius: 4px 0px 0px 4px; text-align: center; font-size: 12px; color: #333; line-height: 12px; } .staff-qa-screen .q-details .card-info i { margin-top: 10px; font-size: 18px; } .staff-qa-screen .q-details .question { background-image: -moz-linear-gradient(left, #34a7fc, #2fa3fc); background-image: linear-gradient(to right, #34a7fc, #2fa3fc); } .staff-qa-screen .q-details .idea { background: #f5f7fa; border: 1px solid #e6e9ed; border-right: none; } .staff-qa-screen .q-details .idea-border { border-left: 1px solid #f3a100; } .staff-qa-screen .q-details .card-details { flex: 1; padding: 5px 15px 10px; } .staff-qa-screen .q-details ul li.q-type { display: block; height: 15px; } .staff-qa-screen .q-details h4 { color: #333; } .staff-qa-screen .staff-card p { display: block; margin: 0 0 10px; font-size: 10px; color: #656d78; line-height: 16px; } .staff-qa-screen .staff-card .info-text { display: inline-block; margin: 0; font-size: 10px; color: #aab2bd; } .staff-qa-screen .staff-card .info-label { display: inline-block; margin: 0; padding: 0px 7px 2px; border: 1px solid #f5f7fa; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; font-size: 10px; color: #aab2bd; } .staff-qa-screen .placeholder { display: flex; margin-top: 5px; } .staff-qa-screen .placeholder .lines { flex: auto; } .staff-qa-screen .placeholder .avatar-circle { height: 30px; width: 30px; margin-right: 5px; border-radius: 50%; background-color: #f5f7fa; } .staff-qa-screen .placeholder .blank-line { height: 8px; width: 100%; margin-bottom: 8px; background-color: #f5f7fa; } .staff-qa-screen .placeholder .blank-line.short { width: 50%; } .actions-screen .actions-card { padding: 15px; } .actions-screen .actions-card h4 { font-size: 12px; color: #333; line-height: 17px; } .actions-screen .actions-card h5 { font-size: 10px; font-weight: 600; color: #333; } .actions-screen .actions-card p { display: block; margin: 0 0 10px; font-size: 10px; color: #656d78; line-height: 16px; } .actions-screen .actions-card p i { color: #ccd1d9; } .actions-screen .actions-card p span { color: #333; } .actions-screen .grey-bar { margin: 10px 0; background-color: #e6e9ed; border-radius: 4px; overflow: hidden; } .actions-screen .green-bar { width: 75%; padding: 5px 7px; background-color: #8cc152; font-size: 10px; color: #fff; line-height: 10px; overflow: hidden; } .actions-screen .date-block { font-size: 10px; line-height: 18px; } .actions-screen .action-details { padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid #e6e9ed; } .actions-screen .action-details .user-details { margin-left: 10px; } .actions-screen .action-details p { margin: 0; } .actions-screen .current-score { font-size: 10px; } .actions-screen .current-score span { font-weight: 600; } @media (max-width: 1200px) { .actions-screen .date-block .float-left, .actions-screen .date-block .float-right { float: none!important; } .actions-screen .date-block .float-left i { display: none; } .actions-screen .actions-title { display: none; } } /* ------------------- SURVEY SCREEN --------------------*/ .color-line { position: fixed; width: 100%; top: 0; height: 4px; -moz-background-size: 100% 6px; background-size: 100% 6px; background: -moz-linear-gradient(left,#34495e,#34495e 24%,#967adc 25%,#967adc 34%,#4fc1e9 35%,#4fc1e9 44%,#8cc152 45%,#8cc152 54%,#ffce54 55%,#ffce54 64%,#f3a100 65%,#f3a100 74%,#fc6e51 75%,#fc6e51 84%,#da4453 85%,#da4453 100%) 50% 100% no-repeat #f7f9fa; background: linear-gradient(to right,#34495e,#34495e 24%,#967adc 25%,#967adc 34%,#4fc1e9 35%,#4fc1e9 44%,#8cc152 45%,#8cc152 54%,#ffce54 55%,#ffce54 64%,#f3a100 65%,#f3a100 74%,#fc6e51 75%,#fc6e51 84%,#da4453 85%,#da4453 100%) 50% 100% no-repeat #f7f9fa; z-index: 1031; } .hide-q { display: none; } .survey-question-1, .survey-question-2 { width: 100%; background-color: #fff; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; z-index: 20; } .survey-question-1 .questions-completed-bar, .survey-question-2 .questions-completed-bar { position: absolute; } .survey-question-1 .questions-completed-bar-item, .survey-question-2 .questions-completed-bar-item { width: 14%; flex-grow: inherit!important; } .survey-screen { margin: auto; background-color: #fff!important; } .survey-screen .color-bg { position: absolute; top: 0; left: 0; width: 100%; height: 130px; background-color: transparent; z-index: 10; } .survey-screen .color-line { z-index: 5; } .survey-screen .center-hv { z-index: 15; } .survey-screen .survey-logo { width: 150px; height: 150px; margin: auto; background-image: url(./../assets/images/gifs/start-survey-animation.gif); background-size: contain; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .survey-screen .survey-logo { background-image: url(./../assets/images/gifs/start-survey-animation-@2x.gif); } } .survey-screen .survey-btn a { height: 40px; border-radius: 40px; padding: 10px 20px; background: #fc6e51; color: #fff!important; font-size: 18px; } .survey-screen .survey-btn a:hover { text-decoration: none; } .survey-screen .survey-title { margin: 20px 0 15px; font-size: 20px; font-weight: 700; color: #677f94; } .survey-screen .survey-text { width: 300px; margin: 0 0 30px; font-size: 18px; } .survey-screen .sm-text { margin: 15px 0 0; font-size: 12px; color: #aab2bd; } .survey-screen .colour-block { background-color: #fc6e51; } .survey-screen .multiple-choice-container { position: absolute; top: 160px; left: 4%; width: 92%; margin: auto; border: 1px solid #e6e9ed; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .survey-screen .multiple-choice-container .multiple-choice-item { padding: 12px; border-bottom: 1px solid #e6e9ed; } .survey-screen .multiple-choice-container .multiple-choice-item:nth-last-child(1) { border: none; } .survey-screen .multiple-choice-container .shortcut-box { display: inline-block; padding: 3px 10px; border: 1px solid #e6e9ed; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; font-weight: bold; color: #fc6e51; } .survey-screen .multiple-choice-container p { display: inline-block; margin: 0 0 0 10px; } .toggle-scroll { left: calc(50% - 31px); } .toggle-scroll .toggle-handle { border-color: #f3a100; } .survey-face { position: relative; width: 60px; left: 8px; top: -3px; filter: alpha(opacity=0); opacity: 0; -webkit-transition: all 0.3s ease-in-out!important; -o-transition: all 0.3s ease-in-out!important; transition: all 0.3s ease-in-out!important; } .v-100 { filter: alpha(opacity=1); opacity: 1; } .multiple-choice-container .selected { background-color: #f5f7fa; } .multiple-choice-container .selected .shortcut-box { background-color: #fc6e51; color: #fff; } /* ------------------- CUSTOM ONE --------------------*/ .custom-one .color-bg { background-color: #5d9cec; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 56 28' width='112' height='56'%3E%3Cpath fill='%23ffffff' fill-opacity='0.05' d='M56 26v2h-7.75c2.3-1.27 4.94-2 7.75-2zm-26 2a2 2 0 1 0-4 0h-4.09A25.98 25.98 0 0 0 0 16v-2c.67 0 1.34.02 2 .07V14a2 2 0 0 0-2-2v-2a4 4 0 0 1 3.98 3.6 28.09 28.09 0 0 1 2.8-3.86A8 8 0 0 0 0 6V4a9.99 9.99 0 0 1 8.17 4.23c.94-.95 1.96-1.83 3.03-2.63A13.98 13.98 0 0 0 0 0h7.75c2 1.1 3.73 2.63 5.1 4.45 1.12-.72 2.3-1.37 3.53-1.93A20.1 20.1 0 0 0 14.28 0h2.7c.45.56.88 1.14 1.29 1.74 1.3-.48 2.63-.87 4-1.15-.11-.2-.23-.4-.36-.59H26v.07a28.4 28.4 0 0 1 4 0V0h4.09l-.37.59c1.38.28 2.72.67 4.01 1.15.4-.6.84-1.18 1.3-1.74h2.69a20.1 20.1 0 0 0-2.1 2.52c1.23.56 2.41 1.2 3.54 1.93A16.08 16.08 0 0 1 48.25 0H56c-4.58 0-8.65 2.2-11.2 5.6 1.07.8 2.09 1.68 3.03 2.63A9.99 9.99 0 0 1 56 4v2a8 8 0 0 0-6.77 3.74c1.03 1.2 1.97 2.5 2.79 3.86A4 4 0 0 1 56 10v2a2 2 0 0 0-2 2.07 28.4 28.4 0 0 1 2-.07v2c-9.2 0-17.3 4.78-21.91 12H30zM7.75 28H0v-2c2.81 0 5.46.73 7.75 2zM56 20v2c-5.6 0-10.65 2.3-14.28 6h-2.7c4.04-4.89 10.15-8 16.98-8zm-39.03 8h-2.69C10.65 24.3 5.6 22 0 22v-2c6.83 0 12.94 3.11 16.97 8zm15.01-.4a28.09 28.09 0 0 1 2.8-3.86 8 8 0 0 0-13.55 0c1.03 1.2 1.97 2.5 2.79 3.86a4 4 0 0 1 7.96 0zm14.29-11.86c1.3-.48 2.63-.87 4-1.15a25.99 25.99 0 0 0-44.55 0c1.38.28 2.72.67 4.01 1.15a21.98 21.98 0 0 1 36.54 0zm-5.43 2.71c1.13-.72 2.3-1.37 3.54-1.93a19.98 19.98 0 0 0-32.76 0c1.23.56 2.41 1.2 3.54 1.93a15.98 15.98 0 0 1 25.68 0zm-4.67 3.78c.94-.95 1.96-1.83 3.03-2.63a13.98 13.98 0 0 0-22.4 0c1.07.8 2.09 1.68 3.03 2.63a9.99 9.99 0 0 1 16.34 0z'%3E%3C/path%3E%3C/svg%3E"); } .custom-one .survey-logo { background-image: url(./../assets/images/features/surveys/custom-logo-one.png?w=145); } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .custom-one .survey-logo { background-image: url(./../assets/images/features/surveys/custom-logo-one.png?w=290); } } .custom-one .survey-btn a, .custom-one .colour-block { background-color: #0785c8; } .custom-one .question-details h3, .custom-one .multiple-choice-container .shortcut-box { color: #0785c8!important; } @media (max-width: 1200px) { .sef-screen .standard-grow { height: 290px; } } @media (max-width: 991px) { .sef-screen .standard-panel { height: 245px; } .sef-screen .standard-grow { height: 368px; } } @media (max-width: 479px) { .sef-screen { height: auto; } } /* ------------------- TRANSLATIONS SCREEN --------------------*/ .survey-screen .language-select { position: relative; display: inline-block; width: 200px; border: 1px solid #ccc; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; padding: 10px 20px; text-align: left; } .survey-screen .language-select-menu { position: relative; top: -1px; display: inline-block; width: 200px; height: 126px; overflow: hidden; border: 1px solid #ccc; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; padding: 10px 20px; text-align: left; } .survey-screen .language-select ul, .survey-screen .language-select-menu ul { margin: 0; padding: 0; list-style: none; } .survey-screen .language-select-menu ul { position: relative; top: 0; -webkit-transition: all 2s ease-in-out; -moz-transition: all 2s ease-in-out; transition: all 2s ease-in-out; } .survey-screen .language-select img, .survey-screen .language-select-menu img { margin-right: 5px; } .survey-screen .language-select-menu li { margin-bottom: 10px; } .survey-screen .fa-caret-down { position: absolute; top: 16px; right: 16px; } .survey-screen .scrollbar { position: absolute; top: 6px; right: 6px; width: 6px; height: 50px; background-color: rgba(0, 0, 0, .25); -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; -webkit-transition: all 2s ease-in-out; -moz-transition: all 2s ease-in-out; transition: all 2s ease-in-out; } @media (max-width: 1200px) { .survey-screen .logo-responsive { width: 110px; height: 110px; } .survey-screen .color-bg { height: 100px; } } .survey-builder-screen h3 { margin: 0px; color: #333; font-size: 12px; } .survey-builder-screen h3 span { color: #aab2bd; font-weight: 300; } .survey-builder-screen p { margin: 0 0 10px; color: #656d78; font-size: 10px; } .survey-builder-screen .question-block { display: flex; margin-bottom: 15px; } .survey-builder-screen .q-holder { flex: 1; } .survey-builder-screen .circle { width: 30px; height: 30px; background-color: #5d9cec; color: #fff; font-size: 10px; } .survey-builder-screen .results { flex: 10; padding: 10px; border: 1px solid #e6e9ed; border-radius: 4px; } .survey-builder-screen .results h4 { margin: 0 0 8px; color: #333; font-size: 12px; } .survey-builder-screen .results p { margin: 0; color: #aab2bd; font-size: 10px; line-height: 10px; } .survey-builder-screen .results-holder { display: flex; margin-top: 10px; padding: 20px 10px 10px; border-top: 1px solid #f5f7fa; } .survey-builder-screen .pie-chart { flex: 1; padding: 0 10px; } .survey-builder-screen .results-key { flex: 1; padding: 0 10px; margin: 0; font-size: 10px; line-height: 10px; color: #656d78; } .survey-builder-screen .results-key i { margin-right: 10px; font-size: 8px; } .survey-builder-screen .results-key .fa-ul li { margin-bottom: 12px; } figure { display: inline-block; margin: 0 auto; position: relative; font-size:16px; font-size:1vw; } figure .pie-hole { position: absolute; width: 65%; height: 65%; border-radius: 50%; background-color: #fff; } svg { display: block; width: 100%; top: 0; left: 0; overflow: visible; } circle { fill:rgba(0,0,0,0); stroke-width:31.8309886184; stroke-dasharray: 0,0,0,100; stroke-dashoffset: 25; -webkit-animation: pie1 2s ease both; animation: pie1 2s ease both; animation-delay: 1s; } .pie1 { /*stroke:hsl(206, 91%, 55%);*/ stroke: #219af6; } .pie2 { stroke:hsl(43, 100%, 67%); -webkit-animation-name: pie2; animation-name: pie2; } .pie3 { /*stroke:hsl(88, 47%, 54%);*/ stroke: #0e79c9; -webkit-animation-name: pie3; animation-name: pie3; } .pie4 { /*stroke:hsl(257, 58%, 67%);*/ stroke: #ac92ec; -webkit-animation-name: pie4; animation-name: pie4; } .pie5 { /*stroke:hsl(165, 55%, 48%);*/ stroke: #a0d468; -webkit-animation-name: pie5; animation-name: pie5; } .pie6 { stroke:hsl(10, 95%, 65%); -webkit-animation-name: pie6; animation-name: pie6; } /* pie percentage made by stroke-dasharray. stroke-dasharray format is... keyframe 100% : 0 offset this-percentage rest I added keyframe 50% for infinite presentation. */ /* 1st pie is 30% */ @-webkit-keyframes pie1 { 50%,100% {stroke-dasharray: 30,70,0,0;} } @keyframes pie1 { 50%,100% {stroke-dasharray: 30,70,0,0;} } /* 2nd pie is 15% */ @-webkit-keyframes pie2 { 50%,100% {stroke-dasharray: 0,30,15,55;} } @keyframes pie2 { 50%,100% {stroke-dasharray: 0,30,15,55;} } /* 3rd pie is 20% */ @-webkit-keyframes pie3 { 50%,100% {stroke-dasharray: 0,45,20,35;} } @keyframes pie3 { 50%,100% {stroke-dasharray: 0,45,20,35;} } /* 4th pie is 15% */ @-webkit-keyframes pie4 { 50%,100% {stroke-dasharray: 0,65,15,20;} } @keyframes pie4 { 50%,100% {stroke-dasharray: 0,65,15,20;} } /* 5th pie is 10% */ @-webkit-keyframes pie5 { 50%,100% {stroke-dasharray: 0,80,10,10;} } @keyframes pie5 { 50%,100% {stroke-dasharray: 0,80,10,10;} } /* 6th pie is 10% */ @-webkit-keyframes pie6 { 50%,100% {stroke-dasharray: 0,90,10,0;} } @keyframes pie6 { 50%,100% {stroke-dasharray: 0,90,10,0;} } .sip-screen h3 { margin: 0px; color: #333; font-size: 12px; } .sip-screen h3 span { color: #aab2bd; font-weight: 300; } .sip-screen p { margin: 0 0 10px; color: #656d78; font-size: 10px; } .sip-screen .btn { margin: 0 0 10px; border-radius: 3px; color: #fff; font-size: 10px; } .sip-screen .sip-table { width: 100%; margin-bottom: 15px; } .sip-screen .sip-table thead { background-color: #f4f8fb; border-bottom: 2px solid #e6e9ed; } .sip-screen .sip-table thead td { padding: 5px 10px; color: #333; font-size: 10px; } .sip-screen .sip-table tr { border-bottom: 1px solid #e6e9ed; } .sip-screen .sip-table tr td { padding: 5px 10px; color: #656d78; font-size: 10px; vertical-align: middle; } .sip-screen .sip-table .circle { display: inline-block; width: 20px; height: 20px; margin: 0 3px 0 0; color: #fff; font-size: 10px; vertical-align: middle; } .resources-screen i { font-size: 10px; line-height: 10px; } .resources-screen h3 { margin: 0 0 10px; color: #333; font-size: 11px; line-height: 16px; } .resources-screen h3 span { color: #aab2bd; font-weight: 300; } .resources-screen img { margin: 0 0 10px; } .resources-screen p { margin: 0 0 10px; color: #656d78; font-size: 10px; line-height: 14px; } .resources-screen .btn { margin: 0 0 10px; border-radius: 3px; color: #fff; font-size: 10px; } .resources-screen .footer { display: flex; padding-top: 10px; border-top: 1px solid #e6e9ed!important; } .resources-screen .views { flex: 1; } .resources-screen .views p { margin: 0; line-height: 11px; } .resources-screen .icons { flex: 1; text-align: right; line-height: 11px; } .resources-screen .icons i { margin-left: 3px; } .resources-screen .form-card { text-align: center; } .resources-screen .form-card .li-bubble-pencil { font-size: 30px; line-height: inherit; color: #aab2bd; } .resources-screen .form-card .blue-btn { margin: 15px auto 20px auto; } .student-heartbeat-screen .canvas { line-height: 15px; font-size: 8px; text-align: center; } .student-heartbeat-screen .last-synced { margin-bottom: 10px; color: #aab2bd; text-align: left; } .student-heartbeat-screen .link { margin: 10px 0 0; } .student-heartbeat-screen .avatar { height: 70px; width: 70px; } .student-heartbeat-screen .student-name { margin: 10px 0 5px; color: #333; font-size: 10px; font-weight: 600; } .student-heartbeat-screen table { text-align: left; } .student-heartbeat-screen .row-title { padding-right: 10px; color: #333; } .student-heartbeat-screen .stat-title { margin: 0 0 10px; font-size: 10px; color: #333; font-weight: 600; line-height: 10px; } .student-heartbeat-screen .banner { margin-bottom: 10px; padding: 10px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; color: #fff; font-size: 10px; font-weight: 600; line-height: 10px; } .red-banner { background-color: #ed5565; } .green-banner { background-color: #8cc152; } .student-heartbeat-screen .icon-box-wrapper { padding: 10px; } .student-heartbeat-screen .icon-box-wrapper p { font-size: 10px; line-height: 10px; } .student-heartbeat-screen .icon-box-wrapper .iapp-icon-box-icon { height: auto; margin: 0; } .student-heartbeat-screen .icon-box-wrapper .iapp-icon-box-icon i { position: relative; z-index: 2; font-size: 30px; line-height: 10px; color: #aab2bd!important; } .student-heartbeat-screen .icon-box-wrapper .iapp-icon-box-icon .circle { position: absolute; top: 5px; left: 10px; width: 30px; height: 30px; margin: 0; filter: alpha(opacity=100); opacity: 1; z-index: 1; } .student-heartbeat-screen .icon-box-wrapper .score { position: absolute; bottom: 20px; right: 10px; font-size: 14px; color: #333; z-index: 10; } .student-heartbeat-screen .sip-table { width: 100%; } .student-heartbeat-screen .sip-table .circle span { font-size: 7px; } .student-heartbeat-screen .sip-table thead { background-color: #f4f8fb; border-bottom: 2px solid #e6e9ed; } .student-heartbeat-screen .sip-table thead td { padding: 5px 10px; color: #333; font-size: 10px; } .student-heartbeat-screen .sip-table tr { border-bottom: 1px solid #e6e9ed; } .student-heartbeat-screen .sip-table tr:last-child { border: none; } .student-heartbeat-screen .sip-table tr td { padding: 5px 10px; color: #656d78; font-size: 10px; vertical-align: middle; } .student-heartbeat-screen .sip-table .circle { display: inline-block; width: 20px; height: 20px; margin: 0 3px 0 0; color: #fff; font-size: 10px; vertical-align: middle; } .student-heartbeat-screen .col-md-4 { margin-bottom: 20px; } .student-heartbeat-screen .left-block { padding-right: 5px; } .student-heartbeat-screen .center-block { padding-right: 5px; padding-left: 5px; } .student-heartbeat-screen .right-block { padding-left: 5px; } @media (max-width: 768px) { .student-heartbeat-screen .left-block, .student-heartbeat-screen .center-block, .student-heartbeat-screen .right-block { padding: 0 15px; } .student-heartbeat-screen .col-md-4 { margin-bottom: 10px; } .student-heartbeat-screen .right-block { margin-bottom: 20px; } } /* --------------------------- SEL SCREENING AND ASSESSMENT ----------------------------*/ .sel-screens .canvas .action-bar { height: auto; border-bottom: none; padding: 13px 15px 12px; } .sel-screens .action-bar .dropdown { height: 28px; margin: 0 1% 0 0; } .sel-screens .action-bar .dropdown span { top: -4px; } .sel-screens .action-bar .dropdown i { top: 8px; } .sel-screens .btn { margin: 0; } .sel-screens .sip-table { margin: 40px 0 15px; } .sel-screens .sip-table thead .li { position: relative; top: 3px; font-size: 16px; } .sel-screens .sip-table tr { border-bottom: none; } .sel-screens .sel-input { width: 30px; background: #fff; padding: 0 5px; border: 1px solid #e6e9ed; margin: 0; border-radius: 4px; text-align: center; } .sel-screens .sip-table .highlight { background-color: #fffaee; border: 1px solid #fae2a7; } .sel-screens .sip-table .avatar { width: 20px; height: 20px; margin-right: 3px; } /* --------------------------- SEL INTERVENTION MANAGEMENT ----------------------------*/ .sel-screens .card-details h4 { margin-top: 15px; } .sel-screens .card-details .sel-pill { display: inline-block; margin-right: 2px; border: 1px solid #e6e9ed; border-radius: 20px; padding: 5px 15px; } .sel-screens .card-details .sel-pill p { margin: 0; } .sel-screens .card-details .sel-pill i { margin-right: 2px; color: #e9573f!important; } .sel-screens .card-details .sip-table { margin: 15px 0 0; } .sel-screens .card-details .sip-table thead tr td { padding: 10px; line-height: 15px; } .sel-screens .action-details { margin-bottom: 10px; } .sel-screens .action-details .user-details { margin-left: 10px; } .sel-screens .action-details p { margin: 0; } .step-box-container { display: flex; flex-wrap: wrap; padding: 0 10px; } .step-box { position: relative; flex: 2; flex-basis: 17.2%; min-width: 150px; margin: 20px; background-color: #f5f7fa; border-radius: 4px; padding: 20px; text-align: center; } .step-box h2 { font-size: 18px; color: #333; } .step-box p { font-size: 14px; line-height: 22px; } .sel-coaching .step-box p { font-size: 16px; line-height: 26px; } .step-box .step-circle { position: relative; width: 82px; height: 82px; margin: auto auto 15px; border-radius: 50%; background-color: #fff; z-index: 2; } .step-box .step-circle i { font-size: 38px; } .mint { color: #37bc9b; } .mint-border { border: 1px solid #37bc9b; } .purple { color: #bf657f; } .purple-border { border: 1px solid #bf657f; } .yellow { color: #f3a100; } .yellow-border { border: 1px solid #f3a100; } .blue { color: #0e79c9; } .blue-border { border: 1px solid #0e79c9; } .step-circle-holder { position: relative; } .chevron-top { position: absolute; left: -6px; top: 24px; transform: rotate(20deg); font-size: 14px!important; color: #aab2bd; } .chevron-bottom { position: absolute; left: -6px; bottom: 23px; transform: rotate(-20deg); font-size: 14px!important; color: #aab2bd; } .line-top { position: absolute; width: 120%; height: 50px; top: 10px; right: -76%; z-index: 1; background: transparent; border: none; border-top: dashed 2px #aab2bd; padding: 40px 40px; border-radius: 50%; } .line-bottom { position: absolute; width: 120%; height: 50px; bottom: 10px; right: -76%; z-index: 1; background: transparent; border: none; border-bottom: dashed 2px #aab2bd; padding: 40px 40px; border-radius: 50%; } @media (max-width: 1199px) { .chevron-bottom { bottom: 19px; } .chevron-top { top: 19px; } .line-bottom, .line-top { right: -88%; } } @media (max-width: 1045px) { .step-box { flex-basis: 30%; } .line-bottom, .line-top, .fa-chevron-right { display: none; } } @media (max-width: 600px) { .step-box { flex-basis: 100%; } } .progress-circle{position:relative;display:inline-block;margin:1rem;width:120px;height:120px;border-radius:50%;background-color:#ebebeb} .progress-circle:after{content:'';display:inline-block;width:100%;height:100%;border-radius:50%;-webkit-animation:colorload 2s;animation:colorload 2s} .progress-circle span{font-size:1.5rem;color:#8b8b8b;position:absolute;left:50%;top:50%;display:block;width:60px;height:60px;line-height:60px;margin-left:-30px;margin-top:-30px;text-align:center;border-radius:50%;background:#fff;z-index:1;} .progress-circle span:after{content:"%";font-weight:600;color:#8b8b8b} .progress-circle.progress-0:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(90deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-1:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(93.6deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-2:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(97.2deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-3:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(100.8deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-4:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(104.4deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-5:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(108deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-6:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(111.6deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-7:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(115.2deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-8:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(118.8deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-9:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(122.4deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-10:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(126deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-11:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(129.6deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-12:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(133.2deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-13:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(136.8deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-14:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(140.4deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-15:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(129.6deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-16:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(133.2deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-17:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(136.8deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-18:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(140.4deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-19:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(144deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-20:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(151.2deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-21:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(158.6deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-22:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(161.2deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-23:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(165.6deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-24:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(169.2deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-25:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(180deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-26:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(183.6deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-27:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(187.2deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-28:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(190.8deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-29:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(194.4deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-30:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(198deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-31:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(201.6deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-32:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(205.2deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-33:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(208.8deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-34:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(212.4deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-35:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(216deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-40:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(234deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-36:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(219.6deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-37:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(223.2deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-38:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(226.8deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-39:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(230.4deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-41:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(237.6deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-42:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(241.2deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-43:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(244.8deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-44:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(248.4deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-45:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(252deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-46:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(255.6deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-47:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(259.2deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-48:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(262.8deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-49:after{background-image:linear-gradient(90deg,#ebebeb 50%,transparent 50%,transparent),linear-gradient(266.4deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-50:after{background-image:linear-gradient(-90deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-51:after{background-image:linear-gradient(-86.4deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-52:after{background-image:linear-gradient(-82.6deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-53:after{background-image:linear-gradient(-79.2deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-54:after{background-image:linear-gradient(-75.6deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-55:after{background-image:linear-gradient(-72deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-56:after{background-image:linear-gradient(-68.4deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-57:after{background-image:linear-gradient(-64.8deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-58:after{background-image:linear-gradient(-61.2deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-59:after{background-image:linear-gradient(-57.6deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-60:after{background-image:linear-gradient(-54deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-61:after{background-image:linear-gradient(-50.4deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-62:after{background-image:linear-gradient(-46.8deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-63:after{background-image:linear-gradient(-43.2deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-64:after{background-image:linear-gradient(-39.6deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-65:after{background-image:linear-gradient(-36deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-66:after{background-image:linear-gradient(-32.4deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-67:after{background-image:linear-gradient(-28.8deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-68:after{background-image:linear-gradient(-25.2deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-69:after{background-image:linear-gradient(-21.6deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-70:after{background-image:linear-gradient(-18deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-71:after{background-image:linear-gradient(-14.4deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-72:after{background-image:linear-gradient(-10.8deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-73:after{background-image:linear-gradient(-7.2deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-74:after{background-image:linear-gradient(-3.6deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-75:after{background-image:linear-gradient(0deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-76:after{background-image:linear-gradient(3.6deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-77:after{background-image:linear-gradient(7.2deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-78:after{background-image:linear-gradient(10.8deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-79:after{background-image:linear-gradient(14.4deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-80:after{background-image:linear-gradient(18deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-81:after{background-image:linear-gradient(21.6deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-82:after{background-image:linear-gradient(25.2deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-83:after{background-image:linear-gradient(28.8deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-84:after{background-image:linear-gradient(32.4deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-85:after{background-image:linear-gradient(36deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-86:after{background-image:linear-gradient(39.2deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-87:after{background-image:linear-gradient(43.2deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-88:after{background-image:linear-gradient(46.8deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-89:after{background-image:linear-gradient(50.4deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-90:after{background-image:linear-gradient(54deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-91:after{background-image:linear-gradient(57.6deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-92:after{background-image:linear-gradient(61.2deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-93:after{background-image:linear-gradient(64.8deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-94:after{background-image:linear-gradient(68.4deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-95:after{background-image:linear-gradient(72deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-96:after{background-image:linear-gradient(75.6deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-97:after{background-image:linear-gradient(79.2deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-98:after{background-image:linear-gradient(82.8deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-99:after{background-image:linear-gradient(86.4deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} .progress-circle.progress-100:after{background-image:linear-gradient(90deg,#66b8ff 50%,transparent 50%,transparent),linear-gradient(270deg,#66b8ff 50%,#ebebeb 50%,#ebebeb)} @-webkit-keyframes colorload{0%{opacity:0;transform:rotate(0)}100%{opacity:1;transform:rotate(360deg)}} /* ------------------- GENERAL --------------------*/ .case-study { background-image: url(./../assets/images/media/case-study/pattern-bg.svg); background-repeat: no-repeat; padding: 50px 20px; z-index: 2; } .case-study-yellow { background-image: url(./../assets/images/media/case-study/pattern-yellow-bg.svg); background-repeat: no-repeat; padding: 50px 20px; z-index: 2; } .case-study .col-xl-10 { padding: 0; } .case-study h1 { margin: 30px 0; color: #333; font-size: 30px; line-height: 40px; font-weight: 600; } .case-study h2 { margin: 0 0 20px; color: #333; font-size: 20px; font-weight: 600; line-height: 30px; } .case-study-flex { width: 100%; display: -webkit-flex; display: -ms-flexbox; display: flex; justify-content: space-between; } .case-study-label { width: 134px; margin-right: auto; padding: 15px; background-color: #37bc9b; -webkit-border-radius: 40px; -moz-border-radius: 40px; border-radius: 40px; vertical-align: middle; } .case-study-btn { width: auto; margin-left: auto; padding: 10px 20px; border: 1px solid #0e79c9; background-color: transparent; -webkit-border-radius: 40px; -moz-border-radius: 40px; border-radius: 40px; vertical-align: middle; color: #0e79c9!important; } .sel-case-study .case-study-btn { width: auto; background-color: #fff; } .sel-case-study .cta-banner { display: flex; width: 100%; margin: auto; padding: 30px; background-color: rgba(243, 161, 0, .25); border-radius: 10px; } .sel-case-study .cta-banner .case-study-btn { width: 100%; text-align: center; } .case-study-btn:hover { cursor: pointer; } .case-study-btn i.li { position: relative; top: 2px; margin-left: 5px; } .case-study-btn i.fa { margin-right: 5px; } .download-pdf { display: inline-block; margin: 0; width: auto; } .case-study-label p { margin: 0; padding: 0; color: #fff; font-size: 20px; line-height: 20px; vertical-align: middle; } .case-study-box-out { margin: 0 0 30px; padding: 20px; background-color: #fff; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; -webkit-box-shadow: 0px 0px 20px 0px rgba(79, 35, 35, 0.1); box-shadow: 0px 0px 20px 0px rgba(79, 35, 35, 0.1); } .case-study-box-out p { margin: 0; } .case-study .logo-box { margin: 30px 0; } .case-study .logo-box img, .case-study .logo-box p { display: inline-block; margin: 0; vertical-align: middle; } .case-study .logo-box img { margin: 0 10px 0 0; } .case-study blockquote { margin: 30px 0; font-size: 30px; line-height: 40px; color: #37bc9b; } .case-study .video-post { width: 50%; float: right; margin: 10px 20px 20px; } .case-study .video-post .video-bg { height: 315px; } @media (max-width: 768px) { .case-study h1 { margin: 20px 0 30px; } .case-study-flex { flex-flow: column-reverse; } .case-study-label { margin-right: 0; } .case-study-btn { margin-left: 0; margin-bottom: 30px; } .sel-case-study .cta-banner .case-study-btn { margin-bottom: 0; } .sel-case-study .bottom-cta { flex-flow: column; } .case-study .video-post { width: 100%; float: none; margin: 0 0 20px; } } /* ------------------- COLORS --------------------*/ .light-pink { color: #d770ad; } .mint { color: #37bc9b; } /* ------------------- HERO --------------------*/ .banner.banner-six { height: auto; position: relative; padding-top: 150px; overflow: hidden; } .banner.banner-six .banner-content-wrapper-six { position: relative; top: -30px; max-width: 80%; z-index: 2; } .hero-custom-banner.banner.banner-six .banner-content-wrapper-six { max-width: 100%; top: 0; } .banner.essentials .banner-content-wrapper-six { top: -10px; } .banner.banner-six .banner-content-wrapper-six .subtitle { font-size: 18px; line-height: 30px; } .banner.banner-six .banner-content-wrapper-six .banner-title { font-size: 70px; line-height: 74px; font-weight: 600; margin-bottom: 30px; } .banner.banner-six .banner-content-wrapper-six .title-small { font-size: 48px; line-height: 62px; } .banner.banner-six .banner-content-wrapper-six p { margin-bottom: 40px; } .banner.banner-six .banner-content-wrapper-six .cta { font-size: 24px; } .banner.banner-six .banner-btn, .banner.page-banner .banner-btn, .cta-wrapper .cta-btn, .banner.hero-custom-banner .banner-btn { padding: 10px 40px; background-color: #8cc152!important; border-radius: 30px; border: 1px solid transparent!important; font-size: 18px; font-weight: bold; display: inline-block; } .banner.banner-six .banner-btn:hover, .banner.page-banner .banner-btn:hover, .cta-wrapper .cta-btn:hover, .banner.hero-custom-banner .banner-btn:hover { background-color: #f3a100!important; color: #fff!important; border: 1px solid transparent!important; } .banner.banner-six:after { content: ""; position: absolute; z-index: -1; width: 43%; height: 100%; right: 0; top: 0; background: #fef5e5; } img#carousel-hero-img-1 { box-shadow:none; } .banner.hero-custom-banner:after { content: ""; position: absolute; z-index: -2; width: 43%; height: 100%; right: 0; top: 0; border-radius: 0 0 0 12%; } .banner.hero-custom-banner.skills-bg:after { background: #fef5e5; } .banner.hero-custom-banner.mint-product-bg:after { background: #ebf8f5; } .banner.hero-custom-banner.soft-blue-product-bg:after { background: #e8f5fe; } .banner.banner-six.full-banner:after { content: ""; position: absolute; z-index: -1; width: 0; height: 0; right: 0; top: 0; background: none; } .banner.your-state:after { background-color: rgba(93,156,236,.1); } .cc.banner-six:after { background: #ebf8f5; } .yv.banner-six:after { background: #f4f1fb; } .banner.banner-six .banner-six-promo-image { position: relative; z-index: 2; } .banner.banner-six .banner-six-promo-image > img { border-radius: 10px; -webkit-box-shadow: 0px 30px 40px 0px rgba(1, 50, 5, 0.14); box-shadow: 0px 30px 40px 0px rgba(1, 50, 5, 0.14); } .revolutionize .banner-six-promo-image > img { border-radius: 10px; -webkit-box-shadow: 0px 30px 40px 0px rgba(1, 50, 5, 0.14); box-shadow: 0px 30px 40px 0px rgba(1, 50, 5, 0.14); } .revolutionize .banner-content-wrapper-six { padding-right: 40px; } @media (max-width: 1200px) { .revolutionize .banner-six-promo-image > img { width: 100%; } .revolutionize .banner-content-wrapper-six { padding: 0; } } @media (max-width: 991px) { .revolutionize .banner-six-promo-image > img { width: 100%; margin-top: 30px; } .revolutionize .banner-content-wrapper-six { text-align: center!important; } } .banner.banner-six .banner-six-promo-image .dot-shape { display: block; position: absolute; bottom: -40px; left: -40px; z-index: -1; -webkit-animation: wave 8s infinite linear; animation: wave 8s infinite linear; } .banner-six .app-collction { position: absolute; bottom: -200px; width: 400px; z-index: 1; } .banner.banner-six .avatar-wrapper .call-us { font-size: 18px; } .banner.banner-six .bottom-shape { margin: 0; padding: 0; list-style: none; position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; } .banner.banner-six .bottom-shape li { position: absolute; bottom: 0; } .banner.banner-six .bottom-shape li:nth-child(1) { left: -50px; } .banner.banner-six .particles-six span { display: block; position: absolute; } .banner.banner-six .particles-six span.angle { top: 140px; left: 90px; -webkit-animation: animationFramesOne 20s infinite linear; animation: animationFramesOne 20s infinite linear; } .banner.banner-six .particles-six span.dotsm { height: 15px; width: 15px; background: #43d355; left: 50%; top: 15%; border-radius: 50%; -webkit-animation: animationFramesTwo 25s infinite linear; animation: animationFramesTwo 25s infinite linear; } .banner.banner-six .particles-six span.dotmd { height: 15px; width: 15px; background: #f8cc61; border-radius: 50%; top: 50%; left: 15%; -webkit-animation: animationFramesRight 20s infinite linear; animation: animationFramesRight 20s infinite linear; } .avatar-holder { margin-left: 20px; } .avatar-holder .join-avatar { position: relative; width: 50px; height: 50px; border-radius: 50px; border: 3px solid #fff; margin-left: -20px; } @media (max-width: 1200px) { .banner.banner-six .banner-content-wrapper-six .title-small { font-size: 44px; line-height: 56px; } .banner.banner-six .banner-content-wrapper-six { max-width: 90%; } } @media (max-width: 991px) { .banner.banner-six { padding-top: 110px; } .banner.banner-six .banner-content-wrapper-six { top: 0px; } .banner.banner-six .banner-content-wrapper-six .banner-title { font-size: 44px; line-height: 58px; } .banner.banner-six .emoji, .banner-six .app-collction { display: none; } .banner.banner-six .avatar-wrapper { display: none; } .banner.banner-six .banner-content-wrapper-six .title-small { font-size: 34px; line-height: 48px; } } @media (max-width: 768px) { .banner.banner-six { height: auto; } .banner.banner-six .banner-content-wrapper-six { max-width: 100%; padding: 0 30px; text-align: center; } .banner.banner-six .bottom-shape, .banner.banner-six .banner-six-promo-image img { display: none; } } /* ------------------- SECTION 2 --------------------*/ .featured-eight { padding: 117px 0 0px; } .featured-eight .top-bg, .essentials-team .top-bg { position: absolute; top: 0; left: 0; z-index: 0; width: 100%; } .essentials-team { overflow: hidden; padding-bottom: 100px!important; } .featured-eight .top-bg img, .essentials-team .top-bg img { min-width: 140%; } .essentials-team .team-member .member-avater { position: relative; overflow: hidden; border-radius: 0; -webkit-border-top-left-radius: 10px; -webkit-border-top-right-radius: 10px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; border-top-left-radius: 10px; border-top-right-radius: 10px; } .essentials-team .team-member .team-info { position: relative; padding: 25px 0; background: rgba(255, 255, 255, .95); -webkit-border-bottom-right-radius: 10px; -webkit-border-bottom-left-radius: 10px; -moz-border-radius-bottomright: 10px; -moz-border-radius-bottomleft: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius: 10px; text-align: center; -webkit-box-shadow: 0px 30px 50px 0px rgba(64, 24, 47, 0.08); box-shadow: 0px 30px 50px 0px rgba(64, 24, 47, 0.08); z-index: 1; } .featured-eight .partical-top { width: 100%; height: 500px; margin: 0; padding: 0; list-style: none; position: absolute; top: 0; left: 0; } .featured-eight .partical-top li { position: absolute; } .featured-eight .partical-top li:nth-child(1) { width: 31px; height: 31px; border-radius: 50%; left: 8%; top: 40%; background-color: rgba(255, 255, 255, 0.14); -webkit-animation: animationFramesOne 20s infinite linear; animation: animationFramesOne 20s infinite linear; } .featured-eight .partical-top li:nth-child(2) { left: 16%; top: 54%; width: 0; height: 0; border-left: 20px solid transparent; border-right: 20px solid transparent; border-bottom: 35px solid rgba(255, 255, 255, 0.14); -webkit-animation: animationFramesLeft 20s infinite linear; animation: animationFramesLeft 20s infinite linear; } .featured-eight .partical-top li:nth-child(3) { left: 11%; bottom: 28px; width: 0; height: 0; border-top: 15px solid transparent; border-bottom: 15px solid transparent; border-right: 20px solid rgba(255, 255, 255, 0.14); -webkit-animation: animationFramesTwo 20s infinite linear; animation: animationFramesTwo 20s infinite linear; } .featured-eight .partical-top li:nth-child(4) { width: 13px; height: 13px; border-radius: 50%; right: 12%; top: 44%; background-color: rgba(255, 255, 255, 0.14); -webkit-animation: animationFramesFive 20s infinite linear; animation: animationFramesFive 20s infinite linear; } .featured-eight .partical-top li:nth-child(5) { right: 0; top: 33%; width: 0; height: 0; border-left: 30px solid transparent; border-right: 30px solid transparent; border-bottom: 50px solid rgba(255, 255, 255, 0.14); -webkit-animation: animationFramesLeft 20s infinite linear; animation: animationFramesLeft 20s infinite linear; } .featured-eight .partical-top li:nth-child(6) { right: 80px; top: 140px; width: 0; height: 0; border-top: 15px solid transparent; border-bottom: 15px solid transparent; border-right: 20px solid rgba(255, 255, 255, 0.14); -webkit-animation: animationFramesOne 20s infinite linear; animation: animationFramesOne 20s infinite linear; } @media (max-width: 991px) { .featured-eight { padding: 72px 0 50px; } .essentials-team .top-bg { background: #37bc9b; min-height: 550px; } } @media (max-width: 768px) { .featured-eight .top-bg { background: #37bc9b; min-height: 350px; } .essentials-team .top-bg { background: #37bc9b; min-height: 700px; } } .icon-box-wrapper.style-eight { border-radius: 6px; background: #fff; -webkit-box-shadow: 0px 30px 50px 0px rgba(64, 24, 47, 0.08); box-shadow: 0px 30px 50px 0px rgba(64, 24, 47, 0.08); text-align: center; padding: 40px 35px; } .icon-box-wrapper.style-eight .li { font-size: 50px; color: #0e79c9; } .icon-box-wrapper.style-eight .icon-box-content .icon-box-title { margin: 15px 0; } .icon-box-wrapper.style-eight .icon-box-content .icon-box-title a:hover { color: #f97bc5; } .icon-box-wrapper.style-eight .icon-box-content p { margin-bottom: 30px; } /* ------------------- VIDEO SECTION --------------------*/ .parents-guide { padding: 150px 0 120px; position: relative; } .about-video-wrapper .video-thumbnail { position: relative; } .about-video-wrapper .video-thumbnail > img { border-radius: 10px; } .about-video-wrapper .video-thumbnail .dot-shape { position: absolute; display: block; top: -50px; left: -60px; z-index: -1; } .parents-guide-content { padding-left: 50px; } .parents-guide-content .section-title { margin-bottom: 10px; } .parents-guide-content p { margin-bottom: 30px; } .parents-guide-content .list-items { margin-bottom: 37px; } .parents-guide-content .list-items li { padding-left: 25px; } .parents-guide-content .list-items li:before { color: #f97bc5; } .faqs .list-items li ul li { padding-left: 0; } .faqs .list-items li ul li:before { display: none; } .popup-videos { position: relative; max-width: 470px; } .popup-videos .play-btn { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-box-shadow: none; box-shadow: none; } .popup-videos .video-btn { height: 80px; width: 80px; background: #fff; border-radius: 50%; line-height: 80px; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center; z-index: 2; } .popup-videos .video-btn:before, .popup-videos .video-btn:after { content: ''; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); border: 1px solid #fff; border-radius: 50%; -webkit-animation: pulse 2s linear infinite; animation: pulse 2s linear infinite; } .popup-videos .video-btn i { color: #2b2350; font-size: 16px; font-size: 40px; line-height: 2.05; } @media (max-width: 768px) { .parents-guide { padding-top: 0; } #satchel-essentials { padding-top: 70px; } } /* ------------------- APPS --------------------*/ .element-bg { background: #fcfafb; position: relative; padding-bottom: 65px; } .element-bg:after { content: ""; position: absolute; bottom: 0; left: 0; width: 0; height: 0; border-top: 115px solid transparent; border-left: 1900px solid #fff; border-bottom: 150px solid #fff; } .element-bg .partical-element { margin: 0; padding: 0; list-style: none; overflow: hidden; position: absolute; width: 100%; height: 100%; top: 0; left: 0; } .element-bg .partical-element li { position: absolute; } .element-bg .partical-element li:nth-child(1) { top: -5%; left: 70px; -webkit-animation: jumping 5s infinite linear; animation: jumping 5s infinite linear; } .element-bg .partical-element li:nth-child(2) { right: 5%; top: -22%; background: rgba(83, 81, 186, 0.04); height: 360px; width: 360px; border-radius: 50%; -webkit-animation: wave 6s infinite linear; animation: wave 6s infinite linear; } .element-bg .iapp-icon-box-icon { margin-bottom: 30px!important; } .element-bg .icon-box-title { margin-bottom: 20px!important; } .featured-apps .feature i { font-size: 80px!important; background: -moz-linear-gradient(150deg,#2655d6 15%,#32adfb 70%,#32adfb 94%); background: -webkit-linear-gradient( 150deg ,#2655d6 15%,#32adfb 70%,#32adfb 94%); background: linear-gradient( 150deg ,#2655d6 15%,#32adfb 70%,#32adfb 94%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2655d6', endColorstr='#268cd3',GradientType=1 ); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } /* ------------------- SATCHEL ONE PLUS --------------------*/ /** Image Content Three **/ #satchel-one-plus { padding: 120px 0 80px; } #satchel-one-plus .app-btn-wrapper img { height: 50px; margin: 10px 10px 0 0; } .qr-code-container { position: relative; } .qr-code-container .scan { position: absolute; top: 40px; left: 120px; color: rgba(236, 135, 192, 1); font-weight: 700; } @media (max-width: 991px) { #satchel-one-plus { padding: 80px 0 40px; } .pix-order-two { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; } .pix-order-one { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } } @media (max-width: 767px) { .pix-order-two-md { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; } } .animated-elements-four { position: relative; height: 705px; margin-right: -100px; } @media (max-width: 991px) { .animated-elements-four { margin-right: 0; } } @media (max-width: 480px) { .animated-elements-four { height: 560px; } } .animated-elements-four .image-one, .animated-elements-four .image-two, .animated-elements-four .image-three, .animated-elements-four .image-four, .animated-elements-four .element-bg-shape { position: absolute; } .animated-elements-four .element-bg-shape { right: -25px; top: 155px; } .animated-elements-four .image-one { left: 130px; top: 60px; z-index: 2; } @media (max-width: 991px) { .animated-elements-four .image-one { left: 60px; } } @media (max-width: 480px) { .animated-elements-four .image-one { left: 15px; max-width: 300px; } } .animated-elements-four .image-two { top: 0; left: 300px; } @media (max-width: 991px) { .animated-elements-four .image-two { left: 145px; } } @media (max-width: 480px) { .animated-elements-four .image-two { left: 90px; } } .animated-elements-four .image-three { z-index: 3; top: 60%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .animated-elements-four .image-four { bottom: 82px; right: 95px; z-index: -1; } .animated-elements-four .image-four img { -webkit-animation: wave 6s infinite linear; animation: wave 6s infinite linear; } @media (max-width: 991px) { .animated-elements-four .image-four { bottom: 150px; right: 30px; } } .essentials-side-img .image-one { left: 100px; top: 50px; z-index: 2; } .essentials-side-img .image-one img { position: relative; left: 50px; width: 480px; border-radius: 10px; -webkit-box-shadow: 0px 30px 40px 0px rgba(1, 50, 5, 0.14); box-shadow: 0px 30px 40px 0px rgba(1, 50, 5, 0.14); } .essentials-side-img .image-four { bottom: 0; } #enhanced-support .interface-content .list-items li, #unlimited-training .interface-content .list-items li { font-size: 16px; line-height: 28px; margin-bottom: 20px; } .image-content-three { position: relative; z-index: 1; } @media (max-width: 991px) { #enhanced-support .title, #unlimited-training .title { margin-top: 50px; } } @media (max-width: 768px) { .essentials-side-img .image-one { left: auto; top: auto; } .essentials-side-img .image-one img { left: auto; } } .comparison { display: flex; flex-wrap: wrap; margin: 0 auto; padding: 2rem 0rem 0rem 0rem; max-width: 1100px; } .comparison-cell { position: relative; box-sizing: border-box; flex-grow: 1; width: 100%; padding: 0.8em 1.2em; overflow: hidden; list-style-type: none; border: 1px solid #ddd; text-align: center; font-weight: 300; margin-top: -1px; margin-left: -1px; } .comparison-cell:first-child { border: 1px solid #fff; background: transparent; } .comparison-cell:nth-child(3) { border: 1px solid #37bc9b; } .comparison-cell:nth-child(-n + 3) { padding: 20px 10px 13px; } .comparison-cell > h3 { font-size: 18px; margin-top: 0; } .comparison-cell.cell-feature { text-align: left; } .comparison-cell.plattform { -webkit-border-top-left-radius: 10px; -webkit-border-top-right-radius: 10px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; border-top-left-radius: 10px; border-top-right-radius: 10px; } .comparison-cell.enterprise { -webkit-border-top-left-radius: 10px; -webkit-border-top-right-radius: 10px; -moz-border-radius-topleft: 10px; -moz-border-radius-topright: 10px; border-top-left-radius: 10px; border-top-right-radius: 10px; background-color: rgba(55, 188, 155, 1); z-index: 1; } .comparison-cell.enterprise h3 { color: #fff; } /* Table columns ================================== */ .comparison-cell { width: calc(33.33% - 1px); } svg.enterprise-check path { fill: #30305b !important; } /*-------------------------------------------------------------- ## Call Back --------------------------------------------------------------*/ .callback { position: relative; padding: 100px 0 65px; } .callback:after { content: ""; position: absolute; bottom: 0; left: 0; width: 0; height: 0; border-top: 115px solid transparent; border-left: 1900px solid #fff; border-bottom: 150px solid #fff; } .callback-form:after { border: none; } .callback .particale-element { margin: 0; padding: 0; list-style: none; overflow: visible; position: absolute; width: 100%; height: 100%; top: 0; left: 0; } .callback .particale-element li { position: absolute; } .callback .particale-element li:nth-child(1) { top: -20%; left: 40px; -webkit-animation: jumping 5s infinite linear; animation: jumping 5s infinite linear; } .callback .particale-element li:nth-child(2) { top: 12%; left: 30%; background: #f7cb61; height: 15px; width: 15px; border-radius: 30px; -webkit-animation: animationFramesLeft 20s infinite linear; animation: animationFramesLeft 20s infinite linear; display: none; } .callback .particale-element li:nth-child(3) { left: 8%; top: 35%; width: 0; height: 0; border-top: 15px solid transparent; border-bottom: 15px solid transparent; border-right: 20px solid #b29ff7; -webkit-animation: animationFramesTwo 20s infinite linear; animation: animationFramesTwo 20s infinite linear; display: none; } .callback .particale-element li:nth-child(4) { bottom: 38%; left: 13%; background: #43d254; height: 15px; width: 15px; border-radius: 30px; -webkit-animation: animationFramesRight 20s infinite linear; animation: animationFramesRight 20s infinite linear; display: none; } .callback .particale-element li:nth-child(5) { bottom: 0%; left: 11%; background: #d7f2eb; height: 300px; width: 300px; border-radius: 50%; -webkit-animation: wave 3s infinite linear; animation: wave 3s infinite linear; } .callback .particale-element li:nth-child(6) { bottom: 9%; left: 41%; z-index: 1; -webkit-animation: wave 6s infinite linear; animation: wave 6s infinite linear; } .callback .particale-element li:nth-child(7) { right: 15%; top: -5%; background: #d7f2eb; height: 400px; width: 400px; border-radius: 50%; -webkit-animation: wave 8s infinite linear; animation: wave 8s infinite linear; } .callback .particale-element li:nth-child(8) { right: 9%; top: -12%; background: rgba(83, 81, 186, 0.04); height: 360px; width: 360px; border-radius: 50%; -webkit-animation: wave 6s infinite linear; animation: wave 6s infinite linear; } .call-back-content { padding: 20px 0; } .call-back-content p { margin-bottom: 40px; } .call-back-forms { border-radius: 10px; background: #fff; -webkit-box-shadow: 8.682px 49.24px 80px 0px rgba(48, 11, 33, 0.1); box-shadow: 8.682px 49.24px 80px 0px rgba(48, 11, 33, 0.1); padding: 60px 50px 30px; max-width: 570px; border-top: 5px solid #37bc9b; -webkit-transform: translateY(-60px); -ms-transform: translateY(-60px); transform: translateY(-60px); z-index: 2; position: relative; } .call-back-forms .title { font-size: 30px; font-weight: 500; margin-bottom: 35px; } .call-back-forms select { padding: 0 20px; outline: 0; } .call-back-forms label { font-weight: 500; } .call-back-forms input, .call-back-forms select { background: #ebf8f5; border: 2px solid #ebf8f5; height: 56px; width: 100%; border-radius: 30px; margin-bottom: 20px; } .call-back-forms input:focus, .call-back-forms select:focus { background: transparent; border-color: #37bc9b; -webkit-box-shadow: none; box-shadow: none; } .call-back-forms button { margin-top: 20px; } @media (max-width: 768px) { .call-back-content { padding: 100px 0; } .callback .particale-element li:nth-child(6) { bottom: 70px; left: 25%; } } .callback .pix-btn.submit-btn, .callback .actions .hs-button { background-color: #37bc9b!important; border: 0; padding: 11px 35px; -webkit-box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.08); box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.08); font-size: 22px!important; } .callback .number-list { margin: 0 0 0 10px; padding: 0 0 0 10px; } .callback .number-list li { margin-bottom: 8px; font-size: 16px; font-weight: 500; color: #2b2350; padding-left: 10px; position: relative; } /* ------------------- SATCHEL CLASSES --------------------*/ .classes-viewer a { cursor: pointer; } .classes-viewer img { border-radius: 8px; cursor: pointer; } .classes-viewer .title { margin-top: 10px; font-size: 18px; font-weight: 600; color: #333; } .classes-viewer .title a { color: #333; cursor: pointer; } .classes-viewer .title a:hover { color: #0e79c9; } .classes-viewer p { margin-bottom: 0px; } .classes-viewer .label { position: relative; top: 0px; margin-right: 2px; color: white; font-size: 13px; font-weight: 500; padding: 2px 10px; border-radius: 12px; white-space: nowrap; text-transform: uppercase; background-color: #8cc152; vertical-align: text-bottom; } .classes-viewer .class-details .label { top: 3px; } .classes-viewer .category-description { margin: 50px auto 30px; border-top: 1px solid #eee; padding-top: 50px; } .classes-viewer .category-description .category-title { margin-bottom: 20px; font-size: 22px; font-weight: 600; color: #333; } /* ------------------- ARTICLE --------------------*/ .block-color { background-color: #ec87c0; } .block-color .section-title.style-two .tagline { font-size: 26px; } .block-color .outline-hero-btn { position: relative; border-color: #fff; background-color: #fff!important; color: #ec87c0!important; } .block-color .outline-hero-btn:hover { background-color: transparent!important; } /* ------------------- COMMUNITIES --------------------*/ .community { overflow: hidden; } .community img { position: absolute; z-index: -1; opacity: .5; } .community .icon-box-wrapper { margin: 0 10px 40px; background-color: rgba(255,255,255,.85)!important; overflow: visible!important; } .community .fa, .community .fab { margin-bottom: 20px; font-size: 80px; } .community .fa { color: #ec87c0; } .community .fab { color: #1877f2; } /* ------------------- TESTIMONIALS --------------------*/ #testimonial-wrapper .welcome-slider .swiper-button-prev, #testimonial-wrapper .welcome-slider .swiper-button-next { display: none!important; } @media (max-width: 991px) { #testimonial-wrapper .welcome-slider .swiper-button-prev, #testimonial-wrapper .welcome-slider .swiper-button-next { display: block!important; background: rgba(255, 255, 255, .25); border-radius: 50%; height: 50px; width: 50px; -webkit-box-shadow: 0px 30px 40px 0px rgba(0, 0, 0, 0.15); box-shadow: 0px 30px 40px 0px rgba(0, 0, 0, 0.15); } #testimonial-wrapper .welcome-slider .swiper-button-prev { left: -5px!important; } #testimonial-wrapper .welcome-slider .swiper-button-next { right: -5px!important; } } /* ------------------- MOBILE APPS --------------------*/ .download-two { padding-bottom: 50px; } .download-two .container-wrap { border: 1px solid rgba(236, 135, 192, .5); overflow: hidden; } .download-wrapper-two { padding: 80px 0; } .download-wrapper-two .title { font-size: 54px; line-height: 1.2; font-weight: 700; color: #333; } .download-wrapper-two .title span { color: rgba(236, 135, 192, 1); } @media (max-width: 768px) { .download-wrapper-two .title { font-size: 40px; } } .download-wrapper-two p { margin-bottom: 30px; color: #76747f; } .download-wrapper-two .app-btn-wrapper img { height: 50px; margin: 15px 10px 0 0; } .download-two .qr-code-lg .qr-code { width: 100px; height: 100px; position: absolute; top: 0px; right: 30px; } .download-two .qr-code-lg .scan { position: absolute; top: 60px; right: 150px; color: rgba(236, 135, 192, 1); font-weight: 700; } .qr-code-mobile .scan { position: relative; top: 15px; left: 10px; color: rgba(236, 135, 192, 1); font-weight: 700; } .download-feature-image-two { position: relative; height: 100%; } @media (max-width: 991px) { .download-feature-image-two { display: none; } .download-two .qr-code-lg { display: none; } .qr-code-mobile { display: block; } } .download-feature-image-two img { position: absolute; bottom: -160px; } .download-feature-image-two img.image-one { left: 0; z-index: 2; } .download-feature-image-two img.image-two { left: 215px; bottom: -240px; } .section-animate-element > div { position: absolute; } .section-animate-element .leaf-top { top: -20px; left: 40px; } .section-animate-element .leaf-bottom { right: 15px; bottom: -20px; } .section-animate-element .ball { left: 5%; top: 50%; } .section-animate-element .triangle { right: 8%; top: 90px; } .container-wrap { max-width: 95%; margin: 0 auto; border-radius: 20px; position: relative; } .container-wrap.bg-color-two { background-color: rgba(236, 135, 192, .1); } @media (max-width: 991px) { .download-wrapper-two { padding: 120px 0 60px; } .section-animate-element .ball { display: none; } } @media (max-width: 575px) { .download-wrapper-two { padding: 120px 0; } } /*-------------------------------------------------------------- ## Faq's --------------------------------------------------------------*/ .faq-section { padding-top: 115px; } .faq-section-two { padding-top: 75px; } .faqs { padding: 120px 0; } .card { border: 0; background: transparent; } .card .card-header { background-color: transparent; border: 0; border-radius: 6px; } .card .card-header .btn-link { padding: 0; color: #2b2350; font-size: 20px; font-weight: 600; text-decoration: none; } .card .card-body { padding: 0; } .card .card-body p { font-size: 16px; margin-bottom: 25px; } .faq { position: relative; z-index: 2; } .faq .card { border: 0; background: transparent; margin-bottom: 20px; border: 1px solid #efe7e7; } .faq .card .card-header { padding: 0; } .faq .card .card-header h5 { position: relative; margin: 0; } .faq .card .card-header h5:before { content: "\33"; color: #aaaaaa; display: block; position: absolute; font-size: 25px; top: 50%; right: 40px; z-index: 9; font-family: eleganticons; -webkit-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); font-size: 20px; pointer-events: none; } .faq .card .card-header .btn-link { color: #2b2350; font-size: 20px; font-weight: 500; text-decoration: none; white-space: normal; text-align: left; width: 100%; padding: 18px 40px; background-color: #fff; } .faq .card .card-body { padding: 0 40px 40px; background-color: #fff; } .faq .card .card-body p { font-size: 16px; margin-bottom: 0; } .faq .card.active { -webkit-box-shadow: 0px 60px 100px 0px rgba(79, 35, 35, 0.1); box-shadow: 0px 60px 100px 0px rgba(79, 35, 35, 0.1); } .faq .card.active h5:before { content: "\32"; color: #fa7070; } .faq-forms { padding-top: 120px; } .faq-forms .section-title { margin-bottom: 50px; } .faq-forms { max-width: 830px; margin: 0 auto; } @media (max-width: 991px) { #faqs { padding: 80px 0 50px; } .faq-two { margin-bottom: 30px; } .faq-section-two { padding-top: 65px; } .faq-section { padding-top: 75px; } .faqs { padding: 80px 0; } .faq-forms { padding-top: 78px; } } @media (max-width: 768px) { #faqs { padding: 50px 0 20px; } .faq .card .card-header h5:before { right: 20px; } .faq .card .card-header .btn-link { padding: 18px 20px; } } @media (max-width: 576px) { .faq .card .card-header .btn-link { padding: 18px 30px 18px 20px; font-size: 18px; } .faq .card .card-header h5:before { right: 10px; } .faq .card .card-body { padding: 5px 20px 25px; } } /*-------------------------------------------------------------- ## SEL Benefits --------------------------------------------------------------*/ .sel-benefits { padding: 115px 0 90px; } .sel-benefits .section-title p { font-size: 18px; } .sel-benefits .video-btn { margin-top: 20px; padding: 10px 40px; border-radius: 30px; font-size: 18px; font-weight: normal; display: inline-block; border: 1px solid #0e79c9; color: #0e79c9!important; } .sel-benefits .video-btn:hover { background: #0e79c9; border: 1px solid #0e79c9; color: #fff!important; } .sel-benefits .icon-box-wrapper.style-eleven { -webkit-box-shadow: 0 20px 50px 0 rgba(14, 3, 52, 0.1); box-shadow: 0 20px 50px 0 rgba(14, 3, 52, 0.1); background: #fff; border-radius: 20px; border: none; padding: 40px 35px; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .sel-benefits .icon-box-wrapper.style-eleven .icon-box-icon { margin-bottom: 20px; font-size: 50px; color: #f3a100; border: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .sel-benefits .icon-box-wrapper:hover .icon-box-icon { box-shadow: none; background: transparent; } .sel-benefits .icon-box-wrapper.two-col .icon-box-icon { position: absolute; } .sel-benefits .icon-box-wrapper.two-col .icon-box-content { padding-left: 70px; } .sel-benefits .icon-box-wrapper .icon-box-content .icon-box-title { font-size: 20px; font-weight: 600; line-height: 30px; margin-bottom: 20px; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .sel-benefits .icon-box-wrapper .icon-box-content p { margin-bottom: 0; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .sel-benefits .icon-box-wrapper.style-eleven .icon-box-content .icon-box-title { margin-bottom: 5px; } .sel-benefits .icon-box-wrapper.style-eleven .icon-box-content p { color: #615f6b; } .sel-benefits .icon-box-wrapper.style-eleven:hover { background: #f3a100; } .cc-benefits .icon-box-wrapper.style-eleven:hover { background: #37bc9b; } .sel-benefits .icon-box-wrapper.style-eleven:hover a.cta-btn { background: #fff; } .sel-benefits .icon-box-wrapper.sel-box:hover a, .sel-benefits .icon-box-wrapper.cc-box:hover a, .sel-benefits .icon-box-wrapper.yv-box:hover a, .sel-benefits .icon-box-wrapper.sb-box:hover a { color: #fff!important; text-decoration: underline; } .sel-benefits .icon-box-wrapper.cc-box:hover { background: #37bc9b; } .sel-benefits .icon-box-wrapper.yv-box:hover { background: #967adc; } .sel-benefits .icon-box-wrapper.sb-box:hover { background: #5d9cec; } .sel-benefits .icon-box-wrapper.style-eleven:hover .icon-box-content .icon-box-title { color: #fff; } .sel-benefits .icon-box-wrapper.style-eleven:hover .icon-box-content .icon-box-title:hover { color: #fff; } .sel-benefits .icon-box-wrapper.style-eleven:hover .icon-box-content .icon-box-title a { color: #fff; } .sel-benefits .icon-box-wrapper.style-eleven:hover .icon-box-content .icon-box-title a:hover { color: #fff; } .sel-benefits .icon-box-wrapper.style-eleven:hover .icon-box-content p { color: #fff; } .sel-benefits .icon-box-wrapper.style-eleven:hover .icon-box-icon { color: #fff; } .sel-benefits .icon-box-wrapper.style-eleven svg { position: relative; top: -4px; width: 50px; height: 50px; } .sel-benefits .icon-box-wrapper.style-eleven .letters { fill: #f3a100; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .sel-benefits .icon-box-wrapper.style-eleven:hover .letters { fill: #fff; } /*-------------------------------------------------------------- ## Interface --------------------------------------------------------------*/ .interface { padding: 105px 0 60px; } .interface .interface-left .interface-content { width: 80%; } .interface-image-wrapper { height: 600px; } .interface-image-wrapper .image-one { margin-left: -60px; margin-top: 178px; } .interface-image-wrapper .image-two { position: absolute; top: 0; left: 160px; } .interface-image-wrapper.style-two .image-one { position: absolute; bottom: 0; left: -20px; margin: 0; z-index: 22; } .interface-image-wrapper.style-two .image-one { position: absolute; bottom: 0; left: -20px; margin: 0; z-index: 22; } .interface-image-wrapper .top-two { position: absolute; top: -100px; left: 0px; } .interface-image-wrapper .bottom-two { margin-left: -60px; margin-top: 100px; } .interface-image-wrapper .top-three { position: absolute; top: 50px; left: 150px; } .interface-image-wrapper .bottom-three { margin-left: -60px; margin-top: 200px; } .interface-image-wrapper .top-four { position: absolute; top: 0px; left: 0px; } .interface-image-wrapper .bottom-four { margin-left: -60px; margin-top: 100px; } .interface-image-wrapper .top-five { position: absolute; top: 80px; left: 100px; } .interface-image-wrapper .bottom-five { margin-left: -60px; margin-top: 200px; } .interface-content .interface-title h2 { font-size: 40px; line-height: 54px; margin-bottom: 20px; } .interface-content .interface-title p { margin-bottom: 30px; font-size: 18px; line-height: 34px; } .interface-content .list-items { margin-bottom: 30px; } .interface-content .list-items li { line-height: 40px; font-size: 18px; } .interface-content .list-items li:before { content: "R"; color: #13bf24; } .svgbg-one { position: absolute; top: 55px; left: 50px; z-index: -1; -webkit-animation: wave 3s 0.1s infinite linear; animation: wave 3s 0.1s infinite linear; } .svgbg-two { position: absolute; top: -70px; left: -37%; z-index: -1; -webkit-animation: wave 3s 0.1s infinite linear; animation: wave 3s 0.1s infinite linear; } .interface-toparea { padding-bottom: 200px; } .border-wrap { position: absolute; left: 50%; top: 50%; max-width: 775px; -webkit-transform: translate(-17%, -54%); -ms-transform: translate(-17%, -54%); transform: translate(-17%, -54%); width: 100%; z-index: -1; } .border-wrap-reversed { position: absolute; right: 25%; top: 76%; max-width: 775px; -webkit-transform: translate(-17%, -54%); -ms-transform: translate(-17%, -54%); transform: translate(-17%, -54%); width: 100%; z-index: -1; -moz-transform: scaleX(-1); -o-transform: scaleX(-1); -webkit-transform: scaleX(-1); transform: scaleX(-1); filter: FlipH; -ms-filter: "FlipH"; } .border-wrap .ball, .border-wrap-reversed .ball { position: absolute; height: 60px; width: 60px; border-radius: 50%; background: #ffce54; top: 48%; left: 45%; z-index: 22; } #animate-border { max-width: 775px; z-index: -1; opacity: 0.5; } .path { stroke-dasharray: 6; -webkit-animation: dash 30s linear infinite; animation: dash 30s linear infinite; } @-webkit-keyframes dash { /* to { stroke-dashoffset: 1000; } */ 0% { stroke-dashoffset: 1000; } } @keyframes dash { /* to { stroke-dashoffset: 1000; } */ 0% { stroke-dashoffset: 1000; } } @media (min-width: 1201px) and (max-width: 1600px) { .border-wrap-reversed { position: absolute; right: 20%; top: 76%; } } @media (min-width: 992px) and (max-width: 1200px) { .interface-image-wrapper .image-two { max-width: 300px; left: 150px; } #animate-border { max-width: 650px; } .md-brn br { display: none; } .interface { padding: 88px 0 37px; } .col-list .icon-box-wrapper { padding: 34px 34px 30px; } } @media (max-width: 992px) { .interface { padding: 62px 0 80px; } .interface-toparea { padding-bottom: 100px; } .border-wrap, .border-wrap-reversed { display: none; } .interface-image-wrapper { height: 600px; } .interface-image-wrapper .image-one { margin-left: -30px; max-width: 500px; } .interface-image-wrapper .image-two { top: 50px; left: 250px; max-width: 350px; } .how-we-help .about-video-wrapper { margin: 0 0 60px 60px; } } @media (max-width: 576px) { .interface-image-wrapper .image-two { max-width: 300px; left: 180px; } .interface-content .interface-title p br { display: none; } .interface-image-wrapper.style-two .image-two { margin-left: 100px; } } @media (max-width: 420px) { .interface-image-wrapper .image-one { z-index: 22; position: relative; } .interface-image-wrapper .image-two { max-width: 300px; left: 70px; } .interface-image-wrapper.style-two .image-one { max-width: 300px; left: 0; } .interface-image-wrapper.style-two .image-two { margin-left: 30px; } } /* ------------------- Pricing --------------------*/ .pricing-table .plan-price { margin-top: 20px!important; font-size: 22px; font-weight: 600; } /* ------------------- Webinar Top Banner --------------------*/ .sel-page { padding-top: 0px; } .sel-page .site-header { top: 0px; } .sel-page .pix-header-fixed { top: 0px; } .sel-page .webinar-top-banner { display: none; } @media (max-width: 768px) { .sel-page { padding-top: 00px; } .sel-page .site-header, .sel-page .pix-header-fixed { top: 0px!important; } } /* ------------------- ANIMATIONS --------------------*/ @-webkit-keyframes animationFramesOne { 0% { -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); } 20% { -webkit-transform: translate(73px, -1px) rotate(36deg); transform: translate(73px, -1px) rotate(36deg); } 40% { -webkit-transform: translate(141px, 72px) rotate(72deg); transform: translate(141px, 72px) rotate(72deg); } 60% { -webkit-transform: translate(83px, 122px) rotate(108deg); transform: translate(83px, 122px) rotate(108deg); } 80% { -webkit-transform: translate(-40px, 72px) rotate(144deg); transform: translate(-40px, 72px) rotate(144deg); } 100% { -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); } } @keyframes animationFramesOne { 0% { -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); } 20% { -webkit-transform: translate(73px, -1px) rotate(36deg); transform: translate(73px, -1px) rotate(36deg); } 40% { -webkit-transform: translate(141px, 72px) rotate(72deg); transform: translate(141px, 72px) rotate(72deg); } 60% { -webkit-transform: translate(83px, 122px) rotate(108deg); transform: translate(83px, 122px) rotate(108deg); } 80% { -webkit-transform: translate(-40px, 72px) rotate(144deg); transform: translate(-40px, 72px) rotate(144deg); } 100% { -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); } } @-webkit-keyframes animationFramesTwo { 0% { -webkit-transform: translate(0px, 0px) rotate(0deg) scale(1); transform: translate(0px, 0px) rotate(0deg) scale(1); } 20% { -webkit-transform: translate(73px, -1px) rotate(36deg) scale(0.9); transform: translate(73px, -1px) rotate(36deg) scale(0.9); } 40% { -webkit-transform: translate(141px, 72px) rotate(72deg) scale(1); transform: translate(141px, 72px) rotate(72deg) scale(1); } 60% { -webkit-transform: translate(83px, 122px) rotate(108deg) scale(1.2); transform: translate(83px, 122px) rotate(108deg) scale(1.2); } 80% { -webkit-transform: translate(-40px, 72px) rotate(144deg) scale(1.1); transform: translate(-40px, 72px) rotate(144deg) scale(1.1); } 100% { -webkit-transform: translate(0px, 0px) rotate(0deg) scale(1); transform: translate(0px, 0px) rotate(0deg) scale(1); } } @keyframes animationFramesTwo { 0% { -webkit-transform: translate(0px, 0px) rotate(0deg) scale(1); transform: translate(0px, 0px) rotate(0deg) scale(1); } 20% { -webkit-transform: translate(73px, -1px) rotate(36deg) scale(0.9); transform: translate(73px, -1px) rotate(36deg) scale(0.9); } 40% { -webkit-transform: translate(141px, 72px) rotate(72deg) scale(1); transform: translate(141px, 72px) rotate(72deg) scale(1); } 60% { -webkit-transform: translate(83px, 122px) rotate(108deg) scale(1.2); transform: translate(83px, 122px) rotate(108deg) scale(1.2); } 80% { -webkit-transform: translate(-40px, 72px) rotate(144deg) scale(1.1); transform: translate(-40px, 72px) rotate(144deg) scale(1.1); } 100% { -webkit-transform: translate(0px, 0px) rotate(0deg) scale(1); transform: translate(0px, 0px) rotate(0deg) scale(1); } } @-webkit-keyframes animationFramesRight { 0% { -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); } 20% { -webkit-transform: translate(73px, 1px) rotate(36deg); transform: translate(73px, 1px) rotate(36deg); } 40% { -webkit-transform: translate(141px, 72px) rotate(72deg); transform: translate(141px, 72px) rotate(72deg); } 60% { -webkit-transform: translate(83px, 122px) rotate(108deg); transform: translate(83px, 122px) rotate(108deg); } 80% { -webkit-transform: translate(-40px, 72px) rotate(144deg); transform: translate(-40px, 72px) rotate(144deg); } 100% { -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); } } @keyframes animationFramesRight { 0% { -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); } 20% { -webkit-transform: translate(73px, 1px) rotate(36deg); transform: translate(73px, 1px) rotate(36deg); } 40% { -webkit-transform: translate(141px, 72px) rotate(72deg); transform: translate(141px, 72px) rotate(72deg); } 60% { -webkit-transform: translate(83px, 122px) rotate(108deg); transform: translate(83px, 122px) rotate(108deg); } 80% { -webkit-transform: translate(-40px, 72px) rotate(144deg); transform: translate(-40px, 72px) rotate(144deg); } 100% { -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); } } @-webkit-keyframes animationFramesLeft { 0% { -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); } 20% { -webkit-transform: translate(-73px, 1px) rotate(-36deg); transform: translate(-73px, 1px) rotate(-36deg); } 40% { -webkit-transform: translate(-141px, -72px) rotate(-72deg); transform: translate(-141px, -72px) rotate(-72deg); } 60% { -webkit-transform: translate(-83px, -122px) rotate(-108deg); transform: translate(-83px, -122px) rotate(-108deg); } 80% { -webkit-transform: translate(40px, -72px) rotate(-144deg); transform: translate(40px, -72px) rotate(-144deg); } 100% { -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); } } @keyframes animationFramesLeft { 0% { -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); } 20% { -webkit-transform: translate(-73px, 1px) rotate(-36deg); transform: translate(-73px, 1px) rotate(-36deg); } 40% { -webkit-transform: translate(-141px, -72px) rotate(-72deg); transform: translate(-141px, -72px) rotate(-72deg); } 60% { -webkit-transform: translate(-83px, -122px) rotate(-108deg); transform: translate(-83px, -122px) rotate(-108deg); } 80% { -webkit-transform: translate(40px, -72px) rotate(-144deg); transform: translate(40px, -72px) rotate(-144deg); } 100% { -webkit-transform: translate(0px, 0px) rotate(0deg); transform: translate(0px, 0px) rotate(0deg); } } @-webkit-keyframes animationFramesFive { 0% { -webkit-transform: translate(61px, -99px) rotate(0deg); transform: translate(61px, -99px) rotate(0deg); } 21% { -webkit-transform: translate(4px, -190px) rotate(38deg); transform: translate(4px, -190px) rotate(38deg); } 41% { -webkit-transform: translate(-139px, -200px) rotate(74deg); transform: translate(-139px, -200px) rotate(74deg); } 60% { -webkit-transform: translate(-263px, -164px) rotate(108deg); transform: translate(-263px, -164px) rotate(108deg); } 80% { -webkit-transform: translate(-195px, -49px) rotate(144deg); transform: translate(-195px, -49px) rotate(144deg); } 100% { -webkit-transform: translate(-1px, 0px) rotate(180deg); transform: translate(-1px, 0px) rotate(180deg); } } @keyframes animationFramesFive { 0% { -webkit-transform: translate(61px, -99px) rotate(0deg); transform: translate(61px, -99px) rotate(0deg); } 21% { -webkit-transform: translate(4px, -190px) rotate(38deg); transform: translate(4px, -190px) rotate(38deg); } 41% { -webkit-transform: translate(-139px, -200px) rotate(74deg); transform: translate(-139px, -200px) rotate(74deg); } 60% { -webkit-transform: translate(-263px, -164px) rotate(108deg); transform: translate(-263px, -164px) rotate(108deg); } 80% { -webkit-transform: translate(-195px, -49px) rotate(144deg); transform: translate(-195px, -49px) rotate(144deg); } 100% { -webkit-transform: translate(-1px, 0px) rotate(180deg); transform: translate(-1px, 0px) rotate(180deg); } } /*-------------------------------------------------------------- ## Tabs --------------------------------------------------------------*/ .app-tabs .container-wrap { padding: 280px 0 175px; } @media (max-width: 991px) { .app-tabs .container-wrap { padding: 130px 0 175px; } } .tabs-three #pix-tabs-nav { text-align: left; width: 300px; } @media (max-width: 991px) { .tabs-three #pix-tabs-nav { margin-bottom: 60px; } } .tabs-three #pix-tabs-nav li { display: block; margin-right: 0; } .tabs-three #pix-tabs-nav li a { -webkit-box-shadow: 0px 4px 6px 0px rgba(1, 51, 32, 0.06); box-shadow: 0px 4px 6px 0px rgba(1, 51, 32, 0.06); background: #fff; color: #76747f; display: block; margin-bottom: 10px; font-weight: 500; font-size: 16px; } .tabs-three #pix-tabs-nav li a i { margin-right: 5px; vertical-align: -1px; } .tabs-three #pix-tabs-nav li.active a { color: #12bf7c; -webkit-box-shadow: 0px 20px 40px 0px rgba(1, 51, 32, 0.1); box-shadow: 0px 20px 40px 0px rgba(1, 51, 32, 0.1); } .download-tab-content { padding-top: 30px; } .download-tab-content .section-title { margin-bottom: 40px; } .tabs-content-wrapper { position: relative; } .tabs-content-wrapper .job-board-tabs-content { position: relative; z-index: 2; } .tabs-content-wrapper .tab-bg-shape-wrapper { position: absolute; top: 0; right: 0; z-index: 1; width: 100%; } @media (max-width: 768px) { .tabs-content-wrapper .tab-bg-shape-wrapper { display: none; } } .tabs-content-wrapper .tab-bg-shape-wrapper .dot, .tabs-content-wrapper .tab-bg-shape-wrapper svg { position: absolute; } .tabs-content-wrapper .tab-bg-shape-wrapper .dot { top: -35px; height: 160px; width: 180px; left: 160px; } .tabs-content-wrapper .tab-bg-shape-wrapper svg { right: -60px; top: -45px; } .marketing { padding-bottom: 120px; } @media (max-width: 991px) { .marketing { padding-bottom: 80px; } } .marketing-tabs #pix-tabs-nav { text-align: center; margin-bottom: 30px; } .marketing-tabs #pix-tabs-nav li a { background: transparent; -webkit-box-shadow: none; box-shadow: none; border: 2px solid #edecf1; color: #615f6b; border-radius: 6px; } .marketing-tabs #pix-tabs-nav li a i { margin-right: 5px; } .marketing-tabs #pix-tabs-nav li a:hover { color: #0e79c9; } .marketing-tabs #pix-tabs-nav li.active a { background: #0e79c9; border-color: #0e79c9; color: #fff; -webkit-box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.10); box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.10); } .marketing-tabs #pix-tabs-nav li a:hover { -webkit-box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.10); box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.10); } .marketing #pix-tabs-content { overflow: hidden; } .marketing-tabs-wrapper { padding: 60px 70px; background: #f5f7fa; border-radius: 20px; } @media (max-width: 991px) { .marketing-tabs-wrapper { padding: 50px; } } .marketing-tabs-wrapper .marketing-tab-contents { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media (max-width: 991px) { .marketing-tabs-wrapper .marketing-tab-contents { display: block; text-align: center; } } .marketing-tabs-wrapper .marketing-tab-contents img { background: transparent !important; -webkit-box-shadow: none !important; box-shadow: none !important; } .marketing-tabs-wrapper .marketing-tab-contents .tab-image { max-width: 355px; } @media (max-width: 991px) { .marketing-tabs-wrapper .marketing-tab-contents .tab-image { margin: 0 auto 40px; } } .marketing-tabs-wrapper .marketing-tab-contents .marketing-content { position: relative; -webkit-box-flex: 2; -ms-flex: 2; flex: 2; text-align: left; padding-left: 50px; } .marketing-tabs-wrapper .marketing-tab-contents i { font-size: 180px; opacity: 0.25; } @media (max-width: 991px) { .marketing-tabs-wrapper .marketing-tab-contents .marketing-content { padding-left: 0; } } .marketing-tabs-wrapper .marketing-tab-contents .marketing-content .title { font-size: 24px; font-weight: 600; color: #1a133b; margin-bottom: 26px; } .marketing-tabs-wrapper .marketing-tab-contents .marketing-content p { color: #615f6b; } .marketing-tabs-wrapper .marketing-tab-contents .feature-items { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 45px; margin-top: 40px; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .marketing-tabs-wrapper .marketing-tab-contents .feature-items .feature { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media (max-width: 768px) { .marketing-tabs-wrapper .marketing-tab-contents .feature-items .feature { margin-bottom: 20px; } } .marketing-tabs-wrapper .marketing-tab-contents .feature-items .feature .icon { width: 50px; margin-right: 20px; } .marketing-tabs-wrapper .marketing-tab-contents .feature-items .feature .feature-content { -webkit-box-flex: 2; -ms-flex: 2; flex: 2; } .marketing-tabs-wrapper .marketing-tab-contents .feature-items .feature .feature-content h3 { font-size: 16px; line-height: 26px; font-weight: 500; color: #1a133b; } .marketing-tabs-wrapper .marketing-tab-contents .pix-btn { border: 2px solid #0e79c9; color: #0e79c9; border-radius: 6px; } .marketing-tabs-wrapper .marketing-tab-contents .pix-btn:hover { color: #fff; background: #0e79c9; -webkit-box-shadow: none; box-shadow: none; } /* Travel Tabs */ .travel-layout { padding-top: 100px; } #pix-tabs-content.travel-tabs-content { position: relative; z-index: 33; } #pix-tabs-content.travel-tabs-content .content img { background-color: transparent; -webkit-box-shadow: none; box-shadow: none; } .tab-bg-shape-wrapper-two { position: absolute; left: 0; top: -10px !important; } .layout-content .section-title { margin-bottom: 40px; } .layout-content #pix-tabs-nav .layout-box { padding: 19px 25px 19px 30px; border: 2px solid #f2f0f5; border-radius: 10px; margin-bottom: 10px; text-align: left; margin-right: 0; -webkit-transition: all 0.3s all ease-in-out; -o-transition: all 0.3s all ease-in-out; transition: all 0.3s all ease-in-out; } .layout-content #pix-tabs-nav .layout-box a { padding: 0; margin: 0; background: transparent; } .layout-content #pix-tabs-nav .layout-box.active a, .layout-content #pix-tabs-nav .layout-box:hover a { -webkit-box-shadow: none; box-shadow: none; } .layout-content #pix-tabs-nav .layout-box.active { background: #f4f2f7; border-color: #f4f2f7; } .layout-content #pix-tabs-nav .layout-box__title { font-size: 18px; margin: 0; font-weight: 600; } .layout-content #pix-tabs-nav .layout-box__title i { font-size: 20px; color: #68666c; margin-right: 10px; display: inline-block; vertical-align: middle; } .layout-content #pix-tabs-nav .layout-box__description { margin-top: 15px; padding-left: 34px; margin: 10px 0 0; } /* particles for pricing page */ .banner.banner-six .particles-pricing span { display: block; position: absolute; } .banner.banner-six .particles-pricing span.angle { top: 1px; left: 15%; -webkit-animation: animationFramesOne 20s infinite linear; animation: animationFramesOne 20s infinite linear; } .banner.banner-six .particles-pricing span.dotsm { height: 15px; width: 15px; background: #43d355; left: 50%; top: 0.3%; border-radius: 50%; -webkit-animation: animationFramesTwo 25s infinite linear; animation: animationFramesTwo 25s infinite linear; } .banner.banner-six .particles-pricing span.dotmd { height: 15px; width: 15px; background: #f8cc61; border-radius: 50%; top: 50%; left: 400px; -webkit-animation: animationFramesRight 20s infinite linear; animation: animationFramesRight 20s infinite linear; } .no-overflow { overflow: hidden; } /* ------------------- COLORS --------------------*/ .light-pink { color: #d770ad; } .mint { color: #37bc9b; } /* ------------------- SHOOTING STAR --------------------*/ .stars { position: absolute; top: 0; left: 0; width: 100%; height: 120%; transform: rotate(-35deg); } .star { --star-color: var(--primary-color); --star-tail-length: 6em; --star-tail-height: 2px; --star-width: calc(var(--star-tail-length) / 6); --fall-duration: 9s; --tail-fade-duration: var(--fall-duration); position: absolute; top: var(--top-offset); left: 0; width: var(--star-tail-length); height: var(--star-tail-height); color: var(--star-color); background: linear-gradient(45deg, currentColor, transparent); border-radius: 50%; filter: drop-shadow(0 0 6px currentColor); transform: translate3d(104em, 0, 0); animation: fall var(--fall-duration) var(--fall-delay) linear, tail-fade var(--tail-fade-duration) var(--fall-delay) ease-out infinite; } @media screen and (max-width: 750px) { .star { animation: fall var(--fall-duration) var(--fall-delay) linear; } } .star:nth-child(1) { --star-tail-length: 6.62em; --top-offset: 25vh; --fall-duration: 3s; --fall-delay: 2.082s; } .star::before, .star::after { position: absolute; content: ""; top: 0; left: calc(var(--star-width) / -2); width: var(--star-width); height: 100%; background: linear-gradient(45deg, transparent, currentColor, transparent); border-radius: inherit; animation: blink 2s linear infinite; } .star::before { transform: rotate(45deg); } .star::after { transform: rotate(-45deg); } @keyframes fall { to { transform: translate3d(-30em, 0, 0); } } @keyframes tail-fade { 0%, 50% { width: var(--star-tail-length); opacity: 1; } 70%, 80% { width: 0; opacity: 0.4; } 100% { width: 0; opacity: 0; } } @keyframes blink { 50% { opacity: 0.6; } } /* ------------------- HERO --------------------*/ #home.banner.banner-six.reducing-threat .banner-title { font-size: 57px !important; line-height: 68px !important; } .banner.banner-six.reducing-threat { position: relative; padding-top: 180px; overflow: hidden; background-image: url(./../assets/images/reducing-threats/hero-bg-thrive.jpg); background-position: bottom; background-size: cover; height: 820px; } .banner.banner-six.reducing-threat .banner-content-wrapper-six { max-width: 90% !important; position: relative !important; z-index: 2; top: unset !important; } .banner .bg-shape-inner { position: absolute; bottom: -2px; width: 100%; } /* Reducing Threats */ .products-section-header { display: flex; align-items: center; justify-content: center; position: relative; margin: 20px 0; } .products-section-header .line { height: 1px; background-color: #e1c667; /* Choose your color */ width: 100%; position: absolute; top: 50%; } .products-section-header .line.skills-line { background-color: #fece56; /* Choose your color */ } .products-section-header .line.perception-line { background-color: #44b598; /* Choose your color */ } .products-section-header .line.bb-line { background-color: #fece56; /* Choose your color */ } .products-section-header .center-image { padding: 10px; /* Adjust padding to your liking */ border-radius: 50%; /* Makes the image round */ z-index: 1; width: 105px; height: auto; } .products-section-header .center-image.rounded-container { background-color: white; border: 1px solid grey; padding: 10px; /* Adjust padding to your liking */ border-radius: 50%; /* Makes the image round */ z-index: 1; width: 105px; height: 105px; } .product-header-title { font-size: 24px; } .round-button-std { padding: 10px 40px !important; background-color: #8cc152 !important; border-radius: 30px; border: 1px solid transparent !important; font-size: 18px; font-weight: bold; display: inline-block; } .image-and-content { margin-top: 1em; } .image-and-content .image-display { width: 100%; height: auto; border: 1px solid #E6E9ED; border-radius: 8px; } .image-and-content .image-display img { width: 100%; border-radius: 8px; } .image-and-content .content-cta { display: flex; flex-direction: column; margin-top: 1.5em; } @media (max-width: 1200px) { .banner.banner-six.reducing-threat .banner-content-wrapper-six .title-small { font-size: 44px !important; line-height: 56px !important; } .banner.banner-six.reducing-threat .banner-content-wrapper-six { max-width: 90% !important; } } @media (max-width: 991px) { .banner.banner-six.reducing-threat { padding-top: 110px !important; height: 965px !important; } .banner.banner-six.reducing-threat .banner-content-wrapper-six { top: 0px !important; text-align: center !important; padding: 0 50px !important; margin: auto !important; } .banner.banner-six.reducing-threat .banner-six-promo-image .dot-shape { display: none !important; } .banner.banner-six.reducing-threat .banner-content-wrapper-six .banner-title { font-size: 44px !important; line-height: 58px !important; } .banner.banner-six.reducing-threat .emoji, .banner-six .app-collction { display: none !important; } .banner.banner-six.reducing-threat .avatar-wrapper { display: none !important; } .banner.banner-six.reducing-threat .banner-content-wrapper-six .title-small { font-size: 34px !important; line-height: 48px !important; } .banner.banner-six.reducing-threat .banner-btn { margin-bottom: 50px!important; } } @media (max-width: 768px) { .banner.banner-six.reducing-threat { height: auto !important; } .banner.banner-six.reducing-threat .banner-content-wrapper-six { max-width: 100% !important; padding: 0 30px !important; text-align: center !important; } .banner.banner-six.reducing-threat .bottom-shape, .banner.banner-six.reducing-threat .banner-six-promo-image img { display: none !important; } } /* ------------------- LIST STYLES --------------------*/ .list-vline { margin: 0; padding-right: 30px; list-style: none; } .list-vline li { margin-bottom: 40px; padding-left: 20px; border-left: 3px solid #0e79c9; } .list-vline li:last-child { margin-bottom: 0px; } .pill-list { margin: 0; padding: 0 0 0 20px; list-style: none; } .pill-list li { margin-bottom: 15px; padding: 15px 30px; border: 1px solid #e6e9ed; border-radius: 8px; background-color: #fff; cursor: pointer; } .pill-list li:last-child { margin-bottom: 0px; } .pill-list li.active { font-weight: bold; color: #fff; } .pill-list li.default.active { font-weight: normal; color: #fff; border: 1px solid #0e79c9; background-color: #0e79c9; } .pill-list li.self-awareness i { color: #0e79c9; } .pill-list li.self-awareness { border: 1px solid rgba(14, 121, 201, .5); background-color: rgba(14, 121, 201, 0.1); } .pill-list li.self-awareness:hover { border: 1px solid #0e79c9; } .pill-list li.self-awareness.active { border: 1px solid #0e79c9; background-color: #0e79c9; } .pill-list li.self-management i { color: #d770ad; } .pill-list li.self-management:hover { border: 1px solid #d770ad; } .pill-list li.self-management { border: 1px solid rgba(215, 112, 173, .5); background-color: rgba(215, 112, 173, 0.1); } .pill-list li.self-management.active { border: 1px solid #d770ad; background-color: #d770ad; } .pill-list li.social-awareness i { color: #37bc9b; } .pill-list li.social-awareness { border: 1px solid rgba(55, 188, 155, .5); background-color: rgba(55, 188, 155, 0.1); } .pill-list li.social-awareness:hover { border: 1px solid #37bc9b; } .pill-list li.social-awareness.active { border: 1px solid #37bc9b; background-color: #37bc9b; } .pill-list li.relationship-skills i { color: #967adc; } .pill-list li.relationship-skills { border: 1px solid rgba(150, 122, 220, .5); background-color: rgba(150, 122, 220, 0.1); } .pill-list li.relationship-skills:hover { border: 1px solid #967adc; } .pill-list li.relationship-skills.active { border: 1px solid #967adc; background-color: #967adc; } .pill-list li.responsible-decision-making i { color: #8cc152; } .pill-list li.responsible-decision-making { border: 1px solid rgba(140, 193, 82, .5); background-color: rgba(140, 193, 82, 0.1); } .pill-list li.responsible-decision-making:hover { border: 1px solid #8cc152; } .pill-list li.responsible-decision-making.active { border: 1px solid #8cc152; background-color: #8cc152; } .pill-list i { margin-right: 5px; } .pill-list li.active i { color: #fff; } .pill-list li:hover { border: 1px solid rgba(14, 121, 201, 1); } @media (max-width: 1200px) { .list-vline { padding-right: 0px; } } /* ------------------- DETAILS BOX --------------------*/ .details-box { position: relative; height: 100%; border-radius: 20px; background-size: contain; background-repeat: no-repeat; } .details-box .text-box { position: absolute; bottom: 0; padding: 20px; -webkit-border-bottom-left-radius: 20px; -webkit-border-bottom-right-radius: 20px; -moz-border-radius-bottomleft: 20px; -moz-border-radius-bottomright: 20px; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; color: #fff; text-align: center; width: 100%; } .details-box .text-box span { display: none; font-weight: bold; } .details-box .text-box p { margin: 0; } .details-box .text-box .text-box-description-flex { display: flex; flex-direction: row; justify-content: flex-start; align-items: center; gap: 1em; } .details-box .text-box .text-box-description-flex p{ text-align: start; } .details-box .text-box .text-box-description-flex img{ height: 50px; width: 50px; } .details-box.hidden { display: none; } .details-box.default { border: 1px solid #E6E9ED; } .details-box.default .text-box { background-color: #0e79c9; } .details-box.self-awareness { background-image: url(./../assets/images/home/self-awareness-1.jpg); } .details-box.self-awareness .text-box { background-color: #0e79c9; } .details-box.self-management { background-image: url(./../assets/images/home/self-management.jpg); } .details-box.self-management .text-box { background-color: #d770ad; } .details-box.social-awareness { background-image: url(./../assets/images/home/social-awareness.jpg); } .details-box.social-awareness .text-box { background-color: #37bc9b; } .details-box.relationship-skills { background-image: url(./../assets/images/home/relationship-skills.jpg); } .details-box.relationship-skills .text-box { background-color: #967adc; } .details-box.responsible-decision-making { background-image: url(./../assets/images/home/responsible-decsion-making.jpg); } .details-box.responsible-decision-making .text-box { background-color: #8cc152; } .details-box-content { padding: 3em; display:flex; flex-direction: column; gap: 1.4em; } .details-box-content--header { font-size: 18px; font-weight: 600; font-style: italic; line-height: 1.6; color: #333333; } .details-box-content--divider { height: 1px; background-color: #E6E9ED; width: 100%; } .details-box-content--text { font-size: 16px; font-weight: 400; color: #4a4a4a; line-height: 1.5; } @media (max-width: 991px) { .leaf-bg .col-lg-4 { margin: 0 0 30px; } .details-box { height: 400px; background-size: cover; background-position: top; } .pill-list, .list-vline { padding: 0; } .details-box .text-box span { display: block; } .details-box .text-box p { margin: 10px 0 0; } } @media (max-width: 768px) and (min-width: 451px) { .details-box { height: 470px; background-size: contain; background-position: top; } } @media (max-width: 450px) { .details-box { height: 550px; } .details-box .text-box span { display: none; } } /* ------------------- BOX ICONS --------------------*/ .box-icon { position: relative; margin-bottom: 30px; padding: 30px; border-radius: 20px; border: 1px solid #e6e9ed; } .box-icon .title-icon { position: relative; width: 100%; margin-bottom: 20px; } .box-icon .title-icon h3 { font-size: 20px; color: #333; line-height: 30px; } .box-icon .title-icon i { position: absolute; right: 0px; font-size: 58px; color: #0e79c9; } /* ------------------- BAD HIRE --------------------*/ .bad-hire .cost { padding: 40px 50px; background-color: #fff; border: none; text-align: center; } .bad-hire .cost span { display: block; margin-bottom: 25px; font-size: 40px; color: #0e79c9; } .bad-hire p { font-size: 18px; } .bad-hire .cost p { margin: 0; } .bad-hire .cost-reasons { background-color: #fff; border: none; text-align: center; } .bad-hire .cost-reasons i { display: block; margin-bottom: 10px; font-size: 36px; color: #0e79c9; } .bad-hire .cost-reasons p { margin-bottom: 0; } .bad-hire .hire-list h3 { margin: 5px 0 20px; font-size: 20px; } .bad-hire .hire-list ul li { margin: 12px 0; font-size: 18px; } .bad-hire .hire-list ul li:last-child { margin: 0; } .bad-hire .morale-img { position: relative; height: 350px; border-radius: 20px; background-image: url(./../assets/images/home/morale.jpg); background-repeat: no-repeat; background-size: cover; background-position: bottom; } .why-thrive i { display: block; margin-bottom: 20px; font-size: 58px; color: #0e79c9; } .why-thrive p { margin: 0; font-size: 18px; } @media screen and (min-width: 1200px) { .finding-3 .text-box .text-box-description-flex p { width: 80%; } } /* ------------------- GENERAL --------------------*/ .cc-window { z-index: 2147483004; } .cc-dismiss:hover { color: #333!important; } body { font-family: "Open Sans", sans-serif; font-size: 16px; line-height: 28px; color: #797687; overflow-x: hidden; } #main_content { overflow: hidden; } .element-hidden { visibility: hidden; } svg { display: block; } a, button, input, textarea, button { -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } input, textarea { width: 100%; padding: 10px 12px; outline: 0; } button { cursor: pointer; outline: 0; } a { color: #0e7cdc; } a, a:hover { text-decoration: none; } h1, h2, h3, h4, h5, h6 { font-family: "Open Sans", sans-serif; margin-top: 0; font-weight: 600; color: #2b2350; } h3 { line-height: 1.3em; } h4 { font-size: 19px; font-weight: 400; } img { max-width: 100%; height: auto; } .img-fluid { width: 100%; height: auto; } .heebo { font-family: 'Heebo', sans-serif!important; font-weight: 400!important; } .clearfix { overflow: auto; } .clearfix::after { content: ""; clear: both; display: table; } .img-responsive { display: block; max-width: 100%; height: auto; } .no-scroll { overflow-y: hidden !important; } .center-hv { position: absolute; margin: auto; top: 50%; left: 50%; transform: translate(-50%, -50%); } .center-v { display: flex; align-items: center; } .fw-300 { font-weight: 300!important; } .fw-400 { font-weight: 400!important; } .fw-600 { font-weight: 600!important; } .fw-700 { font-weight: 700!important; } .circle { position: relative; background-color: #ccd1d9; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; color: white; height: 100px; font-weight: 600; width: 100px; display: table; margin: 0 0 20px; z-index: 1; } .inline-circle { display: inline-block; font-size: 20px; padding: 12px; position: relative; top: -5px; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; color: white; height: 50px; font-weight: 600; width: 50px; z-index: 1; } @media (min-width: 1200px) { .container { max-width: 1200px; } } .wistia-video { position: relative; z-index: 10; border: 10px solid white; border-radius: 20px; } /* ------------------- Modals --------------------*/ .modal-backdrop { z-index: 10000; } #login-modal { z-index: 10001; } #login-modal .modal-header { display: block; position: relative; border-bottom: none; text-align: center; } #login-modal .modal-header .close { position: absolute; right: 20px; top: 20px; } #login-modal .modal-header .modal-logo { margin: 10px 0; } #login-modal .modal-header .modal-title { font-size: 24px; font-weight: 600; } #login-modal .modal-body { padding: 10px 30px; text-align: center; } #login-modal .modal-body .user-wrapper { display: flex; justify-content: space-between; } #login-modal .modal-body .user-type { width: 170px; height: 190px; padding-top: 25px; border: 2px solid #f5f7fa; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; text-align: center; } #login-modal .modal-body .user-type:hover { border: 2px solid #ffce54; } #login-modal .modal-body .user-type .teacher img { top: 23px; } #login-modal .modal-body .user-type:hover .teacher img { top: 18px; } #login-modal .modal-body .user-type .parent img { top: 18px; } #login-modal .modal-body .user-type:hover .parent img { top: 13px; } #login-modal .modal-body .user-type .student img { top: 18px; } #login-modal .modal-body .user-type:hover .student img { top: 15px; } #login-modal .modal-body .user-type .school-leader img { top: 0px; } #login-modal .modal-body .user-type:hover .school-leader img { top: -5px; } #login-modal .modal-body .user-circle { position: relative; width: 100px; height: 100px; margin: auto; -webkit-border-radius: 100px; -moz-border-radius: 100px; border-radius: 100px; } #login-modal .modal-body .teacher { background-color: rgba(55, 188, 155, 0.2); } #login-modal .modal-body .parent { background-color: rgba(190, 100, 127, 0.1); } #login-modal .modal-body .student { background-color: rgba(255, 206, 84, 0.25); } #login-modal .modal-body .school-leader { background-color: rgba(93, 156, 236, 0.15); } #login-modal .modal-body img { position: relative; -webkit-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } #login-modal .modal-body p { margin: 30px 0; font-size: 18px; } #login-modal .modal-body p i { margin-right: 5px; } #login-modal .modal-body .user-type p { margin: 10px 0 0 0; font-size: 18px; color: #333; } #login-modal .hs-form label { margin: 0 10px; font-size: 14px!important; } #login-modal .hs-form .input { margin: 0 10px; } #login-modal .hs-form .hs-input { margin-bottom: 0!important; } #login-modal .hs-form .hs-button { background-color: #0e79c9!important; color: #fff!important; } #login-modal .hs-form .hs-button:hover { background-color: #219af6!important; } @media (min-width: 576px) { .modal-dialog { max-width: 800px; } } /* ------------------- Buttons --------------------*/ .btn-rounded { position: relative; padding: 10px 40px; background-color: #0e79c9; border: 2px solid #0e79c9; border-radius: 30px; font-size: 18px; font-weight: bold; display: inline-block; color: #fff; z-index: 2; } .btn-rounded:hover { background-color: transparent; color: #0e79c9; } .demo-btn { padding: 20px; border-radius: 10px; border: 1px solid #db931b; font-size: 20px; white-space: nowrap; } .demo-btn:hover { background: #feb62a!important; } /* ------------------- Webinar Top Banner --------------------*/ /* body { padding-top: 62px; } .site-header { top: 60px; } .pix-header-fixed { top: 60px; } @media (max-width: 768px) { body { padding-top: 90px; } .site-header, .pix-header-fixed { top: 90px!important; } } .webinar-top-banner { position: fixed; top: 0; width: 100%; height: auto; background-color: #47acf8; padding: 17px 0; z-index: 10000; font-size: 14px; } .webinar-top-banner p { margin: 0; color: #fff; font-weight: 400; text-align: center; display: inline-block; vertical-align: middle; margin-right: 5px; } .webinar-top-banner p a { color: #fff; text-decoration: underline; font-weight: 600; } .webinar-top-banner .banner-label { margin-right: 3px; background-color: #BC2C8A; padding: 5px; border-radius: 3px; color: #fff; font-size: 14px; font-weight: bold; white-space: nowrap; } .book-demo a { top: 170px!important; } #clock { display: inline-block; vertical-align: middle; width: 168px; } #clock span { float: left; text-align: center; font-size: 16px; margin: 0 3px; color: #ffffff; padding: 2px 10px; width: 50px; border-radius: 6px; box-sizing: border-box; } #clock span:nth-child(1) { background: rgba(0,0,0,.1); } #clock span:nth-child(2) { background: rgba(0,0,0,.1); } #clock span:nth-child(3) { background: rgba(0,0,0,.1); } #clock span:nth-child(4) { background: rgba(0,0,0,.1); } #clock:after { content: ""; display: block; clear: both; } #units span { float: left; width: 25%; text-align: center; margin-top: 30px; color: #D7DBDD; text-transform: uppercase; font-size: 13px; letter-spacing: 2px; text-shadow: 1px 1px 1px rgba(10, 10, 10, 0.7) } span.turn { animation: turn 0.5s ease forwards; } @keyframes turn { 0% { transform: rotateY(0deg) } 100% { transform: rotateY(360deg) } } @media (max-width: 991px) { #clock { display: none; } } @media (max-width: 768px) { .webinar-top-banner { height: 90px; } } @media only screen and (min-width : 320px) and (max-width : 420px) { .webinar-top-banner { padding: 10px 0px; } } */ /* ------------------- BANNER STRIP --------------------*/ .banner-strip { position: relative; width: 100%; height: 62px; padding: 17px 0; color: #fff; background-color: rgba(20, 50, 100, 0.9); } .banner-strip p { margin: 0; padding: 0; } .banner-strip a { position: relative; color: #fff; font-weight: 600; text-decoration: underline; z-index: 10; } .banner-strip i { margin-right: 5px; font-size: 24px; vertical-align: text-bottom; } /* ------------------- BANNER STRIP --------------------*/ .banner-strip-message { position: relative; width: 100%; height: auto; margin-top: 50px; padding: 17px; color: #fff; background-color: rgba(243, 161, 0, .1); border: 1px solid #f3a100; transition: background-color 0.2s ease-out 100ms; } .banner-strip-message p { margin: 0; padding: 0; font-size: 18px; color: #333; transition: color 0.2s ease-out 100ms; } .banner-strip-message a { position: relative; font-weight: 600; text-decoration: underline; z-index: 10; } .banner-strip-message i { font-size: 20px; position: relative; top: 1px; margin: 3px; } /*-------------------------------------------------------------- ## Sign --------------------------------------------------------------*/ .signin { min-height: 100vh; position: relative; padding-top: 150px; } .signin-from-wrapper { height: auto; position: relative; z-index: 22; } .signin-from-wrapper .signin-from-inner { padding-right: 100px; position: relative; z-index: 222; } .signin-from-wrapper .signin-from-inner .title { font-size: 46px; font-weight: 400; } .signin-from-wrapper .signin-from-inner input { background: rgba(14,121,201,.05); } .signin-from-wrapper .signin-from-inner input:focus { -webkit-box-shadow: 0px 20px 40px 0px rgba(79, 35, 35, 0.1); box-shadow: 0px 20px 40px 0px rgba(79, 35, 35, 0.1); background: #fff; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .signin-from-wrapper .signin-from-inner button { border: 0; padding: 11px 40px; outline: 0; margin-bottom: 33px; } .signin-from-wrapper .signin-from-inner p { margin-top: 10px; margin-bottom: 38px; font-size: 18px; } .signin-from-wrapper .signin-from-inner p a { color: #0e79c9; } .signin-banner { background: rgba(30,41,59,1) !important; position: absolute; overflow: hidden; right: 0; height: 100%; max-width: 48%; width: 100%; top: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .signin-banner .image-two { margin-left: -35px; margin-top: -140px; } .signin-banner.signup-banner { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .signin-banner.signup-banner .image-one, .signin-banner.signup-banner .image-two { position: absolute; bottom: 0; margin: 0; } .signin-banner.signup-banner .image-one { left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); margin: 0; } .signin-banner.signup-banner .animate-image-inner { position: absolute; width: 100%; height: 450px; left: 0; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .signin-banner .text-box { margin: 10%; } .signin-banner .school-logo-banner { position: absolute; bottom: 0; width: 100%; } .signin-banner .school-logo-banner .swiper-slide { margin: 0 20px; } .signin-banner .school-logo-banner .district-logo img { opacity: 0.25; } .signin-banner .school-logo-banner .district-logo img:hover { opacity: 1; } .signin-banner svg { position: absolute; pointer-events: none !important; inset: 0 !important; opacity: .15 !important; color: rgba(51,65,85,1) !important; } .signin-banner svg circle { fill: rgba(0, 0, 0, 0); stroke-width: 100; stroke-dasharray: none!important; stroke-dashoffset: 0; } .signin-banner svg.shape-dots { top: -2rem !important; left: 80% !important; opacity: 0.75 !important; width: auto; } .condition { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .condition .styled-checkbox { position: absolute; opacity: 0; height: 20px; width: 16px; margin: 0; } .condition span { font-size: 14px; } .styled-checkbox + label { position: relative; cursor: pointer; padding: 0; margin: 0; height: 20px; } .styled-checkbox + label:before { content: ""; margin-right: 10px; display: inline-block; vertical-align: text-top; width: 16px; height: 16px; border: 2px solid #aba8a4; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .styled-checkbox:hover + label:before { border-color: #fa7070; } .styled-checkbox:checked + label:before { border-color: #fa7070; } .styled-checkbox:checked + label:after { content: ""; position: absolute; left: 3px; top: 9px; background: #fa7070; width: 2px; height: 2px; -webkit-box-shadow: 2px 0 0 #fa7070, 4px 0 0 #fa7070, 4px -2px 0 #fa7070, 4px -4px 0 #fa7070, 4px -6px 0 #fa7070, 4px -8px 0 #fa7070; box-shadow: 2px 0 0 #fa7070, 4px 0 0 #fa7070, 4px -2px 0 #fa7070, 4px -4px 0 #fa7070, 4px -6px 0 #fa7070, 4px -8px 0 #fa7070; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .forget-link { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-top: 5px; } .forget-link .forget { font-size: 14px; color: #9694a2; } .forget-link .forget:hover { color: #fa7070; } .singup-social { margin-bottom: 25px; padding: 0; list-style: none; } .singup-social li { display: inline-block; margin-bottom: 10px; } .singup-social li:not(:last-child) { margin-right: 4px; } .singup-social li a { display: inline-block; padding: 11px 35px; color: #fff; border-radius: 30px; font-size: 16px; width: 180px; text-align: center; } .singup-social li a i { margin-right: 10px; } .singup-social li a:hover { opacity: 0.8; } .singup-social li:nth-child(1) a { background: #3b5998; } .singup-social li:nth-child(2) a { background: #dd4b39; } .singup-social li:nth-child(3) a { background: #55acee; } @media (max-width: 991px) { .signin-from-wrapper .signin-from-inner { -webkit-transform: translateY(-47%); -ms-transform: translateY(-47%); transform: translateY(-47%); } .signin-from-wrapper .signin-from-inner .title { font-size: 30px; } .signup input { margin-bottom: 20px; } } @media (max-width: 991px) { .signin { height: auto; } .signin-from-wrapper { height: auto; } .signin-from-wrapper .signin-from-inner { position: relative; height: auto; z-index: 22; padding: 150px 0 36px; top: 0; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } .signin-from-wrapper .signin-from-inner .title { font-size: 30px; } .signin-banner { position: relative; max-width: 100%; z-index: 222; padding: 80px 0; } .signin-banner .image-one { max-width: 200px; } .signin-banner .image-two { max-width: 80px; margin-left: -20px; margin-top: -50px; } .signin-banner.signup-banner { height: 350px; } .signin-banner.signup-banner .animate-image-inner { height: 200px; } .signin-banner.signup-banner .animate-image-inner .image-two img { width: 60px; } } @media (max-width: 768px) { .signin-from-wrapper .signin-from-inner { padding: 100px 0 5px; } .signin-banner.signup-banner { padding: 50px 0; height: 300px; } } /* ------------------- POP OVER BLOG --------------------*/ .blog-float { position: fixed; bottom: 30px; right: 30px; max-width: 300px; pointer-events: none; z-index: 1000000; } .blog-hide { display: none; } .blog-float .blog-post { margin-bottom: 0; } .blog-float a { color: #fff; } .blog-float.blog-show, .blog-float.blog-visible { pointer-events: auto; } .blog-close { width: 20px; height: 20px; position: absolute; right: 20px; top: 17px; overflow: hidden; text-indent: 100%; cursor: pointer; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 100; } .blog-close:hover, .blog-close:focus { outline: none; color: #000; } .blog-close::before, .blog-close::after { content: ''; position: absolute; width: 3px; height: 60%; top: 50%; left: 50%; background: #fff; } .blog-close:hover::before, .blog-close:hover::after { background: #fff; } .blog-close::before { -webkit-transform: translate(-50%,-50%) rotate(45deg); transform: translate(-50%,-50%) rotate(45deg); } .blog-close::after { -webkit-transform: translate(-50%,-50%) rotate(-45deg); transform: translate(-50%,-50%) rotate(-45deg); } [class^="blog-effect-"].blog-float.blog-hide, [class*=" blog-effect-"].blog-float.blog-hide { -webkit-animation-direction: reverse; animation-direction: reverse; } @-webkit-keyframes bounceOutRight { 20% { opacity: 1; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); } 100% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } @keyframes bounceOutRight { 20% { opacity: 1; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); } 100% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } .bounceOutRight { -webkit-animation-name: bounceOutRight; animation-name: bounceOutRight; } @media (max-width: 768px) { .blog-float { bottom: 100px; } } @media (max-width: 479px) { .blog-float span.link, .blog-float .link a { color: #0e79c9!important; font-weight: bold; } .blog-float .feature-image { display: none; } .blog-close::before, .blog-close::after { background: #333; } } @media (max-width: 902px) { .mr-pt0 { padding-top: 0px !important;} .mr-pt10 { padding-top: 10px !important;} .mr-pt20 { padding-top: 20px !important;} .mr-pt30 { padding-top: 30px !important;} .mr-pt40 { padding-top: 40px !important;} .mr-pt50 { padding-top: 50px !important;} .mr-pb0 { padding-bottom: 0px !important;} .mr-pb10 { padding-bottom: 10px !important;} .mr-pb20 { padding-bottom: 20px !important;} .mr-pb30 { padding-bottom: 30px !important;} .mr-pb40 { padding-bottom: 40px !important;} .mr-pb50 { padding-bottom: 50px !important;} .mr-mt0 { margin-top: 0px !important;} .mr-m10 { margin-top: 10px !important;} .mr-m20 { margin-top: 20px !important;} .mr-m30 { margin-top: 30px !important;} .mr-m40 { margin-top: 40px !important;} .mr-m50 { margin-top: 50px !important;} .mr-mb0 { margin-bottom: 0px !important;} .mr-mb10 { margin-bottom: 10px !important;} .mr-mb20 { margin-bottom: 20px !important;} .mr-mb30 { margin-bottom: 30px !important;} .mr-mb40 { margin-bottom: 40px !important;} .mr-mb50 { margin-bottom: 50px !important;} } /* ------------------- POP OVER BOX --------------------*/ .ns-box { position: fixed; bottom: 30px; right: 30px; max-width: 268px; border-radius: 5px; background: rgba(59,102,157,.9); padding: 20px; line-height: 1.4; pointer-events: none; font-size: 90%; z-index: 1000000; -webkit-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.10); -moz-box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.10); box-shadow: 3px 3px 3px 0px rgba(0,0,0,0.10); } .ns-hide { display: none; } .ns-box .ns-header { margin: -20px -20px 15px; color: #fff; background-color: #3b669d; -webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; border-top-left-radius: 4px; border-top-right-radius: 4px; padding: 15px 20px; font-size: 18px; font-family: 'Heebo'; font-weight: 600; } .ns-box p { margin: 0 0 15px; line-height: 26px; color: #fff; font-size: 16px; } .ns-box a { color: #fff; font-weight: 700; } .ns-box .btn { display: block; margin-top: 20px; padding: 11px 30px; font-size: 16px; } .ns-box a:hover, .ns-box a:focus { opacity: 1; text-decoration: underline; color: #fff; } .ns-box.ns-show, .ns-box.ns-visible { pointer-events: auto; } .ns-close { width: 20px; height: 20px; position: absolute; right: 20px; top: 17px; overflow: hidden; text-indent: 100%; cursor: pointer; -webkit-backface-visibility: hidden; backface-visibility: hidden; } .ns-close:hover, .ns-close:focus { outline: none; } .ns-close::before, .ns-close::after { content: ''; position: absolute; width: 3px; height: 60%; top: 50%; left: 50%; background: #fff; } .ns-close:hover::before, .ns-close:hover::after { background: #fff; } .ns-close::before { -webkit-transform: translate(-50%,-50%) rotate(45deg); transform: translate(-50%,-50%) rotate(45deg); } .ns-close::after { -webkit-transform: translate(-50%,-50%) rotate(-45deg); transform: translate(-50%,-50%) rotate(-45deg); } [class^="ns-effect-"].ns-box.ns-hide, [class*=" ns-effect-"].ns-box.ns-hide { -webkit-animation-direction: reverse; animation-direction: reverse; } @-webkit-keyframes bounceOutRight { 20% { opacity: 1; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); } 100% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } @keyframes bounceOutRight { 20% { opacity: 1; -webkit-transform: translate3d(-20px, 0, 0); transform: translate3d(-20px, 0, 0); } 100% { opacity: 0; -webkit-transform: translate3d(2000px, 0, 0); transform: translate3d(2000px, 0, 0); } } .bounceOutRight { -webkit-animation-name: bounceOutRight; animation-name: bounceOutRight; } @media (max-width: 479px) { .ns-box span.link, .ns-box .link a { color: #0e79c9!important; font-weight: bold; } } /* ------------------- BORDER --------------------*/ .border-top { border-top: 1px solid #e6e9ed!important; } .border { border: 1px solid #e6e9ed!important; } .no-shadow { box-shadow: none!important; } .no-border { border: none!important; } .round-top-left { -webkit-border-top-left-radius: 10px; -moz-border-radius-topleft: 10px; border-top-left-radius: 10px; } .round-top-right { -webkit-border-top-right-radius: 10px; -moz-border-radius-topright: 10px; border-top-right-radius: 10px; } /* ------------------- SPACING --------------------*/ .p0 { padding: 0px!important; } .p10 { padding: 10px!important; } .p15 { padding: 15px!important; } .p20 { padding: 20px!important; } .p25 { padding: 25px!important; } .p30 { padding: 30px!important; } .p40 { padding: 40px!important; } .p50 { padding: 50px!important; } .pt0 { padding-top: 0!important; } .pt10 { padding-top: 10px!important; } .pt15 { padding-top: 15px!important; } .pt20 { padding-top: 20px!important; } .pt40 { padding-top: 40px!important; } .pt30 { padding-top: 30px!important; } .pt50 { padding-top: 50px!important; } .pt60 { padding-top: 60px!important; } .pt80 { padding-top: 80px!important; } .pt100 { padding-top: 100px!important; } .pt120 { padding-top: 120px!important; } .pt150 { padding-top: 150px!important; } .ptb50 { padding-top: 50px!important; padding-bottom: 50px!important; } .ptb100 { padding-top: 100px!important; padding-bottom: 100px!important; } .pb0 { padding-bottom: 0!important; } .pb10 { padding-bottom: 10px!important; } .pb20 { padding-bottom: 20px!important; } .pb30 { padding-bottom: 30px!important; } .pb40 { padding-bottom: 40px!important; } .pb50 { padding-bottom: 50px!important; } .pb60 { padding-bottom: 60px!important; } .pb80 { padding-bottom: 80px!important; } .pb100 { padding-bottom: 100px!important; } .pb150 { padding-bottom: 150px!important; } .pb200 { padding-bottom: 200px!important; } .pl70 { padding-left: 70px!important; } .pl100 { padding-left: 100px!important; } .pr70 { padding-right: 70px!important; } .prl8 { padding-right: 8px!important; padding-left: 8px!important; } .mr10 { margin-right: 10px!important; } .mr15 { margin-right: 15px!important; } .mlr30 { margin-left: 30px; margin-right: 30px!important; } .m10 { margin: 10px!important; } .m20 { margin: 20px!important; } .m30 { margin: 30px!important; } .m40 { margin: 40px!important; } .m50 { margin: 50px!important; } .mt0 { margin-top: 0!important; } .mt10 { margin-top: 10px!important; } .mt15 { margin-top: 15px!important; } .mt20 { margin-top: 20px!important; } .mt30 { margin-top: 30px!important; } .mt40 { margin-top: 40px!important; } .mt50 { margin-top: 50px!important; } .mt60 { margin-top: 60px!important; } .mt80 { margin-top: 80px!important; } .mb0 { margin-bottom: 0!important; } .mb5 { margin-bottom: 5px!important; } .mb10 { margin-bottom: 10px!important; } .mb20 { margin-bottom: 20px!important; } .mb30 { margin-bottom: 30px!important; } .mb40 { margin-bottom: 40px!important; } .mb50 { margin-bottom: 50px!important; } .mb60 { margin-bottom: 60px!important; } .mb70 { margin-bottom: 70px!important; } .mb100 { margin-bottom: 100px!important; } .mr5 { margin-right: 5px!important; } .mr10 { margin-right: 10px!important; } /* ------------------- COLOURS --------------------*/ /* Font colours*/ .white { color: #fff!important; } .red { color: #da4453!important; } .light-blue { color: #3bafda!important; } .blue { color: #0e79c9!important; } .green { color: #8cc152!important; } .mint { color: #37bc9b!important; } .yellow { color: #f3a100!important; } .orange { color: #e9573f!important; } .light-orange { color: #fc6e51!important; } .pumpkin { color: #ff7a22!important; } .pink { color: #ec87c0!important; } .purple { color: #bf657f!important; } .purple-s { color: #967adc!important; } .mint { color: #37bc9b!important; } .soft-blue { color: #5d9cec!important; } .grey-blue { color: #7194b7!important; } .charcoal { color: #333!important; } .dark { color: #2b2350 !important; } /* Background colours*/ .grey-bg { background: #f8fafd!important; } .white-bg { background: #ffffff!important; } .dark-grey-bg { background-color: #656d78!important; } .red-bg { background-color: #da4453!important; } .light-red-bg { background-color: #ed5565!important; } .light-blue-bg { background-color: #3bafda!important; } .blue-bg { background-color: #0e79c9!important; } .green-bg { background-color: #8cc152!important; } .yellow-bg { background-color: #f3a100!important; } .pale-yellow-bg { background-color: #fef6ea !important; } .orange-bg { background-color: #e9573f!important; } .pumpkin-bg { background-color: #ff7a22!important; } .light-orange-bg { background-color: #fc6e51!important; } .pink-bg { background: #ec87c0!important; } .mint-bg { background: #37bc9b!important; } .purple-s-bg { background: #967adc!important; } .purple-bg { background: #bf657f!important; } .soft-blue-bg { background: #5d9cec!important; } .no-bg { background: transparent!important; } .dark-grey-bg { background: #8a9fb4!important; } .white-bg { background: #fff!important; } .navy-bg { background: #132843!important; } .purple-s-border { border: 2px solid #967adc!important; } .mint-border { border: 2px solid #37bc9b!important; } .yellow-border { border: 2px solid #f3a100!important; } .soft-blue-border { border: 2px solid #5d9cec!important; } /* Gradient colours*/ .grey-grad { background: #ffffff!important; /* Old browsers */ background: -moz-linear-gradient(top, #ffffff 0%, #f8fafd 100%)!important; /* FF3.6-15 */ background: -webkit-linear-gradient(top, #ffffff 0%,#f8fafd 100%)!important; /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #ffffff 0%,#f8fafd 100%)!important; /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f8fafd',GradientType=0 )!important; /* IE6-9 */ } .grey-blue-grad { background: #7194b7!important; background: -moz-linear-gradient(150deg,#7194b7 15%,#96b6d5 60%,#96b6d5 84%)!important; background: -webkit-linear-gradient(150deg,#7194b7 15%,#96b6d5 60%,#96b6d5 84%)!important; background: linear-gradient(150deg,#7194b7 15%,#96b6d5 60%,#96b6d5 84%)!important; filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7194b7', endColorstr='#96b6d5',GradientType=1 )!important; } .navy-grad { background: #132843; background: -moz-linear-gradient(150deg,#132843 15%,#2257b9 60%,#2257b9 84%); background: -webkit-linear-gradient(150deg,#2257b9 15%,#2257b9 60%,#2257b9 84%); background: linear-gradient(150deg,#132843 15%,#2257b9 60%,#2257b9 84%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#132843', endColorstr='#2257b9',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ } .blue-grad { background: #5d9cec; background: -moz-linear-gradient(150deg,#277deb 15%,#277deb 40%,#5d9cec 84%); background: -webkit-linear-gradient(150deg,#277deb 15%,#277deb 40%,#5d9cec 84%); background: linear-gradient(150deg,#277deb 15%,#277deb 40%,#5d9cec 84%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#277deb', endColorstr='#5d9cec',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ } .grey-blue-grad-img { background: -moz-linear-gradient(150deg, rgba(113,148,183,.9) 15%, rgba(150,182,213,.9) 60%,rgba(150,182,213,.9) 84%); background: -webkit-linear-gradient(150deg, rgba(113,148,183,.9) 15%, rgba(150,182,213,.9) 60%,rgba(150,182,213,.9) 84%); background: linear-gradient(150deg, rgba(113,148,183,.9) 15%, rgba(150,182,213,.9) 60%,rgba(150,182,213,.9) 84%); } .yellow-grad { background: rgb(252,194,80); background: -moz-linear-gradient(225deg, rgba(252,194,80,1) 0%, rgba(243,161,0,1) 50%, rgba(243,161,0,1) 100%); background: -webkit-linear-gradient(225deg, rgba(252,194,80,1) 0%, rgba(243,161,0,1) 50%, rgba(243,161,0,1) 100%); background: linear-gradient(225deg, rgba(252,194,80,1) 0%, rgba(243,161,0,1) 50%, rgba(243,161,0,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#fcc250",endColorstr="#f3a100",GradientType=1); } .mint-grad { background: #37bc9b; background: -moz-linear-gradient(150deg,#37bc9b 15%,#37bc9b 60%,#37bc9b 84%); background: -webkit-linear-gradient(150deg,#37bc9b 15%,#37bc9b 60%,#37bc9b 84%); background: linear-gradient(150deg,#37bc9b 15%,#37bc9b 60%,#37bc9b 84%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#37bc9b', endColorstr='#37bc9b',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ } .purple-grad { background: #967adc; background: -moz-linear-gradient(150deg,#ac92ec 15%,#967adc 60%,#967adc 84%); background: -webkit-linear-gradient(150deg,#967adc 15%,#ac92ec 60%,#967adc 84%); background: linear-gradient(150deg,#ac92ec 15%,#967adc 60%,#967adc 84%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ac92ec', endColorstr='#967adc',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ } .soft-blue-grad { background: #5d9cec; background: -moz-linear-gradient(150deg,#277deb 15%,#277deb 40%,#5d9cec 84%); background: -webkit-linear-gradient(150deg,#277deb 15%,#277deb 40%,#5d9cec 84%); background: linear-gradient(150deg,#277deb 15%,#277deb 40%,#5d9cec 84%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#277deb', endColorstr='#5d9cec',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ } /* ------------------- BUTTONS --------------------*/ .outline-hero-btn { margin-left: 10px; color: #0e79c9!important; background-color: transparent!important; padding: 10px 40px; border: 1px solid #0e79c9; border-radius: 30px; font-size: 18px; font-weight: normal; display: inline-block; } .outline-hero-btn:hover { color: #fff!important; background-color: #219af6!important; } .outline-hero-btn-white { margin-left: 10px; color: #fff!important; background-color: transparent!important; padding: 10px 40px; border: 1px solid #fff; border-radius: 30px; font-size: 18px; font-weight: 600; display: inline-block; } .outline-hero-btn-white:hover { color: #fff!important; background-color: #219af6!important; border: 1px solid #219af6; } .btn { padding: .5em 1em; } .btn.blue-bg:hover { background-color: #219af6!important; } .btn i { margin-left: 5px; font-size: 12px; font-weight: bold; } @media (max-width: 1200px) { .feature-hero .outline-hero-btn { margin-left: 0; margin-top: 15px; } .feature-hero .description { font-size: 16px!important; } } /* ------------------- LIST --------------------*/ .list-items, .checklist-items { margin: 0; padding: 0; list-style: none; } .list-items li { margin: 20px 0; font-size: 16px; line-height: 23px; font-weight: 500; padding-left: 0px; position: relative; } .list-items li span { font-weight: 600; color: #333; } .fa-ul { margin-left: 1.5em; } .fa-ul li { margin-bottom: 1em; } .checklist-items li { margin-bottom: 8px; font-size: 16px; font-weight: 500; color: #2b2350; padding-left: 36px; position: relative; } .checklist-items li:before { content: "\4e"; font-family: eleganticons; position: absolute; left: 0; top: 0; color: #fa7070; } .checklist-items.color-two li:before { color: #7052fb; } .checklist-items.list-with-icon li:before { display: none; } .checklist-items.list-with-icon li i { position: absolute; left: 0; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); color: #7052fb; } /* ------------------- FORMS --------------------*/ input, textarea { background: #fdfafa; padding: 15px 30px; border: 1px solid #efe7e7; margin-bottom: 30px; border-radius: 30px; } input:focus, textarea:focus { background: #fff; -webkit-box-shadow: 0px 20px 40px 0px rgba(79, 35, 35, 0.1); box-shadow: 0px 20px 40px 0px rgba(79, 35, 35, 0.1); } textarea { height: 200px; } /* ------------------- BOOK A DEMO --------------------*/ .book-demo a { position: fixed; top: 130px; right: -1px; height: 46px; padding: 10px 10px 10px 20px; background-color: #8cc152; -webkit-border-top-left-radius: 46px; -webkit-border-bottom-left-radius: 46px; -moz-border-radius-topleft: 46px; -moz-border-radius-bottomleft: 46px; border-top-left-radius: 46px; border-bottom-left-radius: 46px; border: 1px solid rgba(255,255,255,.25); color: #fff; z-index: 1000; -webkit-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.1); -moz-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.1); box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.1); } .book-demo a:hover { background-color: #90d248; color: #fff; } .book-demo a i { margin-left: 5px; } @media (max-width: 768px) { .book-demo { position: fixed; bottom: 0; width: 100%; height: 66px; padding: 10px 40px; background-color: #eee; z-index: 1000; } .book-demo a { position: relative; top: auto; right: auto; width: 100%; height: 46px; padding: 10px 10px 10px 20px; background-color: #8cc152; -webkit-border-radius: 46px; -webkit-border-radius: 46px; -moz-border-radius: 46px; -moz-border-radius: 46px; border-radius: 46px; border-radius: 46px; color: #fff; } } /* ------------------- CALENDLY --------------------*/ .lmtWIHO_gkbTeeyuvoJC.mOUYF5ZmuNL6I7t0mSFg { background-color: transparent!important; } /* ------------------- PAGE LOADER --------------------*/ .page-loader { background: #fff; position: fixed; width: 100%; height: 100%; top: 0; left: 0; z-index: 99999999; } .page-loader .loader { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .page-loader svg { display: none; } .blobs { -webkit-filter: url(#goo); filter: url(#goo); width: 300px; height: 300px; position: relative; overflow: hidden; border-radius: 70px; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; } .blobs .blob-center { -webkit-transform-style: preserve-3d; transform-style: preserve-3d; position: absolute; background: #0e79c9; top: 50%; left: 50%; width: 30px; height: 30px; -webkit-transform-origin: left top; -ms-transform-origin: left top; transform-origin: left top; -webkit-transform: scale(0.9) translate(-50%, -50%); -ms-transform: scale(0.9) translate(-50%, -50%); transform: scale(0.9) translate(-50%, -50%); -webkit-animation: blob-grow linear 3.4s infinite; animation: blob-grow linear 3.4s infinite; border-radius: 50%; -webkit-box-shadow: 0 -10px 40px -5px #0e79c9; box-shadow: 0 -10px 40px -5px #0e79c9; } .blob { position: absolute; background: #0e79c9; top: 50%; left: 50%; width: 30px; height: 30px; border-radius: 50%; -webkit-animation: blobs ease-out 3.4s infinite; animation: blobs ease-out 3.4s infinite; -webkit-transform: scale(0.9) translate(-50%, -50%); -ms-transform: scale(0.9) translate(-50%, -50%); transform: scale(0.9) translate(-50%, -50%); -webkit-transform-origin: center top; -ms-transform-origin: center top; transform-origin: center top; opacity: 0; } .blob:nth-child(1) { -webkit-animation-delay: 0.2s; animation-delay: 0.2s; } .blob:nth-child(2) { -webkit-animation-delay: 0.4s; animation-delay: 0.4s; } .blob:nth-child(3) { -webkit-animation-delay: 0.6s; animation-delay: 0.6s; } .blob:nth-child(4) { -webkit-animation-delay: 0.8s; animation-delay: 0.8s; } .blob:nth-child(5) { -webkit-animation-delay: 1s; animation-delay: 1s; } @-webkit-keyframes blobs { 0% { opacity: 0; -webkit-transform: scale(0) translate(calc(-330px - 50%), -50%); transform: scale(0) translate(calc(-330px - 50%), -50%); } 1% { opacity: 1; } 35%, 65% { opacity: 1; -webkit-transform: scale(0.9) translate(-50%, -50%); transform: scale(0.9) translate(-50%, -50%); } 99% { opacity: 1; } 100% { opacity: 0; -webkit-transform: scale(0) translate(calc(330px - 50%), -50%); transform: scale(0) translate(calc(330px - 50%), -50%); } } @keyframes blobs { 0% { opacity: 0; -webkit-transform: scale(0) translate(calc(-330px - 50%), -50%); transform: scale(0) translate(calc(-330px - 50%), -50%); } 1% { opacity: 1; } 35%, 65% { opacity: 1; -webkit-transform: scale(0.9) translate(-50%, -50%); transform: scale(0.9) translate(-50%, -50%); } 99% { opacity: 1; } 100% { opacity: 0; -webkit-transform: scale(0) translate(calc(330px - 50%), -50%); transform: scale(0) translate(calc(330px - 50%), -50%); } } @-webkit-keyframes blob-grow { 0%, 39% { -webkit-transform: scale(0) translate(-50%, -50%); transform: scale(0) translate(-50%, -50%); } 40%, 42% { -webkit-transform: scale(1, 0.9) translate(-50%, -50%); transform: scale(1, 0.9) translate(-50%, -50%); } 43%, 44% { -webkit-transform: scale(1.2, 1.1) translate(-50%, -50%); transform: scale(1.2, 1.1) translate(-50%, -50%); } 45%, 46% { -webkit-transform: scale(1.3, 1.2) translate(-50%, -50%); transform: scale(1.3, 1.2) translate(-50%, -50%); } 47%, 48% { -webkit-transform: scale(1.4, 1.3) translate(-50%, -50%); transform: scale(1.4, 1.3) translate(-50%, -50%); } 52% { -webkit-transform: scale(1.5, 1.4) translate(-50%, -50%); transform: scale(1.5, 1.4) translate(-50%, -50%); } 54% { -webkit-transform: scale(1.7, 1.6) translate(-50%, -50%); transform: scale(1.7, 1.6) translate(-50%, -50%); } 58% { -webkit-transform: scale(1.8, 1.7) translate(-50%, -50%); transform: scale(1.8, 1.7) translate(-50%, -50%); } 68%, 70% { -webkit-transform: scale(1.7, 1.5) translate(-50%, -50%); transform: scale(1.7, 1.5) translate(-50%, -50%); } 78% { -webkit-transform: scale(1.6, 1.4) translate(-50%, -50%); transform: scale(1.6, 1.4) translate(-50%, -50%); } 80%, 81% { -webkit-transform: scale(1.5, 1.4) translate(-50%, -50%); transform: scale(1.5, 1.4) translate(-50%, -50%); } 82%, 83% { -webkit-transform: scale(1.4, 1.3) translate(-50%, -50%); transform: scale(1.4, 1.3) translate(-50%, -50%); } 84%, 85% { -webkit-transform: scale(1.3, 1.2) translate(-50%, -50%); transform: scale(1.3, 1.2) translate(-50%, -50%); } 86%, 87% { -webkit-transform: scale(1.2, 1.1) translate(-50%, -50%); transform: scale(1.2, 1.1) translate(-50%, -50%); } 90%, 91% { -webkit-transform: scale(1, 0.9) translate(-50%, -50%); transform: scale(1, 0.9) translate(-50%, -50%); } 92%, 100% { -webkit-transform: scale(0) translate(-50%, -50%); transform: scale(0) translate(-50%, -50%); } } @keyframes blob-grow { 0%, 39% { -webkit-transform: scale(0) translate(-50%, -50%); transform: scale(0) translate(-50%, -50%); } 40%, 42% { -webkit-transform: scale(1, 0.9) translate(-50%, -50%); transform: scale(1, 0.9) translate(-50%, -50%); } 43%, 44% { -webkit-transform: scale(1.2, 1.1) translate(-50%, -50%); transform: scale(1.2, 1.1) translate(-50%, -50%); } 45%, 46% { -webkit-transform: scale(1.3, 1.2) translate(-50%, -50%); transform: scale(1.3, 1.2) translate(-50%, -50%); } 47%, 48% { -webkit-transform: scale(1.4, 1.3) translate(-50%, -50%); transform: scale(1.4, 1.3) translate(-50%, -50%); } 52% { -webkit-transform: scale(1.5, 1.4) translate(-50%, -50%); transform: scale(1.5, 1.4) translate(-50%, -50%); } 54% { -webkit-transform: scale(1.7, 1.6) translate(-50%, -50%); transform: scale(1.7, 1.6) translate(-50%, -50%); } 58% { -webkit-transform: scale(1.8, 1.7) translate(-50%, -50%); transform: scale(1.8, 1.7) translate(-50%, -50%); } 68%, 70% { -webkit-transform: scale(1.7, 1.5) translate(-50%, -50%); transform: scale(1.7, 1.5) translate(-50%, -50%); } 78% { -webkit-transform: scale(1.6, 1.4) translate(-50%, -50%); transform: scale(1.6, 1.4) translate(-50%, -50%); } 80%, 81% { -webkit-transform: scale(1.5, 1.4) translate(-50%, -50%); transform: scale(1.5, 1.4) translate(-50%, -50%); } 82%, 83% { -webkit-transform: scale(1.4, 1.3) translate(-50%, -50%); transform: scale(1.4, 1.3) translate(-50%, -50%); } 84%, 85% { -webkit-transform: scale(1.3, 1.2) translate(-50%, -50%); transform: scale(1.3, 1.2) translate(-50%, -50%); } 86%, 87% { -webkit-transform: scale(1.2, 1.1) translate(-50%, -50%); transform: scale(1.2, 1.1) translate(-50%, -50%); } 90%, 91% { -webkit-transform: scale(1, 0.9) translate(-50%, -50%); transform: scale(1, 0.9) translate(-50%, -50%); } 92%, 100% { -webkit-transform: scale(0) translate(-50%, -50%); transform: scale(0) translate(-50%, -50%); } } /* ------------------- SITE HEADER --------------------*/ .site-header { position: absolute; width: 100%; left: 0; z-index: 9999; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .site-header .heder-inner { position: relative; } .site-header .heder-inner .site-logo a { display: block; max-width: 240px; } .site-header .heder-inner .site-logo a img { width: 100%; } .site-header .heder-inner .site-logo a .sticky-logo { display: none; } .site-header .heder-inner .site-nav { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .site-header .heder-inner .site-nav .menu-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: relative; } .site-header .heder-inner .site-nav .menu-wrapper:before { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.75); z-index: 99; opacity: 0; visibility: hidden; -webkit-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .site-header .heder-inner .site-nav .nav-right { margin-left: 50px; } .site-header .heder-inner .site-nav .nav-right.flexContainer { display: flex; gap: 1em; } @media (max-width: 991px) { .site-header .heder-inner .site-nav .nav-right.flexContainer { flex-direction: column; } } .site-header .heder-inner .site-nav .nav-right .nav-btn, .site-header .site-mobile-logo .nav-btn { background: #fff; -webkit-box-shadow: 0px 20px 30px 0px rgba(79, 35, 35, 0.15); box-shadow: 0px 20px 30px 0px rgba(79, 35, 35, 0.15); color: #0e79c9; display: inline-block; padding: 7px 37px; font-weight: 600; border-radius: 30px; font-size: 14px; border: 2px solid #fff; } .site-header .site-mobile-logo .nav-right { position: relative; right: 0; display: inline-block; float: right; } .site-header .heder-inner .site-nav .nav-right .nav-btn:hover { background: #219af6; border: 2px solid #0e79c9; color: #fff; } .site-header .heder-inner .site-nav.nav-two .nav-right .nav-btn { background: transparent; color: #fff; border: 2px solid #fff; -webkit-box-shadow: none; box-shadow: none; padding: 6px 37px; } .site-header .heder-inner .site-nav.nav-two .nav-right .nav-btn:hover { background: #fff; color: #7052fb; border-color: #fff; } .site-header .heder-inner .site-nav.nav-two .nav-right .nav-btn.style-two { background-color: rgba(255, 255, 255, 0.1); border-color: rgba(255, 255, 255, 0.3); color: #fff; padding: 9px 37px; } .site-header .heder-inner .site-nav.nav-two .nav-right .nav-btn.style-two:hover { background: #fff; color: #7052fb; } .site-header .heder-inner .site-nav.nav-two .site-main-menu li .sub-menu li a:hover, .site-header .heder-inner .site-nav.nav-two .site-main-menu li .sub-menu li a.current_page { color: #7052fb; } .site-header .site-mobile-logo { display: none; } .site-header .site-main-menu { margin: 0; padding: 0; list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; } .site-header .site-main-menu li { margin: 0 23px; position: relative; padding: 36px 0; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .site-header .site-main-menu li:last-child { margin-right: 0; } .site-header .site-main-menu li > a { color: #fff; font-size: 15px; font-weight: 500; position: relative; } .nav-light .site-main-menu li a, .nav-light .pricing-link a { color: #333; } .nav-light .toggle-menu .bar, .nav-mixed .toggle-menu .bar { background: #333; } .white-bar { left: 0; right: 0; position: fixed; z-index: 1040; -webkit-box-shadow: 0px 10px 20px 0px rgba(79, 35, 35, 0.08); box-shadow: 0px 10px 20px 0px rgba(79, 35, 35, 0.08); background: #fff; } .site-header .site-main-menu li > a:after, .site-header .pricing-link a:after, .site-header .site-main-menu li.feature-menu .sub-menu li.product-title a span:after { content: ''; position: absolute; bottom: -2px; width: 0; height: 1px; background: #fff; opacity: 1; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; left: 0; } .site-header.nav-light .site-main-menu li > a:after, .site-header.nav-light .pricing-link a:after, .site-header .site-main-menu li.feature-menu .sub-menu li.product-title a span:after { background: #0e79c9; } .site-header .pricing-link a:after { bottom: 38px; } .site-header .site-main-menu li > a:hover:after, .site-header .site-main-menu li > a span:hover:after, .site-header .pricing-link a:hover:after, .site-header .site-main-menu li > a.current_page:after { width: 100%; opacity: 1; } .site-header .site-main-menu li.menu-item-has-children:after { position: absolute; right: -18px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); font-family: eleganticons; font-size: 10px; font-weight: 700; color: #fff; font-size: 14px; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .site-header .site-main-menu li.menu-item-has-children:hover:after { color: #fa7070; } .site-header .site-main-menu li .sub-menu { /* display: block; */ margin: 0; padding: 13px 30px; list-style: none; background: #fff; -webkit-box-shadow: 0px 0px 36px 4px rgba(79, 35, 35, 0.1); box-shadow: 0px 0px 36px 4px rgba(79, 35, 35, 0.1); position: absolute; top: 110%; left: -96px; min-width: 252px; visibility: hidden; opacity: 0; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; z-index: 999999; border-radius: 10px; } .site-header .site-main-menu li.feature-menu .sub-menu { display: block; margin: 0; padding: 0px; } .site-header .site-main-menu li.feature-menu .sub-menu li { margin: 0 30px; } .site-header .site-main-menu li.feature-menu .sub-menu li.product-title { border-bottom: 1px solid #eee; margin: 0 0 10px; padding: 0 30px 10px; } .site-header .site-main-menu li.feature-menu .sub-menu li.product-title a { padding: 0 0 8px; color: #333; font-weight: 600; font-size: 16px; } .site-header .site-main-menu li.feature-menu .sub-menu li.product-title a span { color: #0e79c9; text-decoration: underline; font-weight: 400; font-size: 14px; } .site-header .site-main-menu li.solutions-menu .sub-menu li { margin: 0 40px; } .site-header .site-main-menu li .sub-menu:before { content: ''; border-left: 16px solid transparent; border-right: 16px solid transparent; border-bottom: 16px solid #fff; position: absolute; top: -8px; left: 50%; margin-left: -16px; } .site-header .site-main-menu li.resources-menu .sub-menu { min-width: 180px; } /* new Resources Menu */ .site-header .site-main-menu.new-compact-nav li.resources-menu.new-compact-styling .sub-menu { min-width: 180px; } .site-header .site-main-menu.new-compact-nav li.resources-menu.new-compact-styling .sub-menu.flex-menu { left: -324px !important; } .site-header .site-main-menu.new-compact-nav li.resources-menu.new-compact-styling .sub-menu::before { content: ''; border-left: 16px solid transparent; border-right: 16px solid transparent; border-bottom: 16px solid #fff; position: absolute; top: -15px; left: 50%; margin-left: -132px !important; } .site-header .site-main-menu.new-compact-nav li.resources-menu.new-compact-styling .sub-menu .left-menu, .site-header .site-main-menu.new-compact-nav li.resources-menu.new-compact-styling .sub-menu .left-menu { width: 360px; } /* end new resources menu */ li.resources-menu.new-compact-styling .sub-menu.flex-menu > .right-menu { width: 360px; padding: 0; border-radius: 10px; } .flex-menu-list.new-compact-list li.flex-menu-list-item:last-child { padding-bottom: 20px !important; } .site-header .site-main-menu li.product-menu .sub-menu { left: -112px; } .site-header .site-main-menu li.feature-menu .sub-menu { left: -515px; } @media (max-width: 1200px) { .site-header .site-main-menu li.feature-menu .sub-menu { top: 50px!important; left: -570px!important; transform: scale(0.85); } .site-header .site-main-menu li.feature-menu .sub-menu:before { margin-left: 58px!important; } } @media (max-width: 991px) { .site-header .site-main-menu li.feature-menu .sub-menu { top: auto!important; left: auto!important; transform: scale(1); } .site-header .site-main-menu li.feature-menu .sub-menu:before { margin-left: 58px!important; } } .site-header .site-main-menu li.feature-menu .sub-menu:before { margin-left: -17px; } .site-header .site-main-menu li.pricing-menu .sub-menu { left: -86px; min-width: 220px; } .site-header .site-main-menu li.solutions-menu .sub-menu { left: -310px; min-width: 680px; padding: 0; } .site-header .site-main-menu li.resources-menu .sub-menu { left: -55px; } .site-header .site-main-menu li.why-menu .sub-menu { left: -92px; min-width: 240px; } .site-header .site-main-menu li.about-menu .sub-menu { left: -60px; min-width: 180px; } .site-header .site-main-menu li.about-menu-light .sub-menu { left: -102px; } .site-header .site-main-menu li .sub-menu li { display: block; margin: 0; padding: 0; } .site-header .site-main-menu li .sub-menu li.menu-item-has-children:after { content: "\35"; right: 0px; color: #333; } .site-header .site-main-menu li .sub-menu li.menu-item-has-children .sub-menu { left: 105%; top: 0; visibility: hidden; opacity: 0; } .site-header .site-main-menu li .sub-menu li.menu-item-has-children:hover .sub-menu { top: -23px; visibility: visible; opacity: 1; } .site-header .site-main-menu li .sub-menu li { padding: 6px 0; color: #797687; font-size: 14px; font-weight: 400; } .site-header .site-main-menu li .sub-menu li a { display: inline-block; padding: 8px 0; color: #797687; font-size: 14px; font-weight: 400; } .site-header .site-main-menu li .sub-menu li a span { color: #333; font-size: 16px; font-weight: 600; } .site-header .site-main-menu li.solutions-menu .sub-menu li span { color: #333; font-size: 16px; font-weight: 600; } .site-header .site-main-menu li .sub-menu li a p { margin-top: 10px; line-height: 22px; } .site-header .site-main-menu li.solutions-menu .sub-menu li p { margin: 5px 0 0; line-height: 22px; } .site-header .site-main-menu li .sub-menu .menu-block li a { line-height: 12px; } .site-header .site-main-menu li .sub-menu .menu-block li a.mint-hover:hover { color: #37bc9b!important; } .site-header .site-main-menu li .sub-menu .menu-block li a.blue-hover:hover { color: #0e79c9!important; } .site-header .site-main-menu li .sub-menu li:first-child .product-title { margin-top: 0px; padding-top: 8px; border: none; } .site-header .site-main-menu li .sub-menu li .product-title { display: flex; align-items: center; margin-top: 10px; padding-top: 14px; border-top: 1px solid #f5f7fa; color: #7194b7!important; text-transform: uppercase; font-size: 14px; font-weight: 600; line-height: 20px!important; } .site-header .site-main-menu li .sub-menu li .product-title span { margin: 0; padding: 0; line-height: 20px; } .site-header .site-main-menu li .sub-menu .menu-block { float: left; width: 270px; padding: 20px 0; } .site-header .site-main-menu li .sub-menu .menu-block.perception { float: left; width: 275px; padding: 20px 0; } .site-header .site-main-menu li .sub-menu .menu-block.bys { float: left; width: 275px; padding: 20px 0; } .site-header .site-main-menu li .sub-menu .menu-block:last-child { margin-right: 0px; } .site-header .site-main-menu li.solutions-menu .sub-menu .menu-block { width: 340px; } .site-header .site-main-menu li .sub-menu .product-holder { padding: 10px 30px 10px!important; margin: 0 0 10px; background-color: #f8fafd; } .site-header .site-main-menu .menu-block .nav-heading { padding: 0px; font-weight: bold; font-size: 14px; } .site-header .site-main-menu li.feature-menu .sub-menu li.product-title a { display: flex; align-items: center; } .site-header .site-main-menu li.feature-menu .sub-menu li.product-title a .nav-flex { line-height: 24px; } /* .site-header .site-main-menu li .sub-menu .climate-culture:hover .product-holder { background-color: rgba(55,188,155,.15); } .site-header .site-main-menu li .sub-menu .learner-positioning:hover .product-holder { background-color: rgba(243,161,0,.15); } .site-header .site-main-menu li .sub-menu .strategic-planning:hover .product-holder { background-color: rgba(190,100,127,.15); } .site-header .site-main-menu li .sub-menu .toolbox:hover .product-holder { background-color: rgba(113,148,183,.15); } */ .site-header .site-main-menu li .sub-menu .feature-list img { -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .site-header .site-main-menu li .sub-menu .feature-list .nav-icon { display: flex; align-items: center; } .site-header .site-main-menu li .sub-menu .climate-culture:hover .product-holder a { color: #37bc9b!important; } .site-header .site-main-menu li .sub-menu .your-voice:hover .product-holder a { color: #967adc!important; } .site-header .site-main-menu li .sub-menu .learner-positioning:hover .product-holder a { color: #f3a100!important; } .site-header .site-main-menu li .sub-menu .strategic-planning:hover .product-holder a { color: #be647f!important; } .site-header .site-main-menu li .sub-menu .toolbox:hover .product-holder a { color: #7194b7!important; } .site-header .site-main-menu li .sub-menu .feature-list img { width: 25px; } .site-header .site-main-menu li .sub-menu .product-holder { position: relative; height: 76px; display: flex; align-items: center; } .site-header .site-main-menu li .sub-menu .feature-list:hover .product-holder:after { width: 100%; opacity: 1; } .site-header .site-main-menu li .sub-menu .product-holder:after { content: ''; position: absolute; bottom: -2px; width: 0; height: 1px; opacity: 1; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; left: 0; } .site-header .site-main-menu li .sub-menu .climate-culture .product-holder:after { background: #37bc9b; } .site-header .site-main-menu li .sub-menu .your-voice .product-holder:after { background: #967adc; } .site-header .site-main-menu li .sub-menu .learner-positioning .product-holder:after { background: #f3a100; } .site-header .site-main-menu li .sub-menu .strategic-planning .product-holder:after { background: #be647f; } .site-header .site-main-menu li .sub-menu .toolbox .product-holder:after { background: #7194b7; } .site-header .site-main-menu li .sub-menu .climate-culture a:hover { color: #37bc9b!important; } .site-header .site-main-menu li .sub-menu .your-voice a:hover { color: #967adc!important; } .site-header .site-main-menu li .sub-menu .learner-positioning a:hover { color: #f3a100!important; } .site-header .site-main-menu li .sub-menu .strategic-planning a:hover { color: #be647f!important; } .site-header .site-main-menu li .sub-menu .toolbox a:hover { color: #5d9cec!important; } .site-header .site-main-menu li .sub-menu .feature-list { border-right: 1px solid #f5f7fa; } .site-header .site-main-menu li.solutions-menu .sub-menu { text-align: center; } .site-header .site-main-menu li.solutions-menu .sub-menu .cta { display: inline-block; margin: 17px 0; padding: 14px 30px; border-radius: 30px; font-size: 15px; font-weight: 600; } .site-header .site-main-menu li.solutions-menu .sub-menu .cta.blue { border: 2px solid #0e79c9!important; color: #0e79c9!important; } .site-header .site-main-menu li.solutions-menu .sub-menu .cta.blue:hover { background-color: #0e79c9!important; border: 2px solid transparent!important; cursor: pointer; color: #fff!important; } .site-header .site-main-menu li .sub-menu .feature-list .cta { display: inline-block; margin-top: 5px; padding: 14px 30px; border-radius: 30px; font-size: 15px; font-weight: 600; } .site-header .site-main-menu li .sub-menu .feature-list .cta.yellow { border: 2px solid #f3a100!important; color: #f3a100!important; } .site-header .site-main-menu li .sub-menu .feature-list .cta.yellow:hover { background-color: #f3a100!important; border: 2px solid transparent!important; cursor: pointer; color: #fff!important; } .site-header .site-main-menu li .sub-menu .feature-list .cta.mint { border: 2px solid #37bc9b!important; color: #37bc9b!important; } .site-header .site-main-menu li .sub-menu .feature-list .cta.mint:hover { background-color: #37bc9b!important; border: 2px solid transparent!important; cursor: pointer; color: #fff!important; } .site-header .site-main-menu li .sub-menu .feature-list .cta.soft-blue { border: 2px solid #5d9cec!important; color: #5d9cec!important; } .site-header .site-main-menu li .sub-menu .feature-list .cta.soft-blue:hover { background-color: #5d9cec!important; border: 2px solid transparent!important; cursor: pointer; color: #fff!important; } .site-header .site-main-menu li .sub-menu .feature-list:last-child { border-right: none; border-left: 1px solid #f5f7fa; } .site-header .site-main-menu li .sub-menu .menu-block .product-title img { width: 40px; margin-right: 15px; } .site-header .site-main-menu li .sub-menu .menu-block span { /*padding-left: 44px;*/ } .site-header .site-main-menu li .sub-menu li a img { width: 30px; margin-right: 10px; } .site-header .site-main-menu li .sub-menu li a:after { display: none; } .site-header .site-main-menu li .sub-menu li a:hover, .site-header .site-main-menu li .sub-menu li a.current_page { color: #fa7070; } .site-header .site-main-menu li .sub-menu li a.current { color: #fa7070; font-weight: 600; } .site-header .site-main-menu li .sub-menu li a:hover { color: #0e79c9; } .site-header .site-main-menu li .sub-menu li:last-child a { border-bottom: 0; } .site-header .site-main-menu li:hover .sub-menu { opacity: 1; visibility: visible; top: 80px; } .site-header .nav-dark .site-main-menu li a { color: #2b2350; } .site-header .nav-dark .site-main-menu li a:after { display: none; } .site-header .nav-dark .site-main-menu li a:hover, .site-header .nav-dark .site-main-menu li a.current_page { color: #fa7070; } .site-header .nav-dark .site-main-menu li.menu-item-has-children:after { color: #2b2350; } .site-header .outline { border: 1px solid rgba(255,255,255,.55); padding: 10px 20px!important; margin: 20px 0 0px!important; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .pix-header-fixed .outline { color: #656d78!important; border: 1px solid rgba(51,51,51,.25); } .logo-sticky { display: none; } .pix-header-fixed { left: 0; right: 0; position: fixed; z-index: 1040; -webkit-box-shadow: 0px 10px 20px 0px rgba(79, 35, 35, 0.08); box-shadow: 0px 10px 20px 0px rgba(79, 35, 35, 0.08); -webkit-animation: stickySlideDown 0.65s cubic-bezier(0.23, 1, 0.32, 1) both; animation: stickySlideDown 0.65s cubic-bezier(0.23, 1, 0.32, 1) both; background: #fff; } .pix-header-fixed .heder-inner .site-logo { padding: 18px 0; } .pix-header-fixed .heder-inner .site-logo .logo-sticky { display: block; } .pix-header-fixed .heder-inner .site-logo .logo-main { display: none; } .site-header .pricing-link { margin: 0 0 0 46px; position: relative; padding: 36px 0; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .pix-header-fixed .heder-inner .site-nav .nav-right .nav-btn { background: transparent; color: #0e79c9; -webkit-box-shadow: none; box-shadow: none; border-color: #0e79c9; } .pix-header-fixed .heder-inner .site-nav .nav-right .nav-btn:hover { background: #219af6; color: #fff; } .pix-header-fixed .heder-inner .site-nav.nav-two .nav-right .nav-btn, .pix-header-fixed .heder-inner .site-nav.nav-two .nav-right .nav-btn.style-two { border-color: #7052fb; color: #7052fb; } .pix-header-fixed .heder-inner .site-nav.nav-two .nav-right .nav-btn:hover, .pix-header-fixed .heder-inner .site-nav.nav-two .nav-right .nav-btn.style-two:hover { background: #7052fb; color: #fff; border-color: #7052fb; } .pix-header-fixed .heder-inner .site-nav.nav-two .site-main-menu li a:hover, .pix-header-fixed .heder-inner .site-nav.nav-two .site-main-menu li a.current_page { color: #7052fb; } .pix-header-fixed .site-main-menu li { padding: 28px 0; } .pix-header-fixed .site-main-menu li.menu-item-has-children:after { color: #333; } .pix-header-fixed .site-main-menu li a, .pix-header-fixed .pricing-link a { color: #333!important; } .pix-header-fixed .site-main-menu li a:after { display: none; } .pix-header-fixed .site-main-menu li a:hover, .pix-header-fixed .site-main-menu li a.current_page { color: #fa7070; } .pix-header-fixed .site-main-menu li a:hover:before, .pix-header-fixed .site-main-menu li a:hover:after, .pix-header-fixed .site-main-menu li a.current_page:before, .pix-header-fixed .site-main-menu li a.current_page:after { background: #fa7070; } .pix-header-fixed .site-logo .main-logo { display: none; } .pix-header-fixed .site-logo .sticky-logo { display: block; } /* Back To Top */ .return-to-top { position: fixed; bottom: -30px; right: 20px; width: 42px; height: 42px; line-height: 42px; text-align: center; cursor: pointer; z-index: 998; border-radius: 50%; opacity: 0; -webkit-transition: bottom .5s ease, opacity .5s ease; -o-transition: bottom .5s ease, opacity .5s ease; transition: bottom .5s ease, opacity .5s ease; } .return-to-top:before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: transparent; opacity: 1; display: block; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; border-radius: inherit; -webkit-transition: opacity .6s ease, -webkit-transform .5s ease; transition: opacity .6s ease, -webkit-transform .5s ease; -o-transition: transform .5s ease, opacity .6s ease; transition: transform .5s ease, opacity .6s ease; transition: transform .5s ease, opacity .6s ease, -webkit-transform .5s ease; } .return-to-top:after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: block; background: rgba(0, 0, 0, 0.25); -webkit-box-shadow: 0px 0px 0px 0px transparent; box-shadow: 0px 0px 0px 0px transparent; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -webkit-transition: all .3s ease; -o-transition: all .3s ease; transition: all .3s ease; border-radius: inherit; } .return-to-top > i { position: relative; overflow: hidden; font-size: 12px; width: inherit; height: inherit; line-height: inherit; display: block; color: transparent; text-shadow: 0px 0px #fff, 0px 50px #fff; -webkit-transition: text-shadow .2s ease; -o-transition: text-shadow .2s ease; transition: text-shadow .2s ease; z-index: 1; } .return-to-top:hover:after { -webkit-transform: scale(1.07); -ms-transform: scale(1.07); transform: scale(1.07); background: #fa7070; -webkit-box-shadow: 0px 10px 20px 8px rgba(0, 0, 0, 0.15); box-shadow: 0px 10px 20px 8px rgba(0, 0, 0, 0.15); } .return-to-top:hover > i { text-shadow: 0px -50px #fff, 0px 0px #fff; } .return-to-top.back-top { bottom: 20px; opacity: 1; } .mask-overlay { position: fixed; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); z-index: 3333; top: 0; left: 0; } .close-menu { display: none; } .home-color-two .return-to-top:hover:after { -webkit-transform: scale(1.07); -ms-transform: scale(1.07); transform: scale(1.07); background: #7052fb; -webkit-box-shadow: 0px 10px 20px 8px rgba(0, 0, 0, 0.15); box-shadow: 0px 10px 20px 8px rgba(0, 0, 0, 0.15); } .home-color-two .return-to-top:hover > i { text-shadow: 0px -50px #fff, 0px 0px #fff; } @media (max-width: 1200px) { .site-header .heder-inner .site-logo a { max-width: 190px; } .site-header .site-main-menu li { margin: 0 15px; } .site-header .pricing-link { margin: 0 0 0 40px; } .site-header .heder-inner .site-nav .nav-right { margin-left: 25px; } .site-header .heder-inner .site-nav .nav-right .nav-btn, .site-header .site-mobile-logo .nav-btn { padding: 7px 20px; } .site-header .site-main-menu li.feature-menu .sub-menu { left: -364px; } .site-header .site-main-menu li.feature-menu .sub-menu:before { margin-left: -145px; } .site-header .site-main-menu li .sub-menu:before { left: 49%; } } /* NAV MEDIA QUERY */ @media (max-width: 991px) { .site-header .heder-inner { text-align: center; padding: 15px 0; } .site-header .heder-inner .site-nav .nav-right { margin-left: 15px; } .site-header .heder-inner .site-nav .nav-right .nav-btn { padding: 8px 22px; } .site-header .site-mobile-logo { display: block; } .site-header .site-main-menu li { margin: 0 15px; } .site-header .site-logo { display: none; } .site-header.header-two.toggle-light .toggle-menu .bar { background: #fff; } .site-header .site-main-menu li .sub-menu .feature-list .cta.yellow, .site-header .site-main-menu li .sub-menu .feature-list .cta.mint, .site-header .site-main-menu li .sub-menu .feature-list .cta.soft-blue { margin-top: 12px; padding: 15px 30px; } .site-header .site-main-menu li.solutions-menu .sub-menu { text-align: left; } .site-header .site-main-menu li.solutions-menu .sub-menu .cta.blue { width: 308px; margin: 10px 30px 20px; } .site-header .site-main-menu li .sub-menu .menu-block.bys { padding: 0 0 20px; } .site-header .site-nav { position: fixed; width: 370px !important; height: 100vh; background: #fff; top: 0; left: -100%; display: block !important; -webkit-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; overflow: scroll; -webkit-box-shadow: 0 20px 30px rgba(0, 0, 0, 0.1); box-shadow: 0 20px 30px rgba(0, 0, 0, 0.1); } .site-header .site-nav .site-main-menu { display: block; width: 100%; padding-bottom: 50px; text-align: left; } .site-header .site-nav .site-main-menu li { padding: 0; margin: 0; border-bottom: 1px solid #f1f2f3; } .site-header .site-nav .site-main-menu li:first-child { border-top: 1px solid #f1f2f3; } .site-header .site-nav .site-main-menu li a { display: block; color: #333; padding: 15px 30px; font-weight: 600; font-size: 18px; } .site-header .site-nav .site-main-menu li a:after { display: none; } .site-header .site-nav .site-main-menu li.menu-item-has-children { position: relative; } .site-header .site-nav .site-main-menu li.menu-item-has-children:after { display: none !important; } .site-header .site-nav .site-main-menu li.menu-item-has-children a:hover, .site-header .site-nav .site-main-menu li.menu-item-has-children:focus { color: #0e79c9; } .site-header .site-nav .site-main-menu li.menu-item-has-children i { position: absolute; top: 12px; right: 35px; } .site-header .site-nav .site-main-menu li.menu-item-has-children .sub-menu { position: static; -webkit-box-shadow: none; box-shadow: none; opacity: 1; width: auto; visibility: visible; background: transparent; padding: 0; -webkit-transition: none; -o-transition: none; transition: none; display: flex; flex-direction: column; } .site-header .site-nav .site-main-menu li.menu-item-has-children .sub-menu li { padding: 8px 0; } .site-header .site-nav .site-main-menu li.menu-item-has-children .sub-menu li:first-child { border-top: 1px solid #f1f2f3; } li.border-lined { height: auto!important; } li.border-lined p { margin-bottom: 0; } .sub-menu.flex-menu > .left-menu { width: 375px!important; border-right: none!important; padding: 0 40px 0 0!important } .site-header .site-main-menu .solutions-menu li.grey-box { margin: 5px 3px 5px 5px !important; padding: 20px 40px !important; height: auto; background-color: #fff; border-radius: 0; } .site-header .site-main-menu .solutions-menu li.border-box-left, .site-header .site-main-menu .solutions-menu li.border-box-right { margin: 0 0 10px !important; padding: 20px !important; margin-left: 30px !important; height: auto; background-color: #fff; border: 1px solid #eee; } .site-header .site-main-menu .solutions-menu li.border-box-left:last-child, .site-header .site-main-menu .solutions-menu li.border-box-right:last-child { border-bottom: 1px solid #eee !important; } .site-header .site-main-menu .solutions-menu li.border-box-left p, .site-header .site-main-menu .solutions-menu li.border-box-right p { margin-bottom: 0; } .site-header .site-main-menu li .sub-menu:before { display: none; } .sub-menu.flex-menu .flex-menu-list-item { padding: 0 30px 20px !important; } .sub-menu.flex-menu .flex-menu-list-item p { margin-bottom: 0!important; } .site-header .site-nav .site-main-menu li.menu-item-has-children .sub-menu li:last-child { border-bottom: none; padding-bottom: 0; } .site-header .site-nav .site-main-menu li.menu-item-has-children .sub-menu li a { color: #888888; font-weight: 400; padding: 10px 35px 10px 45px; } .site-header .site-nav .site-main-menu li.feature-menu .sub-menu li a { color: #888888; font-weight: 400; padding: 15px 0px 15px 20px; } .site-header .site-nav .site-main-menu li.solutions-menu .sub-menu li a { color: #888888; font-weight: 400; padding: 0px!important; } .site-header .site-main-menu li.feature-menu .sub-menu li.product-title { margin: 0; padding: 0 30px 0px; border-bottom: none; } .site-header .site-main-menu li.feature-menu .sub-menu li.product-title a { padding: 15px 0px 5px; } .site-header .site-nav .site-main-menu li.menu-item-has-children .solutions-menu .sub-menu li a { color: #888888; font-weight: 400; padding: 5px 35px 5px 45px; } .site-header .site-nav .site-main-menu li.menu-item-has-children .sub-menu li.menu-item-has-children .sub-menu { opacity: 1; visibility: visible; position: relative; left: 0; top: auto; } .site-header .site-nav .site-main-menu li.menu-item-has-children .sub-menu li.menu-item-has-children .sub-menu li a { padding-left: 60px; } .site-header .site-nav .site-main-menu li.menu-item-has-children .sub-menu li.menu-item-has-children:after { content: "\33"; color: #fff; } .site-header .site-nav .nav-right { position: absolute; bottom: -15px; left: 15px; } .site-header .site-nav .nav-right .nav-btn { padding: 7px 37px!important; background: transparent; color: #fa7070; -webkit-box-shadow: none!important; box-shadow: none!important; border-color: #0e79c9!important; } .site-header .site-nav.nav-two .site-main-menu li.menu-item-has-children:hover, .site-header .site-nav.nav-two .site-main-menu li.menu-item-has-children:focus { color: #7052fb; } .site-header .site-nav.nav-two .site-main-menu li.menu-item-has-children:hover:after, .site-header .site-nav.nav-two .site-main-menu li.menu-item-has-children:focus:after { color: #7052fb; } .site-header .site-nav.nav-two .site-main-menu li.menu-item-has-children a:hover, .site-header .site-nav.nav-two .site-main-menu li.menu-item-has-children a:focus { color: #7052fb; } .site-header.header-two .toggle-menu .bar { background: #2b2350; } .heder-inner .site-mobile-logo img { max-height: 30px; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .pix-header-fixed .toggle-menu { top: 30px; } .pix-header-fixed .toggle-menu .bar { background: #333; } .pix-header-fixed .site-main-menu li a { color: #fff; } .pix-header-fixed .site-main-menu li.menu-item-has-children:after { color: #fff; } .pix-header-fixed .heder-inner .site-logo { padding: 12px 0; } .pix-header-fixed.header-two.toggle-light .toggle-menu .bar { background: #000; } .sidebar-open .site-header .site-nav { left: 0; } .sidebar-open .menu-wrapper:before { opacity: 1; visibility: visible; } .close-menu { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; top: 0; text-align: right; width: 100%; left: 0; padding: 2px; padding: 30px 20px; } .close-menu i { font-size: 36px; color: #2b2350; } .close-menu span { font-size: 15px; } .toggle-menu { position: absolute; left: 0; width: 26px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); display: block; height: 24px; } .toggle-menu .bar { width: 18px; height: 2px; display: block; float: left; margin: 3px auto; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; background: #fff; } .toggle-menu .bar:nth-child(2) { width: 24px; } .header-dark .toggle-menu .bar { background: #2b2350; } .site-header .site-main-menu li .sub-menu .menu-block { float: none; height: auto; width: auto; padding: 0; border: none; } .site-header .site-main-menu li .sub-menu li .product-title { padding-left: 8px!important; } .site-header .site-main-menu li .sub-menu .menu-block img { width: 20px; } .site-header .site-main-menu li .sub-menu .menu-block span { padding-left: 0; } .site-header .site-main-menu li .sub-menu .product-holder { margin: 0; } .site-nav .language-custom-select { display: none; } .mobile-language { display: block!important; position: absolute!important; top: 6px; right: 0; transform: scale(0.8); } .pix-header-fixed .heder-inner .mobile-language .select-selected { -webkit-box-shadow: none; box-shadow: none; border: 2px solid #e6e9ed; } .pix-header-fixed .heder-inner .mobile-language .select-arrow-active { border: 2px solid #0e79c9; } .left-panel { text-align: center; } /* FLEX MENU - Resources nav */ .sub-menu.flex-menu { flex-direction: column; } .box-content > .image-wrapper { display: none; } .sub-menu.flex-menu > .right-menu { width: auto !important; padding: 20px 30px 30px !important; } .box-content > .content-wrapper > a { padding: 0 !important; } /* MOBILE MENU - Remove content */ .site-header .site-nav .site-main-menu li.menu-item-has-children .sub-menu.mobile-no-menu { display: none; } .site-header .site-nav .site-main-menu li.solutions-menu .sub-menu.mobile-no-menu ul { display: none; } .site-header .site-nav .site-main-menu li.feature-menu .sub-menu.mobile-no-menu ul li { display: none; } .site-header .site-nav .site-main-menu li.feature-menu .sub-menu.mobile-no-menu ul li.product-title { display: block; } .site-header .site-nav .site-main-menu li.feature-menu .sub-menu.mobile-no-menu ul li.product-title a { padding: 15px 0px; } .site-header .site-main-menu li.solutions-menu .sub-menu.mobile-no-menu .cta.blue { margin-top: 0; } .site-header .site-main-menu li .sub-menu .menu-block.perception, .site-header .site-main-menu li .sub-menu .menu-block.bys { float: none; height: auto; width: auto; border: none; margin: 0; padding: 0; border-bottom: none; } .site-header .site-nav .site-main-menu li.resources-menu .sub-menu.mobile-no-menu .right-menu { display: none!important; } .site-header .site-nav .site-main-menu li.resources-menu .sub-menu.mobile-no-menu .left-menu { padding: 0!important; } .site-header .site-nav .site-main-menu li.resources-menu .sub-menu.mobile-no-menu ul li.flex-menu-list-item { padding: 15px 30px !important; } } @media (max-width: 420px) { .site-header .site-nav { width: 100% !important; } } /* ------------------- SECTIONS --------------------*/ section { position: relative; padding: 100px 0; } .section-title .title { font-size: 36px; font-weight: 400; line-height: 1.4; } .section-title h3 { margin: 0; font-size: 1.75rem; font-weight: 300; line-height: 1.4; } .section-title .sub-heading { font-size: 18px; line-height: 30px; margin-top: 28px; } .section-title p { margin: 1em auto; font-size: 18px; line-height: 30px; } section h1.section-intro { margin-top: 0; margin-bottom: 80px; font-size: 28px; font-weight: 300; line-height: 40px; } section .overlay-bg { position: absolute; right: 0; top: 0; z-index: -1; } section .scroll-circle { position: absolute; bottom: -48%; right: 0; top: 40%; z-index: 1; } section .scroll-circle img { width: 1500px; zoom: 1; filter: alpha(opacity=25); opacity: 0.25; } /* ------------------- HERO BANNERS --------------------*/ .banner { position: relative; padding-top: 150px; } .product-icon-title { display: inline-flex; margin-bottom: 20px; } .product-icon-title img { position: relative; margin-right: 15px; } .banner .banner-content { position: relative; z-index: 10; } .banner-content .subtitle { margin-bottom: 30px; font-size: 20px; line-height: 40px; } #home .banner-title { font-size: 62px; line-height: 74px; } #home .banner-content-wrapper-six .subtitle { font-size: 24px; line-height: 40px; } .banner .banner-content .banner-title { margin-bottom: 0; font-size: 50px; line-height: 60px; } .banner .banner-content .home-title { font-size: 42px; line-height: 50px; } .banner .banner-content .large-title { font-size: 62px; line-height: 70px; } .site-header .heder-inner .site-logo-lp a img { width: 100%; padding: 18px 0; } .site-header .heder-inner .site-logo-lp a img { width: 100%; padding: 18px 0; } .pix-header-fixed .heder-inner .site-logo-lp { padding: 0; } @media (max-width: 1200px) { .banner .banner-content .large-title { font-size: 52px; line-height: 60px; } } @media (max-width: 991px) { .heder-inner .site-mobile-logo .logo-lp img { max-height: none; width: 150px; } } @media (max-width: 768px) { .banner .banner-content .large-title { margin-top: 50px; } } .banner .banner-content i { display: block; margin-bottom: 20px; font-size: 50px; } .banner .banner-content .banner-title span { font-weight: 300; } .banner .banner-content .description { font-size: 18px; font-weight: 400; line-height: 30px; margin-bottom: 47px; } .banner .banner-content .large-description { font-size: 22px; font-weight: 400; line-height: 32px; margin-bottom: 47px; } .banner .banner-content .banner-btn { padding: 10px 40px; background-color: #fff; border: 2px solid #fff; border-radius: 30px; font-size: 18px; font-weight: bold; display: inline-block; } .banner .banner-content .banner-btn:hover { background: #219af6; border: 2px solid #0e79c9; color: #fff!important; box-shadow: none!important; } .cta-btn { padding: 10px 40px; border-radius: 30px; font-size: 18px; font-weight: normal; display: inline-block; border: 2px solid transparent; } .banner .banner-content .cta-btn:hover { background-color: #90d248!important; } .cta-btn-white { margin-bottom: 10px; padding: 10px 40px; background-color: #fff; border-radius: 30px; border: 2px solid rgba(255,255,255,.5); font-size: 18px; font-weight: bold; display: inline-block; color: #8cc152; -webkit-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.1); -moz-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.1); box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.1); } .yellow-grad .cta-btn-white:hover { background-color: #f3a100; color: #fff; border: 2px solid rgba(255,255,255,1); } .cta-btn.yellow-bg:hover { background-color: #fff!important; color: #f3a100!important; border: 2px solid #f3a100!important; } .cta-btn.green-bg:hover { background-color: #fff!important; color: #8cc152!important; border: 2px solid #8cc152!important; } .cta-btn.mint-bg:hover { background-color: #fff!important; color: #37bc9b!important; border: 2px solid #37bc9b!important; } .cta-btn.white-bg:hover { background-color: transparent!important; color: #fff!important; border: 2px solid #fff!important; } .revolutionize .cta-btn-white:hover { background-color: #90d248!important; color: #fff; } .cta-btn-white i.fa { display: inline-block; margin: 0 0 0 5px; font-size: 16px; } .banner .circle-shape { position: absolute; top: -14%; left: -13%; } .banner .circle-shape img { width: 1300px; zoom: 1; filter: alpha(opacity=25); opacity: 0.25; } .banner .banner-content .list { margin-bottom: 40px; padding-left: 20px; font-size: 16px; font-weight: 400; color: #fff; line-height: 23px; } .banner .banner-content .list li { margin-bottom: 10px; } .banner .banner-button-container { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .banner .banner-btn:hover { -webkit-box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.2)!important; box-shadow: 0px 10px 20px 0px rgba(0, 0, 0, 0.2)!important; color: #fa7070!important; } .product-banner .bg-shape { margin-top: -200px; } .background-map { height: 100%; width: 100%; position: absolute; z-index: -1; top: 15px; left: 0; background-position: center center; background-repeat: no-repeat; } .feature-hero, .page-banner { overflow: hidden; } .error-hero { background: #fdf8f8; text-align: center; height: 550px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; overflow: hidden; } .error-hero .page-title { font-size: 50px; font-weight: 800; color: #2b2350; position: relative; z-index: 2; max-width: 820px; margin: 30px auto 20px; } .error-hero .large { margin-top: 10px; font-size: 20px; line-height: 32px; } .feature-hero .aside-stripes { position: absolute; top: 0px; left: 0px; width: 800px; height: 100%; -webkit-transform: skewY(-4deg); transform: skewY(-4deg); -webkit-transform-origin: bottom left; transform-origin: bottom left; z-index: 1; filter: alpha(opacity=50); opacity: 0.5; z-index: 1; } .feature-hero .aside-stripes-bg { width: 800px; height: 730px; background-repeat: no-repeat; position: absolute; top: 0px; left: 0px; -webkit-transform: skewY(-4deg); transform: skewY(-4deg); -webkit-transform-origin: bottom left; transform-origin: bottom left; z-index: 1; filter: alpha(opacity=50); opacity: 0.5; z-index: 1; } .feature-hero .aside-stripes-yellow { background-image: url(./../assets/images/features/yellow-shape.svg?w=800); } @media (max-width: 991px) { .hide-bullets-mobile { list-style: none; } .interface .interface-left .interface-content, .interface .interface-content { width: 100%; text-align: center!important; } } @media (max-width: 590px) { .standalone h4 { margin: 0!important; line-height: 36px; } } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .feature-hero .aside-stripes-yellow { background-image: url(./../assets/images/features/yellow-shape.svg?w=1600); } } .feature-hero .aside-stripes-mint { background-image: url(./../assets/images/features/mint-shape.svg?w=800); } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .feature-hero .aside-stripes-mint { background-image: url(./../assets/images/features/mint-shape.svg?w=1600); } } .feature-hero .aside-stripes-purple { background-image: url(./../assets/images/features/purple-triangles.svg?w=800); } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .feature-hero .aside-stripes-purple { background-image: url(./../assets/images/features/purple-triangles.svg?w=1600); } } .feature-hero .aside-stripes-blue { background-image: url(./../assets/images/features/grey-blue-shape.svg?w=800); } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .feature-hero .aside-stripes-blue { background-image: url(./../assets/images/features/grey-blue-shape.svg?w=1600); } } .feature-hero .aside-stripes-purple-alt { background-image: url(./../assets/images/features/purple-shape.svg?w=800); } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .feature-hero .aside-stripes-purple-alt { background-image: url(./../assets/images/features/purple-shape.svg?w=1600); } } .feature-hero:before, .feature-hero:after, .page-banner:before, .page-banner:after { content: ""; position: absolute; width: 100%; height: 100%; bottom: 0; left: 0; } .feature-hero:after { background-size: cover!important; background-position: bottom left!important; background-repeat: no-repeat; top: 0; z-index: 1; } .page-banner:after { background-size: contain!important; background-position: bottom left!important; background-repeat: no-repeat; top: 0; z-index: 1; } .feature-hero:after { background-image: url(./../assets/images/features/shape.png?w=1040); } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .feature-hero:after { background-image: url(./../assets/images/features/shape.png?w=2080); } } .page-banner:after { background-image: url(./../assets/images/media/background/hero-curve.png?w=960); } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .page-banner:after { background-image: url(./../assets/images/media/background/hero-curve.png?w=1920); } } .page-banner { padding: 150px 0 150px; text-align: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; overflow: hidden; } .page-banner .circle { position: absolute; top: -51%; left: -15%; z-index: 1; } .page-banner .animate-ball { position: absolute; height: 100%; width: 100%; margin: 0; padding: 0; list-style: none; top: 0; left: 0; } .page-banner .animate-ball .ball { background: #fdf1f1; border-radius: 50%; position: absolute; opacity: 0.10; filter: alpha(opacity=10); } .webinar-banner .animate-ball .ball { background: #fdf1f1; border-radius: 50%; position: absolute; opacity: 0.10; filter: alpha(opacity=10); background-color: #fff; } .animate-ball .ball:nth-child(1) { height: 50px; width: 50px; top: 37%; left: 10%; -webkit-animation: zoommd 1.5s infinite alternate; animation: zoommd 1.5s infinite alternate; } .animate-ball .ball:nth-child(2) { height: 70px; width: 70px; bottom: 22%; right: 8%; -webkit-animation: bounce 4s infinite alternate; animation: bounce 4s infinite alternate; } .animate-ball .ball:nth-child(3) { height: 100px; width: 100px; bottom: 43%; right: 22%; -webkit-animation: zoommd 1.5s infinite alternate; animation: zoommd 1.5s infinite alternate; } .animate-ball .ball:nth-child(4) { height: 40px; width: 40px; bottom: 20%; right: 32%; -webkit-animation: movexy 1.5s infinite alternate; animation: movexy 1.5s infinite alternate; } .animate-ball .ball:nth-child(5) { height: 500px; width: 500px; top: -75%; right: 100px; -webkit-animation: wave 3s 0.1s infinite linear; animation: wave 3s 0.1s infinite linear; } @media (max-width: 1200px) { .feature-hero .aside-stripes, .feature-hero .aside-stripes-bg { left: -50px; width: 650px; } } @media (max-width: 991px) { .product-banner .bg-shape { margin-top: -100px; } .feature-hero .aside-stripes, .feature-hero .aside-stripes-bg { left: -10px; width: 650px; } } @media (max-width: 768px) { .banner .banner-content { text-align: center; } .product-banner .bg-shape { margin-top: 0; } .banner .circle-shape { display: none; } .feature-hero .aside-stripes, .feature-hero .aside-stripes-bg { top: 20px; left: -50px; width: 600px; } } /* ------------------- BANNER TWO --------------------*/ .banner.banner-two { height: 800px; padding-top: 20px; overflow: hidden; background-image: -o-linear-gradient(150deg, rgb(55, 188, 155) 0%, rgb(72, 207, 173) 100%); background-image: linear-gradient(-60deg, rgb(55, 188, 155) 0%, rgb(72, 207, 173) 100%); overflow-x: hidden; } .banner.banner-two .vector-bg { position: absolute; left: -190px; bottom: 0; width: 115%; height: 100%; } .banner.banner-two .vector-bg img { width: 100%; height: 100%; } .banner.banner-two .banner-content-wrap { -webkit-transform: translateY(37%); -ms-transform: translateY(37%); transform: translateY(37%); } @media (max-width: 1600px) { .banner.banner-two .animate-promo-mockup { width: 550px; height: 530px; } .banner.banner-two .animate-promo-mockup img:nth-child(3) { right: -160px; } .banner.banner-two .animate-promo-mockup img:nth-child(5) { left: 62%; } .banner.banner-two .animate-promo-mockup img:nth-child(6) { right: -10px; width: 230px; } .banner.banner-two .animate-promo-mockup img:nth-child(7) { right: -60px; width: 99px; } } @media (max-width: 1440px) { .banner.banner-two { height: 890px; } .banner.banner-two .vector-bg { height: 890px; } .banner.banner-two .vector-bg img { height: 890px; } .banner.banner-two .banner-content-wrap { -webkit-transform: translateY(50%); -ms-transform: translateY(50%); transform: translateY(50%); } .banner.banner-two .banner-content .banner-title { font-size: 50px; line-height: 60px; } .banner.banner-two .animate-promo-mockup { width: 480px; height: 470px; } .banner.banner-two .animate-promo-mockup img:nth-child(1) { left: 85px; } .banner.banner-two .animate-promo-mockup img:nth-child(2) { width: 85px; } .banner.banner-two .animate-promo-mockup img:nth-child(3) { right: -135px; width: 61px; } .banner.banner-two .animate-promo-mockup img:nth-child(4) { left: 65px; width: 150px; } .banner.banner-two .animate-promo-mockup img:nth-child(5) { left: 62%; } .banner.banner-two .animate-promo-mockup img:nth-child(6) { right: -5px; width: 210px; } .banner.banner-two .animate-promo-mockup img:nth-child(7) { right: -45px; width: 90px; } } @media (min-width: 992px) and (max-width: 1200px) { .banner.banner-two .banner-content .banner-title { font-size: 40px; line-height: 50px; } .banner.banner-two .banner-content p br { display: none; } .banner.banner-two .animate-promo-mockup { width: 380px; height: 400px; } .banner.banner-two .animate-promo-mockup img:nth-child(1) { left: 65px; } .banner.banner-two .animate-promo-mockup img:nth-child(2) { width: 65px; } .banner.banner-two .animate-promo-mockup img:nth-child(3) { right: -100px; width: 50px; } .banner.banner-two .animate-promo-mockup img:nth-child(4) { left: 55px; width: 125px; bottom: 30px; } .banner.banner-two .animate-promo-mockup img:nth-child(5) { left: 55%; width: 40px; } .banner.banner-two .animate-promo-mockup img:nth-child(6) { right: -3px; width: 180px; bottom: 8px; } .banner.banner-two .animate-promo-mockup img:nth-child(7) { right: -35px; width: 70px; bottom: 50px; } .banner.banner-two .vector-bg { left: -198px; width: 120%; } } @media (max-width: 1200px) { .banner.banner-two { height: 840px; } .banner.banner-two .vector-bg { height: 840px; } .banner.banner-two .vector-bg img { height: 840px; } } @media (max-width: 991px) { .pix-order-2 { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; } .banner.banner-two .banner-six-promo-image { text-align: center!important; } .banner.banner-two .banner-six-promo-image img { width: 400px; } .banner.banner-two { height: auto; padding: 100px 0!important; } .banner.banner-two .vector-bg { height: 100%; left: 0; width: 100%; } .banner.banner-two .vector-bg img { height: 100%; } .banner.banner-two .banner-content-wrap { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } .banner.banner-two .banner-content { margin-top: 40px; text-align: center; } .banner.banner-two .banner-content .banner-title { font-size: 40px; line-height: 50px; } .banner.banner-two .banner-content p br { display: none; } .banner.banner-two .animate-promo-mockup { width: 380px; height: 380px; margin: 0 auto; } .banner.banner-two .animate-promo-mockup img:nth-child(1) { left: 65px; } .banner.banner-two .animate-promo-mockup img:nth-child(2) { width: 65px; } .banner.banner-two .animate-promo-mockup img:nth-child(3) { right: -100px; width: 50px; } .banner.banner-two .animate-promo-mockup img:nth-child(4) { left: 55px; width: 125px; bottom: 30px; } .banner.banner-two .animate-promo-mockup img:nth-child(5) { left: 55%; width: 40px; } .banner.banner-two .animate-promo-mockup img:nth-child(6) { right: -3px; width: 180px; bottom: 8px; } .banner.banner-two .animate-promo-mockup img:nth-child(7) { right: -35px; width: 70px; bottom: 50px; } } @media (max-width: 768px) { .banner.banner-two { height: 840px; } .banner.banner-two .banner-content .banner-title { font-size: 32px; line-height: 40px; } .banner.banner-two .banner-content .description { font-size: 16px; } .banner.banner-two .banner-content-wrap { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } .banner.banner-two .animate-promo-mockup { width: 360px; height: 370px; } .banner.banner-two .animate-promo-mockup img:nth-child(1) { left: 65px; } .banner.banner-two .animate-promo-mockup img:nth-child(2) { width: 65px; } .banner.banner-two .animate-promo-mockup img:nth-child(3) { right: -100px; width: 50px; } .banner.banner-two .animate-promo-mockup img:nth-child(4) { left: 55px; width: 125px; bottom: 30px; } .banner.banner-two .animate-promo-mockup img:nth-child(5) { left: 55%; width: 40px; } .banner.banner-two .animate-promo-mockup img:nth-child(6) { right: -3px; width: 170px; bottom: 13px; } .banner.banner-two .animate-promo-mockup img:nth-child(7) { right: -35px; width: 67px; bottom: 50px; } } @media (max-width: 480px) { .banner.banner-two { height: 840px; } .banner.banner-two .banner-content-wrap { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } .banner.banner-two .animate-promo-mockup { width: 300px; height: 325px; margin-top: 20px; } .banner.banner-two .animate-promo-mockup img:nth-child(1) { left: 30px; } .banner.banner-two .animate-promo-mockup img:nth-child(2) { width: 40px; } .banner.banner-two .animate-promo-mockup img:nth-child(3) { right: -30px; width: 30px; bottom: 130px; } .banner.banner-two .animate-promo-mockup img:nth-child(4) { left: 20px; width: 80px; bottom: 56px; } .banner.banner-two .animate-promo-mockup img:nth-child(5) { left: 49%; width: 30px; bottom: 45px; } .banner.banner-two .animate-promo-mockup img:nth-child(6) { right: 20px; width: 140px; bottom: 30px; } .banner.banner-two .animate-promo-mockup img:nth-child(7) { right: -5px; width: 50px; bottom: 70px; } } /* ------------------- PIE CHARTS --------------------*/ .b-skills { text-align: center; } .b-skills:last-child { margin-bottom: -30px; } .b-skills h2 { margin-bottom: 50px; font-weight: 900; text-transform: uppercase;} .skill-item { position: relative; max-width: 250px; width: 100%; margin: 0 auto; color: #555; } .chart-container { position: relative; width: 100%; height: 0; padding-top: 100%; margin-bottom: 27px; } .skill-item .chart, .skill-item .chart canvas { position: absolute; top: 0; left: 0; width: 100% !important; height: 100% !important; } .skill-item .chart:before { content: ""; width: 0; height: 100%; } .skill-item .chart:before, .skill-item .percent { display: inline-block; vertical-align: middle; } .skill-item .percent { position: relative; line-height: 1; font-size: 40px; font-weight: 900; z-index: 2; } .skill-item .percent:after { content: attr(data-after); font-size: 20px; } /* ------------------- HOME IMAGES --------------------*/ section .pulse-triangle { padding: 0 15%; } section .bubble-holder { position: relative; } section .bubble-holder .rounded-holder { position: relative; padding: 20px; background-color: #fff; border: 1px solid #eee; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } section .bubble-holder .overlap-screen { position: relative; top: -50px; left: 50px; } section .screen-holder { position: relative; width: 100%; } section .rounded-corners { -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } section .screen-holder img { position: absolute; width: 55%; } section .screen-holder .screen2 { transform: translateX(35%) translateY(35%); } section .screen-holder .screen3 { transform: translateX(70%) translateY(70%); } section .screen-holder .group-screen { transform: translateX(36%) translateY(40%); } /* ------------------- HOME PRODUCT BLOCKS --------------------*/ .product-block .img-right { padding-left: 70px; } .product-block .img-left { padding-right: 70px; } .icon-holder { display: flex; align-items: center; } .icon-holder h3 { margin: 0 0 0 10px; padding: 0; font-size: 20px; line-height: 26px; } .icon-holder img, .icon-holder h3 { } @media (max-width: 991px) { .product-block .img-right { margin-top: 120px; padding-left: 20px; } .product-block .img-left { margin-top: 120px; padding-right: 20px; } } @media (max-width: 768px) { .product-block .img-right { margin-top: 20px; padding-left: 0px; } .product-block .img-left { margin-top: 20px; padding-right: 0px; } .video-placeholder { padding: 100px 0 0!important; } .video-placeholder .video-hide { display: none; } } /* ------------------- PRODUCT ICONS --------------------*/ .culture-climate-icon { position: relative; display: inline-block; width: 60px; height: 60px; margin-bottom: 12px; background-color: #44b598; border-radius: 50%; overflow: hidden; } .culture-climate-icon .heart-bottom { position: absolute; top: 20px; left: 18px; width: 51px; } .culture-climate-icon .heart-top { position: absolute; top: -6px; right: 17px; width: 51px; } .your-voice-icon { position: relative; display: inline-block; width: 60px; height: 60px; margin-bottom: 12px; background-color: #876ccc; border-radius: 50%; overflow: hidden; } .your-voice-icon i { position: relative; top: -4px; left: 13px; font-size: 60px; } .learner-positioning-icon { position: relative; display: inline-block; width: 60px; height: 60px; margin-bottom: 12px; background-color: #fece56; border-radius: 50%; border: 8px solid #fece56; overflow: hidden; } .learner-positioning-icon .block-1 { position: absolute; bottom: -50px; left: -5px; width: 20px; height: 50px; background-color: #ce7c39; } .learner-positioning-icon .block-2 { position: absolute; bottom: -50px; left: 15px; width: 16px; height: 50px; background-color: #ef9e22; } .learner-positioning-icon .block-3 { position: absolute; bottom: -50px; left: 31px; width: 16px; height: 50px; background-color: #fff; } .learner-positioning-icon .height-1 { bottom: -30px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .learner-positioning-icon .height-2 { bottom: -22px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .learner-positioning-icon .height-3 { bottom: -5px; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .strategic-planning-icon { position: relative; display: inline-block; width: 60px; height: 60px; margin: 0 0 12px; border-radius: 50%; background-color: transparent; overflow: hidden; } .strategic-planning-icon .progress-circle { position: relative; display: inline-block; width: 60px; height: 60px; margin: 0 0 12px; overflow: hidden; background-color: transparent; } .progress-circle.progress-37:after { background-image: linear-gradient(90deg,#e288a4 50%,transparent 50%,transparent),linear-gradient(223.2deg,#bf647f 50%,#e288a4 50%,#e288a4); } .strategic-planning-icon .magnifying-glass { position: absolute; top: 46px; left: 46px; width: 44px; z-index: 1000; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .strategic-planning-icon .move-icon { top: 11px; left: 11px; } /* ------------------- SCHOOL LOGOS BANNER --------------------*/ .school-logo-banner { padding: 50px 0 60px; } .school-logo-banner h4 { margin: 0 0 5px; font-size: 20px; font-weight: 400; } .school-logos { height: 80px; padding: 0 4%; -webkit-filter: grayscale(100%); /* Ch 23+, Saf 6.0+, BB 10.0+ */ filter: grayscale(100%); /* FF 35+ */ zoom: 1; filter: alpha(opacity=25); opacity: 0.25; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; cursor: pointer; } .school-logos:hover { -webkit-filter: grayscale(0%); /* Ch 23+, Saf 6.0+, BB 10.0+ */ filter: grayscale(0%); /* FF 35+ */ filter: alpha(opacity=100); opacity: 1; } .integrations-logos { height: 80px; padding: 0 4%; zoom: 1; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; cursor: pointer; } @media (max-width: 1080px) { .school-logos { height: 70px; } } @media (max-width: 991px) { .school-logos { height: 70px; } } @media (max-width: 900px) { .school-logos { height: 60px; } } @media (max-width: 820px) { .school-logos { padding: 0 3%; } } @media (max-width: 800px) { .school-logos { height: 60px; margin-bottom: 20px; } } @media (max-width: 751px) { .school-logo-banner h4 { margin: 45px 0 35px; } } @media (max-width: 735px) { .school-logo-banner h4 { margin: 45px 0 35px; } } @media (max-width: 698px) { .school-logo-banner h4 { margin: 45px 0 35px; } .school-logos { padding: 0 6%; } } @media (max-width: 590px) { .school-logo-banner h4 { margin: 80px 0 35px; } } @media (max-width: 485px) { .school-logo-banner h4 { margin: 110px 0 20px; } .school-logos { padding: 0 4%; } } @media (max-width: 429px) { .school-logo-banner .container-fluid { padding-left: 0; padding-right: 0; } .school-logo-banner h4 { height: 55px; margin: 145px 0 20px; } } @media (max-width: 405px) { .school-logo-banner .container-fluid { padding-left: 0; padding-right: 0; } .school-logo-banner h4 { margin: 10px 0 20px; } } /* ------------------- CARDS --------------------*/ .card-container { position: relative; margin: 15px 0; padding: 20px; background-color: #fff; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; text-align: center; } .card-container i { font-size: 50px; color: #8a9fb4; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .card-container h3 { margin: 10px 0; font-size: 18px; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .card-container:hover { transform: scale(1.03); box-shadow: 0px 28px 70px -7px rgba(0,0,0, 0.25); cursor: pointer; } .purple-hover:hover i { color: #bf657f!important; } .yellow-hover:hover i { color: #f3a100!important; } .mint-hover:hover i { color: #37bc9b!important; } .zoom-bubble img { -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .pulse-modules a { text-decoration: none!important; } .no-link-modules .card-container { cursor: default; } .no-link-modules .card-container:hover { transform: scale(1); box-shadow: none; } .no-link-modules a { color: #7f858f; } /* ------------------- MORE FEATURES --------------------*/ .more_features { padding: 130px 0 150px; } .more_features .section-title { margin-bottom: 30px; } .more_features .media { margin-top: 50px; } .more_features .media .media-left { padding: 0px 30px 0px 20px; } .more_features .media .media-left i { font-size: 50px; background: -moz-linear-gradient(150deg,#2655d6 15%,#32adfb 70%,#32adfb 94%); background: -webkit-linear-gradient(150deg,#2655d6 15%,#32adfb 70%,#32adfb 94%); background: linear-gradient(150deg,#2655d6 15%,#32adfb 70%,#32adfb 94%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2655d6', endColorstr='#268cd3',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ -webkit-background-clip: text; -webkit-text-fill-color: transparent; } *::-ms-backdrop, .more_features .media .media-left i { background: none!important; color: #0e7cdc!important; } /* IE11 */ .more_features .media .media-body h2 { margin: 0 0 15px; font-weight: 400; font-size: 19px; line-height: 28px; -webkit-transition: all 0.4s linear; -o-transition: all 0.4s linear; transition: all 0.4s linear; } .exclusive_features .media .media-left i { color: #b166ff; -webkit-text-fill-color: initial; } .exclusive_features .media:hover h2 { color: #b166ff; -webkit-text-fill-color: initial; } .exclusive_features-two .media .media-left i { color: #8675ff; -webkit-text-fill-color: initial; } .exclusive_features-two .media:hover h2 { color: #8675ff; -webkit-text-fill-color: initial; } @media (max-width: 1200px) { .more_features .media { margin-top: 40px; } .more_features .media .media-left { padding: 0px 15px; } .more_features .media .media-left i { font-size: 40px; } } /* ------------------- FEATURES POINTS --------------------*/ .feature-points .panel-group { text-align: left; } .feature-points .faq-img { text-align: center; } .feature-points .faq-img img { max-width: 100%; } .feature-points .faq_accordian_two { padding-top: 50px; } @media (max-width: 991px) { .feature-points .faq-img { padding-top: 50px; } .feature-points video { margin-bottom: 30px; } } .faq-inner-accordion { margin-bottom: 0px; } .faq-inner-accordion .panel { border-radius: 0px; border: 0px; -webkit-box-shadow: none; box-shadow: none; position: relative; background-color: transparent; } .faq-inner-accordion .panel:before { content: ''; width: 1px; height: 92%; position: absolute; top: 5px; left: 60px; background: #f1f1f1; } .faq-inner-accordion .panel .panel-heading { padding: 0px; background: transparent; } .faq-inner-accordion .panel .panel-heading .panel-title { margin-bottom: 0; } .faq-inner-accordion .panel .panel-heading .panel-title a { display: block; color: #1a264a; position: relative; padding-left: 88px; padding-bottom: 15px; padding-top: 15px; font-size: 20px; font-weight: 600; cursor: pointer; } .faq-inner-accordion .panel .panel-heading .panel-title a i { font-size: 16px; width: 35px; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; text-align: center; display: inline-block; line-height: 35px; -webkit-transition: all 0.6s linear; -o-transition: all 0.6s linear; transition: all 0.6s linear; position: absolute; left: 0; top: 8px; font-weight: bold; } .faq-inner-accordion .panel .panel-heading .panel-title a i:before { padding-left: 2px; } .faq-inner-accordion .panel .panel-heading .panel-title a:hover { text-decoration: none; } .faq-inner-accordion .panel .panel-heading .panel-title a i.minus { display: inline-block; background-color: #0e7cdc; color: #fff; } .faq-inner-accordion .panel .panel-heading .panel-title a i.plus { display: none; background-color: #f5f7fa; color: #333; } .show-mobile { display: block!important; visibility: visible!important; } .grey-bg .faq-inner-accordion .panel .panel-heading .panel-title a i.plus { background-color: #fff; color: #333; } .faq-inner-accordion .panel .panel-heading .panel-title a.collapsed .plus { display: inline-block; } .faq-inner-accordion .panel .panel-heading .panel-title a.collapsed .minus { display: none; } .faq-inner-accordion .panel .panel-body { border-top: 0px; line-height: 28px; padding: 0px 40px 26px 88px; } .accordion-left { padding-left: 100px; } .accordion-left .panel .panel-body { padding: 0px 0px 26px 88px; } .faq-inner-accordion .panel + .panel { margin-top: 20px; } .feature-points .product-slide { margin-top: 20px; } .feature-points .feature-img { position: relative; width: 660px; max-width: none; margin: 50px 0 30px; } @media (max-width: 1199px) { .feature-points .feature-img { left: -130px; } } @media (max-width: 991px) { .feature-points .feature-img { left: -320px; } } @media (max-width: 768px) { .feature-points .product-slide img { max-width: 479px!important; margin: 0 auto 40px!important; } .feature-points .feature-img { position: relative; width: auto; max-width: 100%; left: auto; margin: 30px 0 0; } .feature-points .flex-height { margin-top: 10px; } } @media (max-width: 550px) { .feature-points .product-slide img { max-width: 100%!important; } } /* ------------------- SLICK SLIDER --------------------*/ .slider h4 { margin: 0 0 10px; } .slick-prev:before, .slick-next:before { background-color: rgb(255, 255, 255); border: 0px; border-radius: 50%; cursor: pointer; display: block; font-size: 9px; line-height: 1; transition: color 400ms, box-shadow 400ms; height: 4.44444em; width: 4.44444em; box-shadow: rgba(0, 0, 0, 0.1) 0px 0.222222em 0.888889em; position: absolute; bottom: 0px; margin-bottom: auto; margin-top: auto; top: 0px; } .slick-arrow { z-index: 8; height: 40px; width: 40px; } .slider i.li-chevron-right, .slider i.li-chevron-left { position: relative; color: #333; font-size: 13px; font-weight: bold; } .slick-prev.slick-disabled i, .slick-next.slick-disabled i { opacity: .25; } .slider-nav { position: absolute; top: 44%; left: 0; width: 100%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); z-index: 999; } .slider-nav .slider-prev, .slider-nav .slider-next { height: 100px; width: 40px; text-align: center; line-height: 100px; background: rgba(0, 0, 0, 0.5); position: absolute; cursor: pointer; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .slider-nav .slider-prev i, .slider-nav .slider-next i { font-size: 30px; color: #fff; } .slider-nav .slider-prev:hover, .slider-nav .slider-next:hover { background: #fa7070; } .slider-nav .slider-next { right: 0; } .slider-nav .slider-prev { left: 0; } @media (max-width: 768px) { .slick-dots { display: none!important; } .slick-slide { text-align: center; } } /* ------------------- ICON CARDS --------------------*/ .stat-block span { font-size: 50px; line-height: 50px; } .icon-box-wrapper { border-radius: 4px; border: 1px solid #e6e9ed; padding: 40px 40px 30px; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; position: relative; overflow: hidden; background-color: #fff; z-index: 2; } .icon-box-wrapper .layer { position: absolute; top: -100%; left: 0; width: 100%; z-index: -1; -webkit-transition: all 0.6s ease-in-out; -o-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; } .icon-box-wrapper .iapp-icon-box-icon { position: relative; margin-bottom: 44px; height: 80px; } .icon-box-wrapper .iapp-icon-box-icon .circle { position: absolute; top: 20px; left: 20px; width: 60px; height: 60px; filter: alpha(opacity=20); opacity: 0.2; } @media (max-width: 768px) { .icon-box-wrapper .iapp-icon-box-icon { margin-bottom: 20px; } } .icon-box-wrapper .iapp-icon-box-icon i { font-size: 60px; color: #0e79c9; } .icon-box-wrapper .icon-style i { color: #333!important; } .icon-box-wrapper .icon-box-content .icon-box-title { font-size: 21px; font-weight: 500; margin-bottom: 20px; line-height: 30px; color: #333; } .icon-box-wrapper .icon-box-content .icon-box-title strong { font-weight: 500; } @media (min-width: 1200px) { .icon-box-wrapper .icon-box-content .icon-box-title { font-size: 19px; } } .icon-box-wrapper .icon-box-content .icon-box-title a { color: #2b2350; } .icon-box-wrapper .icon-box-content .icon-box-title a.header-link { color: #0e79c9; } .icon-box-wrapper .icon-box-content .icon-box-title a:hover { color: #fa7070; } .icon-box-wrapper .icon-box-content p { margin-bottom: 22px; } .icon-box-wrapper:hover { -webkit-box-shadow: 0px 40px 60px 0px rgba(79, 35, 35, 0.14); box-shadow: 0px 40px 60px 0px rgba(79, 35, 35, 0.14); } .icon-box-wrapper:hover .layer { top: 0; } .icon-box-wrapper .icon-box-icon { height: 60px; width: 60px; line-height: 60px; text-align: center; border: 2px solid #8cc152; color: #8cc152; font-size: 22px; border-radius: 50%; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; margin-bottom: 42px; } .icon-box-wrapper:hover .icon-box-icon { -webkit-box-shadow: 0px 20px 30px 0px rgba(75, 42, 222, 0.2); box-shadow: 0px 20px 30px 0px rgba(75, 42, 222, 0.2); background: #8cc152; color: #fff; } .manage-interventions .col-md-6 { position: relative; z-index: 2; } .tailored .scroll-bg-circle, .manage-interventions .scroll-bg-circle { position: absolute; bottom: -48%; z-index: 1; } .tailored .icon-box-wrapper { border-radius: 6px; background-color: white; padding: 40px 50px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; position: relative; border: 1px solid #e6e9ed; z-index: 22; -webkit-box-align: initial; -ms-flex-align: initial; align-items: initial; -webkit-box-shadow: none; box-shadow: none; } .iapp-icon-box-icon { width: 70px; margin-right: 30px; margin-bottom: 0; } .icon-box-wrapper .iapp-icon-box-icon i { font-size: 60px; color: #0e79c9; } .icon-box-content { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .icon-box-content p { margin: 0; } /* ------------------- BLOG --------------------*/ #blog-grid { padding: 72px 0 90px; } #blog-grid .feature-image a, .blog-float .feature-image a { display: block; position: relative; overflow: hidden; } .blog-float .feature-image a { height: 180px; } #blog-grid .feature-image a img, .blog-float .feature-image a img { -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; width: 100%; -webkit-border-top-left-radius: 6px; -webkit-border-top-right-radius: 6px; -moz-border-radius-topleft: 6px; -moz-border-radius-topright: 6px; border-top-left-radius: 6px; border-top-right-radius: 6px; } #blog-grid .feature-image a:before, .blog-float .feature-image a:before { content: ''; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.3); opacity: 0; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; z-index: 22; } #blog-grid .feature-image a:hover:before, .blog-float .feature-image a:hover:before { opacity: 1; } #blog-grid .feature-image a:hover img, .blog-float .feature-image a:hover img { -webkit-transform: scale(1.05); -ms-transform: scale(1.05); transform: scale(1.05); } .blog-post { border-radius: 6px; background-color: white; -webkit-box-shadow: 0px 6px 14px 0px rgba(43, 35, 79, 0.1); box-shadow: 0px 6px 14px 0px rgba(43, 35, 79, 0.1); overflow: hidden; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; margin-bottom: 30px; } .blog-post:hover { -webkit-box-shadow: 0px 30px 60px 0px rgba(43, 35, 79, 0.12); box-shadow: 0px 30px 60px 0px rgba(43, 35, 79, 0.12); } .blog-content { position: relative; padding: 30px 40px; background: #fff; z-index: 2; } .blog-content .cta-btn.blue-bg:hover { background-color: #219af6!important; } .blog-content .blog-header { display: flex; align-items: center; margin-bottom: 20px; } .blog-content .blog-header img { margin-right: 20px; height: 60px; } .blog-float .blog-content { padding: 20px 30px 20px; } .blog-content .post-meta { margin: 0; padding: 0; list-style: none; } .blog-content .post-meta li { display: inline-block; margin-right: 30px; position: relative; } .blog-content .post-meta li:not(:last-child):after { position: absolute; content: ''; right: -18px; top: 7px; width: 2px; height: 14px; background: #9997a3; } .blog-content .post-meta li i { margin-right: 5px; color: #fa7070; } .blog-content .post-meta li a { color: #797687; font-size: 15px; font-weight: 500; text-transform: uppercase; } .blog-content .post-meta li a:hover { color: #fa7070; } .blog-content .entry-title { margin: 0; font-size: 20px; line-height: 30px; font-weight: 400; } .blog-content .entry-title strong { font-weight: 600; } .blog-content .entry-title a { color: #222; } .blog-content .entry-title a:hover { color: #fa7070; } .blog-content .read-more-ntn { font-size: 12px; font-weight: 600; color: #fa7070; text-transform: uppercase; display: -webkit-box; display: -ms-flexbox; display: flex; } .blog-content .read-more-ntn i { font-size: 10px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-left: 5px; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .blog-content .read-more-ntn:hover { color: #f83f3f; } .blog-content .read-more-ntn:hover i { margin-left: 8px; } .post-author { font-size: 16px; font-weight: 500; color: #656177; } .post-author img { border-radius: 50%; margin-right: 20px; } .post-author:hover { color: #7052fb; } /* ------------------- SOLUTIONS --------------------*/ .solution-details h3 { margin-top: 20px; font-size: 16px; } /* ------------------- CASE STUDIES --------------------*/ .case-studies { display: none; } .video-post .hickman-mills-video { background-image: url(./../assets/images/media/case-study/hickman-mills-video-thumb.jpg?w=480); border: 1px solid rgba(55,188,155,0.5); } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .video-post .hickman-mills-video { background-image: url(./../assets/images/media/case-study/hickman-mills-video-thumb.jpg?w=960); } } .video-post .rock-falls-video { background-image: url(./../assets/images/media/blog/covers/the-benefits-of-a-continuous-feedback-culture.jpg?w=480); } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .video-post .rock-falls-video { background-image: url(./../assets/images/media/blog/covers/the-benefits-of-a-continuous-feedback-culture.jpg?w=960); } } .video-post .dawson-county-video { background-image: url(./../assets/images/media/case-study/dawson-county-video-thumb.jpg?w=480); } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .video-post .dawson-county-video { background-image: url(./../assets/images/media/case-study/dawson-county-video-thumb.jpg?w=960); } } .video-post .niles-middle-school-video { background-image: url(./../assets/images/media/blog/covers/importance-of-sel-in-the-secondary-classroom.jpg?w=480); } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .video-post .niles-middle-school-video { background-image: url(./../assets/images/media/blog/covers/importance-of-sel-in-the-secondary-classroom.jpg?w=960); } } .video-post .dodge-county-video { background-image: url(./../assets/images/media/blog/covers/make-culture-and-climate-data-count.jpg?w=480); } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .video-post .dodge-county-video { background-image: url(./../assets/images/media/blog/covers/make-culture-and-climate-data-count.jpg?w=960); } } .video-post .lksd-img { background-image: url(./../assets/images/media/testimonial/lksd.jpg?w=420); } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .video-post .lksd-img { background-image: url(./../assets/images/media/testimonial/lksd.jpg?w=840); } } .video-post .building-belonging-video { height: 330px !important; background-image: url(./../assets/images/building-belonging/building-belonging-thumb.jpg?w=480); } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .video-post .building-belonging-video { background-image: url(./../assets/images/building-belonging/building-belonging-thumb.jpg?w=960); } } .blog-post .video-post .video-bg { height: 250px; margin: 0 0 30px; border-radius: 10px; background-size: cover; background-repeat: no-repeat; background-position: center; } .blog-label { position: absolute; top: 20px; padding: 5px 10px; -webkit-border-top-right-radius: 4px; -webkit-border-bottom-right-radius: 4px; -moz-border-radius-topright: 4px; -moz-border-radius-bottomright: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; color: #fff; z-index: 1; } /* ------------------- CASE STUDIES --------------------*/ .video-post .sel-lessons { background-image: url(./../assets/images/features/sel/sel-lesson-video-thumb.jpg?h=480); } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .video-post .sel-lessons { background-image: url(./../assets/images/features/sel/sel-lesson-video-thumb.jpg?h=960); } } /* ------------------- TESTIMONIALS --------------------*/ .swiper-button-prev, .swiper-container-rtl .swiper-button-next, .swiper-button-next, .swiper-container-rtl .swiper-button-prev { background-image: none; } .swiper-button-prev, .swiper-container-rtl .swiper-button-next, .swiper-button-next, .swiper-container-rtl .swiper-button-prev { background-color: #fff; width: 50px; height: 50px; border-radius: 50%; box-shadow: 3px 3px 3px 0px rgba(0, 0, 0, 0.1); color: #0e79c9; border: 1px solid #0e79c9; } .swiper-button-prev:hover, .swiper-container-rtl .swiper-button-next:hover, .swiper-button-next:hover, .swiper-container-rtl .swiper-button-prev:hover { background-color: #0e79c9; color: #fff; border: 1px solid #0e79c9; } .ei-arrow_right::before, .ei-icon_arrow_right::before, .ei-arrow_left::before, .ei-icon_arrow_left::before { position: relative; top: 7px; left: 12px; font-size: 24px; } .ei-icon_arrow_right::before, .ei-icon_arrow_left::before { position: relative; top: 14px; left: 12px; font-size: 24px; } .swiper-button-next { right: 6%; } .swiper-button-prev { left: 6%; } .testimonials { background: #fdf8f8; padding: 116px 0 0; overflow: hidden; } .testimonials .scroll-circle { bottom: 35%; right: -133px; } .testimonial-wrapper { padding: 0 100px 160px; position: relative; z-index: 22; } .testimonial-wrapper .shape-shadow { border-radius: 10px; background-color: white; opacity: 0.4; -webkit-box-shadow: 0px 60px 100px 0px rgba(102, 74, 74, 0.2); box-shadow: 0px 60px 100px 0px rgba(102, 74, 74, 0.2); height: 100px; max-width: 54%; position: absolute; bottom: 120px; width: 100%; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .testimonial-wrapper .slider-nav .swiper-button-next, .testimonial-wrapper .slider-nav .swiper-button-prev { color: #bdb4b4; font-size: 36px; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; outline: 0; } .testimonial-wrapper .slider-nav .swiper-button-next:hover, .testimonial-wrapper .slider-nav .swiper-button-prev:hover { color: #fa7070; } .testimonial-wrapper .slider-nav .swiper-button-next { right: 20px; } .testimonial-wrapper .slider-nav .swiper-button-prev { left: 20px; } .testimonial-container .testimonial-mask { border-top-left-radius: 10px; border-bottom-left-radius: 10px; background-size: cover; background-repeat: no-repeat; background-position: center; } .testimonial-container .lksd { background-image: url(./../assets/images/media/testimonial/lksd.jpg?w=480); } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .video-post .lksd { background-image: url(./../assets/images/media/testimonial/lksd.jpg?w=960); } } .testimonial-container .sel-case-study { background-image: url(./../assets/images/media/testimonial/sel-case-study.jpg?w=480); } .testimonial-container .universal-case-study { background-image: url(./../assets/images/media/testimonial/niels-testimonial.png?w=480); } .testimonial-container .bys-testimonial-1 { background-image: url(./../assets/images/services/BYS-image-2-min.png?w=480); } .testimonial-container .reducing-threats-1 { background-image: url(./../assets/images/reducing-threats/hickman-mills-logo.jpg?w=480); background-size: contain; background-color: #d5dce6; } @media screen and (min-width: 1000px) { .testimonial-container .reducing-threats-1 { background-size: cover } } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .testimonial-container .sel-case-study { background-image: url(./../assets/images/media/testimonial/sel-case-study.jpg?w=960); } } .post .sel-case-study { background-image: url(./../assets/images/media/blog/covers/what-is-inclusion-in-education.jpg?w=480); } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .post .sel-case-study { background-image: url(./../assets/images/media/blog/covers/what-is-inclusion-in-education.jpg?w=960); } } .testimonial-container .dawson-county { background-image: url(./../assets/images/media/case-study/dawson-county-video-thumb.jpg?w=420); } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .testimonial-container .dawson-county { background-image: url(./../assets/images/media/case-study/dawson-county-video-thumb.jpg?w=840); } } #testimonial { border-radius: 10px; max-width: 770px; margin: 0 auto; position: relative; -webkit-box-shadow: 0px 60px 100px 0px rgba(79, 35, 35, 0.1); box-shadow: 0px 60px 100px 0px rgba(79, 35, 35, 0.1); background: #fff; width: 100%; } #testimonial .testimonial { text-align: center; margin: 0 auto; padding: 60px; position: relative; } #testimonial .testimonial .testimonial-content { max-width: 630px; margin: 0 auto 30px; } #testimonial .testimonial .testimonial-content p { color: #656177; font-size: 20px; margin: 0; line-height: 38px; } #testimonial .testimonial-stars { margin-bottom: 20px; font-size: 24px; color: #f3a100; } #testimonial .testimonial .single-bio-thumb { max-width: 80px; margin: 0 auto 41px; -webkit-box-shadow: 0px 20px 30px 0px rgba(79, 35, 35, 0.2); box-shadow: 0px 20px 30px 0px rgba(79, 35, 35, 0.2); border-radius: 50%; } #testimonial .testimonial .single-bio-thumb img { border-radius: 50%; } #testimonial .testimonial .bio-info .name { font-size: 20px; line-height: 32px; margin: 0; } .testimonials-two { position: relative; overflow: hidden; } .testimonials-two .section-title { margin-bottom: 50px; } .testimonials-two .animate-shape { position: absolute; right: -9%; top: -37%; } .testimonials-two .animate-shape.custom-district{ position: absolute; right: 9%; top: -45%; } .testimonials-two .animate-shape.custom-district img{ max-width: 150% !important; width: 150% !important; } #testimonial-wrapper { position: relative; z-index: 2; } #testimonial-wrapper .slider-nav .swiper-button-prev, #testimonial-wrapper .slider-nav .swiper-button-next { outline: 0; } #testimonial-wrapper .slider-nav .swiper-button-prev i, #testimonial-wrapper .slider-nav .swiper-button-next i { font-size: 32px; } #testimonial-wrapper .slider-nav .swiper-button-prev:hover, #testimonial-wrapper .slider-nav .swiper-button-next:hover { color: #fff; } #testimonial-wrapper .slider-nav .swiper-button-next { right: -100px; } #testimonial-wrapper .slider-nav .swiper-button-prev { left: -100px; } .testimonials-two, .testimonials-two-about { padding: 116px 0 60px; } .testimonials-two .swiper-container, .testimonials-two-about .swiper-container { padding: 0 20px 100px; } .testimonials-two { background: #f8fafd; } .testimonial-two .testi-content-inner { overflow: hidden; position: relative; background: #fff; -webkit-box-shadow: 0px 30px 20px 0px rgba(43, 35, 79, 0.05); box-shadow: 0px 30px 20px 0px rgba(43, 35, 79, 0.05); border-radius: 10px; padding: 50px 60px; } .testimonial-two .testimonial-bio { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 43px; } .avatar .avatar-label-chip { position: absolute; padding: 4px 12px; background-color: #0B2945; color: #F9FAFA; border-radius: 4px; bottom: 20px; left: 20px; } .testimonial-two .testimonial-bio .avatar { height: 70px; width: 70px; border-radius: 50%; margin-right: 30px; } .testimonial-two .testimonial-bio .avatar img { border-radius: 50%; } .testimonial-two .testimonial-bio .bio-info .name { font-size: 20px; font-weight: 600; margin-top: 0; margin-bottom: 5px; color: #333; } .testimonial-two .testimonial-bio .bio-info .name strong { font-weight: 600; } .testimonial-two .testimonial-content { margin-bottom: 35px; } .testimonial-two .testimonial-content p { font-size: 18px; line-height: 30px; margin: 0; } .testimonial-two .shape-shadow { border-radius: 10px; background-color: white; opacity: 0.4; -webkit-box-shadow: 0px 20px 50px 0px rgba(102, 74, 74, 0.2); box-shadow: 0px 20px 50px 0px rgba(102, 74, 74, 0.2); height: 100px; max-width: 81%; position: absolute; bottom: -40px; width: 100%; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); z-index: -1; } .testimonial-two .quote { position: absolute; right: 60px; width: 107px; height: 66px; } .testimonial-two .quote { background-image: url(./../assets/images/media/testimonial/quote.png?w=107); background-size: contain; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .testimonial-two .quote { background-image: url(./../assets/images/media/testimonial/quote.png?w=214); } } .testimonials-two.help-districts { padding-bottom: 100px !important; } .testimonials-two.help-districts > .custom-district > .paralax-icon { opacity: 0.7; } .testimonial-tag p, .testimonial-tag img { display: inline-block; } .testimonial-tag p { position: relative; top: 2px; margin-left: 5px; margin-bottom: 0; color: #aab2bd; } .rating { margin: 0; padding: 0; list-style: none; } .rating li { display: inline-block; font-size: 18px; color: #fdae04; } #testimonial-wrapper-three { max-width: 1150px; margin: 0 auto; position: relative; } #testimonial-wrapper-three .quote { position: absolute; bottom: 80px; right: 80px; z-index: 1; } #testimonial-wrapper-three .swiper-container { padding: 0 45px 80px; } .testimonials-three .testimonial-container { margin: 0 auto; position: relative; padding: 0 45px 80px; overflow: hidden!important; list-style: none; z-index: 1; } .single-case-study .testimonial-container { margin: 0 auto; position: relative; padding: 0 0 80px!important; overflow: hidden!important; list-style: none; z-index: 1; } .testimonials-three .quote { position: absolute; bottom: 0px; right: 80px; z-index: 1; } .testimonials-three .swiper-container .quote { bottom: 0px!important; } #testimonial-wrapper-three .slider-nav { width: 90px; top: auto; bottom: 100px; left: 50%; height: 40px; } #testimonial-wrapper-three .slider-nav .swiper-button-prev { height: 25px; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; outline: 0; } #testimonial-wrapper-three .slider-nav .swiper-button-prev .arrow { margin-top: 12px; width: 25px; height: 2px; background: #bdb4b4; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #testimonial-wrapper-three .slider-nav .swiper-button-prev .arrow:after { content: ''; position: absolute; width: 15px; height: 2px; top: 7px; left: -2px; background-color: #bdb4b4; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #testimonial-wrapper-three .slider-nav .swiper-button-prev .arrow:before { content: ''; position: absolute; width: 15px; height: 2px; top: 17px; left: -2px; background-color: #bdb4b4; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #testimonial-wrapper-three .slider-nav .swiper-button-prev:hover { width: 40px; left: -15px; } #testimonial-wrapper-three .slider-nav .swiper-button-prev:hover .arrow { width: 40px; background: #fa7070; } #testimonial-wrapper-three .slider-nav .swiper-button-prev:hover .arrow:before, #testimonial-wrapper-three .slider-nav .swiper-button-prev:hover .arrow:after { background: #fa7070; } #testimonial-wrapper-three .slider-nav .swiper-button-next { height: 25px; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #testimonial-wrapper-three .slider-nav .swiper-button-next .arrow { margin-top: 12px; width: 25px; height: 2px; background: #bdb4b4; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #testimonial-wrapper-three .slider-nav .swiper-button-next .arrow:after { content: ''; position: absolute; width: 15px; height: 2px; top: 7px; right: -2px; background-color: #bdb4b4; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #testimonial-wrapper-three .slider-nav .swiper-button-next .arrow:before { content: ''; position: absolute; width: 15px; height: 2px; top: 17px; right: -2px; background-color: #bdb4b4; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } #testimonial-wrapper-three .slider-nav .swiper-button-next:hover { width: 40px; right: -15px; } #testimonial-wrapper-three .slider-nav .swiper-button-next:hover .arrow { width: 40px; background: #fa7070; } #testimonial-wrapper-three .slider-nav .swiper-button-next:hover .arrow:before, #testimonial-wrapper-three .slider-nav .swiper-button-next:hover .arrow:after { background: #fa7070; } .testimonials-two-about { background: #fdf8f8; padding: 116px 0 58px; overflow: hidden; } .testimonials-two-about .testimonial-two .testi-content-inner { -webkit-box-shadow: 0px 30px 20px 0px rgba(79, 35, 35, 0.1); box-shadow: 0px 30px 20px 0px rgba(79, 35, 35, 0.1); } .testimonials-two-about .testimonial-two .shape-shadow { -webkit-box-shadow: 0px 20px 50px 0px rgba(79, 35, 35, 0.1); box-shadow: 0px 20px 50px 0px rgba(79, 35, 35, 0.1); } .testimonials-two-about .scroll-circle { bottom: 33%; z-index: 1; right: -7%; } .testimonials-two-about #testimonial-wrapper .slider-nav .swiper-button-prev:hover, .testimonials-two-about #testimonial-wrapper .slider-nav .swiper-button-next:hover { color: #fa7070; } .testimonial-three { border-radius: 10px; background-color: #fff; -webkit-box-shadow: 0px 20px 40px 0px rgba(79, 35, 35, 0.1); box-shadow: 0px 20px 40px 0px rgba(79, 35, 35, 0.1); display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .testimonial-three .avatar img { float: right; height: 100%; } .testimonial-three .avatar, .testimonial-three .testimonial-content { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .testimonial-three .testimonial-content { padding: 0 60px; margin-top: -47px; } .testimonial-three .testimonial-content .bio-info { margin-bottom: 30px; } .testimonial-three .testimonial-content .bio-info .name { font-size: 20px; font-weight: 600; } .testimonial-three .testimonial-content p { position: relative; font-size: 18px; line-height: 32px; color: #656177; z-index: 2; } .testimonials-three { padding: 116px 0 40px; } .testimonial-content.flex-wrap { display: flex !important; flex-direction: column; } @media (max-width: 1440px) { .testimonials-two .animate-shape, .testimonials-two .scroll-circle, .testimonials-two-about .animate-shape, .testimonials-two-about .scroll-circle { max-width: 600px; } } @media (max-width: 1200px) { #testimonial-wrapper-three .slider-nav { bottom: 70px; } .testimonial-three .testimonial-mask { height: 400px; } } @media (max-width: 1024px) { .testimonial-three .testimonial-content { padding: 0 50px; margin-top: 0; } .testimonial-three .testimonial-content p { font-size: 16px; line-height: 28px; } #testimonial-wrapper-three .slider-nav { bottom: 80px; } #testimonial-wrapper-three .quote { width: 80px; } .testimonials .scroll-circle { max-width: 500px; } .testimonials-two-about .scroll-circle { max-width: 400px; } } @media (max-width: 991px) { .testimonials { padding: 76px 0 10px; } .testimonials-two .swiper-container, .testimonials-two-about .swiper-container { padding: 0 20px 80px; } .testimonials-two, .testimonials-two-about { padding: 76px 0 30px; } #testimonial-wrapper .slider-nav .swiper-button-prev { left: -30px; } #testimonial-wrapper .slider-nav .swiper-button-next { right: -20px; } .testimonials-three { padding: 76px 0 0; } #testimonial-wrapper-three .slider-nav { display: none; } .testimonials-two .animate-shape { right: -80%; } .testimonial-wrapper { padding: 0 50px 110px; } .testimonial-wrapper .slider-nav .swiper-button-prev { left: 0; } .testimonial-wrapper .slider-nav .swiper-button-next { right: 10px; } .testimonial-wrapper .shape-shadow { bottom: 80px; } #testimonial .testimonial .testimonial-content p { font-size: 18px; line-height: 34px; } .testimonial-two .testi-content-inner { padding: 40px 30px; } .testimonial-two .shape-shadow { bottom: -30px; } #testimonial-wrapper-three .swiper-container { padding: 0 0 80px; } } @media (max-width: 768px) { .testimonials { padding: 76px 0 30px; } .testimonials-three { padding: 76px 0 30px; } #testimonial-wrapper-three .swiper-container { padding: 0 0 50px; } #testimonial .testimonial { padding: 40px; } #testimonial .testimonial .testimonial-content p { font-size: 16px; line-height: 30px; } .testimonial-wrapper { padding: 0 50px 70px; } .testimonial-wrapper .shape-shadow { bottom: 50px; } #testimonial-wrapper .slider-nav .swiper-button-prev { left: -30px; } #testimonial-wrapper .slider-nav .swiper-button-next { right: -20px; } .testimonials-two .animate-shape { right: -100%; } .testimonial-three { display: block; padding: 30px 30px 100px; } .single-case-study .testimonial-three { display: block; padding: 30px 30px 50px; } .testimonial-three .avatar { width: 80px; height: 80px; border-radius: 50%; margin: auto 20px 30px; overflow: hidden; } .testimonial-three .avatar img { height: 80px; border-radius: 50%; } .single-case-study .testimonial-three .avatar { display: none; } .testimonial-three .testimonial-content { padding: 0 20px; } .testimonial-three .testimonial-content p { margin: 25px 0 0; } .single-case-study .testimonial-content p { margin: 0; } #testimonial-wrapper-three .slider-nav { bottom: 50px; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); display: none; } #testimonial-wrapper-three .quote { bottom: 50px; } } @media (max-width: 576px) { #testimonial-wrapper .slider-nav .swiper-button-prev, #testimonial-wrapper .slider-nav .swiper-button-next, .testimonial-wrapper .slider-nav .swiper-button-prev, .testimonial-wrapper .slider-nav .swiper-button-next { display: none; } .testimonial-wrapper { padding: 0 0 70px; } #testimonial .testimonial { padding: 40px 25px; } #testimonial-wrapper-three .slider-nav { display: none; } #testimonial-wrapper-three .swiper-container { padding: 0 20px 50px !important; } #testimonial-wrapper-three .quote { right: 30px; } .testimonial-three { padding: 30px 10px 100px; } .testimonials-three .testimonial-container { padding-left: 20px; padding-right: 20px; } .swiper-button-next { right: 5px; } .swiper-button-prev { left: 5px; } } /* ------------------- TEAM --------------------*/ .teams-single { padding: 116px 0 120px; } .teams-two { padding-top: 116px; padding-bottom: 120px; } .teams-two .scroll-circle { right: 0; left: auto; top: 25%; z-index: -1; } .team-member { position: relative; margin-bottom: 70px; max-width: 370px; margin: 0 auto 70px; } .team-member .member-avatar { position: relative; overflow: hidden; border-radius: 10px; } .team-member .member-avatar svg { position: absolute; bottom: -100%; left: 0; -webkit-transition: all 0.6s ease-in-out; -o-transition: all 0.6s ease-in-out; transition: all 0.6s ease-in-out; } .team-member .member-avatar svg.layer-two { -webkit-transition-delay: 0.3s; -o-transition-delay: 0.3s; transition-delay: 0.3s; } .team-member .member-avatar svg:hover { bottom: 0; } .team-member .member-avatar .member-social { margin: 0; padding: 0; list-style: none; position: absolute; bottom: 20px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); z-index: 333; opacity: 0; -webkit-transition: all 0.4s ease-in-out; -o-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; -webkit-transition-delay: 0.3s; -o-transition-delay: 0.3s; transition-delay: 0.3s; } .team-member .member-avatar .member-social li { display: inline-block; margin-right: 5px; } .team-member .member-avatar .member-social li a { display: inline-block; height: 46px; width: 46px; line-height: 46px; text-align: center; color: #fff; border: 2px solid #fff; border-radius: 50%; } .team-member .member-avatar .member-social li a:hover { background: #fff; color: #fa7070; -webkit-box-shadow: 0px 20px 20px 0px rgba(79, 35, 35, 0.2); box-shadow: 0px 20px 20px 0px rgba(79, 35, 35, 0.2); } .team-member .member-avatar:hover svg { bottom: 0; } .team-member .member-avatar:hover .member-social { bottom: 40px; opacity: 1; } .team-member .team-info { text-align: center; padding-top: 25px; } .team-member .team-info .name { font-size: 20px; font-weight: 600; } .team-member .team-info .job { font-size: 16px; color: #797687; font-weight: 400; } .team-member .bio-hover { position: absolute; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; background-color: rgba(14, 121, 201, .9); color: #fff; opacity: 0; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } .team-member .bio-hover .bio-text { position: absolute; padding: 20px; font-size: 16px; line-height: 23px; } .team-member:hover .bio-hover, .team-member:active .bio-hover { opacity: 1; } @media (max-width: 991px) { .teams, .teams-two { padding: 76px 0 50px; } .teams-two { padding: 76px 0 80px; } .team-member { margin-bottom: 40px; } .section-small { margin: 0; } .teams-single { padding: 76px 0 80px; } .teams-single .button-container { margin-top: 10px; } .teams-two .scroll-circle { max-width: 320px; } .testimonials-two.help-districts > .custom-district > .paralax-icon { opacity: 0.4 !important; } } @media (max-width: 768px) { .teams-two .scroll-circle { max-width: 330px; } } @media (max-width: 576px) { .scroll-circle { display: none; } } /* ------------------- OFFICE BANNER --------------------*/ .office-banner { padding: 200px; background-size: cover; background-repeat: no-repeat; } .london-office { background-image: url(./../assets/images/about/london.jpg?w=915); background-position: center bottom; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .london-office { background-image: url(./../assets/images/about/london-2x.jpg?w=1830); } } .ny-office { background-image: url(./../assets/images/about/new-york.jpg?w=915); background-position: center center; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .ny-office { background-image: url(./../assets/images/about/new-york-2x.jpg?w=1830); } } /* ------------------- MAP --------------------*/ .bg-map { background-image: url(./../assets/images/media/background/map-2.png?w=773); } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .bg-map { background-image: url(./../assets/images/media/background/map-2.png?w=1546); } } /* ------------------- CONTACT US --------------------*/ .wrap-map { padding: 0; } #map { width: 100%; height: 400px; z-index: -2; } .list-inline > li { display: inline-block; padding-left: 5px; padding-right: 5px; } .wrap-map .no-scroll { background:transparent; position:relative; width: 100%; height: 400px; top: 400px; margin-top: -400px; } .wrap-contact-info { padding: 30px 0 80px; } .wrap-contact-info .wrap-contact-info-text h4 { margin: 30px 0 25px; } .wrap-contact-info .wrap-contact-info-text h5 { margin: 30px 0 20px; } .wrap-contact-info .wrap-contact-info-text .type-info { font-weight: bold; color: #2a2d32; margin-bottom: 15px; } .wrap-contact-info .wrap-contact-info-text .fa { color: #0e79c9; margin-right: 10px; min-width: 20px; } .wrap-contact-info .wrap-contact-info-text .fab { font-size: 1.33333333em; line-height: .75em; vertical-align: -15%; } .wrap-contact-info .wrap-contact-info-text .copyright-links li .fab { color: #7e848e; } .wrap-contact-info .wrap-contact-info-text .copyright-links li .fab:hover { color: #2a2d32; } .wrap-contact-info .wrap-contact-info-text a { color: #0e79c9; } .wrap-contact-info .wrap-contact-info-text a:hover { text-decoration: underline; } .wrap-contact-info .wrap-contact-info-text .grey-link { color: #7e848e; } .wrap-contact-info .wrap-contact-info-text .well { background-color: #f5f7fa; border: 1px solid #e6e9ed; padding: 25px; } .wrap-contact-info .support-section { padding-right: 50px; } @media (max-width: 540px) { .wrap-contact-info .info { clear: both; } .wrap-contact-info .pull-right { float: left!important; } } /* ------------------- SITE MAP --------------------*/ .site-map { border-bottom: 1px solid #e6e9ed; } .site-map ul { margin: 0; padding: 0; } .site-map li { list-style: none; padding: 0; margin: 0; line-height: 36px; } /* ------------------- LEGALS --------------------*/ .legal h3 { margin-bottom: 20px; } .legal h5 { margin: 20px 0; line-height: 30px; } .legal .sticky-top { top: 180px!important; } .legal .sticky-top h5, .site-map h5 { margin: 0 0 20px; } .legal .sticky-top ul, .site-map ul { margin: 0; padding: 0; list-style: none; } .legal .sticky-top ul li, .site-map ul li { margin: 0 0 10px; } .legal table { margin: 0 0 20px; display: block; } .legal .legal-table { width: 100%; border: 1px solid #e6e9ed; margin-bottom: 20px; } .legal .legal-table thead { background-color: #f5f7fa; } .legal .legal-table td { padding: 5px 10px; border: 1px solid #e6e9ed; vertical-align: top; } .legal .legal-table.teacher-retention-table td { padding: 15px 15px; border: 1px solid #e6e9ed; vertical-align: top; } @media (max-width: 991px) { .legal .sticky-top { display: none; } } @media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px) { /* Force table to not be like tables anymore */ .responsive-data, .responsive-data thead, .responsive-data tbody, .responsive-data th, .responsive-data td, .responsive-data tr { display: block; } /* Hide table headers (but not display: none;, for accessibility) */ .responsive-data thead tr { position: absolute; top: -9999px; left: -9999px; } .responsive-data tr { border: 1px solid #ccc; } .responsive-data td { /* Behave like a "row" */ border: none!important; border-bottom: 1px solid #eee!important; position: relative; padding-left: 50%!important; } .responsive-data td:before { /* Now like a table header */ position: absolute; /* Top/left values mimic padding */ top: 6px; left: 6px; width: 45%; padding-right: 10px; white-space: nowrap; } /* Label the data */ .data-subjects td:nth-of-type(1):before { content: "User type:"; } .data-subjects td:nth-of-type(2):before { content: "Personal data type:"; } .data-subjects td:nth-of-type(3):before { content: "Source:"; } .data-subjects td:nth-of-type(4):before { content: "Usage category:"; } .personal-data td:nth-of-type(1):before { content: "Third country (non-EU) / international organisation"; } .personal-data td:nth-of-type(2):before { content: "Safeguards in place to protect your personal data"; } .personal-data td:nth-of-type(3):before { content: "Retrieve a copy of the safeguards in place here:"; } .personal-data td:nth-of-type(4):before { content: "Purpose"; } } /* ------------------- FOOTER --------------------*/ #footer .cta-btn { position: relative; margin-bottom: 50px; padding: 10px 30px; background-color: #fff; border-radius: 30px; font-size: 18px; font-weight: normal; display: inline-block; color: #8cc152; z-index: 2; } #footer .cta-btn:hover { background: #90d248!important; } #footer .footer-logos { position: relative; left: 15px; margin-bottom: 10px; } #footer .footer-logos img { margin-right: 20px; } #footer { background: #132843; } #footer .footer-logo { display: block; font-size: 40px; font-weight: 500; color: #fff; line-height: 46px; } #footer .footer-nner { padding: 116px 0 62px; } #footer .widget.footer-widget { padding-right: 10px; } #footer .widget.footer-widget .widget-title { color: #2b2350; font-size: 20px; font-weight: 500; margin-bottom: 20px; border-bottom: 0; padding-bottom: 0; } #footer .widget.footer-widget p { margin-bottom: 20px; } #footer .footer-menu { margin-bottom: 40px; padding: 0; list-style: none; } #footer .footer-menu li:not(:last-child) { margin-bottom: 10px; } #footer .footer-menu li i { margin-right: 10px; opacity: .5; } #footer .footer-menu li a { display: block; color: #797687; font-weight: 400; line-height: 30px; } #footer .footer-menu li a:hover { color: #fa7070; } #footer .footer-social-link { margin: 0; padding: 0; list-style: none; } #footer .footer-social-link li { display: inline-block; } #footer .footer-social-link li:not(:last-child) { margin-right: 5px; } #footer .footer-social-link li a { height: 45px; width: 45px; line-height: 45px; border: 1px solid #e6dbdb; display: block; border-radius: 50%; color: #9694a1; text-align: center; font-size: 16px; } #footer .footer-social-link li a:hover { background: #fa7070; border-color: #fa7070; color: #fff; -webkit-box-shadow: 0px 20px 30px 0px rgba(176, 70, 70, 0.3); box-shadow: 0px 20px 30px 0px rgba(176, 70, 70, 0.3); } #footer .site-info { padding: 36px 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; border-top: 1px solid #e4d9d9; position: relative; z-index: 3; } #footer .site-info p { margin: 0; } #footer .site-info p a { color: #fa7070; font-weight: 500; } #footer .site-info p a:hover { color: #f83f3f; } #footer .widget.footer-widget .widget-title { color: #fff; } #footer .widget p { color: #a39eb9; } #footer .footer-menu li a { color: #a39eb9; } #footer .footer-menu li a:hover { color: #fff; } #footer .footer-social-link li a { border-color: #615a7e; color: #a39eb9; } #footer .footer-social-link li a:hover { background: #7052fb; -webkit-box-shadow: 0px 20px 30px 0px rgba(90, 70, 176, 0.3); box-shadow: 0px 20px 30px 0px rgba(90, 70, 176, 0.3); border-color: #7052fb; color: #fff; } #footer .site-info-menu li { margin-right: 10px; } #footer .site-info-menu li a { color: #797687; } #footer .site-info-menu li a:hover { color: #fff; } #footer .site-info { border-color: #3d355b; } #footer .site-info p { color: #9c99a7; } #footer .site-info p a { color: #7052fb; } #footer .site-info-menu { margin: 0; padding: 0; list-style: none; } #footer .site-info-menu li { display: inline-block; } #footer .site-info-menu li a { display: inline-block; color: #797687; } #footer .site-info-menu li a:hover { color: #fa7070; } @media (max-width: 1200px) { #footer .fa-envelope { display: none; } } @media (max-width: 991px) { #footer .footer-nner { padding: 76px 0 22px; } #footer .site-info { padding: 21px 0; } #footer .widget.footer-widget .widget-title { margin-bottom: 25px; } #footer .site-info { padding: 21px 0; display: block; text-align: center; } .language-custom-select { margin: 10px 0 0 5px!important; } #footer .footer-logos { margin-top: 0; } } @media (max-width: 768px) { #footer { padding-bottom: 80px; } .no-demo-footer { padding-bottom: 10px!important; } #footer .footer-menu { margin-bottom: 40px; } } /* ------------------- HUBSPOT FORMS --------------------*/ .hbspt-form .cookie-reset-container span { color: #ffffff; } .hbspt-form .cookie-reset-container a { color: #ffffff; text-decoration: underline; } .hbspt-form .hs-submit { position: relative; z-index: 10; } #cta .banner-button-container .banner-btn, .hs-form-right .banner-button-container .banner-btn { padding: 10px 40px; background-color: #fff; border: 2px solid #fff; border-radius: 30px; font-size: 18px; font-weight: bold; display: inline-block; } #cta .banner-button-container .banner-btn:hover, .hs-form-right .banner-button-container .banner-btn:hover { background: #219af6; border: 2px solid #0e79c9; color: #fff!important; box-shadow: none!important; } #cta .scroll-bg-circle, .hs-form-right .scroll-bg-circle { position: absolute; right: 0; top: 40%; } #cta .title, .hs-form-right .title { font-size: 50px; line-height: 64px; font-weight: 700; margin-bottom: 28px; } #cta .sub-heading, .hs-form-right .sub-heading { font-size: 18px; line-height: 28px; } #cta .hs-form { margin-top: 40px; } #cta .hs-form fieldset, .hs-form-right .hs-form fieldset { max-width: 100%; margin-left: 20px; } #cta .hs-form .hs-form-field, .hs-form-right .hs-form .hs-form-field { text-align: left!important; } #cta .hs-form .hs-form-field .input, .hs-form-right .hs-form .hs-form-field .input { margin-right: 20px!important; } #cta .hs-form .hs-form-field label { width: 100%; text-align: left!important; color: #fff!important; } #cta.pricing-form .hs-form .hs-form-field label { width: 100%; text-align: left!important; color: #000!important; padding-right: 15px; } #cta .hs-form .legal-consent-container, .hs-form-right .hs-form .legal-consent-container { margin-top: 20px; text-align: left!important; } #cta .hs-form .inputs-list, .hs-form-right .hs-form .inputs-list { list-style: none; margin: 0; padding: 0; } #cta .hs-form .hs-button { width: auto; margin-top: 20px!important; padding: 20px 30px!important; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } #cta .hs-form .hs-button:hover { background-color: #fff!important; -webkit-box-shadow: 0px 50px 20px 0px rgba(0,0,0,.25)!important; -moz-box-shadow: 0px 50px 20px 0px rgba(0,0,0,.25)!important; box-shadow: 0px 20px 50px 0px rgba(0,0,0,.25)!important; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } #cta .hs-form .hs-richtext, .hs-form-right .hs-form .hs-richtext { color: #fff; } #cta .hs-form .hs-richtext a, .hs-form-right .hs-form .hs-richtext a { text-decoration: underline; color: #fff; } #cta .hs-form .hs-error-msgs li label { position: relative; top: -5px; color: #fff!important; font-size: 16px!important; } #cta-section .slick-slide img { display: inline-block; } @media (min-width: 1000px) { .single-item #cta { width: 850px!important; margin: 0 auto; } } @media (max-width: 999px) { .single-item #cta { width: 80%!important; margin: 0 auto; } } @media (max-width: 600px) { .single-item #cta { width: 90%!important; margin: 0 auto; } } @media (max-width: 550px) { .single-item #cta .hs-form .hs-form-field { float: none; width: 100%; } } .hs-form-right { background-color: #fff; padding: 30px; border-radius: 10px; text-align: left!important; } .hs-form-right .hs-form .hs-button { width: auto; background-color: #8cc152 !important; border-radius: 65px!important; margin-top: 20px!important; padding: 20px 30px!important; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; color: #fff!important; } .hs-form-right .hs-form .hs-button:hover { background-color: #90d348 !important; -webkit-box-shadow: 0px 50px 20px 0px rgba(0,0,0,.15)!important; -moz-box-shadow: 0px 50px 20px 0px rgba(0,0,0,.15)!important; box-shadow: 0px 20px 50px 0px rgba(0,0,0,.15)!important; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } .hs-form-right .hs-form .hs-form-field label { display: inline; width: 100%; text-align: left!important; color: #333!important; } .hbspt-form { margin-top: -5px!important; } .hs-form .hs-error-msgs { padding-left: 0!important; } .hs-form .hs-error-msgs label { margin-bottom: 10px!important; font-family: 'Open Sans'!important; font-size: 14px!important; font-weight: normal!important; color: #da4453!important; } .hs-form label { margin-bottom: 10px!important; font-family: 'Open Sans'!important; font-size: 16px!important; font-weight: 600!important; color: #333!important; } .hs-form-right .hs-form .hs-error-msgs li label { position: relative; top: -5px; color: #da4453!important; font-size: 16px!important; } .cta-btn-green { margin-bottom: 10px; padding: 10px 40px; background-color: #8cc152; border-radius: 30px; border: 2px solid rgba(255,255,255,.5); font-size: 18px; font-weight: bold; display: inline-block; color: #fff; -webkit-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.1); -moz-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.1); box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.1); } .yellow-grad .cta-btn-green:hover { background-color: #90d348; color: #fff; border: 2px solid rgba(255,255,255,1); } .pricing-form .hs-form .hs-input { background-color: #F6FBFD!important; } .pricing-form .hs-form .hs-input:focus { background-color: #fff!important; } .hs-form .hs-input { position: relative; margin-bottom: 10px!important; box-sizing: border-box!important; width: 100%!important; max-width: 100%!important; padding: 0px!important; font-family: 'Open Sans'!important; font-size: 16px!important; height: 50px!important; padding-left: 15px!important; background-color: #fff!important; box-shadow: none!important; -moz-border-radius: 4px!important; -webkit-border-radius: 4px!important; border-radius: 4px!important; border: 1px solid #ccd1d9!important; z-index: 10; } .hs-form .hs-input { position: relative; margin-bottom: 10px!important; box-sizing: border-box!important; width: 100%!important; max-width: 100%!important; padding: 0px!important; font-family: 'Open Sans'!important; font-size: 16px!important; height: 50px!important; padding-left: 15px!important; background-color: #fff!important; box-shadow: none!important; -moz-border-radius: 4px!important; -webkit-border-radius: 4px!important; border-radius: 4px!important; border: 1px solid #ccd1d9!important; z-index: 10; } .hs-form select.hs-input { -webkit-appearance:none; -moz-appearance:none; appearance:none; padding-left: 15px!important; background-image: url(./../assets/images/resources/dropdown_arrow.png)!important; background-position: center right!important; background-repeat: no-repeat; } .hs-form .field { margin-bottom: 10px!important; } .hs-form .error { border: 2px solid #da4453!important; } .hs-form .hs-form-required { font-size: 10px!important; position: relative!important; top: -5px!important; color: #fff; } .pricing-form .hs-form .hs-button { background-color: #7CC33C !important; color: #fff !important; } .pricing-form .hs-form .hs-button:active { background-color: #7CC33C !important; color: #fff !important; } #cta.pricing-form .hs-form .hs-button:hover { background-color: #7CC33C !important; color: #fff !important; -webkit-box-shadow: 0px 50px 20px 0px rgba(0,0,0,.25)!important; -moz-box-shadow: 0px 50px 20px 0px rgba(0,0,0,.25)!important; box-shadow: 0px 20px 20px 0px rgba(0,0,0,.25)!important; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } .hs-form .hs-button { position: relative!important; text-shadow: none!important; background-color: #fff!important; background-image: none!important; display: inline-block!important; margin: 5px 0 0!important; font-weight: 700!important; text-align: center!important; vertical-align: middle!important; touch-action: manipulation!important; cursor: pointer!important; border: none!important; white-space: nowrap!important; padding: 15px 20px!important; font-size: 16px!important; line-height: 24px!important; -moz-border-radius: 4px!important; -webkit-border-radius: 4px!important; border-radius: 4px!important; color: #0e7cdc!important; outline: none!important; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; -webkit-box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.125); -moz-box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.125); box-shadow: 0px 10px 20px 0px rgba(0,0,0,0.125); } .hs-form .hs-button:hover { color: #ffffff; background-color: #f3a100!important; border-color: #f3a100; } .hs-form .actions { margin: 0!important; padding: 0!important; } .hs-form-booleancheckbox span p { float: left!important; margin-left: 3px!important; display: inline-block!important; } .hs-form-booleancheckbox-display .hs-input { float: left!important; margin: 6px 5px 0 0!important; width: 20px!important; height: 20px!important; } .hs-form li.hs-form-checkbox { display: inline-block; width: 30%; } .hs-form .inputs-list ul { margin-bottom: 30px; } .multi-container .hs-form-checkbox-display .hs-input { width: 30px!important; height: 30px!important; margin-right: 10px!important; } .multi-container .hs-form-checkbox-display span { position: relative; top: -7px; } label.hs-form-checkbox-display { margin-bottom: 0!important; } .hbspt-form .submitted-message p { color: #fff; font-weight: bold; font-size: 18px; } .hs-form #label-i_want_to-0705e977-967a-4366-9c77-306d3dc34cb8 { margin-top: 20px!important; margin-bottom: 20px!important; } .hs-form .hs-form-radio input { position: relative; top: 3px; width: 20px!important; height: 20px!important; margin-right: 10px; } .hs-form .hs-form-radio span { font-weight: 400; } .pulse-form .hbspt-form .submitted-message { background: #e2efd4!important; border: 2px solid #8cc152!important; border-radius: 10px!important; padding: 10px 50px!important; display: inline-block!important; margin-top: 10px!important; } .pricing-form .hbspt-form .submitted-message { background: #e2efd4!important; border: 2px solid #8cc152!important; border-radius: 10px!important; padding: 10px 50px!important; display: inline-block!important; margin-top: 10px!important; } .pulse-form .hbspt-form .submitted-message p { margin: 10px!important; color: #4f9404!important; font-weight: bold!important; font-size: 18px!important; } .pricing-form { padding: 20px !important; } .pricing-form .hbspt-form .submitted-message p { margin: 10px!important; color: #4f9404!important; font-weight: bold!important; font-size: 18px!important; } @media (min-width: 768px) { .pulse-form .hbspt-form { -ms-flex: 0 0 66.666667%!important; flex: 0 0 66.666667%!important; max-width: 66.666667%!important; } .pricing-form .hbspt-form { -ms-flex: 0 0 66.666667%!important; flex: 0 0 66.666667%!important; max-width: 66.666667%!important; } } @media (min-width: 576px) { .pulse-form .hbspt-form { -ms-flex: 0 0 83.333333%!important; flex: 0 0 83.333333%!important; max-width: 83.333333%!important; } .pricing-form .hbspt-form { -ms-flex: 0 0 100!important; flex: 0 0 100%!important; max-width: 100%!important; } } /*-------------------------------------------------------------- ## Animation --------------------------------------------------------------*/ @-webkit-keyframes zoom { from { -webkit-transform: scale(1) translate(0px); } to { -webkit-transform: scale(1.03) translate(0px); } } @keyframes zoom { from { -webkit-transform: scale(1) translate(0px); } to { -webkit-transform: scale(1.03) translate(0px); } } @-webkit-keyframes zoommd { 0% { -webkit-transform: scale(0.9); transform: scale(0.9); } 100% { -webkit-transform: scale(1.5); transform: scale(1.5); } } @keyframes zoommd { 0% { -webkit-transform: scale(0.9); transform: scale(0.9); } 100% { -webkit-transform: scale(1.5); transform: scale(1.5); } } @-webkit-keyframes bounce { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 100% { -webkit-transform: translateY(40px); transform: translateY(40px); } } @keyframes bounce { 0% { -webkit-transform: translateY(0); transform: translateY(0); } 100% { -webkit-transform: translateY(40px); transform: translateY(40px); } } @-webkit-keyframes movexy { 0% { -webkit-transform: translateX(-10px) scale(0.9); transform: translateX(-10px) scale(0.9); } 100% { -webkit-transform: translateX(30px) scale(1.3) translateY(10px); transform: translateX(30px) scale(1.3) translateY(10px); } } @keyframes movexy { 0% { -webkit-transform: translateX(-10px) scale(0.9); transform: translateX(-10px) scale(0.9); } 100% { -webkit-transform: translateX(30px) scale(1.3) translateY(10px); transform: translateX(30px) scale(1.3) translateY(10px); } } @-webkit-keyframes wave { 0% { -webkit-transform: rotateZ(0deg) translate3d(0, 1%, 0) rotateZ(0deg); transform: rotateZ(0deg) translate3d(0, 1%, 0) rotateZ(0deg); } 100% { -webkit-transform: rotateZ(360deg) translate3d(0, 1%, 0) rotateZ(-360deg); transform: rotateZ(360deg) translate3d(0, 1%, 0) rotateZ(-360deg); } } @keyframes wave { 0% { -webkit-transform: rotateZ(0deg) translate3d(0, 1%, 0) rotateZ(0deg); transform: rotateZ(0deg) translate3d(0, 1%, 0) rotateZ(0deg); } 100% { -webkit-transform: rotateZ(360deg) translate3d(0, 1%, 0) rotateZ(-360deg); transform: rotateZ(360deg) translate3d(0, 1%, 0) rotateZ(-360deg); } } @-webkit-keyframes pixFade { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes pixFade { 0% { opacity: 0; } 100% { opacity: 1; } } @-webkit-keyframes pixFadeUp { 0% { opacity: 0; -webkit-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @-webkit-keyframes pixFadeDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @-webkit-keyframes pixSlideInUp { 0% { opacity: 1; -webkit-transform: translateY(20px); transform: translateY(20px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @-webkit-keyframes pixSlideInDown { 0% { opacity: 0; -webkit-transform: translateY(-20px); transform: translateY(-20px); } 100% { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } } @-webkit-keyframes pixFadeLeft { 0% { opacity: 0; -webkit-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes pixFadeLeft { 0% { opacity: 0; -webkit-transform: translateX(20px); transform: translateX(20px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @-webkit-keyframes pixFadeRight { 0% { opacity: 0; -webkit-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes pixSlideInLeft { 0% { opacity: 1; -webkit-transform: translateX(50px); transform: translateX(50px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @-webkit-keyframes pixSlideInRight { 0% { opacity: 1; -webkit-transform: translateX(-50px); transform: translateX(-50px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @keyframes pixFadeRight { 0% { opacity: 0; -webkit-transform: translateX(-20px); transform: translateX(-20px); } 100% { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); } } @-webkit-keyframes pixZoomIn { 0% { opacity: 0; -webkit-transform: scale(0.7); transform: scale(0.7); } 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } @keyframes pixZoomIn { 0% { opacity: 0; -webkit-transform: scale(0.7); transform: scale(0.7); } 100% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } } @-webkit-keyframes pixBounceIn { 0% { -webkit-transform: scale(0.1); transform: scale(0.1); opacity: 0; } 60% { -webkit-transform: scale(1.1); transform: scale(1.1); opacity: 1; } 100% { -webkit-transform: scale(1); transform: scale(1); } } @keyframes pixBounceIn { 0% { -webkit-transform: scale(0.1); transform: scale(0.1); opacity: 0; } 60% { -webkit-transform: scale(1.1); transform: scale(1.1); opacity: 1; } 100% { -webkit-transform: scale(1); transform: scale(1); } } .pixFade { -webkit-animation-name: pixFade; animation-name: pixFade; } .pixFadeUp { -webkit-animation-name: pixFadeUp; animation-name: pixFadeUp; } .pixFadeDown { -webkit-animation-name: pixFadeDown; animation-name: pixFadeDown; } .pixFadeLeft { -webkit-animation-name: pixFadeLeft; animation-name: pixFadeLeft; } .pixFadeRight { -webkit-animation-name: pixFadeRight; animation-name: pixFadeRight; } .pixSlideInLeft { -webkit-animation-name: pixSlideInLeft; animation-name: pixSlideInLeft; } .pixSlideInRight { -webkit-animation-name: pixSlideInRight; animation-name: pixSlideInRight; } .pixSlideInUp { -webkit-animation-name: pixSlideInUp; animation-name: pixSlideInUp; } .pixSlideInDown { -webkit-animation-name: pixSlideInDown; animation-name: pixSlideInDown; } .pixZoomIn { -webkit-animation-name: pixZoomIn; animation-name: pixZoomIn; } .pixBounceIn { -webkit-animation-name: pixBounceIn; animation-name: pixBounceIn; } @-webkit-keyframes jumping { 0% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 0; } 50% { -webkit-transform: translateY(-20px); transform: translateY(-20px); opacity: 1; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 0; } } @keyframes jumping { 0% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 0; } 50% { -webkit-transform: translateY(-20px); transform: translateY(-20px); opacity: 1; } 100% { -webkit-transform: translateY(0); transform: translateY(0); opacity: 0; } } @-webkit-keyframes jump { 0% { -webkit-transform: translateY(5px); transform: translateY(5px); } 50% { -webkit-transform: translateY(-10px); transform: translateY(-10px); } 100% { -webkit-transform: translateY(5px); transform: translateY(5px); } } @keyframes jump { 0% { -webkit-transform: translateY(5px); transform: translateY(5px); } 50% { -webkit-transform: translateY(-10px); transform: translateY(-10px); } 100% { -webkit-transform: translateY(5px); transform: translateY(5px); } } @-webkit-keyframes stickySlideDown { from { -webkit-transform: translateY(-100%); transform: translateY(-100%); } to { -webkit-transform: translateY(0); transform: translateY(0); } } @keyframes stickySlideDown { from { -webkit-transform: translateY(-100%); transform: translateY(-100%); } to { -webkit-transform: translateY(0); transform: translateY(0); } } @-webkit-keyframes moveclouds { 0% { -webkit-transform: translate3d(-10px, -10px, 0); transform: translate3d(-10px, -10px, 0); opacity: 1; } 50% { -webkit-transform: translate3d(-20px, 20px, 0); transform: translate3d(-20px, 20px, 0); opacity: 1; } 100% { -webkit-transform: translate3d(30px, 0px, 0); transform: translate3d(30px, 0px, 0); opacity: 1; } } @keyframes moveclouds { 0% { -webkit-transform: translate3d(-10px, -10px, 0); transform: translate3d(-10px, -10px, 0); opacity: 1; } 50% { -webkit-transform: translate3d(-20px, 20px, 0); transform: translate3d(-20px, 20px, 0); opacity: 1; } 100% { -webkit-transform: translate3d(30px, 0px, 0); transform: translate3d(30px, 0px, 0); opacity: 1; } } @-webkit-keyframes pulse { 0% { width: 82px; height: 82px; opacity: 1; } 50% { opacity: 1; } 100% { height: 150px; width: 150px; } } @keyframes pulse { 0% { width: 82px; height: 82px; opacity: 1; } 50% { opacity: 1; } 100% { height: 150px; width: 150px; opacity: 0; } } @-webkit-keyframes pulse-green { 0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(51, 217, 178, 0.7); } 70% { transform: scale(1); box-shadow: 0 0 0 80px rgba(51, 217, 178, 0); } 100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(51, 217, 178, 0); } } @keyframes pulse-green { 0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(51, 217, 178, 0.7); } 70% { transform: scale(1); box-shadow: 0 0 0 80px rgba(51, 217, 178, 0); } 100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(51, 217, 178, 0); } } @-webkit-keyframes heartbeat { 0%, 30% { -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1); } 15% { -webkit-transform: scale(1.06); -moz-transform: scale(1.06); transform: scale(1.06); } } @keyframes heartbeat { 0%, 30% { -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1); } 15% { -webkit-transform: scale(1.06); -moz-transform: scale(1.06); transform: scale(1.06); } } /* ------------------- NYC --------------------*/ .nyc-hero .banner-content i { margin: 0; display: inline-block; font-size: 18px; } .nyc-hero .banner-content a { margin-top: 10px; border-color: #8cc152!important; color: #fff; } .nyc-hero .banner-content .banner-btn:hover { border-color: #fff!important; } .intro-header { font-size: 14px; font-weight: 600; text-transform: uppercase; } #why .trust-1 { position: absolute; z-index: 5; animation-delay: .5s; } #why .trust-2 { position: absolute; z-index: 4; animation-delay: 1.5s; } #why .trust-3 { position: absolute; z-index: 3; animation-delay: 2.5s; } #why .trust-4 { position: absolute; z-index: 2; animation-delay: 3.5s; } #why .card-container { padding: 30px; -webkit-box-shadow: 0 5px 40px rgba(14,121,201,.07); box-shadow: 0 5px 40px rgba(14,121,201,.07); } .topic .card-container p { margin-bottom: 25px; color: #797687; } .topic .icons { font-size: 50px; } .down-bg { position: absolute; width: 130%; left: 0; bottom: -250px; z-index: -1; overflow: hidden; } #pricing, #faqs, .topic, .special-offer { position: relative; } #pricing .btn { padding: 15px 20px!important; font-weight: bold; } #pricing .price-header { border-bottom: 1px solid #eee; } #pricing .price-header .price-large { margin-top: 0; font-size: 50px; color: #333; } #pricing .price-header .price-sub-text { margin-top: 0; font-size: 20px; } #pricing .price-list li .fa-info-circle { margin-left: 5px; opacity: .15; } #pricing .price-list li:hover .fa-info-circle { opacity: 1; } #pricing .bg-angle { background: #2655d6; background: -moz-linear-gradient(150deg,#2655d6 15%,#32adfb 70%,#32adfb 94%); background: -webkit-linear-gradient(150deg,#2655d6 15%,#32adfb 70%,#32adfb 94%); background: linear-gradient(150deg,#2655d6 15%,#32adfb 70%,#32adfb 94%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2655d6', endColorstr='#268cd3',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ max-height: 700px; height: 100%; width: 100%; position: absolute; left: 0; top: 0; z-index: -1; overflow: hidden; } #pricing .bg-angle:after { content: ""; position: absolute; bottom: 0; left: 0; width: 0; height: 0; border-top: 200px solid transparent; border-left: 1900px solid #fff; border-bottom: 0 solid transparent; } .feature-section .rounded-holder { position: relative; padding: 20px; background-color: #fff; border: 1px solid #eee; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; } .special-offer .img-offer { position: relative; display: inline-block; } .special-offer #countdown-timer { display: block; font-size: 74px; color: #063584; } .nyc-footer { position: relative; padding-bottom: 10px; background-color: #132843; z-index: 2; } .famis .btn { padding: 15px 20px; color: #0e79c9!important; font-weight: bold; } .famis .btn:hover { background-color: #0e79c9!important; color: #fff!important; } .famis p { font-size: 22px!important; line-height: 32px!important; } .animate-heartbeat { -webkit-animation-name: heartbeat; -moz-animation-name: heartbeat; animation-name: heartbeat; -webkit-animation-duration: 2.6s; -moz-animation-duration: 2.6s; animation-duration: 2.6s; -webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-iteration-count: infinite; } @-webkit-keyframes heartbeat { 0%, 30% { -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1); } 15% { -webkit-transform: scale(1.06); -moz-transform: scale(1.06); transform: scale(1.06); } } @keyframes heartbeat { 0%, 30% { -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1); } 15% { -webkit-transform: scale(1.06); -moz-transform: scale(1.06); transform: scale(1.06); } } /*-------------------------------------------------------------- ## PRICING SLIDER --------------------------------------------------------------*/ .ag-format-container { width: 1142px; margin: 0 auto; } .ag-activity-block { padding: 0; } .ag-activity_box { position: relative; margin: 0 0 90px; } .ag-range-track_list { display: block; height: 12px; width: 100%; margin-bottom: 50px; background-color: #F4F4F4; list-style: none; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; position: relative; padding-inline-start: 0; } .ag-range-track_list:before { content: ""; height: 20px; width: 40px; background: #37bc9b; position: absolute; left: 0; top: 50%; -webkit-border-radius: 10px 0 0 10px; -moz-border-radius: 10px 0 0 10px; border-radius: 10px 0 0 10px; -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .ag-range-track_list { text-align: justify; font-size: 14px; line-height: 0; } .ag-range-track_list:after { content: ""; display: inline-block; height: 0; width: 100%; visibility: hidden; overflow: hidden } .ag-range-track_item { display: inline-block; line-height: normal; width: auto; padding: 30px 0 0; white-space: nowrap; text-align: center; color: #000; z-index: 20; position: relative; -webkit-transition: all .3s cubic-bezier(.165, .84, .44, 1); -o-transition: all .3s cubic-bezier(.165, .84, .44, 1); -moz-transition: all .3s cubic-bezier(.165, .84, .44, 1); transition: all .3s cubic-bezier(.165, .84, .44, 1); } .ag-range-track_item div { padding: 10px; background-color: #fff; border: 1px solid #37bc9b; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; font-size: 16px; } .ag-range-track_item:before { content: ""; height: 14px; width: 14px; background-color: #37bc9b; z-index: 5; position: absolute; top: -1px; left: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transform: translate(-50%); -moz-transform: translate(-50%); -ms-transform: translate(-50%); -o-transform: translate(-50%); transform: translate(-50%); } .js-ag-selected { z-index: 50; } .js-ag-selected:before { height: 8px; width: 8px; background-color: #fff; top: 2px; left: 50%; } .js-ag-active .ag-range-track_sum { opacity: 1; -webkit-transition: all .3s cubic-bezier(.165, .84, .44, 1); -moz-transition: all .3s cubic-bezier(.165, .84, .44, 1); -o-transition: all .3s cubic-bezier(.165, .84, .44, 1); transition: all .3s cubic-bezier(.165, .84, .44, 1); } .js-ag-active div { background-color: #37bc9b; border: 1px solid #37bc9b; color: #fff; } .ag-range-track_sum:before { content: ""; display: none; height: 0; width: 0; border-style: solid; border-width: 8px 8px 0; border-color: #37bc9b transparent transparent; position: absolute; top: 100%; left: 50%; -webkit-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; -o-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transform: translate(-50%); -moz-transform: translate(-50%); -ms-transform: translate(-50%); -o-transform: translate(-50%); transform: translate(-50%); } .ag-range_box { z-index: 30; position: absolute; top: -4px; left: 40px; right: 40px; } .noUi-horizontal { height: 20px; } .noUi-target { border: none; background: 0 0; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .noUi-connect { background: #37bc9b; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } .ag-range_box .noUi-handle { height: 30px; width: 30px; border: none; background-color: #FFF; cursor: pointer; right: -15px; top: -5px; -webkit-box-shadow: 0 3px 5px 0 rgba(0, 0, 0, .5); -moz-box-shadow: 0 3px 5px 0 rgba(0, 0, 0, .5); box-shadow: 0 3px 5px 0 rgba(0, 0, 0, .5); -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .noUi-handle:after, .noUi-handle:before { display: none; } .noUi-touch-area { height: 8px; width: 2px; background-color: #808080; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .noUi-touch-area:after, .noUi-touch-area:before { content: ""; height: 8px; width: 2px; background-color: gray; position: absolute; } .noUi-touch-area:after { left: 0; -webkit-transform: translateX(-3px); -moz-transform: translateX(-3px); -ms-transform: translateX(-3px); -o-transform: translateX(-3px); transform: translateX(-3px); } .noUi-touch-area:before { right: 0; -webkit-transform: translateX(3px); -moz-transform: translateX(3px); -ms-transform: translateX(3px); -o-transform: translateX(3px); transform: translateX(3px); } .noUi-connects { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } .ag-reward-block { padding: 150px 0 0; text-align: center; position: relative; } .ag-reward_box { display: inline-block; max-width: 360px; width: 100%; margin: 0 15px 50px; padding: 75px 20px 20px; border: 3px solid #d5dde8; background-color: #FFF; vertical-align: top; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; position: relative; } .ag-reward_box:before { content: ""; height: 100px; width: 100px; margin: 0 auto; border: 2px solid #98999d; background-color: #EFEFEF; z-index: 2; position: absolute; top: 0; left: 0; right: 0; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .ag-reward_num { margin-bottom: 22px; letter-spacing: -.45px; font-weight: 700; font-size: 18px; color: #787d87; } .ag-reward_title { padding: 0 0 20px; letter-spacing: -.75px; font-weight: 700; font-size: 24px; color: #323a45; } .ag-reward_plus { display: inline-block; height: 28px; width: 28px; position: relative; } .ag-reward_plus:before, .ag-reward_plus:after { content: ""; background-color: #CCC; position: absolute; } .ag-reward_plus:before { height: 4px; width: 28px; top: 50%; left: 0; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } .ag-reward_plus:after { height: 28px; width: 4px; top: 0; left: 50%; -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); } @media only screen and (max-width: 767px) { .ag-range-track_item { min-height: 18px; font-size: 20px; } .ag-reward_box { display: block; margin: 0 auto; padding: 40px 20px; } .ag-reward_box-1 { border-bottom: 0; position: relative; } .ag-reward_box-1:before, .ag-reward_box-1:after { content: ""; height: 1px; width: 120px; margin: 0 auto; border: 0; background-color: #d5dde8; position: absolute; bottom: 0; } .ag-reward_box-1:before { top: auto; left: auto; right: 30px; } .ag-reward_box-1:after { left: 30px; } .ag-reward_box-2 { border-top: 0; } .ag-reward_box-2::before { display: none; background: none; } .ag-reward_plus { display: block; margin: -14px auto; z-index: 10; } } @media only screen and (max-width: 639px) { .js-ag-selected:before { height: 6px; width: 6px; } .ag-range_box { left: 30px; right: 30px; } } @media only screen and (max-width: 479px) { .ag-range-track_item { min-height: 13px; width: 46px; font-size: 14px; } } @media (min-width: 768px) and (max-width: 979px) { .ag-reward_box { max-width: 300px; } } @media only screen and (max-width: 767px) { .ag-format-container { width: 96%; } } @media only screen and (max-width: 639px) { } @media only screen and (max-width: 479px) { } @media (min-width: 768px) and (max-width: 979px) { .ag-format-container { width: 750px; } } @media (min-width: 980px) and (max-width: 1161px) { .ag-format-container { width: 960px; } } /*-------------------------------------------------------------- ## PRICING --------------------------------------------------------------*/ .pricing { padding: 116px 0 120px; } .pricing-two-single .licence-cost { width: 100%; display: none; margin: 0 15px 30px; padding: 20px; background-color: #f5fcfa; border: 1px solid #37bc9b; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; z-index: 3; } .pricing-two-single .licence-cost p { margin: 0; font-size: 18px; } .pricing-two-single .licence-cost p span, .pricing-header span { font-size: 36px; font-weight: 600; } .pricing-two-single .licence-cost p .enquire, .pricing-header .enquire { display: inline-block; padding: 3px 0; font-size: 22px; font-weight: 500; line-height: 40px; } .pricing-header .enquire .fa { margin-right: 5px; } .pix-btn { border-radius: 30px; display: inline-block; font-size: 18px; z-index: 10; -webkit-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out; } .pix-btn.btn-outline { border: 1px solid #0e79c9; background: transparent; color: #0e79c9; -webkit-box-shadow: none; box-shadow: none; } .pricing-table .pix-btn { text-align: center; font-weight: 600; padding: 8px 0; width: 200px; text-align: center; } .pricing-table .pix-btn:hover { background: #0e79c9; color: #fff; } .pricing-tab-fixed { margin-bottom: 136px!important; } .pricing-two { padding-top: 146px; padding-bottom: 90px; } .pricing-two-single { padding-top: 116px; padding-bottom: 90px; } .pricing .scroll-circle { bottom: 20%; } .pricing-single-one { padding: 116px 0 90px; } .pricing-table { border-right: 1px solid #efe7e7; padding: 20px 40px; margin-bottom: 30px; } .pricing-table.br-left { border-left: 1px solid #efe7e7; } .pricing-table .pricing-header { text-align: center; padding-bottom: 55px; border-bottom: 1px dashed #efe7e7; margin-bottom: 30px; } .pricing-table .pricing-header .action { margin: 20px 0 0; } .pricing-table .pricing-header .price { color: #fa7070; font-size: 36px; font-weight: 800; line-height: 50px; margin-bottom: 20px; } .pricing-table .pricing-header .price-title { font-size: 20px; font-weight: 600; text-transform: uppercase; letter-spacing: 4px; } .pricing-table .pricing-header p { margin: 0; } .pricing-table .pricing-header .first { display: none; } .pricing-table .pricing-header .second { display: none; } .pricing-table .pricing-header .third { display: none; } .pricing-table .pricing-header .fourth { display: none; } .pricing-table .price-feture { padding: 0; list-style: none; } .pricing-table .price-feture li { padding-left: 33px; position: relative; margin-bottom: 12px; } .pricing-table .price-feture li:before { font-family: eleganticons; position: absolute; left: 0; top: 0; } .pricing-table .price-feture li.have:before { content: "\4e"; color: #1acb44; } .pricing-table .price-feture li.not:before { content: "\4d"; color: #fa7878; } .pricing-table.color-two .pricing-header .price { color: #8070fa; } .pricing-table.color-three .pricing-header .price { color: #22cd1a; } .pricing-table .pix-btn { text-align: center; font-weight: normal; padding: 8px 0; width: 200px; text-align: center; } .pricing-table.style-two { background: #fff; padding: 30px 40px 40px; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; position: relative; border: 1px solid #e6e9ed; border-radius: 8px; } .pricing-table.style-two.price-two { background: #f8f7fc; } .pricing-table.style-two.price-two.featured .trend:before { border-right: 90px solid #8cc152; } .pricing-table.style-two .pricing-header { text-align: left; border-color: #b4b2bf; padding-bottom: 30px; } .pricing-table.style-two .pricing-header .price-title { margin-bottom: 10px; letter-spacing: 0; text-transform: unset; line-height: 30px; } .pricing-table.style-two:hover { background: #fff; -webkit-box-shadow: 0px 40px 80px 0px rgba(43, 35, 79, 0.14); box-shadow: 0px 40px 80px 0px rgba(43, 35, 79, 0.14); } .pricing-table.selected { -webkit-box-shadow: 0px 40px 80px 0px rgba(43, 35, 79, 0.14); box-shadow: 0px 40px 80px 0px rgba(43, 35, 79, 0.14); border: 1px solid #37bc9b; } .pricing-table.selected .action a { background: #37bc9b; color: #fff; } .pricing-table.featured .trend { position: absolute; top: 0; right: 0; } .pricing-table.featured .trend p { color: #fff; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); margin-left: 22px; margin-bottom: 0; z-index: 22; font-size: 14px; padding-top: 17px; padding-bottom: 15px; } .pricing-table.featured .trend:before { content: ''; width: 0; height: 0; border-top: 0px solid transparent; border-bottom: 90px solid transparent; border-right: 90px solid #8cc152; position: absolute; top: 0; right: 0; } .tabed-content .tabs-item { display: none; } .pricing-tab { text-align: center; margin-bottom: 30px; position: relative; z-index: 2; } .pricing-tab .tab-btn { cursor: pointer; } .pricing-tab .monthly_tab_title { color: #fa7070; } .pricing-tab .pricing-tab-switcher { height: 40px; width: 90px; display: inline-block; border-radius: 50px; position: relative; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; margin: 0 18px; -webkit-transform: translateY(-3px); -ms-transform: translateY(-3px); transform: translateY(-3px); border: 1px solid #dcd2d2; border-radius: 30px; cursor: pointer; } .pricing-tab .pricing-tab-switcher:before { content: ''; position: absolute; left: 5px; top: 4px; background: #fa7070; width: 30px; height: 30px; border-radius: 100%; -webkit-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; -webkit-box-shadow: 0px 14px 24px 0px rgba(176, 70, 70, 0.4); box-shadow: 0px 14px 24px 0px rgba(176, 70, 70, 0.4); } .pricing-tab .pricing-tab-switcher.active:before { left: calc(100% - 35px); } .pricing-tab.selected .annual_tab_title { color: #fa7070; } .pricing-tab.selected .monthly_tab_title { color: #797687; } .pricing-tab span { margin-bottom: 20px; vertical-align: middle; } .pricing-tab.color-two .pricing-tab-switcher:before { background: #7052fb; -webkit-box-shadow: 0px 14px 24px 0px rgba(90, 70, 176, 0.4); box-shadow: 0px 14px 24px 0px rgba(90, 70, 176, 0.4); } .pricing-tab.color-two .monthly_tab_title { color: #7052fb; } .pricing-tab.color-two.selected .annual_tab_title { color: #7052fb; } .pricing-tab.color-two.selected .monthly_tab_title { color: #797687; } .pricing-table .pricing-users, .pricing-table .pricing-features, .pricing-table .pricing-support, .pricing-table .pricing-integration { text-align: center; padding-bottom: 33px; border-bottom: 1px dashed #b4b2bf; margin-bottom: 30px; } .pricing-table .pricing-integration { text-align: center; padding-bottom: 0px; margin-bottom: 30px; border: none; } .pricing-table .pricing-users h4, .pricing-table .pricing-features h4, .pricing-table .pricing-support h4 { margin-bottom: 15px; } .pricing-table .pricing-features ul, .pricing-table .pricing-support ul, .pricing-table .pricing-integration ul { text-align: left; } .pricing-table .pricing-users p { margin: 0px; } .tabs-wrapper { max-width: 830px; margin: 0 auto; } .price-changer { display: inline-block; margin: 0 10px; padding: 10px 15px; border: 1px solid #e6e9ed; border-radius: 8px; font-size: 20px; cursor: pointer; } .price-changer.active { background-color: #0e79c9; border: 1px solid #0e79c9; color: #fff; } .faq-tabs { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-bottom: 40px; position: relative; z-index: 22; } .faq-tabs li { margin-bottom: 20px; } .faq-tabs li:not(:last-child) { margin-right: 20px; } .faq-tabs li a { font-size: 14px; font-weight: 600; color: #fa7070; background: rgba(250, 112, 112, 0.122); padding: 1px 25px; border-radius: 4px; display: inline-block; } .faq-tabs li a:hover, .faq-tabs li a.active { background: #fa7070; color: #fff; } .faq-tabs li:nth-child(2) a { background: rgba(94, 103, 225, 0.122); color: #5e67e1; } .faq-tabs li:nth-child(2) a:hover, .faq-tabs li:nth-child(2) a.active { background: #5e67e1; color: #ffff; } .faq-tabs li:nth-child(3) a { background: rgba(26, 201, 88, 0.122); color: #1ac958; } .faq-tabs li:nth-child(3) a:hover, .faq-tabs li:nth-child(3) a.active { background: #1ac958; color: #ffff; } .faq-tabs li:nth-child(4) a { background: rgba(251, 43, 224, 0.122); color: #fb2be0; } .faq-tabs li:nth-child(4) a:hover, .faq-tabs li:nth-child(4) a.active { background: #fb2be0; color: #ffff; } .pricing-service { background: #fdf8f8; padding: 116px 0 90px; } @media (max-width: 991px) { .pricing { padding: 76px 0 80px; } .pricing-service { padding: 76px 0 50px; } .pricing-single-one, .pricing-two-single { padding: 76px 0 50px; } .pricing-table { border: 1px solid #efe7e7; padding: 40px; max-width: 500px; margin: 0 auto 30px; } .faq-tabs { margin-bottom: 30px; } .pricing-two { padding-top: 66px; padding-bottom: 50px; } .pricing .scroll-circle { width: 250px; } .licence-cost-fixed { position: fixed; top: auto; bottom: 0px; margin-bottom: 0!important; border-radius: 0!important; z-index: 5!important; } } @media (max-width: 768px) { .faq-tabs li { margin-bottom: 10px; } } /* ------------------- PULSE PACKAGES & SURVEY TEMPLATES --------------------*/ .pulse-packages .rounded-holder { text-align: left; } .pulse-packages .mint-border-top { border-top: 5px solid #37bc9b; } .pulse-packages .yellow-border-top { border-top: 5px solid #ffce54; } .pulse-packages .amber-border-top { border-top: 5px solid #f3a100; } .pulse-packages .purple-border-top { border-top: 5px solid #bf657f; } .pulse-packages .grey-border-top { border-top: 5px solid #8a9fb4; } .pulse-packages .green-border-top { border-top: 5px solid #8cc152; } .pulse-packages h3 { margin-top: 10px; font-size: 18px; font-weight: bold; } .pulse-packages a { width: 100%; text-align: center; } .pulse-packages ul { margin: 20px 0 0; padding: 0; list-style: none; } .pulse-packages ul li { margin: 0 0 10px; color: #333; } .pulse-packages ul li i { margin-right: 2px; } .pulse-packages .pill { display: inline-block; margin-right: 7px; background-color: #f4f8fb; -moz-border-radius: 15px; border-radius: 15px; padding: 2px 13px; font-size: 14px; } @media (max-width: 991px) { .pulse-packages h3 { font-size: 17px; } } @media (max-width: 768px) { .pulse-packages h3 { font-size: 20px; } } /*-------------------------------------------------------------- ## Revolutionize --------------------------------------------------------------*/ .revolutionize { padding: 150px 0 30px; } .banner.revolutionize { padding: 182px 0 120px; } .banner.revolutionize .banner-title { font-weight: 900; } .banner.revolutionize.page-banner:after { top: 1px; } @media (max-width: 991px) { .banner.revolutionize { padding: 118px 0 100px; } } .banner.revolutionize span { line-height: 46px; } .revolutionize .banner-title { font-size: 50px; line-height: 46px; font-weight: 800; margin-bottom: 20px; color: #fff; } .revolutionize .banner-title span { display: inline-block; margin-top: 15px; font-weight: 300; font-size: 32px; } .revolutionize .banner-content-wrap-two p { margin-bottom: 50px; color: #fff; } .bg-angle { max-height: 900px; height: 100%; width: 100%; position: absolute; left: 0; top: 0; z-index: -1; overflow: hidden; } @media (max-width: 768px) { .bg-angle { max-height: 1500px; } } .bg-angle:after { content: ''; position: absolute; bottom: 0; left: 0; width: 0; height: 0; border-top: 200px solid transparent; border-left: 1900px solid #fff; border-bottom: 0px solid transparent; } .your-voice .bg-angle { background: #967adc; } .climate-culture .bg-angle { background: #37bc9b; background: -moz-linear-gradient(150deg,#37bc9b 15%,#37bc9b 60%,#37bc9b 84%); background: -webkit-linear-gradient(150deg,#37bc9b 15%,#37bc9b 60%,#37bc9b 84%); background: linear-gradient(150deg,#37bc9b 15%,#37bc9b 60%,#37bc9b 84%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#37bc9b', endColorstr='#37bc9b',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ } .learner-positioning .bg-angle, .sel-research { background: rgb(252,194,80); background: -moz-linear-gradient(225deg, rgba(252,194,80,1) 0%, rgba(243,161,0,1) 50%, rgba(243,161,0,1) 100%); background: -webkit-linear-gradient(225deg, rgba(252,194,80,1) 0%, rgba(243,161,0,1) 50%, rgba(243,161,0,1) 100%); background: linear-gradient(225deg, rgba(252,194,80,1) 0%, rgba(243,161,0,1) 50%, rgba(243,161,0,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#fcc250",endColorstr="#f3a100",GradientType=1); } .strategic-planning .bg-angle { background: #e188a4; background: -moz-linear-gradient(150deg,#e188a4 15%,#be647f 60%,#be647f 84%); background: -webkit-linear-gradient(150deg,#e188a4 15%,#be647f 60%,#be647f 84%); background: linear-gradient(150deg,#e188a4 15%,#be647f 60%,#be647f 84%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e188a4', endColorstr='#be647f',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ } .survey-builder .bg-angle { background: #5d9cec; background: -moz-linear-gradient(150deg,#277deb 15%,#277deb 40%,#5d9cec 84%); background: -webkit-linear-gradient(150deg,#277deb 15%,#277deb 40%,#5d9cec 84%); background: linear-gradient(150deg,#277deb 15%,#277deb 40%,#5d9cec 84%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#277deb', endColorstr='#5d9cec',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ } .sel-research { overflow: hidden; } .sel-research .quote { margin: 0; font-size: 30px; font-weight: 300; line-height: 40px; } .sel-research .cover { position: absolute; border-radius: 10px; } .sel-research .btn { position: relative; margin-top: 20px; padding: 10px 40px; background-color: #fff; border: 2px solid #fff; border-radius: 30px; font-size: 18px; font-weight: bold; display: inline-block; color: #f3a100; z-index: 2; } .sel-research .btn:hover { background-color: transparent; color: #fff; } @media (max-width: 991px) { .sel-research .quote { font-size: 30px; line-height: 40px; } } @media (max-width: 768px) { .sel-research .quote { font-size: 24px; line-height: 30px; } .sel-research .btn { margin-top: 10px; padding: 10px 30px; font-size: 16px; } } @media (max-width: 575px) { .sel-research .section-title { margin-bottom: 30px!important; } .sel-research .sub-heading { margin-bottom: 0px!important; } .sel-research .quote { text-align: center; } .sel-research .btn { padding: 10px 30px; } .sel-research .cover { display: none; } .sel-research .btn-wrapper { text-align: center; } } /* Tabs */ #pix-tabs-nav { text-align: center; list-style: none; margin-bottom: 38px; padding: 0; } #pix-tabs-nav li { display: inline-block; } #pix-tabs-nav li:not(:last-child) { margin-right: 10px; } #pix-tabs-nav li a { color: #f1e8e8; font-weight: 500; cursor: pointer; padding: 11px 27px; border-radius: 30px; display: inline-block; margin-bottom: 20px; } #pix-tabs-nav li a:hover { background: #fff; color: #fa7070; -webkit-box-shadow: 0px 20px 30px 0px rgba(176, 70, 70, 0.3); box-shadow: 0px 20px 30px 0px rgba(176, 70, 70, 0.3); } #pix-tabs-nav li.active a { background: #fff; color: #fa7070; -webkit-box-shadow: 0px 20px 30px 0px rgba(176, 70, 70, 0.3); box-shadow: 0px 20px 30px 0px rgba(176, 70, 70, 0.3); } #pix-tabs-nav.pix-tab-two li a:hover { color: #7052fb; -webkit-box-shadow: 0px 20px 30px 0px rgba(90, 70, 176, 0.3); box-shadow: 0px 20px 30px 0px rgba(90, 70, 176, 0.3); } #pix-tabs-nav.pix-tab-two li.active a { color: #7052fb; -webkit-box-shadow: 0px 20px 30px 0px rgba(90, 70, 176, 0.3); box-shadow: 0px 20px 30px 0px rgba(90, 70, 176, 0.3); } #pix-tabs-content .content { text-align: center; position: relative; } #pix-tabs-content .content img, .banner .demo { overflow: visible; background-color: #e1d5d5; -webkit-box-shadow: 0px 60px 100px 0px rgba(79, 35, 35, 0.2); box-shadow: 0px 60px 100px 0px rgba(79, 35, 35, 0.2); border-radius: 10px; z-index: 2; } #pix-tabs-content .content .shape-shadow, .banner .shape-shadow { border-radius: 10px; background-color: white; opacity: 0.4; -webkit-box-shadow: 0px 60px 100px 0px rgba(79, 35, 35, 0.2); box-shadow: 0px 60px 100px 0px rgba(79, 35, 35, 0.2); height: 100px; max-width: 80%; position: absolute; bottom: -30px; width: 100%; z-index: -1; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .banner .shape-shadow { z-index: 1; } #pix-tabs-content .content.color-two img { -webkit-box-shadow: 0px 60px 100px 0px rgba(43, 35, 79, 0.2); box-shadow: 0px 60px 100px 0px rgba(43, 35, 79, 0.2); } #pix-tabs-content .content.color-two .shape-shadow, .banner .shape-shadow { -webkit-box-shadow: 0px 60px 100px 0px rgba(43, 35, 79, 0.2); box-shadow: 0px 60px 100px 0px rgba(43, 35, 79, 0.2); } @media (max-width: 991px) { .revolutionize, .revolutionize-two { padding: 76px 0 30px; } #pix-tabs-content .content.color-two img { -webkit-box-shadow: 0px 40px 50px 0px rgba(43, 35, 79, 0.2); box-shadow: 0px 40px 50px 0px rgba(43, 35, 79, 0.2); } #pix-tabs-content .content.color-two .shape-shadow { -webkit-box-shadow: 0px 40px 50px 0px rgba(43, 35, 79, 0.2); box-shadow: 0px 40px 50px 0px rgba(43, 35, 79, 0.2); } } @media (max-width: 768px) { #pix-tabs-content .content img, .banner .shape-shadow { -webkit-box-shadow: 0px 40px 50px 0px rgba(79, 35, 35, 0.2); box-shadow: 0px 40px 50px 0px rgba(79, 35, 35, 0.2); } #pix-tabs-content .content .shape-shadow, .banner .shape-shadow { bottom: -30px; -webkit-box-shadow: 0px 40px 50px 0px rgba(79, 35, 35, 0.2); box-shadow: 0px 40px 50px 0px rgba(79, 35, 35, 0.2); } #pix-tabs-nav li:not(:last-child) { margin-right: 5px; } } @media (max-width: 576px) { #pix-tabs-nav { margin: 0; } #pix-tabs-nav li { margin-right: 3px; } #pix-tabs-nav li a { font-size: 14px; padding: 6px 22px; } } @media (max-width: 420px) { #pix-tabs-nav { margin-bottom: 20px; } #pix-tabs-nav li a { margin-bottom: 10px; } #pix-tabs-nav li:not(:last-child) { margin-right: 0; } } .post.video-post .feature-image, .post.video-post .case-study-video { position: relative; } .post.video-post .feature-image .video-shadow { height: 100px; width: 100px; background: #fff; border-radius: 50%; -webkit-box-shadow: 0px 5px 5px 5px rgba(0,0,0,0.1); box-shadow: 0px 5px 5px 5px rgba(0,0,0,0.1); position: absolute; top: 42%; left: 42%; z-index: 1; } .post.video-post .feature-image .video-btn { height: 100px; width: 100px; background: #fff; border-radius: 50%; line-height: 100px; position: absolute; top: 42%; left: 42%; z-index: 2; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center; -webkit-animation: pulse-green 2s linear infinite; animation: pulse-green 2s linear infinite; } .post.video-post .feature-image .video-btn:after { -webkit-animation-delay: 1s; animation-delay: 1s; } .post.video-post .feature-image .video-btn i { color: #2b2350; font-size: 16px; font-size: 48px; line-height: 2.05; } .post.video-post .case-study-video .video-btn { height: 80px; width: 80px; background: #fff; border-radius: 50%; line-height: 80px; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center; } .post.video-post .case-study-video .video-btn:before, .post.video-post .case-study-video .video-btn:after { content: ''; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); border: 1px solid #fff; border-radius: 50%; -webkit-animation: pulse 2s linear infinite; animation: pulse 2s linear infinite; } .post.video-post .case-study-video .video-btn:after { -webkit-animation-delay: 1s; animation-delay: 1s; } .post.video-post .case-study-video .video-btn i { color: #2b2350; font-size: 16px; font-size: 40px; line-height: 2.05; } .video-post .video-bg { height: 479px; border-radius: 10px; background-size: cover; background-repeat: no-repeat; background-position: center; } .video-post .culture-climate-video { background-image: url(./../assets/images/products/culture-and-climate/culture-and-climate-video.jpg?w=670); border: 1px solid rgba(55,188,155,0.5); } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .video-post .culture-climate-video { background-image: url(./../assets/images/products/culture-and-climate/culture-and-climate-video.jpg?w=1340); } } .bundles.photo-img .feature-image img { -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; } .service-content { padding: 30px 50px 0 50px; } .service-content { padding: 30px 50px 0 50px; } .service-content .section-title { margin-bottom: 40px; } .service-content p { font-size: 18px; line-height: 34px; } .featured-two-service { padding: 145px 0 28px; } @media (max-width: 991px) { .service { padding-top: 80px; } .service-content { padding: 0; margin-top: 20px; } } .interface-content .list-items { margin-bottom: 30px; } .interface-content .list-items li { margin: 0 0 5px; padding-left: 36px; line-height: 40px; font-size: 18px; } .interface-content .multi-line-list li { margin: 0 0 20px; padding-left: 36px; line-height: 29px; font-size: 16px; } .interface-content .list-items li:before { content: "\52"; font-family: eleganticons; position: absolute; left: 0; top: 0; color: #13bf24; } .interface-content .list-icons { margin-bottom: 15px; } .interface-content .list-icons li:before { content: ""; font-family: inherit!important; } .interface-content .list-icons li { padding-left: 0; } .interface-content .list-icons li i { position: relative; top: -1px; margin-right: 10px; color: #0e79c9; font-size: 20px; vertical-align: middle; } .multi-line .list-items li { line-height: 34px; margin-bottom: 30px; } /*-------------------------------------------------------------- ## Logo Carousel --------------------------------------------------------------*/ #brand-logo .section-small { margin-top: -90px; } .brand-logo, .district-logo { margin-top: 50px; text-align: center; } .brand-logo img, .district-logo img { opacity: 0.5; -webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .district-logo img { height: 80px; } .brand-logo img:hover, .district-logo img:hover { opacity: 1; } .brand-logo-ab { padding-bottom: 120px; } .logo-carousel .swiper-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } @media (min-width: 1200px) { .brand-logo img { height: 80px; } } @media (max-width: 991px) { #brand-logo { padding-top: 76px; } #brand-logo .section-small { margin-top: 0; } #brand-logo .section-small .title { margin-bottom: 50px; } .brand-logo-ab { padding-bottom: 75px; } .brand-logo-ab .section-small .title { margin-bottom: 60px; } } @media (max-width: 768px) { #brand-logo { padding-top: 30px; } #brand-logo .section-small { margin-top: 0; } } @media (max-width: 480px) { #brand-logo { padding-top: 0; } #brand-logo .section-small { margin-top: 0; } } /* ------------------- AWARD SLIDER --------------------*/ .awards { padding-top: 100px; padding-bottom: 150px; background: #f8fafd; border-top: 1px solid #f5f7fa; overflow: hidden; } #award-slider .award-card { display: inline-block; position: relative; width: 220px; padding: 20px; margin: 0 30px; background-color: #fff; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; text-align: center; -webkit-box-shadow: 0px 30px 20px 0px rgba(43, 35, 79, 0.05); box-shadow: 0px 30px 20px 0px rgba(43, 35, 79, 0.05); } #award-slider .award-card p { font-size: 18px; } #award-slider .award-card:nth-child(even) { position: relative; top: 30px; } #award-slider .slick-slide img { display: inline-block; } #award-slider .slick-prev, #award-slider .slick-next { display: none!important; } #award-slider .slick-list { overflow: visible; } /* ------------------- EVENT LIST --------------------*/ .event-list .event-month { margin: 0; font-size: 22px; color: #333; } .event-list .event { padding: 30px 0; border-bottom: 1px solid #e6e9ed; vertical-align: middle; } .event-list .event-img { display: inline-block; width: 210px; height: 80px; margin-right: 20px; padding: 15px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; border: 1px solid #e6e9ed; vertical-align: middle; text-align: center; } .event-list .event-img img { display: block; max-width: 100%; height: 100%; margin: auto; } .event-list .event-description { display: inline-block; vertical-align: middle; } .event-list .event-title { font-size: 18px; color: #333; } .event-list .event-description p { margin: 0; } .event-list .event-cta { display: inline-block; float: right; margin: 16px 30px; background-color: #0e79c9; padding: 10px 20px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; border: 1px solid #205f95; color: #fff; vertical-align: middle; } .event-list .event-cta:hover { background-color: #219af6; border: 1px solid #3b74a3; } .event-list .webinar { display: flex; position: relative; margin: 30px 0 0; padding-bottom: 30px; border-bottom: 1px solid #e6e9ed; color: #fff; } .event-list .webinar .webinar-left { width: 50%; padding: 30px 30px 30px 80px; background-color: #47acf8; -webkit-border-top-left-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-topleft: 4px; -moz-border-radius-bottomleft: 4px; border-top-left-radius: 4px; border-bottom-left-radius: 4px; } .event-list .webinar .webinar-right { width: 50%; padding: 30px; background-color: #4498ef; -webkit-border-top-right-radius: 4px; -webkit-border-bottom-right-radius: 4px; -moz-border-radius-topright: 4px; -moz-border-radius-bottomright: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; } .event-list .webinar .avatar { display: inline-block; width: 60px; height: 60px; margin-right: 10px; border-radius: 50%; border: 2px solid #fff; vertical-align: text-top; } .event-list .webinar .jeff-klein { background-image: url(./../assets/images/about/events/jeff-klein.jpg?w=60); background-size: contain; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .event-list .webinar .jeff-klein { background-image: url(./../assets/images/about/events/jeff-klein.jpg?w=120); } } .event-list .webinar .luvelle-brown { background-image: url(./../assets/images/about/events/luvelle-brown.jpg?w=60); background-size: contain; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .event-list .webinar .luvelle-brown { background-image: url(./../assets/images/about/events/luvelle-brown.jpg?w=120); } } .event-list .webinar .traci-davis { background-image: url(./../assets/images/about/events/traci-davis.jpg?w=60); background-size: contain; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .event-list .webinar .traci-davis { background-image: url(./../assets/images/about/events/traci-davis.jpg?w=120); } } .event-list .webinar .dr-joseph-davis { background-image: url(./../assets/images/about/events/dr-joseph-davis.jpg?w=60); background-size: contain; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .event-list .webinar .dr-joseph-davis { background-image: url(./../assets/images/about/events/dr-joseph-davis.jpg?w=120); } } .event-list .webinar .kevin-hampton { background-image: url(./../assets/images/about/events/kevin-hampton.jpg?w=60); background-size: contain; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .event-list .webinar .kevin-hampton { background-image: url(./../assets/images/about/events/kevin-hampton.jpg?w=120); } } .event-list .webinar .greg-wolcott { background-image: url(./../assets/images/about/events/greg-wolcott.jpg?w=60); background-size: contain; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .event-list .webinar .greg-wolcott { background-image: url(./../assets/images/about/events/greg-wolcott.jpg?w=120); } } .event-list .webinar .byron-mcclure { background-image: url(./../assets/images/about/events/byron-mcclure.jpg?w=60); background-size: contain; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .event-list .webinar .byron-mcclure { background-image: url(./../assets/images/about/events/byron-mcclure.jpg?w=120); } } .event-list .webinar .david-schuler { background-image: url(./../assets/images/about/events/david-schuler.jpg?w=60); background-size: contain; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .event-list .webinar .david-schuler { background-image: url(./../assets/images/about/events/david-schuler.jpg?w=120); } } .event-list .webinar .stephen-mcwilliams { background-image: url(./../assets/images/about/events/stephen-mcwilliams.jpg?w=60); background-size: contain; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .event-list .webinar .stephen-mcwilliams { background-image: url(./../assets/images/about/events/stephen-mcwilliams.jpg?w=120); } } .event-list .webinar .scarlett-tannetta { background-image: url(./../assets/images/about/events/scarlett-tannetta.jpg?w=60); background-size: contain; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .event-list .webinar .scarlett-tannetta { background-image: url(./../assets/images/about/events/scarlett-tannetta.jpg?w=120); } } .event-list .webinar .shawna-jensen { background-image: url(./../assets/images/about/events/shawna-jensen.jpg?w=60); background-size: contain; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .event-list .webinar .shawna-jensen { background-image: url(./../assets/images/about/events/shawna-jensen.jpg?w=120); } } .event-list .webinar .lisa-westman { background-image: url(./../assets/images/about/events/lisa-westman.jpg?w=60); background-size: contain; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .event-list .webinar .lisa-westman { background-image: url(./../assets/images/about/events/lisa-westman.jpg?w=120); } } .event-list .webinar .faith-smith { background-image: url(./../assets/images/about/events/faith-smith.jpg?w=60); background-size: contain; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .event-list .webinar .faith-smith { background-image: url(./../assets/images/about/events/faith-smith.jpg?w=120); } } .event-list .webinar .sheldon-berman { background-image: url(./../assets/images/about/events/sheldon-berman.jpg?w=60); background-size: contain; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .event-list .webinar .sheldon-berman { background-image: url(./../assets/images/about/events/sheldon-berman.jpg?w=120); } } .event-list .webinar .lyndsey-killilea { background-image: url(./../assets/images/about/events/lyndsey-killilea.jpg?w=60); background-size: contain; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .event-list .webinar .lyndsey-killilea { background-image: url(./../assets/images/about/events/lyndsey-killilea.jpg?w=120); } } .event-list .webinar .avatar-details { display: inline-block; vertical-align: text-top; } .event-list .webinar-icon { position: absolute; top: 30px; left: 30px; } .event-list .pulse-icon { position: absolute; top: 30px; right: 30px; } .event-list .webinar-type { font-size: 16px; color: #fff; } .event-list .webinar-title { margin-bottom: 15px; font-size: 30px; font-weight: 600; line-height: 38px; color: #fff; } .event-list .webinar .date-time { margin: 0; font-weight: 600; } .event-list .webinar-btn { position: absolute; bottom: 60px; background-color: #fff; padding: 10px 20px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; border: 1px solid #fff; color: #0e79c9; cursor: pointer!important; } .event-list .webinar-btn:hover { -webkit-box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.1); -moz-box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.1); box-shadow: 0px 0px 10px 5px rgba(0,0,0,0.1); cursor: pointer!important; border: 1px solid #0e79c9; } .event-list .webinar .speaker-details { display: none; } .event-list .recorded-webinar { position: relative; padding: 30px 30px 40px 30px; background-color: #47acf8; border-radius: 4px; color: #fff; } .event-list .recorded-webinar .webinar-icon { position: relative; top: 0px; left: 0px; display: inline-block; margin-right: 10px; } .event-list .recorded-webinar .webinar-type { display: inline-block; } .event-list .recorded-webinar .webinar-label { margin-bottom: 20px; } @media (max-width: 991px) { .event-list .webinar .event-description { width: 250px; } .event-list .webinar .webinar-left { width: 54% } .event-list .webinar .webinar-right { width: 46%; } .event-list .event-description { width: 36%; } } @media (max-width: 768px) { .event-list .webinar .webinar-left { width: 100%; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; } .event-list .webinar .webinar-right { display: none; } .event-list .webinar .speaker-details { display: block; } .event-list .webinar .webinar-btn { position: relative; bottom: auto; } .event-list .webinar .webinar-left { padding-bottom: 40px!important; } .event-list .webinar .date-time { margin-bottom: 30px; } .event-list .event .event-img { display: none; } .event-list .event .event-cta { margin-right: 0; } .event-list .event-description { width: 340px; } } @media (max-width: 540px) { .event-list .event-description { width: 60%; } } @media (max-width: 500px) { .event-list .event-description { width: 52%; } } /* ------------------- DEMO BANNER --------------------*/ .demo-banner { margin: 0; overflow: hidden; background-color: #8cc152; z-index: 1; } .demo-banner .fa-circle { position: relative; top: -2px; margin-right: 3px; } .demo-banner .banner-button-container .banner-btn { position: relative; padding: 10px 40px; background-color: #fff; border: 2px solid #fff; border-radius: 30px; font-size: 18px; font-weight: bold; display: inline-block; color: #8cc152; z-index: 2; } .demo-banner .banner-button-container .banner-btn:hover { background: #90d248; border: 2px solid #81b24c; color: #fff!important; box-shadow: none!important; } .demo-banner .scroll-bg-circle, .sel-research .scroll-bg-circle { position: absolute; right: 0; top: 40%; z-index: 1; } /* ------------------- WEBINAR BANNER --------------------*/ .webinar-banner { margin: 0; overflow: hidden; background-color: #47acf8; } .webinar-banner .banner-button-container .banner-btn { position: relative; padding: 10px 40px; background-color: #fff; border: 2px solid #fff; border-radius: 30px; font-size: 18px; font-weight: bold; display: inline-block; z-index: 2; } .webinar-banner .banner-button-container .banner-btn:hover { background: #219af6; border: 2px solid #0e79c9; color: #fff!important; box-shadow: none!important; } .webinar-banner .scroll-bg-circle { position: absolute; right: 0; top: 40%; z-index: 1; } .webinar-banner .title { /*font-size: 50px;*/ font-size: 45px; /*line-height: 64px;*/ line-height: 58px; font-weight: 700; margin-bottom: 28px; } .webinar-banner .sub-heading { font-size: 18px; line-height: 28px; } .webinar-banner .webinar-label { margin: 0 0 10px; font-size: 24px; font-weight: 600; } .webinar-banner .webinar-label img { position: relative; top: -4px; margin-right: 5px; } /* ------------------- PARTNERSHIPS BANNER --------------------*/ .partnerships-banner { margin: 0; overflow: hidden; } .partnerships-banner .banner-button-container .banner-btn { position: relative; padding: 10px 40px; background: transparent; border: 2px solid #0e79c9; border-radius: 30px; font-size: 18px; font-weight: 600; display: inline-block; z-index: 2; color: #0e79c9; } .partnerships-banner .banner-button-container .banner-btn:hover { background: #219af6; border: 2px solid #0e79c9; color: #fff!important; box-shadow: none!important; } .partnerships-banner .scroll-bg-circle { position: absolute; right: 0; top: 40%; z-index: 1; } .partnerships-banner .title { font-size: 36px; line-height: 48px; font-weight: 400; margin-bottom: 28px; color: #132843; } .partnerships-banner .title span { color: #da4453; } .partnerships-banner .sub-heading { font-size: 18px; line-height: 28px; } .partnerships-banner .webinar-label { margin: 0 0 10px; font-size: 20px; font-weight: 400; color: #132843; } .partnerships-banner .logo-container { margin: 40px 0; } /* ------------------- Language selector --------------------*/ /* The container must be positioned relative: */ .language-custom-select { position: relative; margin-left: 20px; } .language-custom-select select { display: none; /*hide original SELECT element: */ } .mobile-language { display: none; } .select-selected { background-color: #fff; } /* Style the arrow inside the select element: */ .select-selected:after { position: absolute; content: ""; top: 19px; right: 15px; width: 0; height: 0; border: 6px solid transparent; border-color: #333 transparent transparent transparent; } /* Point the arrow upwards when the select box is open (active): */ .select-selected.select-arrow-active:after { border-color: transparent transparent #333 transparent; top: 14px; } /* style the items (options), including the selected item: */ .select-selected { padding: 8px 16px; border-radius: 30px; border: 2px solid transparent; cursor: pointer; font-size: 15px; -webkit-box-shadow: 0px 20px 30px 0px rgba(79, 35, 35, 0.15); box-shadow: 0px 20px 30px 0px rgba(79, 35, 35, 0.15); } .pix-header-fixed .heder-inner .site-nav .select-selected { -webkit-box-shadow: none; box-shadow: none; border: 2px solid #e6e9ed; } .select-arrow-active { border: 2px solid #0e79c9!important; } .select-items div { color: #333; padding: 8px 16px; cursor: pointer; font-size: 15px; } /* Style items (options): */ .select-items { position: absolute; background-color: #fff; top: -133px; left: 0; right: 0; border-radius: 6px; -webkit-box-shadow: 0px 20px 30px 0px rgba(79, 35, 35, 0.15); box-shadow: 0px 20px 30px 0px rgba(79, 35, 35, 0.15); z-index: 99; } /* Hide the items when the select box is closed: */ .select-hide { display: none; } .select-items div:hover { background-color: rgba(245, 247, 250, 1); } .same-as-selected { background-color: rgba(14, 121, 201, 1)!important; color: #fff!important; } .select-items div:nth-child(1) { -webkit-border-top-left-radius: 6px; -webkit-border-top-right-radius: 6px; -moz-border-radius-topleft: 6px; -moz-border-radius-topright: 6px; border-top-left-radius: 6px; border-top-right-radius: 6px; } .select-items div:nth-child(2) { -webkit-border-radius: 0px; -moz-border-radius: 0px; border-border: 0px; } .select-items div:nth-child(3) { -webkit-border-bottom-right-radius: 6px; -webkit-border-bottom-left-radius: 6px; -moz-border-radius-bottomright: 6px; -moz-border-radius-bottomleft: 6px; border-bottom-right-radius: 6px; border-bottom-left-radius: 6px; } /* ------------------- Custom Header Classes --------------------*/ .h2 { margin-top: 0!important; font-family: "Open Sans", sans-serif; font-size: 36px!important; color: #2b2350; line-height: 1.2em!important; } .h2 strong { font-weight: 400!important; } .footer-widget .h3 { margin-bottom: 20px; font-size: 20px; font-weight: 500; border-bottom: 0; padding-bottom: 0; color: #fff!important; } .footer-widget .h3 strong { font-weight: 500; } .box-out { border: 1px solid #f3a100; border-radius: 6px; background-color: rgba(243,161,0,.1); padding: 20px; width: 300px; } .our-investors .box-out { margin: 0 20px!important; padding: 50px; text-align: center; cursor: pointer; } .our-investors a .box-out:hover { border: 1px solid #0e79c9; } .our-investors .box-out img { width: 100px; } .our-investors .box-out h4 { margin-bottom: 20px; } .teams .blue-group { border-bottom: 10px solid #0e79c9; } .teams .red-group { border-bottom: 10px solid #da4453; } .teams .mint-group { border-bottom: 10px solid #37bc9b; } .teams .amber-group { border-bottom: 10px solid #f3a100; } .teams .purple-group { border-bottom: 10px solid #967adc; } .teams .orange-group { border-bottom: 10px solid #ff7a22; } .teams .light-blue-group { border-bottom: 10px solid #4fc1e9; } /* ------------------- Custom Header Classes --------------------*/ .img-trail { padding: 0 0 60px; } .img-trail .interface-toparea { padding-bottom: 50px; } .img-trail .interface-image-wrapper .img-one { margin-left: -60px; margin-top: 150px; } .img-trail .interface-image-wrapper .img-two { margin-left: -60px; margin-top: 50px; } /* ------------------- School Connect --------------------*/ .school-connect { background-image: url(./../assets/images/sel/school-connect-wave.svg?w=1400); background-repeat: no-repeat; background-position: bottom left; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .school-connect { background-image: url(./../assets/images/sel/school-connect-wave.svg?w=2800); } } /* ------------------- SEL Store Promo --------------------*/ .sm-tag { position: relative; top: -1px; margin-left: 3px; font-size: 10px!important; border-radius: 4px!important; padding: 2px 5px!important; background-color: #fbdb8c; color: #333!important; } .sel-store { background-image: url(https://blog.teamsatchel.com/hubfs/Backgrounds/Yellow%20SEL%20BG.png); background-position: bottom; background-size: cover; background-repeat: no-repeat; padding: 80px 0; } .sel-store .sel-promo { display: flex; } .sel-store .text-block { flex-basis: 50%; background-color: #fff; padding: 70px; -webkit-border-top-left-radius: 10px; -moz-border-radius-topleft: 10px; -webkit-border-bottom-left-radius: 10px; -moz-border-radius-bottomleft: 10px; border-top-left-radius: 10px; border-bottom-left-radius: 10px; } .sel-store .text-block h2 { font-size: 32px; line-height: 46px; } .sel-store .img-block { position: relative; background-image: url(./../assets/images/sel/sel-promo-img.jpg?w=690); background-size: cover; background-position: center center; flex-basis: 50%; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { .sel-store .img-block { background-image: url(./../assets/images/sel/sel-promo-img.jpg?w=1380); } } .sel-block .icon-box-wrapper { -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; border: none; } .sel-store .full-block { position: relative; background-color: #fff; padding: 70px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; } .sel-store .full-block .icon-box-wrapper { margin: 0; padding: 20px; border: none; } .sel-store .full-block .icon-box-wrapper:hover { box-shadow: none; } .sel-store .full-block i { display: block; font-size: 60px; } .sel-store .ribbon { width: 150px; height: 150px; overflow: hidden; position: absolute; } .sel-store .ribbon::before, .sel-store .ribbon::after { position: absolute; z-index: -1; content: ''; display: block; border: 5px solid #2980b9; } .sel-store .ribbon span { position: absolute; display: block; width: 225px; padding: 15px 0 15px 10px; background-color: #8cc152; box-shadow: 0 5px 10px rgba(0,0,0,.1); color: #fff; font: 700 15px/1 'Lato', sans-serif; text-shadow: 0 1px 1px rgba(0,0,0,.2); text-align: center; } /* top right*/ .sel-store .ribbon-top-right { top: -10px; right: -10px; } .sel-store .ribbon-top-right::before, .sel-store .ribbon-top-right::after { border-top-color: transparent; border-right-color: transparent; } .sel-store .ribbon-top-right::before { top: 0; left: 0; } .sel-store .ribbon-top-right::after { bottom: 0; right: 0; } .sel-store .ribbon-top-right span { left: -25px; top: 30px; transform: rotate(45deg); } @media (max-width: 991px) { .sel-store .sel-promo { flex-direction: column-reverse; } .sel-store .text-block { padding: 40px; -webkit-border-top-left-radius: 0px; -moz-border-radius-topleft: 0px; -webkit-border-bottom-right-radius: 10px; -moz-border-radius-bottomright: 10px; border-top-left-radius: 0px; border-bottom-right-radius: 10px; text-align: center; } .sel-store .img-block { flex-basis: auto; width: 100%; height: 200px; } } .sel-benefits .flip .icon-box-wrapper .icon-box-content { text-align: left; } /* FLIP TRANSITION */ div.flip { width: 570px; height: 225px; display: block; position: relative; perspective: 1000px; margin-top: 30px; } div.flip-card-inner { position: relative; width: 100%; height: 100%; transition: transform 0.3s; transform-style: preserve-3d; } /* Do an horizontal flip when you move the mouse over the flip box container */ div.flip:hover .flip-card-inner { transform: rotateY(180deg); } /* Position the front and back side */ div.flip .front, div.flip .back { position: absolute; width: 100%; height: 100%; padding: 40px 35px; -webkit-backface-visibility: hidden; /* Safari */ backface-visibility: hidden; -webkit-box-shadow: 0 20px 50px 0 rgba(14, 3, 52, 0.1); box-shadow: 0 20px 50px 0 rgba(14, 3, 52, 0.1); -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; } /* Style the front side (fallback if image is missing) */ div.flip .front { background-color: #fff; color: #615f6b; } div.flip .icon-box-content { padding-left: 70px; } div.flip .icon-box-content h3 { font-size: 20px; font-weight: 600; line-height: 30px; margin-bottom: 20px; } div.flip .icon-box-icon { position: absolute; margin-bottom: 20px; font-size: 50px; color: #f3a100; border: none; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } /* Style the back side */ div.flip .back { transform: rotateY(180deg); } div.flip .cc-back { background-color: #37bc9b; } div.flip .sel-back { background-color: #f3a100; } div.flip .back h3, div.flip .back p, div.flip .back a { color: #fff; } @media (max-width: 1200px) { div.flip { width: 450px; height: 255px; } } @media (max-width: 991px) { div.flip { width: 690px; height: 225px; } } @media (max-width: 767px) { div.flip { width: 510px; height: 250px; } } @media (max-width: 520px) { div.flip { width: 100%; height: 280px; } } @media (max-width: 450px) { div.flip { width: 100%; height: 360px; } } .sel-coach img { margin: auto; border-radius: 50%; } .sel-coach .banner-content { background-color: rgba(0, 0, 0, 0.05); padding: 30px; } @media (max-width: 991px) { .sel-coach .row { text-align: center; } .sel-coach img { margin-bottom: 20px; } .sel-coach .banner-content { background-color: transparent; padding: 0px; } } /* ------------------- Two Col with Circles --------------------*/ .two-col-circles { -webkit-box-shadow: 0 20px 50px 0 rgba(14, 3, 52, 0.1); box-shadow: 0 20px 50px 0 rgba(14, 3, 52, 0.1); background: #fff; border-radius: 20px; border: none; padding: 40px 35px; -webkit-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; text-align: center; } .two-col-circles.cc-box { border: 1px solid #37bc9b; } .two-col-circles.sel-box { border: 1px solid #f3a100; } .icon-center img { margin: 0 auto 20px; } .circle-bg-left { position: absolute; top: -40px; left: -80px; opacity: 0.5; } .circle-bg-right { position: absolute; top: -40px; right: -80px; opacity: 0.5; } .circle-bg-big-right { position: absolute; top: 0px; right: -80px; opacity: 0.5; } .circle-bg-big-left { position: absolute; top: 0px; left: -80px; opacity: 0.5; } .circle-footer-left { position: absolute; top: 280px; left: -250px; opacity: 0.5; } .circle-footer-right { position: absolute; top: 280px; right: -250px; opacity: 0.5; } @media (max-width: 1200px) { .circle-footer-left { top: 270px; left: -250px; } .circle-footer-right { top: 270px; right: -250px; } } @media (max-width: 991px) { .circle-footer-left { top: 280px; left: -250px; } .circle-footer-right { top: 280px; right: -250px; } } @media (max-width: 768px) { .circle-footer-left { top: 360px; left: -200px; } .circle-footer-right { top: 360px; right: -200px; } } @media (max-width: 600px) { .circle-footer-left { top: 360px; left: -150px; } .circle-footer-right { top: 360px; right: -150px; } } .quote-box .text-holder { position: relative; margin-left: 30px; margin-bottom: 50px; padding-left: 100px; } .quote-box .text-holder img { position: absolute; left: 0; } .quote-box .cta-wrapper a { font-size: 16px; } .four-col .icon-box-wrapper .icon-center { margin-bottom: 20px; font-size: 60px; } /* ------------------- YOUR STATE --------------------*/ .state-text .pill { display: inline-block; -webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px; padding: 10px 20px; color: #333; } .state-text .pill.yellow { background-color: rgba(243,161,0,.05); border: 1px solid rgba(243,161,0, 1); } .state-text .pill.green { background-color: rgba(140,193,82,.05); border: 1px solid rgba(140,193,82, 1); } .state-text .pill.purple-s { background-color: rgba(150,122,220,.05); border: 1px solid rgba(150,122,220, 1); } .state-text .pill.red { background-color: rgba(218,68,83,.05); border: 1px solid rgba(218,68,83, 1); } .state-text blockquote { margin: 30px 0; font-size: 30px; line-height: 40px; color: #aab2bd; font-style: italic; } .box-out { border: 1px solid #e6e9ed; border-radius: 10px; background-color: transparent; } /* ------------------- TABLE --------------------*/ .table-check-list { width: 100%; margin: 0 auto 20px; display: inline-table; border: 1px solid rgba(243, 161, 0, 1); border-collapse: separate; border-radius: 10px; border-spacing: 0px; } .table-check-list.perceptions { width: 100%; margin: 0 auto 20px; display: inline-table; border: 1px solid rgb(122 243 0); border-collapse: separate; border-radius: 10px; border-spacing: 0px; } .table-check-list thead td { padding: 20px; background-color: rgba(243, 161, 0, 0.1); color: #333; } .table-check-list.perceptions thead td { padding: 20px; background-color: rgb(152 199 101); color: #333; } .table-check-list td { padding: 20px; border: 1px solid rgba(243, 161, 0, 0.2); vertical-align: top; font-size: 18px; } .table-check-list.perceptions td { padding: 20px; border: 1px solid rgb(152 199 101); vertical-align: top; font-size: 18px; } .table-check-list td i { font-size: 22px; } .table-check-list .br-corner { -webkit-border-bottom-right-radius: 10px; -moz-border-radius-bottomright: 10px; border-bottom-right-radius: 10px; } .table-check-list .bl-corner { -webkit-border-bottom-left-radius: 10px; -moz-border-radius-bottomleft: 10px; border-bottom-left-radius: 10px; } .table-check-list thead td:last-of-type { -webkit-border-top-right-radius: 10px; -moz-border-radius-topright: 10px; border-top-right-radius: 10px; } .table-check-list thead td:first-of-type { -webkit-border-top-left-radius: 10px; -moz-border-radius-topleft: 10px; border-top-left-radius: 10px; } /*-------------------------------------------------------------- ## SOLUTIONS --------------------------------------------------------------*/ blockquote.quote-post.size-medium.mint-quote { min-height: 250px; } .long-text-content .row div { padding-right: 30px; } .long-text-content .box-out { margin-bottom: 30px; border-radius: 10px; padding: 30px; } .long-text-content .box-out ul li { margin-bottom: 15px; } .long-content-img { margin: 30px 0 50px; border-radius: 20px; } .long-text-content h3 { line-height: 40px; } .long-text-content h5 { margin-top: 40px; } .long-text-content .box-out p { margin: 0; } .long-text-content .box-out img { margin-right: 5px; } .long-text-content .mint-box { background: rgba(55, 188, 155, 0.1); border: 1px solid #37bc9b; } .long-text-content .purple-box { background: rgba(150, 122, 220, 0.1); border: 1px solid #967adc; } .long-text-content .soft-blue-box { background: rgba(93, 156, 236, 0.1); border: 1px solid #5d9cec; } .long-text-content blockquote { margin: 30px 0; display: block; } .long-text-content .quote-post { position: relative; padding: 50px; border-bottom: 0; overflow: hidden; border-radius: 10px; } .long-text-content .quote-post.mint-quote { background: rgba(55, 188, 155, .1); } .long-text-content .quote-post.yellow-quote { background: rgba(243, 161, 0, .1); } .long-text-content .quote-post p { font-size: 24px; font-weight: 400; line-height: 40px; margin-bottom: 30px; position: relative; z-index: 2; } .long-text-content .quote-post i { position: absolute; right: 50px; bottom: 20px; font-size: 80px; } .long-text-content .quote-post.mint-quote i { color: rgba(55, 188, 155, .25); } .long-text-content .quote-post.yellow-quote i { color: rgba(243, 161, 0, .25); } .long-text-content .quote-post span { font-size: 16px; font-weight: 600; color: #333; } .long-text-content .quote-post.size-medium p { font-size: 16px; font-weight: 400; line-height: 30px; margin-bottom: 25px; position: relative; z-index: 2; } /* ------------------- Research banner --------------------*/ .research-banner { overflow: hidden; padding: 60px 0; } .research-banner img { border-radius: 10px; } .research-banner h3 { margin-bottom: 20px; font-size: 46px; font-weight: 400; line-height: 54px; } .research-banner p { margin-bottom: 25px; font-size: 18px; font-weight: 400; line-height: 30px; } .research-banner .banner-image-panel { /*position: absolute; top: -100px;*/ } @media (max-width: 1200px) { .research-banner { padding: 100px 0; } .research-banner img { position: relative; left: -30px; scale: 1.2; } } @media (max-width: 991px) { .research-banner { text-align: center; } .research-banner a { margin: auto; margin-bottom: 40px; } .research-banner img { position: relative; left: auto; width: 400px; scale: 1; } } /* ------------------- ABOUT US --------------------*/ .about-content { padding-right: 50px; } /*-------------------------------------------------------------- ## Funfact --------------------------------------------------------------*/ .countup { padding: 116px 0 120px; } .countup .pix-btn { margin-top: 62px; position: relative; z-index: 2; } .countup .scroll-circle { top: 58%; } .countup-two { padding: 100px 0 20px; } .countup-wrapper { position: relative; z-index: 22; } .fun-fact { margin-bottom: 30px; } .fun-fact .count, .fun-fact span { font-size: 50px; font-weight: 400; margin: 0; line-height: 1.2; color: #7052fb; display: inline-block; } .fun-fact p { font-size: 18px; margin: 0; } .fun-fact.color-two .count, .fun-fact.color-two span { color: #fa7070; } .fun-fact.color-three .count, .fun-fact.color-three span { color: #22cd1a; } .fun-fact.color-four .count, .fun-fact.color-four span { color: #f62ee1; } .fun-fact.style-two .count, .fun-fact.style-two span { font-size: 40px; color: #1a133b; } .fun-fact.style-two p { font-size: 14px; color: #615f6b; } .countup-wrapper-two { padding-bottom: 60px; } .fun-fact-two { text-align: center; margin-bottom: 50px; } .fun-fact-two .icon-container { border-radius: 10px; height: 60px; width: 60px; line-height: 68px; background: rgba(112, 82, 251, 0.141); margin: 0 auto 20px; } .fun-fact-two .icon-container i { font-size: 25px; color: #7052fb; } .fun-fact-two .counter p { font-size: 20px; color: #5e5b74; } .fun-fact-two .counter h4 { font-size: 54px; font-weight: 300; color: #7052fb; } .fun-fact-two.color-two .icon-container { background: rgba(253, 176, 26, 0.141); } .fun-fact-two.color-two .icon-container i { color: #fdb01a; } .fun-fact-two.color-two .counter h4 { color: #fdb01a; } .fun-fact-two.color-three .icon-container { background: rgba(246, 74, 143, 0.141); } .fun-fact-two.color-three .icon-container i { color: #f64a8f; } .fun-fact-two.color-three .counter h4 { color: #f64a8f; } .fun-fact-two.color-four .icon-container { background: rgba(80, 205, 138, 0.141); } .fun-fact-two.color-four .icon-container i { color: #50cd8a; } .fun-fact-two.color-four .counter h4 { color: #50cd8a; } @media (max-width: 991px) { .countup .scroll-circle { left: -30%; } .countup { padding: 76px 0 75px; } .countup .pix-btn { margin-top: 30px; } .countup-two { padding-bottom: 80px; } } @media (max-width: 768px) { .countup .scroll-circle { left: -30%; } } @media (max-width: 576px) { .fun-fact { text-align: center; } } /* custom spaces */ .mt-3px { margin-top: 3px; } .our-mission-cards { /* min-height: 450px; */ /* max-height: 570px; */ border-radius: 16px; background-color: white; -webkit-box-shadow: 10px 12px 40px 10px rgba(43, 35, 79, 0.1); box-shadow: 10px 12px 40px 10px rgba(43, 35, 79, 0.1); overflow: hidden; margin-bottom: 30px; } .circletag { display: flex; justify-content: center; border: 2px solid #37bc9b; width: 75px; height: 75px; text-align: center; align-content: center; align-items: center; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; } .circletag>i { max-height: 100%; max-width: 100%; font-size: 48px; font-weight: 400; color: #f7a900; } .our-mission-cards--content { display: flex; flex-direction: column; align-items: center; padding: 48px 30px 30px 30px; font-size: 16px; gap: 16px; } .our-mission-cards--content > p{ font-size: 18px; text-align: center; } .our-mission-cards--content .entry-title { font-size: 22px; line-height: 30px; } .our-mission-cards--content .entry-title strong { font-weight: 600; } /* custom links styling */ .custom-list-group { width: 100%; display: flex; flex-direction: column; gap: 12px; } .custom-list-group > .custom-list-group-item { border: 1px solid rgba(0,0,0,.125); border-radius: 5px; padding: 22px; color: #495057; background: white; display:flex; align-items: center; gap: 14px; } /* .custom-list-group-item > a { color: #495057; } */ .custom-caret { font-size: 30px; } .orange-theme > i { color: #f3a100 !important; } .orange-theme > a { color: #495057; } .orange-theme:hover { border-color: #f3a100 !important; color: #f3a100 !important; box-shadow: 0px 4px 6px 0px rgba(79, 35, 35, 0.14); } .orange-theme:hover > a { color: #f3a100 !important; } .green-theme > i { color: #37bc9b !important; } .green-theme > a { color: #495057; } .green-theme:hover { border-color: #37bc9b !important; color: #37bc9b !important; box-shadow: 0px 4px 6px 0px rgba(79, 35, 35, 0.14); } .green-theme:hover > a { color: #37bc9b !important; } .testimonial-card { min-height: 300px; border: 1px solid; border-radius: 20px; padding: 12px; } .orange-borders { border-color: #f3a100 !important; } .orange-borders:hover { box-shadow: 0px 40px 60px 0px rgba(79, 35, 35, 0.14); } .mint-borders { border-color: #37bc9b !important; } .mint-borders:hover { box-shadow: 0px 40px 60px 0px rgba(79, 35, 35, 0.14); } .partners-flex { display: flex; flex-direction: column; } .text-mint { color: #37bc9b !important; } .text-orange { color: #f3a100 !important; } .text-old-rose { color: #c76d89 !important; } .our-products-and-services { position: relative; overflow: hidden; background: #F8FAFD; } .section-sub-title p{ width: 70%; color: #3a3a3a !important; } /* generic cards */ .generic-cards { background-color: #fff; border-radius: 2px; border-color: rgba(43, 35, 79, 0.1); /* background-color: white; -webkit-box-shadow: 10px 12px 40px 10px rgba(43, 35, 79, 0.1); box-shadow: 10px 12px 40px 10px rgba(43, 35, 79, 0.1); */ overflow: hidden; margin-bottom: 30px; } .generic-cards .circletag { display: flex; justify-content: center; border: 2px solid; width: 60px; height: 60px; text-align: center; align-content: center; align-items: center; border-radius: 50%; -moz-border-radius: 50%; -webkit-border-radius: 50%; } .circletag>i { max-height: 100%; max-width: 100%; font-size: 30px; font-weight: 400; color: #f7a900; } .circletag.mint { border-color: #37bc9b !important; } .circletag.orange { border-color: #f3a100 !important; } .circletag.old-rose { border-color: #c76d89 !important; } .generic-cards--content { display: flex; flex-direction: column; align-items: center; align-items: center; padding: 48px 30px 30px 30px; font-size: 16px; gap: 16px; min-height: 329px; } .generic-cards--content > p{ font-size: 18px; text-align: center; } .generic-cards--content .entry-title { font-size: 22px; line-height: 30px; } .generic-cards--content .entry-title strong { font-weight: 600; } .custom-generic-card { padding: 48px 23px 30px 23px !important; height: auto !important; min-height: auto !important; } .custom-cards--content { display: flex; flex-direction: column; align-items: center; align-items: center; padding: 48px 23px 30px 23px; font-size: 16px; gap: 16px; } .custom-cards--content > .circletag > i { color: #37bc9b } .custom-cards--content > p{ font-size: 18px; text-align: center; } .custom-cards--content .entry-title { font-size: 22px; line-height: 30px; } .custom-cards--content .entry-title strong { font-weight: 600; } .mt-25 { margin-top: 25px !important; } .label-title { color: #3a3a3a; } .box-wrapper { width: max-content; } .bordered-box { border: 1px solid; padding: 30px; /* width: auto; height: 200px; */ display: flex; align-items: center; } .bordered-box.rounded-gray { border-radius: 8px; border-color: #eaebef; } .flex-column { width: 100%; display: flex; /* gap: 20px; */ } .custom-box-group { width: 100%; display: flex; flex-direction: row; gap: 22px; justify-content: center; flex-wrap: wrap; } .custom-box-group-banners { width: 100%; display: flex; flex-direction: row; gap: 22px; align-items: center; justify-content: center; } .custom-box-group > .custom-box-group-item { border: 1px solid rgba(0,0,0,.125); border-radius: 5px; padding: 40px; color: #495057; background: white; display:flex; align-items: center; } .custom-box-group-banners > .custom-box-group-item-banner { border: 1px solid rgba(0,0,0,.125); border-radius: 5px; padding: 22px; color: #495057; display:flex; align-items: center; justify-content: center; flex-wrap: wrap; flex-direction: column; width: 25%; height: 100%; justify-content: space-between; } .custom-box-group-item-banner > p { font-size: 18px; } .award-section { padding-top: 0; padding-bottom: 0; background-image: url(./../assets/images/features/award-banner.png?w=2080); } .award-section--flex-container { display: inline-flex; height: auto; align-items: center; gap: 50px; padding-top: 100px; padding-bottom: 100px; flex-wrap: wrap; justify-content: center; } .award-section--flex-container > .left-panel { color: #fff; /* padding: 20px 20px 20px 75px; */ font-size: 55px; line-height: 65px; width: 50%; } .award-section--flex-container > .right-panel { color: #fff; /* padding: 20px 20px 20px 75px; */ width: auto; } .award-section--flex-container > .right-panel > .image-border { background: white; padding: 20px 60px; -webkit-border-radius: 80px; -webkit-border-top-right-radius: 1px; -webkit-border-bottom-left-radius: 1px; -moz-border-radius: 80px; -moz-border-radius-topright: 1px; -moz-border-radius-bottomleft: 1px; border-radius: 120px; border-top-right-radius: 1px; border-bottom-left-radius: 1px; } .ml1px { margin-left: 1px; } .center-inline-flex > a { display: inline-flex!important; align-items: center; gap: 2px; color: #0e7cdc; margin-bottom: 22px; } .rounded-corners10 { border-radius: 10px; } .how-it-works-item { padding: 0 8px 8px 8px; border-radius: 10px; } .how-it-works-circles { position: absolute; top: -40px; left: -80px; opacity: 0.5; } li.border-lined { margin: 0 0 !important; padding: 20px 40px 20px 40px !important; height: 120px; border-bottom: 2px solid #f5f7fa !important; } li.border-lined:first-child { margin: 0 0 !important; padding: 20px 40px 20px 40px !important; height: 120px; border-bottom: 2px solid #f5f7fa !important; } li.border-lined:last-child { margin: 0 0 !important; padding: 20px 40px 20px 40px !important; height: 120px; border-bottom: none !important; } .solutions-menu li.grey-box { margin: 5px 3px 5px 5px !important; padding: 20px 40px 20px 40px !important; height: 120px; background-color: #f5f7fa; border-radius: 10px; } .solutions-menu li.grey-box p { margin-bottom: 0; } .solutions-menu .grey-box-right li.grey-box { margin: 5px 5px 5px 3px !important; } .solutions-menu li.border-box-left { margin: 0!important; padding: 20px 40px 20px 40px !important; height: 120px; border-bottom: 1px solid #eee; text-align: left; } .solutions-menu li.border-box-left p { margin-bottom: 0; } .solutions-menu li.border-box-right { margin: 0!important; padding: 20px 40px 20px 40px !important; height: 120px; border-bottom: 1px solid #eee; border-left: 1px solid #eee !important; text-align: left; } .flex-row-block { display: flex; flex-direction: column; } .flex-row-block .items { display: flex; } /* FLEX MENU - Resources nav */ .sub-menu.flex-menu { display: flex; width: auto; left: -308px !important; padding: 0 !important; } /* */ .sub-menu.flex-menu::before { border-bottom: 16px solid #f8fafd !important; } .sub-menu.flex-menu > .left-menu { width: 330px; border-right: 2px solid #f5f7fa; /* padding: 20px 30px 20px 30px; */ } .sub-menu.flex-menu > .right-menu { width: 360px; padding: 20px; border-radius: 10px; } .sub-menu.flex-menu > .right-menu > span { color: #333 } .demos-container { display: flex; gap: 10px; flex-direction: column; margin-top: 10px; } .demos-container > .demos-box { background-color: #fff; } .demos-container > .demos-box > .box-content { display: flex; flex-direction: row; gap: 10px; padding: 10px; border: 1px solid transparent; border-radius: 6px; } .demos-container > .demos-box > .box-content:hover { border: 1px solid #f3a100; } .box-content > .image-wrapper { padding: 0px; } .box-content > .image-wrapper > img { height: auto; width: auto; max-width: 70px; border-radius: 4px; } .box-content > .content-wrapper > span { color: #333 !important; font-size: 16px !important; font-weight: 600 !important; } .box-content > .content-wrapper > p { color: #797687 !important; font-size: 14px !important; font-weight: 400 !important; margin-bottom: 3px !important; } .box-content > .content-wrapper > a { font-size: 14px !important; font-weight: 400 !important; margin-bottom: 3px !important; color: #007bff !important; } .flex-menu-list { padding: 0 !important; } .flex-menu-list-item { padding: 20px 30px 0px 30px !important; border-bottom: 2px solid #f5f7fa; } .flex-menu-list-item:last-child { padding: 0; border-bottom: none; } .flex-menu-list-item > a { padding: 0 !important; } .flex-menu-list-item > a > p { margin-top: 3px; } .pricing-box { border: solid #EAEDF1 1px; background-color: #ffffffde; border-radius: 20px; margin: 20px 0px; z-index: 2; padding: 20px; } .pricing-form fieldset.form-columns-2 { display: flex; align-items: start; line-height: normal !important; margin-left: 0 !important; } .pricing-text { line-height: 31px; } .callout-box { padding: 20px; border-radius: 10px; text-align: justify; } .callout-box p { font-size: 0.9em; font-style: normal; } .content-image.climate-theme{ border: 2px solid #37bc9b; border-radius: 12px; } .content-image.survey-theme{ border: 2px solid #5d9cec; border-radius: 12px; } .content-image.voice-theme{ border: 2px solid #967adc; border-radius: 12px; } .content-image.solutions-theme{ border: 2px solid #f3a100; border-radius: 12px; } .content-image.skill-theme{ border: 2px solid #f3a100; border-radius: 12px; } .content-image img.long-content-img { width: 100%; } img.long-content-img.cover-nomargin { margin: 0px !important; border-radius: 9px; } .content-image.skill-theme img.long-content-img { width: 100% !important; height: auto !important; margin: 10px 0 10px !important; border-radius: 0 !important; } .content-image.skill-theme img.long-content-img.cover-nomargin { width: 100% !important; height: auto !important; margin: 0px !important; border-radius: 9px !important; } @media (max-width: 768px) { .content-image.skill-theme img.long-content-img { width: 100% !important; height: auto !important; margin: 10px 0 10px !important; border-radius: 0 !important; } } #teacher-retention-content .content-wrapper .row p { text-align: left; } .content-wrapper .row .flex-col { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; } .carousel-control-next.custom-black, .carousel-control-prev.custom-black { filter: invert(50%); } .carousel-indicators.carousel-quote { padding-bottom: 17px; filter: invert(50%); } @media (min-width: 993px) { .carousel-control-next.custom-black { justify-content: end; padding-right: 1em; } .carousel-control-prev.custom-black{ justify-content: start; padding-left: 1em; } } @media (max-width: 990px) { .carousel-control-next.custom-black { display: none; } .carousel-control-prev.custom-black{ display: none; } .p80-width { width: 80%; } .p90-width { width: 90%; } } /* Custom Boxes */ .custom-content-box { padding: 30px; border-radius: 18px; } .rounded-corners { border-radius: 24px !important; } .clean-table { width: 100%; margin: 0 auto; border-radius: 12px; } .clean-table tr td p { padding: 2px; margin: 2px; } .shadowed-box { min-height: 140px; padding: 1.3em; border-radius: 10px; border: 1px grey; box-shadow: -4px 15px 5px -8px rgba(0,0,0,0.05); -webkit-box-shadow: -4px 15px 5px -8px rgba(0,0,0,0.05); -moz-box-shadow: -4px 15px 5px -8px rgba(0,0,0,0.05); } .round-img-building-belonging { background-color: white; width: 150px; height: 150px; padding: 20px; border-radius: 50%; margin: 0 auto; background-image: url(./../assets/images/building-belonging/bb-image.png); background-position: center; background-size: contain; background-repeat: no-repeat; } .custom-title { font-size: 21px; font-weight: 600; } .lesson-cards div p { margin-bottom: 0; } .arrow-container { display: block; } .arrow-container.hide-on-full { display: none !important; } .arrow { display: block; height: 4px; background-color: #f3a100; position: relative; &:after { position: absolute; content: " "; display: inline-block; right: -40%; top: -6px; width: 8px; height: 10px; border-top: 8px solid transparent; border-bottom: 8px solid transparent; border-right: 8px solid transparent; border-left: 8px solid #f3a100; z-index: 2; } } .arrow.perception-theme { display: block; height: 4px; background-color: #36bc9b; position: relative; &:after { position: absolute; content: " "; display: inline-block; right: -40%; top: -6px; width: 8px; height: 10px; border-top: 8px solid transparent; border-bottom: 8px solid transparent; border-right: 8px solid transparent; border-left: 8px solid #36bc9b; z-index: 2; } } .dotted { display: block; background-image: linear-gradient(90deg, #ffffff 5px, #fb8f4c 0); background-size: 10px 3px; background-position: 0 100%; } .dotted.perception-theme { display: block; background-image: linear-gradient(90deg, #ffffff 5px, #36bc9b 0); background-size: 10px 3px; background-position: 0 100%; } .dotted-horizontal { display: block; background-image: linear-gradient(90deg, #ffffff 5px, #fb8f4c 0); background-size: 10px 3px; background-position: 0 100%; } .arrow-spacing { display: block; left: 110%; width: 24%; top: 3.5em; } @media (max-width: 1182px) { .arrow-spacing { left: 115%; width: 30%; } } @media (max-width: 1024px) { .arrow-spacing { left: 115%; width: 30%; } } @media (max-width: 991px) { .arrow-container.hide-on-full { display: block !important; } .arrow-container.hide-on-three { display: none !important; } .arrow-spacing { left: 115%; width: 30%; } } @media (max-width: 767px) { .arrow-container { display: none !important; } .arrow-container.hide-on-full { display: none !important; } } iframe.bb-popup { position: absolute; display: block; top: -35%; left: 0; width: 100%; height: 178%; box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); background: #000; } button.bb-close { top: -45% !important; } .card-wrapper { display: flex; flex-direction: column; justify-content: center; align-items: center; /* padding: 50px; */ font-family: 'Roboto', sans-serif; } .card { width: 24rem; height: 36rem; border-radius: 10px; overflow: hidden; cursor: pointer; position: relative; color: rgb(240, 240, 240); box-shadow: 0 10px 30px 5px rgba(0, 0, 0, 0.2); .hover-screen { opacity: 1; } img { position: absolute; object-fit: cover; width: 100%; height: 100%; top: 0; left: 0; opacity: 0.9; transition: opacity .2s ease-out; } h2 { position: absolute; inset: auto auto 30px 30px; margin: 0; transition: inset .3s .3s ease-out; font-family: 'Roboto Condensed', sans-serif; font-weight: normal; text-transform: uppercase; color: white; } p, a { position: absolute; opacity: 0; max-width: 80%; transition: opacity .3s ease-out; } p { inset: auto auto 80px 30px; } a { inset: auto auto 40px 30px; color: inherit; text-decoration: none; } &:hover h2 { inset: auto auto 270px 30px; transition: inset .3s ease-out; } &:hover p, &:hover a { opacity: 1; transition: opacity .5s .1s ease-in; } &:hover img { transition: opacity .3s ease-in; opacity: 1; } } .material-symbols-outlined { vertical-align: middle; } .perception-box { border: 1px solid #37BC9B !important; min-height: 170px; align-content: center; } .purple-small-card { background-color: #967adc24; padding: 2em; border-radius: 10px; } .iframe-form-wrapper { height: 580px; } @media (min-width: 992px) and (max-width: 1199px) { .iframe-form-wrapper { height: 792px; } } @media (min-width: 300px) and (max-width: 991px) { .iframe-form-wrapper { height: 1032px; } } #cta .sub-heading { margin-bottom: 40px; } .iframe-form-wrapper.pricing-form { height: 641px; } @media (min-width: 992px) and (max-width: 1199px) { .iframe-form-wrapper.pricing-form { height: 792px; } } @media (min-width: 300px) and (max-width: 991px) { .iframe-form-wrapper.pricing-form { height: 1032px; } } .iframe-form-wrapper.get-in-touch-form { height: 982px; } @media (min-width: 992px) and (max-width: 1199px) { .iframe-form-wrapper.get-in-touch-form { height: 972px; } } @media (min-width: 300px) and (max-width: 991px) { .iframe-form-wrapper.get-in-touch-form { height: 1032px; } } .new-left-panel-testimonial { width: 30%; } .new-left-panel-testimonial img { margin: 0 auto; } .generic-box { padding: 2rem; background: white; border-radius: 18px; } .bys-how-we-help { height: 100%; } .bys-how-we-help img { height: 100%; object-fit: cover; } @media (max-width: 991px) { .bys-how-we-help { padding-bottom: 24px; } } .nav-icon-style::before { font-size: 22px; margin-right: 15px; font-weight: 400; } .nav-icon-solutions::before { position: relative; top: 2px; font-size: 19px; margin-right: 3px; font-weight: 400; } .quote-wall.testimonials-two { background-color: #fff; } .quote-wall.testimonials-two .swiper-container { padding-bottom: 20px; } blockquote.blocked-quote { border: solid 1px #37bc9b; padding: 2.2rem; border-radius: 12px; min-height: 215px; display: flex; justify-content: center; align-items: center; } .quote-wall.testimonials-two blockquote.blocked-quote { margin: 30px 0 50px!important; background-color: #fff; } .quote-wall blockquote.blocked-quote { min-height: 140px; } blockquote.blocked-quote .block-icon { background-color: #f4f6fc; width: 70px; height: 70px; display: flex; align-items: center; justify-content: center; border-radius: 50%; position: absolute; top: -6px; /* right: 42%; */ } blockquote.blocked-quote .block-icon i { font-size: 36px; } blockquote.blocked-quote p { font-size: 20px; margin-bottom: 0px; } .quote-wall.testimonials-two blockquote.blocked-quote .quote-2 { top: 185px; } .testimonial-wrapper.bys-testimonials { margin: 0 auto; } /* .compact-nav--solutions .sub-menu ul.menu-block li.border-lined { height: auto; } .compact-nav--solutions ul.solutions-list { padding: 0; margin-top: 10px; } .compact-nav--solutions ul.solutions-list li{ margin: 0 !important; } .site-header .site-main-menu li .sub-menu .feature-list .solutions-list img { width: 35px; } .compact-nav--title { color: #333; font-weight: 600; } li.feature-menu .sub-menu.products-compact-menu { min-width: 1085px; display: flex; flex-direction: column; } li.feature-menu .sub-menu.products-compact-menu .menu-column { padding: 14px; } li.feature-menu .sub-menu.products-compact-menu .column-divider { width: 100%; border-bottom: 2px solid #f5f7fa !important; } ul.menu-list--wrapper { display: flex; flex-direction: row; align-content: center; justify-content: center; align-items: stretch; padding: 0; gap: 0.6em; } .menu-list--item-container { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 14px; } li.menu-list--item { width: 25%; margin: 0px !important; padding: 10px; height: 160px; } .menu-list--item-title a{ font-weight: 600; display: flex; } .menu-list--item-title a:hover{ font-weight: 600; display: flex; } .menu-list--item-description { text-align: center; } .site-nav .menu-wrapper-v2 { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: relative; } .menu-wrapper-v2:before { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.75); z-index: 99; opacity: 0; visibility: hidden; -webkit-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .site-header .site-main-menu li:hover .sub-menu { opacity: 1; visibility: visible; top: 80px; min-height: 400px; background: #EFF2F8; } .sub-menu.double-panel-list.new-products { display: flex !important; flex-direction: row; padding: 0 !important; background-color: #eef2f8; min-width: 380px; border-radius: 6px; margin: 0 !important; } .sub-menu.double-panel-list.new-products { display: flex !important; flex-direction: row; } .sub-menu.double-panel-list.new-products { left: -390px !important; min-width: 822px; align-items: flex-start; border-radius: 6px; } .double-panel-list.new-products .left-panel { min-width: 272px; background-color: #EFF2F8 !important; } .double-panel-list.new-products .left-panel { padding: 4px 0 4px 4px; } .double-panel-list.new-products .left-panel:first-child { border-radius: 6px 0 0 0; } .double-panel-list.new-products .left-panel:last-child { border-radius: 0 6px 6px 0; } .sub-menu.double-panel-list.new-products .right-panel{ min-width: 600px; background-color: #fff; padding: 4px 8px; height: 90%; display: flex; flex-direction: column; align-items: center; gap: 10px;; } .new-products .left-panel .panel-item { padding: 15px 15px 15px 16px; } .site-header .menu-wrapper-v2 .site-main-menu li .sub-menu li a:hover, .site-header .menu-wrapper-v2 .site-main-menu li .sub-menu li a.current_page, .site-header .menu-wrapper-v2 .site-main-menu li.menu-item-has-children ul .left-panel .panel-item a:hover p, .site-header .menu-wrapper-v2 .site-main-menu li.menu-item-has-children ul .left-panel .panel-item a:hover b { color: #0E79C9; } .new-products .left-panel .panel-item { padding: 15px 15px 15px 16px; } .new-products .left-panel .panel-item b{ font-size: 14px; color: #333333; } .new-products .left-panel .panel-item p{ font-size: 14px; color: #656D78; } .new-products .left-panel .panel-item.active, .new-products .left-panel .panel-item.selected { background: #fff; border-radius: 4px; } .site-main-menu.new-compact-nav .sub-menu{ min-height: 400px; background: #EFF2F8; } .products.double-panel-list.new-products .right-panel { min-width: 546px; background-color: #eef2f8; padding: 4px 8px; height: 100%; display: flex; flex-direction: column; align-items: center; gap: 10px; } .right-panel .item-card { width: 100%; background-color: white; padding: 10px; border-radius: 4px; display: flex; flex-direction: row; align-items: center; gap: 20px; min-height: 160px; } .products.double-panel-list.new-products .right-panel .item-card { width: 100%; background-color: #fff !important; padding: 10px; border-radius: 4px; display: flex; flex-direction: row; align-items: center; gap: 20px; } .new-products .right-panel.selection { margin: 3px 8px; } .new-products .right-panel.selection.panel-1.active { display: flex !important; opacity: 1; transition: opacity .5s ease; border-radius: 0 6px 6px 0; height: 100%; } .new-products .right-panel.selection.panel-1.inactive { display: none !important; opacity: 0; transition: opacity 0.5s ease } .new-products .right-panel.selection.panel-2.active { display: flex !important; opacity: 1; transition: opacity 0.5s ease; border-radius: 0 6px 6px 0; } .new-products .right-panel.selection.panel-2.inactive { display: none !important; opacity: 0; transition: opacity 0.5s ease; } .double-panel-list.new-products .right-panel .item-card { min-height: 520px; flex-direction: column; padding-left: 30px; padding-right: 30px; padding-top: 26px; padding-bottom: 26px !important; } .new-products .right-panel.selection .body-content.two-columns { display: flex; width: 100%; flex-wrap: wrap; row-gap: 25px; } .new-products .right-panel .body-content.two-columns .body-item { display: flex; width: 50%; gap: 10px; } .new-products .right-panel .body-content.two-columns .body-item .icon-left img { width: 45px; height: 45px; } .body-item .label-right b{ color: #333333; font-size: 14px; } .body-item .label-right p{ color: #656D78; font-size: 14px; margin-bottom: 0 !important; } .body-item .label-right-title { display: flex; gap: 10px; } .label-right-title svg { width: 12px; fill: #0E79C9; transform: translateX(-5px); opacity: 0; transition: opacity 0.3s ease-in; } .label-right:hover .label-right-title svg { opacity: 1; } .horizontal-line { border: 1px solid #eff2f8; width: 100%; } */ /* NEW HERO */ .hero-image-title { display: inline-flex; align-items: center; gap: 1em; } .hero-image-title h1 { margin: 0; } .pxs-btn.white.banner-btn.skills-btn { background: white !important; color: #f3a100 !important; border: 2px solid #f3a100 !important } .pxs-btn.white.banner-btn.skills-btn:hover { background: #f3a100 !important; color: white !important; } .pxs-btn.white.banner-btn.mint-product-btn { background: white !important; color: #37bc9b !important; border: 2px solid #37bc9b !important } .pxs-btn.white.banner-btn.mint-product-btn:hover { background: #37bc9b !important; color: white !important; } .pxs-btn.white.banner-btn.soft-blue-product-btn { background: white !important; color: #5d9cec !important; border: 2px solid #5d9cec !important } .pxs-btn.white.banner-btn.soft-blue-product-btn:hover { background: #5d9cec !important; color: white !important; } .dot-shape-carousel { display: block; position: absolute; bottom: 15px; left: 40px; z-index: -1; -webkit-animation: wave 8s infinite linear; animation: wave 8s infinite linear; scale: 1.15; } .hero-blob-bg { border-radius: 70% 30% 37% 63% / 61% 49% 51% 39%; height: 500px; width: 530px; background: white; /* default bg */ } .carousel-navigation-wrapper { display: inline-flex; gap: 12px; align-items: center; } .carousel-navigation-wrapper .carousel-nav { width: 20px; height: 20px; background: blue; border-radius: 50%; } .carousel-navigation-wrapper .carousel-nav.active, .carousel-navigation-wrapper .carousel-nav:hover{ background: #3677c4; } .carousel-navigation-wrapper .carousel-nav.inactive{ background: #c7dcee; } .selected-to-show { display: block !important; } .unselected-to-show { display: none !important; } /* hero-option- */ #home .banner-title.new-hero { font-size: 50px !important; line-height: 66px !important; } .carousel-hero-img { width: 100%; position: relative; right: -50px; Filter: drop-shadow(0px 3px 20px rgba(0, 0, 0, .1)); } .hero-image-title img { width: 50px; height: 50px; } @media screen and (max-width: 1199px) and (min-width: 992px) { #home .banner-title.new-hero { font-size: 40px !important; line-height: 56px !important; margin-bottom: 20px !important } .hero-image-title img { width: 40px !important; height: 40px !important; } #home .banner-content-wrapper-six .subtitle.custom-hero-subtitle.subtitle { font-size: 20px; line-height: 34px; } .dot-shape-carousel { scale: 0.9; bottom: -70px; left: -35px; } .hero-custom-banner.banner.banner-six .banner-content-wrapper-six { max-width: 88%; } .carousel-hero-img { scale: 1.15px; } } @media screen and (max-width: 991px) { .col-md-5 { max-width: 100%; flex: 0 0 100%; } .col-md-7 { max-width: 100%; flex: 0 0 100%; } .hero-subtitle-1, .hero-subtitle-2, .hero-subtitle-3, .hero-image-title { text-align: center; } .carousel-navigation-wrapper { text-align: center; width: 100%; justify-content: center; margin-bottom: 2em; } .cta-hero-btn-wrapper{ text-align: center; width: 100%; justify-content: center; } /* .hero-custom-banner.banner.banner-six .banner-content-wrapper-six { min-height: 130vh; } */ .dot-shape-carousel { bottom: -1em; left: 0; scale: 1; } .carousel-hero-img { width: 100%; position: relative; right: -20px; top: -20px; Filter: drop-shadow(0px 3px 20px rgba(0, 0, 0, .1)); margin-top: 10px; } .hero-buttons, .hero-buttons-2 { margin-bottom: 0 !important; } } @media screen and (max-width: 767px) { .col-md-7 { margin-top: 100px; } } @media screen and (max-width: 550px) { .dot-shape-carousel { scale: 0.9 !important; bottom: -1em; } #home .banner-title.new-hero { font-size: 32px !important; line-height: 48px !important; } } @media screen and (max-width: 470px) { .col-md-7 { margin-top: 30px; } .dot-shape-carousel { scale: 0.7 !important; top: -6.2em; left: -4.5em; } .carousel-hero-img { right: -15px; } } /* Apply animation to the image */ /* Define the keyframes for the rotation animation */ @keyframes rotate { 0% { transform: rotate(15deg); /* Start rotated 15 degrees */ opacity: 0.2; /* Start at 20% opacity */ } 50% { transform: rotate(0deg); /* Main rotation ends here */ opacity: 1; /* Full opacity */ } 70% { transform: rotate(-2deg); /* Slight backward nudge */ } 100% { transform: rotate(0deg); /* Return to the original position */ } } .rotate-on-load { animation: rotate 0.3s ease-out; /* Short duration and smooth finish for a gentle bounce */ } #cta.yellow-btn .banner-btn { color: #fff!important; } #cta.yellow-btn .banner-btn:hover { background: transparent!important; border: 2px solid #f3a100!important; color: #f3a100!important; } /* NEW MIS OFFER PAGE */ .mis-offer-box { border: solid 2px white; border-radius: 10px; padding: 0px 50px; } .quote-block .mis-offer-box { border: solid 2px white; border-radius: 10px; padding: 0 50px 30px 50px; } .mis-offer--icon { width: 100px; background: white; border-radius: 50%; padding: 16px; position: relative; top: -15%; margin: 0 auto; } .quote-block .mis-offer--icon { text-align: center; top: -24%; } .mis-offer--content { display: flex; justify-content: center; flex-direction: column; align-items: center; color: white; gap: 1rem; margin-top: -24px; } .mis-offer--content h3 { text-align: center; color: white; } .quote-block .mis-offer--content p { font-size: 24px; line-height: 34px; font-weight: 600; text-align: center; color: white; } .quote-block .mis-offer--icon i { position: relative; top: 3px; left: 2px; font-size: 64px!important; } .mis-offer--cta { position: relative; top: 14%; margin: 0 auto; display: flex; justify-content: center; } @media (max-width: 1200px) { .quote-block .mis-offer--icon { top: -20%; } } @media (max-width: 991px) { .quote-block .mis-offer--icon { top: -18%; } } @media (max-width: 768px) { .quote-block .mis-offer--icon { top: -14%; } }