Как исправить чтобы owl-carousel не мешал отображению border-radius и overflow?

Question

[nugmani]

Без подключения карусели во всех браузерах отображается иконка правильно.

Но стоит заработать owl-carousel в chrom и opera показывает не то что надо, а вот в firefox все хорошо. В чем ошибка?

Код html

<div class="teams">
  <div class="team ">
    <div class="card-icon img-wrap">
          <img src="http://www.vokrug.tv/pic/person/7/7/d   /a/medium_77da532db4ac53be487627c4bb880d45.jpeg" ></div>
           <h4>Екатерина</h4>
<div class="team-comment"> Мы с мужем жили в гражданском браке, решили расстаться... </div>
	</div>
   </div>

Код SASS

.teams 
	text-align: center
	.team
		max-width: 350px
		height: 520px
		display: inline-block
		background: #fff
		box-shadow: inset 0px 0px 25px 0px rgba(50, 50, 50, 0.75)
		transition: all 1.2s ease
		display: inline-block
		margin: 0 20px 30px
		color: #97a4b2
		font-size: em(15px)
		line-height: em(21px)
		padding: 54px 28px 48px
		vertical-align: top
		border-bottom: $main-color 4px solid

		.card-icon
			line-height: 0
			box-shadow: 0 0 0 5px #D6D6D6
			width: 120px
			height: 120px
			line-height: 0
			background-color: #fff
			border-radius: 10em 
			display: inline-block
			overflow: hidden
			img
				width: 100% 
			h4
				color: #282828
				font-family: "RalewayBold", $helvetica
				margin-top: 30px
				margin-bottom: 18px
			p
				margin-bottom: 0
				margin-top: 0
				height: auto
				strong
					color: $main-color

Answer 1

[Kjuri]

а картинке попробовать радиус задать?
50%

Comments

[nugmani]

Спасибо! Так все получилось. Только изображения обязательно должны быть квадратными и радиус я все таки задала в px.
img
width: 120px
height: 120px
border: 5px solid #ddd
border-radius: 100px
box-shadow: 0 0 5px #d6d6d6