.lshowcase-logos { margin:0 auto; text-align: center; } .lshowcase-center { text-align: center; } .lshowcase-left .lshowcase-logos { text-align: left !important; } .lshowcase-slide { vertical-align: middle; /* display: inline-block; */ float: none !important; } .lshowcase-horizontal-slide { display: inline-block; } .lshowcase-ticker-slide { display: flex; align-items: center; justify-content: center; } .lshowcase-flex-list { display:flex; flex-direction: column; align-items: flex-start; } .lshowcase-boxInner-list { display:flex; flex-direction: row; align-items: center; } .lshowcase-wrapper-list { margin: 20px 0; } .lshowcase-boxInner-list .lshowcase-description { padding:0 0 0 10px; text-align:left; } /* To hide Accessibility Tooltips Added by jQuery UI*/ .ui-helper-hidden-accessible { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .ui-tooltip { position: absolute; z-index: 9999; -o-box-shadow: 0 0 5px #aaa; -moz-box-shadow: 0 0 5px #aaa; -webkit-box-shadow: 0 0 5px #aaa; box-shadow: 0 0 5px #aaa; color: #FFF; border-radius: 3px; background: #666; padding: 5px 10px; } * html .ui-tooltip { background-image: none; } body .ui-tooltip { border-width: 2px; } #hcarouselhelp { margin-top:50px; margin-bottom:30px; display:none; background:#f5f5f5; padding:5px; font-size:0.8em; } .ls-remember.button-primary { margin-bottom:10px; } #hcarouselhelp .fa { color:red; } .ui-tooltip, .lsarrow:after { background: #666; border-radius: 2px; } .lsarrow { width: 70px; height: 16px; overflow: hidden; position: absolute; left: 50%; margin-left: -35px; bottom: -16px; } .lsarrow.top { top: -16px; bottom: auto; } .lsarrow.left { left: 20%; } .lsarrow:after { content: ""; position: absolute; left: 20px; top: -20px; width: 25px; height: 25px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); tranform: rotate(45deg); } .lsarrow.top:after { bottom: -20px; top: auto; } .lshowcase-opacity-enhance img { opacity: 0.7; transition: .6s; -webkit-transition: .6s; -moz-transition: .6s; -o-transition: .6s; -ms-transition: .6s; } .lshowcase-opacity-enhance img:hover { opacity: 1; transition: .6s; -webkit-transition: .6s; -moz-transition: .6s; -o-transition: .6s; -ms-transition: .6s; } .lshowcase-lower-opacity img:hover { opacity:0.7; transition: 0.6s; -webkit-transition: 0.6s; -moz-transition: 0.6s; -o-transition: 0.6s; -ms-transition: 0.6s; } .lshowcase-lower-opacity img { opacity:1; transition: 0.6s; -webkit-transition: 0.6s; -moz-transition: 0.6s; -o-transition: 0.6s; -ms-transition: 0.6s; /* solves moving image issue on chrome -webkit-transform: translateZ(0); */ } .lshowcase-boxhighlight img:hover { -webkit-box-shadow: 0 0 10px #CCC; -moz-box-shadow: 0 0 10px #CCC; box-shadow: 0 0 10px #CCC; } .lshowcase-jquery-gray { opacity: 0; } .lshowcase-grayscale img, .lshowcase-hover-grayscale img{ filter: url("data:image/svg+xml;utf8,#greyscale"); -webkit-filter: grayscale(100%); filter: grayscale(100%); filter: gray; opacity: 0.7; margin: 10px; -webkit-transform: translateZ(0); } .lshowcase-hover-grayscale img:hover { filter: none; -webkit-filter: grayscale(0); opacity: 1; -o-transition: .5s; -ms-transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; transition: .5s; } .lshowcase-grayscale-2 img { filter: url("data:image/svg+xml;utf8,#greyscale"); -webkit-filter: grayscale(100%); filter: grayscale(100%); filter: gray; opacity: 1; -o-transition: .5s; -ms-transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; transition: .5s; margin: 10px; } .lshowcase-grayscale-2 img:hover { filter: none; -webkit-filter: grayscale(0); opacity: 1; -o-transition: .5s; -ms-transition: .5s; -moz-transition: .5s; -webkit-transition: .5s; transition: .5s; } .lshowcase-container-hover { background-color: inherit; transition: 0.5s; } .lshowcase-container-hover:hover { background-color:#f0f0f0; transition: 0.5s; } .lshowcase-border { border:1px solid #CCC; box-sizing:border-box; margin-right:-1px; margin-bottom:-1px; background-color: inherit; transition: 0.5s; } .lshowcase-border:hover { background-color:#f0f0f0; transition: 0.5s; } .lshowcase-clear-both { clear: both; height: 0; } .lshowcase-box-normal { /*float: left;*/ vertical-align: middle; display: inline-block; /*margin: 5px; padding: 5px;*/ } .lshowcase-boxInner { } .lshowcase-description-hover { position:absolute; max-width:100%; background:rgba(255, 255, 255, 0.85); color:#222; opacity:0; width:100%; height:100%; top:0; left:0; display:flex; align-items: center; justify-content: center; font-size:0.9em; font-weight: bold; text-align: center; transition: all 0.3s; } .lshowcase-thumb { position:relative; } .lshowcase-thumb img { height:auto; } .lshowcase-thumb:hover .lshowcase-description-hover { opacity:1; } .lshowcase-thumb:hover .lshowcase-boxInner { overflow: hidden; } .lshowcase-boxInner-normal { display: inline-block; height: 100%; vertical-align: middle; } .lshowcase-boxInner-normal img { text-align: center; margin: 0 auto; height:auto; } /* Responsive Grid */ .lshowcase-flex { display: flex; flex-flow: row; flex-wrap: wrap; justify-content: center; align-content: stretch; } .lshowcase-box-1, .lshowcase-box-2, .lshowcase-box-3, .lshowcase-box-4, .lshowcase-box-5, .lshowcase-box-6, .lshowcase-box-7, .lshowcase-box-8, .lshowcase-box-9, .lshowcase-box-10, .lshowcase-box-11, .lshowcase-box-12, .lshowcase-box-14, .lshowcase-box-16, .lshowcase-box-18{ align-self:stretch; display:flex; align-items:center; } .lshowcase-box-18 { flex-basis:5.5%; width:5.5%; } .lshowcase-box-16 { flex-basis:6.25%; width:6.25%; } .lshowcase-box-14 { flex-basis:7.14%; width:7.14%; } .lshowcase-box-12 { flex-basis:8.33%; width:8.33%; } .lshowcase-box-11 { flex-basis:9.09%; width:9.09%; } .lshowcase-box-10 { flex-basis:10%; width:10%; } .lshowcase-box-9 { flex-basis:11.11%; width:11.11%; } .lshowcase-box-8 { flex-basis:12.5%; width:12.5%; } .lshowcase-box-7 { flex-basis:14.28%; width:14.28%; } .lshowcase-box-6 { flex-basis:16%; width:16%; } .lshowcase-box-5 { flex-basis:20%; width:20%; } .lshowcase-box-4 { flex-basis:25%; width: 25%; } .lshowcase-box-3 { flex-basis:33.33%; width:33.33%; } .lshowcase-box-2 { flex-basis:50%; width:50%; } .lshowcase-box-1 { flex-basis:100%; width:100%; } .lshowcase-description { text-align: center; padding: 5px 5px 10px 5px; margin:0 auto; word-wrap: break-word; word-break: keep-all; } .lstit { font-weight: bold;} .lshowcase-wrap-responsive { width:100%; } .lshowcase-wrap-responsive img { max-width: 100%; height: auto; display: block; text-align: center; margin: 0 auto; } .lshowcase-wrap-hcarousel, .lshowcase-wrap-normal { display: inline-block; vertical-align: middle; } /* FILTER CLASSES */ ul#ls-filter-nav, ul#ls-enhance-filter-nav, ul#ls-isotope-filter-nav { text-align: center; display: block; margin: 20px 0; padding: 15px 4px 17px 0; list-style: none; clear: both; z-index: 9999999999; } ul#ls-filter-nav li, ul#ls-enhance-filter-nav li, ul#ls-isotope-filter-nav li { font: bold 1em; display: inline-block; margin: 0px 2px; position: relative; padding: 7px 12px; cursor: pointer; -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -ms-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; } ul#ls-filter-nav li:hover, ul#ls-enhance-filter-nav li:hover, ul#ls-isotope-filter-nav li:hover { background: #666; color: #fff; border-radius: 3px; } ul#ls-filter-nav li ul, ul#ls-enhance-filter-nav li ul, ul#ls-isotope-filter-nav li ul { z-index: 9999999999; padding: 0; margin:0; position: absolute; top: 30px; left: -2px; width: 150px; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; display: none; opacity: 0; visibility: hidden; -webkit-transiton: opacity 0.2s; -moz-transition: opacity 0.2s; -ms-transition: opacity 0.2s; -o-transition: opacity 0.2s; -transition: opacity 0.2s; } ul#ls-filter-nav li ul li, ul#ls-enhance-filter-nav li ul li, ul#ls-isotope-filter-nav li ul li { background: #666; display: block; color: #fff; text-shadow: 0 -1px 0 #000; border-radius: 5px; } ul#ls-filter-nav li ul li:hover, ul#ls-enhance-filter-nav li ul li:hover, ul#ls-isotope-filter-nav li ul li:hover { background: #666; border-radius: 3px; } ul#ls-filter-nav li:hover ul, ul#ls-enhance-filter-nav li:hover ul, ul#ls-isotope-filter-nav li:hover ul { display: block; opacity: 1; visibility: visible; } ul#ls-filter-nav li.ls-current-li, ul#ls-enhance-filter-nav li.ls-current-li, ul#ls-isotope-filter-nav li.ls-current-li { background:#666; color:#FFF; border-radius: 3px; } .ls-not-current { filter: url("data:image/svg+xml;utf8,#greyscale"); -webkit-filter: grayscale(100%); filter: grayscale(100%); filter: gray; opacity:0.3; filter:alpha(opacity=0.3); -webkit-transform: scale(0.7); -moz-transform: scale(0.7); -ms-transform: scale(0.7); transition: 0.6s; -webkit-transition: 0.6s; -moz-transition: 0.6s; -o-transition: 0.6s; -ms-transition: 0.6s; } .ls-not-current-hide { filter: url("data:image/svg+xml;utf8,#greyscale"); -webkit-filter: grayscale(100%); filter: grayscale(100%); filter: gray; opacity:0; filter:alpha(opacity=0); -webkit-transform: scale(0); -moz-transform: scale(0); -ms-transform: scale(0); transition: 0.6s; -webkit-transition: 0.6s; -moz-transition: 0.6s; -o-transition: 0.6s; -ms-transition: 0.6s; } .ls-current { filter: none; -webkit-filter: grayscale(0); opacity: 1; filter:alpha(opacity=100); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); transition: 0.6s; -webkit-transition: 0.6s; -moz-transition: 0.6s; -o-transition: 0.6s; -ms-transition: 0.6s; } .post-type-lshowcase #postimagediv .inside img { width:none; } @media screen and (max-width: 480px) { .lshowcase-box-4,.lshowcase-box-5,.lshowcase-box-6,.lshowcase-box-7,.lshowcase-box-8,.lshowcase-box-9,.lshowcase-box-10,.lshowcase-box-11,.lshowcase-box-12,.lshowcase-box-14,.lshowcase-box-16,.lshowcase-box-18,.lshowcase-box-2 { width: 50%; flex-basis:50%; } } @media screen and (max-width: 650px) and (min-width: 481px) { .lshowcase-box-4,.lshowcase-box-5,.lshowcase-box-6,.lshowcase-box-7,.lshowcase-box-8,.lshowcase-box-9,.lshowcase-box-10,.lshowcase-box-11,.lshowcase-box-12,.lshowcase-box-14,.lshowcase-box-16,.lshowcase-box-18 { width: 25%; flex-basis:25%; } } /* Elementor CSS */ /* .elementor-widget-container .lshowcase-wrap-carousel-0 { display:block !important; } .elementor-widget-container .lshowcase-wrap-carousel-0 .lshowcase-slide { display:none; } .elementor-widget-container .lshowcase-wrap-carousel-0:after { display:block; height:100px; background:#f5f5f5; content:'-- Logos Carousel will load here --'; font-weight: bold; font-size:0.9em; padding-top:40px; } */