/*-------------------------------------- Team Member Style2 --------------------------------------*/ .wrap-teammember-style2{ margin: auto; } .wrap-teammember-style2 .slick-slider{ margin-left: auto !important; margin-right: auto !important; width: 90%; right: 0; margin-bottom: 0; } .wrap-teammember-style2 .slick-track{ margin: auto; } .wrap-teammember-style2 .slides li{ outline: none; position: relative; transition: margin .5s; margin: 0 12px; } .wrap-teammember-style2 .slides li .wrap{ position: relative; } .wrap-teammember-style2 .teammember-image{ width: 100%; background-position: center; height: 330px; background-size: cover; } /* meta */ .wrap-teammember-style2 .slides li .meta{ margin-top: 24px; text-align: center; } .wrap-teammember-style2 .slides li .meta .name{ font-size: 16px; } .wrap-teammember-style2 .slides li .meta .position{ font-size: 13px; } /* hover */ .wrap-teammember-style2 .teammember-hover{ background-color: rgba(0,0,0,0.7); position: absolute; width: 100%; height: 100%; display: block; top: 0; left: 0; opacity: 0; transition: opacity .4s; } .wrap-teammember-style2 .slides li:hover .teammember-hover{ opacity: 1; } .wrap-teammember-style2 .teammember-hover p{ font-size: 14px; color: #fff; margin: auto; display: table; padding: 37% 40px 35px 40px; line-height: 22px; text-align: center; } /* socials */ .wrap-teammember-style2 .teammember-hover .social-icons{ margin: 0 auto; display: table; } .wrap-teammember-style2 .teammember-hover .social-icons li{ list-style: none; float: left; margin: 0 10px; } .wrap-teammember-style2 .teammember-hover .social-icons li a{ color: #fff; transition: opacity .5s; } .wrap-teammember-style2 .teammember-hover .social-icons li a:hover { opacity: .5; } /*To move navigation buttons outside use these settings:*/ .wrap-teammember-style2 .slick-arrow { background-repeat: no-repeat; background-position: center; width: 16px; height: 41px; transition: opacity .4s; } .wrap-teammember-style2 .slick-arrow:hover { opacity: .5 !important; } .wrap-teammember-style2 .slick-arrow { transition: left .2s, right .2s; margin-top: -3%; } .wrap-teammember-style2 .slick-arrow:before { content: ''; } .wrap-teammember-style2 .slick-arrow.slick-prev { left: -61px; } .wrap-teammember-style2 .slick-arrow.slick-prev:hover { left: -66px; } .wrap-teammember-style2 .slick-arrow.slick-next:hover { right: -66px; } .wrap-teammember-style2 .slick-arrow.slick-next { right: -61px; } /* Responsive */ .col-sm-12 .wrap-teammember-style2 .slick-slider { width: 90%; } .col-sm-10 .wrap-teammember-style2 .slick-arrow { margin-top: -5%; } .col-sm-8 .wrap-teammember-style2 .slick-arrow { margin-top: -5%; } .col-sm-6 .wrap-teammember-style2 .slick-arrow { margin-top: -7%; } .col-sm-4 .wrap-teammember-style2 .slick-arrow { margin-top: -9%; } .col-sm-3 .wrap-teammember-style2 .slick-arrow.slick-prev, .col-sm-4 .wrap-teammember-style2 .slick-arrow.slick-prev { left: -41px; } .col-sm-3 .wrap-teammember-style2 .slick-arrow.slick-next, .col-sm-4 .wrap-teammember-style2 .slick-arrow.slick-next { right: -41px; } .col-sm-3 .wrap-teammember-style2 .slick-arrow { margin-top: -14%; } .col-sm-2 .wrap-teammember-style2 .slick-arrow { margin-top: -23%; } .col-sm-2 .wrap-teammember-style2 .slick-arrow.slick-prev { left: -27px; } .col-sm-2 .wrap-teammember-style2 .slick-arrow.slick-next { right: -27px; }