.doc-btn { margin-top: 29px; .btn_ { background: #fff !important; color:#333; padding: 0 22px; } } .doc-name { font-size: 20px; font-weight: 700; text-transform: uppercase; } .doc-surname { font-size: 18px; font-weight: 700; text-transform: uppercase; margin-top: 6px; } .specialty { font-size: 11px; text-transform: uppercase; color: $link-color; margin-top: 12px; a { text-decoration: none; } } .doc-txt { margin-top: 15px; font-size: 14px; } .doctor-img { width: 165px; height: 165px; display: table-cell; vertical-align: bottom; overflow: hidden; background: grey; text-align: center; border-radius: 100%; @include Gradient-horisontal(#f5f5f5, #e6e6e6); img { vertical-align: bottom; max-width: 100%; max-height: 100%; } } .doctors-col { margin-top: 60px; &:nth-child(2n +3) { clear: both; } } .slider-doctors-wrapper { margin-bottom: 15px; } @media (max-width: 991px) { .doctor-img { width: 95px; height: 95px; } } @media (max-width: 767px) { .doctor-img { width: 165px; height: 165px; } .doctors-col { text-align: center; &:nth-child(2n +3) { clear: none; } .doctor-img-wr { display: inline-block; width: 165px !important; float: none; margin-bottom: 16px; padding: 0 !important; } } .doc-btn { text-align: center; .btn_ { display: inline-block; float: none; } } } /***slider doc***/ .slider-doctors { //padding: 0 20%; } .slider-doc-items { float: left; //margin-left: -23px; } .slider-doctors-wrapper { position: relative; padding-bottom: 20px; margin-top: 27px; .owl-nav { display: none; } } .slider-doc-main { width: 40%; height: 100%; left: 50%; margin-left: -20%; position: absolute; @include Gradient-horisontal(#f3f3f3,#e6e6e6); } .slider-doc-main-item-img { float: left; display: table; height: 100%; div { vertical-align: bottom; display: table-cell; img { vertical-align: bottom; } } } .slider-doc-main-item-txt { float: left; display: inline-block; max-width: 368px; margin-top: 114px; .doc-name, .doc-surname, .specialty, .doc-txt, .doc-btn { float: left; clear: both; } } .slider-doc-main-items { display: none; height: 100%; &.active { display: table !important; } } .btns-doc { position: absolute; right: 30px; bottom: 30px; width: 50px; height: 18px; z-index: 4; div { position: relative; z-index: 3; cursor: pointer; width: 10px; height: 18px; float: left; background: url("../images/slider-left.svg"); background-position: 50% 50%; background-repeat: no-repeat; background-size: 10px 18px; &.right { float: right; background: url("../images/slider-right.svg"); } } &:before { content: ''; background: red; z-index: 2; width: 100%; height: 100%; position: absolute; top: -10px; left: -10px; box-sizing: content-box; padding: 10px; } } @media (max-width: 1790px) { .slider-doc-main { width: 50%; margin-left: -25%; } } @media (max-width: 1470px) { .slider-doc-main-item-txt { max-width: 320px; margin-top: 80px; } } @media (max-width: 1340px) { .slider-doc-main-item-txt { max-width: 260px; margin-top: 50px; } .slider-doc-main { width: 52%; margin-left: -26%; } } @media (max-width: 1200px) { .slider-doc-main-item-img div img { max-width: 300px; } .slider-doc-main { width: 60%; margin-left: -30%; } } @media (max-width: 991px) { .slider-doc-main { width: 66%; margin-left: -33%; } } @media (max-width: 870px) { .slider-doc-main { width: 70%; margin-left: -35%; } } @media (max-width: 845px) { .slider-doc-main-item-img div img { max-width: 280px; } .slider-doc-main-item-txt { max-width: 230px; margin-top: 30px; } } @media (max-width: 767px) { .slider-doc-main { width: 100%; margin-left: 0; left: 0; } .slider-doctors-wrapper { padding-bottom: 0; } .slider-doc-main-item-txt { max-width: 375px; margin-top: 80px; } } @media (max-width: 680px) { .slider-doc-main-item-txt { max-width: 305px; margin-top: 70px; } } @media (max-width: 615px) { .slider-doc-main-item-img div img { max-width: 240px; } .slider-doc-main-item-txt { max-width: 270px; margin-top: 55px; } } @media (max-width: 540px) { .slider-doc-main-item-txt { .doc-txt { display: none; } } .slider-doctors { max-height: 380px; overflow: hidden; } } @media (max-width: 470px) { .slider-doc-main-item-img div img { max-width: 200px; } .slider-doctors { max-height: 320px; } } @media (max-width: 435px) { .slider-doc-main-item-img div img { max-width: 170px; } .slider-doctors { max-height: 270px; } .slider-doc-main-item-txt { margin-top: 30px; } } @media (max-width: 405px) { .slider-doctors-wrapper { display: none; } }