Current Path : /home/theafprt/conviviality360.com/wp-content/themes/salient/css/elements/ |
Current File : /home/theafprt/conviviality360.com/wp-content/themes/salient/css/elements/element-clients.css |
/* Theme Name: Salient Description: Styles for the "Clients" page builder element. */ .clients.two-cols >div{ width:49.4% } .clients.two-cols.no-carousel >div{ width:48.4% } .clients.two-cols >div:nth-child(2n+2){ margin-right:0 } .clients.carousel.two-cols >div{ margin:0 10px } .clients.three-cols >div{ width:32.6% } .clients.three-cols.no-carousel >div{ width:31.6% } .clients.three-cols >div:nth-child(3n+3){ margin-right:0 } .clients.carousel.three-cols >div{ margin:0 10px } @media only screen and (min-width: 1000px) { .clients.no-carousel.three-cols > div:nth-child(3n+4) { clear: both; } } @media only screen and (min-width: 690px) { .clients.no-carousel.four-cols > div:nth-child(4n+5) { clear: both; } .clients.no-carousel.five-cols > div:nth-child(5n+6) { clear: both; } .clients.no-carousel.six-cols > div:nth-child(6n+7) { clear: both; } } .clients.four-cols >div{ width:24.2% } .clients.four-cols.no-carousel >div{ width:23.2% } .clients.four-cols >div:nth-child(4n+4){ margin-right:0 } .clients.carousel.four-cols >div{ margin:0 10px } .clients.five-cols >div{ width:19.2% } .clients.five-cols.no-carousel >div{ width:18.2% } .clients.five-cols >div:nth-child(5n+5){ margin-right:0 } .clients.carousel.five-cols >div{ margin:0 10px } .clients.six-cols >div{ width:15.8% } .clients.six-cols.no-carousel >div{ width:14.8% } .clients.six-cols >div:nth-child(6n+6){ margin-right:0 } .clients.carousel.six-cols >div{ margin:0 10px } .clients >div{ float:left; transition:opacity 0.2s linear; -webkit-transition:opacity 0.2s linear; margin-right:2%; margin-bottom:2%; opacity:1 } .clients.fade-in-animation >div{ opacity:0; -webkit-transition:none; transition:none; } .clients.fade-in-animation.completed >div{ -webkit-transition:opacity 0.2s linear; transition:opacity 0.2s linear; -webkit-backface-visibility:hidden } .clients:not(.fade-in-animation) >.no-link:hover, .clients.fade-in-animation.completed >.no-link:hover{ opacity:1!important } .clients:not(.fade-in-animation) >div:hover, .clients.fade-in-animation.completed >div:hover{ opacity:0.7!important } .clients >div img{ display:block; max-width:100%; margin:0 auto } .row.carousel.clients { display: flex; align-items: center; } .clients.no-carousel:after{ content:""; display:block; height:0; clear:both; visibility:hidden } .clients.no-carousel { display: -ms-flexbox; display: flex; display: -webkit-flex; align-items: center; justify-content: center; -ms-flex-flow: row wrap; flex-wrap: wrap; } .clients.no-carousel > div { float: none; } .clients[data-additional_padding="2"].no-carousel > div, .clients[data-additional_padding="3"].no-carousel > div, .clients[data-additional_padding="4"].no-carousel > div, .clients[data-additional_padding="2"].no-carousel > div img, .clients[data-additional_padding="3"].no-carousel > div img, .clients[data-additional_padding="4"].no-carousel > div img { margin: 0; } .clients[data-additional_padding="2"].no-carousel >div { padding: 2%; } .clients[data-additional_padding="3"].no-carousel >div { padding: 3%; } .clients[data-additional_padding="4"].no-carousel >div { padding: 3% 5%; } .clients[data-he="greyscale_to_color"] > div img{ transition: filter 0.45s cubic-bezier(0.3, 0.4, 0.1, 1), opacity 0.45s cubic-bezier(0.3, 0.4, 0.1, 1); -webkit-filter: grayscale(100%); filter: grayscale(100%); opacity: 0.55; } .clients[data-he="greyscale_to_color"] > div:hover img{ -webkit-filter: grayscale(0%); filter: grayscale(0%); opacity: 1; } .clients img.nectar-lazy { opacity: 0; transition: opacity 0.5s ease; } .clients img.nectar-lazy.loaded { opacity: 1; } @media only screen and (min-width : 690px) and (max-width : 999px) { body .clients.no-carousel > div, body .clients.four-cols.no-carousel >div { width: 24.2%; margin-right: 1%; } body .clients.no-carousel.six-cols > div { width: 15.8% ; margin-right: 1%; } body .clients.no-carousel.five-cols > div { width: 19.2%; margin-right: 1%; } body .clients.no-carousel > div:nth-child(4n+4) { margin-right: 0; } body .clients.carousel > div { margin: 0 5px; } } @media only screen and (max-width : 690px) { body .clients[class*="col"].no-carousel > div { margin-right: 1%; width: 49.4%; } body .clients[class*="col"].no-carousel > div:nth-child(2n+2) { margin-right: 0; } body .clients[class*="col"].carousel > div { margin: 0 5px; width: 150px; } body .clients.carousel.phone > div { width: 150px; } .clients[data-additional_padding="2"].no-carousel >div { padding: 2% 4% 2% 4%; } .clients[data-additional_padding="3"].no-carousel >div { padding: 3% 6% 3% 6%; } .clients[data-additional_padding="4"].no-carousel >div { padding: 5% 10% 5% 10%; } } @media only screen and (min-width: 1300px) and (max-width: 1600px) { .full-width-content .vc_span8 .clients.five-cols.carousel > div, .full-width-content .vc_col-sm-8 .clients.five-cols.carousel > div { width: 33%; } } @media only screen and (min-width: 990px) and (max-width: 1300px) { .full-width-content .vc_span8 .clients.six-cols > div, .full-width-content .vc_col-sm-8 .clients.six-cols > div { width: 32.3%; } .full-width-content .vc_span8 .clients.no-carousel.six-cols > div:nth-child(3n+3), .full-width-content .vc_col-sm-8 .clients.no-carousel.six-cols > div:nth-child(3n+3) { margin-right: 0; } .full-width-content .vc_span8 .clients.five-cols.carousel > div, .full-width-content .vc_col-sm-8 .clients.five-cols.carousel > div { width: 40%; } }