/* --------------- clients style-4 --------------- */ .clients.style-4 { background-color: #f0eff5; position: relative; z-index: 25; .client-logos { border-bottom: 1px solid #9994; .img { img { filter: grayscale(1); opacity: 0.6; } &:hover { img { filter: grayscale(0); opacity: 1; } } } } } /* --------------- clients style 5 --------------- */ .clients.style-5 { .content { .img { padding: 30px; text-align: center; border-radius: 20px; border: 1px solid #9994; display: flex; align-items: center; justify-content: center; margin: 5px; height: 150px; &.img-card{ width: 19%; } } } .swiper-wrapper { -webkit-transition-timing-function: linear !important; transition-timing-function: linear !important; position: relative; } } /* --------------- clients style 9 --------------- */ .clients.style-9{ .client-card{ padding: 50px; border: 1px solid #9993; border-radius: 5px; transition: all 0.3s ease; &:hover{ border: 1px solid transparent; background-color: #fff; box-shadow: 0px 16px 32px 0px #0000000f; .info{ a{ margin-left: 0; .l-arrow{ opacity: 1; } .r-arrow{ opacity: 0; } } } } .info{ h5{ font-weight: bold; font-size: 20px; color: var(--color-darkBlue2); margin-bottom: 10px; span{ color: #6c41ff; text-decoration: underline !important; } } p{ color: #666; } a{ font-weight: bold; color: var(--color-darkBlue2); margin-left: -20px; .l-arrow{ opacity: 0; transition: all 0.3s ease; } .r-arrow{ transition: all 0.3s ease; } } } } .logos-content{ margin-top: 100px; h4{ font-size: 24px; font-weight: bold; color: var(--color-darkBlue2); padding-bottom: 20px; border-bottom: 1px solid #9993; text-align: center; span{ color: #6c41ff; } } .logos{ display: flex; justify-content: space-around; align-items: center; flex-wrap: wrap; padding-top: 20px; a{ margin-top: 30px; } } } } /* --------------- clients style 14 --------------- */ .clients.style-14{ background-color: #000; color: #fff; .logos-content{ display: flex; flex-wrap: wrap; justify-content: space-between; a{ margin-top: 30px; } } }