.sliders { &.slider-home { margin-top: 6px; padding-bottom: 8px; padding-top: 8px; overflow: hidden; .owl-controls { display: none; } .owl-dots { padding: 0 10px; position: relative; bottom: auto; left: auto; float: left; margin-top: 4px; .owl-dot { border: 1px solid #e2e2e2; &.active { border: 0; } &:last-child { //display: none; } } &.disabled { display: none; } } .owl-nav { &.disabled { display: none; } } &.owl-carousel { height: auto !important; margin-bottom: 0 !important; } } &.owl-carousel { overflow: hidden; } } .owl-controls { } .owl-video-wrapper { } .owl-video-play-icon { width: 100%; height: 100%; cursor: pointer; background: rgba(0,0,0,0.6); position: relative; z-index: 2; &:before { @include svgIcon; position: absolute; $w:32; width: $w + px; height: $w + px; left: 50%; top: 50%; margin-top: -16px; margin-left: -16px; content: '\e902'; color: #fff; font-size: 32px; text-align: center; line-height: 32px; background: none; z-index: 2; font-weight: 700; } } .owl-video-tn { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 1; } .owl-video-wrapper { height: 300px; float: left; width: 100%; } .owl-video-frame { z-index: 3; position: relative; width: 100%; height: 100%; float: left; iframe { width: 100% !important; max-height: 100% !important; } } .owl-height { @include Transition(0.35); } .owl-stage { position: relative; -ms-touch-action: pan-Y; float: left; } .owl-stage-outer { position: relative; //overflow: hidden; -webkit-transform: translate3d(0,0,0); } .owl-item { float: left; position: relative; -webkit-backface-visibility: hidden; -webkit-touch-callout: none; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; //-webkit-transform: translate3d(0,0,0); //-moz-transform: translate3d(0,0,0); //-ms-transform: translate3d(0,0,0); -webkit-tap-highlight-color: transparent; position: relative; [class*="col-"] { width: 100%; } } /*dots*/ .owl-dots { position: absolute; bottom: 16px; left: 0; width: 100%; text-align: center; padding: 0 15px; .owl-dot { display: inline-block; width: 14px; height: 14px; border-radius: 100%; background: #fff; cursor: pointer; margin-right: 6px; margin-top: 6px; //@include Transition(0.2); &:before { content: ''; //@include Transition(0.25); display: block; @include Scale(0); } &.active { position: relative; background: none; &:before { @include Scale(1); width: 8px; height: 8px; position: absolute; top: 50%; margin-top: -4px; left: 50%; margin-left: -4px; background: $violet-color; border-radius: 100%; } } &:hover { @include Opacity(0.9); } } } /*******/ .slider-articles-wr { } .slider-articles { overflow: hidden; div.articles-items { margin-top: 18px; line-height: 18px; .img-link { display: block; text-align: center; overflow: hidden; img { vertical-align: top; max-width: 100%; @include Transition(0.3); } } .articles-link { margin-top: 11px; display: block; } p { margin-top: 18px; a { } } &:nth-child(3n+1) { clear: both; } .articles-excerpt { height: 252px; overflow: hidden; position: relative; &:before { content: ''; display: block; position: absolute; bottom: 0; right: 0; left: 0; height: 45px; @include Gradient-vertical(rgba(255,255,255,0),#fff) } } &:hover { .img-link { img { @include filter-gray(80%); @include Scale(1.05); } } } } &.owl-carousel { div { float: left; } .owl-item { float: left; padding: 0 15px; .articles-items { width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; clear: none !important; } } } } .arrows-sales-wr{padding-right: 0 !important;} .row-sliders-home .arrows-sales-wr{padding-left: 22px;} .btn-l_, .btn-r_ { //margin-top: 15px; margin-top: 29px; position: relative; width: 16px; height: 32px; cursor: pointer; float: right; @include svgIcon; &.vis_ { display: block !important; } &:before { color: #ced0d6; line-height: 32px; content: '\e916'; font-size: 16px; } &.lock { opacity: 0.3; cursor: default; &:before { color: #ced0d6; } } &:hover { &:before { color: #9fa1a7; } } &:active { &:before { color: #86888e; } } } .btn-r_ { margin-left: 13px; &:before { content: '\e917'; } } /***********slider-first***********/ .slider-first-wrapp { width: 100%; float: left; height: 416px; } .slider-first { position: relative; overflow: hidden; height: 416px; &.owl-carousel { height: 416px; text-align: center; } .owl-stage-outer { float: left; } .owl-controls { display: inline-block; height: 83px; position: absolute; bottom: 0; left: 0; width: 100%; background: url("../images/shadow-slider.png") repeat-x; } .owl-nav { //float: left; div { //position: absolute; //width: 26px; //height: 29px; //top: 50%; //margin-top: -14px; //right: -(26 + 6px); //text-align: center; //cursor: pointer; &:before { //@include svgIcon; //line-height: 29px; //content: '\e917'; //color: $blocks-color; //font-size: 18px; } &:first-child { //right: auto; //left: -(26 + 6px); &:before { //content: '\e916'; } } } } .owl-dots { margin-top: 43px; float: none; padding: 0; position: relative; width: auto; right:auto; left: auto; bottom: auto; margin-right: 0; margin-left: 0; &:first-child { margin-left: 0; } .owl-dot { } } div.slider-first-items { //margin-top: 30px; width: 100%; float: left; a { position: relative; color: #fff; font-size: 24px; font-weight: 700; text-transform: uppercase; line-height: 29px; width: 100%; float: left; display: block; img { max-width: 100%; vertical-align: top; } } &:hover { img { } } } &.owl-carousel { //height: auto; } } .slider-first .owl-item div.slider-first-items a img { margin-left: -1px; } /***********slider-card************/ .slider-card { float: left; width: 100%; .card-slider-img { float: left; width: 100%; background: #fff; text-align: center; img { max-width: 100%; max-height: 100%; } } .card-slider-img, .video-card-slider { height: 353px; } .video-card-slider { float: left; width: 100%; background: #fff; text-align: center; iframe { width: 100% !important; max-height: 100% !important; } } .owl-nav { display: none; } .owl-dots { padding-right: 0; margin-top: 6px; position: relative; bottom: auto; width: auto; padding-left: 0; .owl-dot { width: 12px; height: 12px; position: relative; &:before { background: #ced0d6; border: 1px solid #ced0d6; transform: scale(1); width: 11px; height: 11px; position: absolute; top: 0; margin-top: 0; left: 0; margin-left: 0; border-radius: 100%; } &.active { background: #fff !important; &:before { background: #50ae34; border: 1px solid #50ae34 !important; width: 8px; height: 8px; top: 50%; margin-top: -4px; left: 50%; margin-left: -4px; } } } } } .gallery-card-wrapp { .card-list-buttons { float: right; width: auto; margin-top: -28px; } } /***********slider-card************/ @media (min-width: 992px) { .row.row-sliders-home { margin-left: -22px; margin-right: -22px; } .sliders { &.slider-home { .owl-item { opacity: 0; @include Transition(0.3); &.active { opacity: 1; @include Transition(0.5); } } } } } /******tabs*******/ .title-blocks-home-tabs-wr { margin-top: 61px; z-index: 2; position: relative; text-align: center; } .title-blocks-home-tabs { padding-left: 25px; margin-right: 25px; position: relative; float: left; display: inline-block; &:before { position: absolute; content: ''; width: 1px; height: 13px; background: #a3a3a3; top: 50%; margin-top: -5px; left: 0; } &:first-child { padding-left: 0; &:before { display: none; } } &:last-child { margin-right: 0; } span { float: left; cursor: pointer; font-size: 18px; font-weight: 700; line-height: 32px; text-transform: uppercase; color: #a3a3a3; } &.active { span { color: $main-color; } } } .slider-tabs { margin-top: -21px; .btn-l_, .btn-r_ { margin-top: 0; } } /******end tabs*******/ @media (min-width: 767px) { .sliders { &.slider-home { //height: 482px; overflow: hidden; padding-bottom: 8px; } } } @media (max-width: 1200px) { .slider-first-wrapp { height: 310px; } .slider-first { height: 261px; &.owl-carousel { height: 310px; } } } @media (max-width: 991px) { .slider-first-wrapp { height: auto; max-height: 283px; overflow: hidden; } .slider-first { height: auto; &.owl-carousel { height: auto; } } } @media (max-width: 920px) { .slider-first-wrapp { max-height: 264px; } } @media (max-width: 900px) { .slider-first-wrapp { max-height: 260px; } } @media (max-width: 870px) { .slider-first-wrapp { max-height: 253px; } } @media (max-width: 850px) { .slider-first-wrapp { max-height: 248px; } } @media (max-width: 800px) { .slider-first-wrapp { max-height: 236px; } } @media (max-width: 780px) { .slider-first-wrapp { max-height: 228px; } } @media (max-width: 767px) { .sliders { &.slider-home { height: 282px; overflow: hidden; margin-bottom: 24px; padding-bottom: 0; .owl-controls { display: block; } } } .arrows-sales-wr { .btn-l_, .btn-r_ { display: none !important; } text-align: center; .title-blocks-home {float: none;margin-top: 4px} } .title-blocks-home-tabs { padding-left: 15px; margin-right: 15px; float: none; } .slider-tabs { margin-top: -4px; } .owl-dots .owl-dot { width: 12px; height: 12px; background: #ced0d6 !important; &.active { background: #fff !important; } } .sliders.slider-home .owl-dots .owl-dot { border-color: #ced0d6; } } @media (max-width: 550px) { .card-slider-img { max-height: 353px; } .slider-card { max-height: 394px; overflow: hidden; &.owl-loaded { max-height: none; } } .options-hide-blocks { ul { max-width: 196px; } } .more-hide-options { right: auto; left: 196px; } } @media (max-width: 450px) { .slider-card .card-slider-img { height: auto; } .slider-card .video-card-slider { height: 300px; } } @media (max-width: 400px) { .slider-card { max-height: 350px; } } @media (max-width: 370px) { .slider-card { max-height: 327px; } } @media (max-width: 360px) { .slider-card { max-height: 319px; } } @media (max-width: 350px) { .slider-card { max-height: 310px; } } @media (max-width: 340px) { .slider-card { max-height: 302px; } } @media (max-width: 330px) { .slider-card { max-height: 293px; } } @media (max-width: 325px) { .slider-card { max-height: 289px; } } @media (min-width: 992px) { .sliders.slider-home { padding-left: 8px; padding-right: 8px; position: relative; } }