.l-author { width: 100%; display: flex; padding: 50px 0; justify-content: space-between; h2 { margin: 0; font-weight: 600; font-size: 21.5px; line-height: 140%; border-bottom: 1px solid #D9D9D9; padding-bottom: 15px; padding-top: 5px; letter-spacing: -0.01em; color: #007880; margin-bottom: 23px; } .row { width: 100%; &:nth-child(1) { div { display: flex; } h2 { width: 100%; } .l-author__photo { width: 100%; max-width: 238px; } } &:nth-child(2) { max-width: 415px; padding-top: 48px; padding-left: 32px; } } } .l-author__info { min-width: 364px; h3 { margin: 0; font-weight: 600; font-size: 31px; line-height: 140%; letter-spacing: -0.01em; color: #007880; } p { margin-top: 20px; font-weight: normal; font-size: 18px; line-height: 150%; color: #474747; } } .l-author__photo { margin: 0; margin-right: 50px; img { border-radius: 10px; overflow: hidden; } figcaption { margin-top: 5px; font-weight: normal; font-size: 15px; line-height: 160%; color: #808080; } } .l-author__quotes { background: #E1F1F2; border-radius: 10px; padding: 48px 32px 40px 32px; position: relative; &:before { display: flex; align-items: center; justify-content: center; content: $icon-quote; top: 0; transform: translateY(-50%); font-family: '#{$icomoon-font-family}' !important; speak: never; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: white; background-color: #007880; font-size: 33px; width: 60px; height: 60px; border-radius: 50%; position: absolute; } } .l-author__quotes__slider { display: flex; div { em { font-style: italic; font-weight: 300; font-size: 28px; line-height: 140%; letter-spacing: -0.02em; color: #083F4D; } p { font-style: normal; font-weight: normal; font-size: 15px; line-height: 160%; color: #007880; } } } .l-author__quotes__slider__item { max-width: 336px; outline: 0; }