.rubl { text-transform: none; font-style: normal; font-family: 'rubl'; } /* LESS variables are information about icon's compiled state, stored under its original file name .icon-home { width: @icon-home-width; } The large array-like variables contain all information about a single icon @icon-home: x y offset_x offset_y width height total_width total_height image_path name; At the bottom of this section, we provide information about the spritesheet itself @spritesheet: width height image @spritesheet-sprites; */ /* The provided classes are intended to be used with the array-like variables .icon-home { .sprite-width(@icon-home); } .icon-email { .sprite(@icon-email); } Example usage in HTML: `display: block` sprite:

To change `display` (e.g. `display: inline-block;`), we suggest using a common CSS class: // CSS .icon { display: inline-block; } // HTML */ /* The `.sprites` mixin generates identical output to the CSS template but can be overridden inside of LESS This must be run when you have at least 2 sprites. If run with a single sprite, then there will be reference errors. .sprites(@spritesheet-sprites); */ @font-face { font-family: 'PT Sans'; src: url('../fonts/ptsans/bold/ptsansbold.eot'); src: url('../fonts/ptsans/bold/ptsansbold.eot?#iefix') format('embedded-opentype'), url('../fonts/ptsans/bold/ptsansbold.woff') format('woff'), url('../fonts/ptsans/bold/ptsansbold.ttf') format('truetype'); font-weight: 700; font-style: normal; } /*ptsans regular*/ @font-face { font-family: 'PT Sans'; src: url('../fonts/ptsans/regular/PTSans-Regular.eot?#iefix') format('embedded-opentype'), url('../fonts/ptsans/regular/PTSans-Regular.woff') format('woff'), url('../fonts/ptsans/regular/PTSans-Regular.ttf') format('truetype'), url('../fonts/ptsans/regular/PTSans-Regular.svg#PTSans-Regular') format('svg'); font-weight: 400; font-style: normal; } /*PT Sans-CaptionBold*/ @font-face { font-family: 'PT Sans Caption'; src: url('../fonts/ptsanscaption/bold/PTSans-CaptionBold.eot'); src: url('../fonts/ptsanscaption/bold/PTSans-CaptionBold.eot?#iefix') format('embedded-opentype'), url('../fonts/ptsanscaption/bold/PTSans-CaptionBold.woff') format('woff'), url('../fonts/ptsanscaption/bold/PTSans-CaptionBold.ttf') format('truetype'), url('../fonts/ptsanscaption/bold/PTSans-CaptionBold.svg#PTSans-CaptionBold') format('svg'); font-weight: bold; font-style: normal; } /*PT Sans-Caption Regular*/ @font-face { font-family: 'PT Sans Caption'; src: url('../fonts/ptsanscaption/regular/PTSans-Caption.eot'); src: url('../fonts/ptsanscaption/regular/PTSans-Caption.eot?#iefix') format('embedded-opentype'), url('../fonts/ptsanscaption/regular/PTSans-Caption.woff') format('woff'), url('../fonts/ptsanscaption/regular/PTSans-Caption.ttf') format('truetype'), url('../fonts/ptsanscaption/regular/PTSans-Caption.svg#PTSans-Caption') format('svg'); font-weight: normal; font-style: normal; } /*rubl*/ @font-face { font-family: 'rubl'; src: url('../fonts/rubl/ALSRubl.eot'); src: url('../fonts/rubl/ALSRubl.eot?#iefix') format('embedded-opentype'), url('../fonts/rubl/ALSRubl.woff') format('woff'), url('../fonts/rubl/ALSRubl.ttf') format('truetype'), url('../fonts/rubl/ALSRubl.svg#ALSRubl') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'Open Sans'; src: url('../fonts/opensans/OpenSans-ExtraBold.eot'); src: url('../fonts/opensans/OpenSans-ExtraBold.eot?#iefix') format('embedded-opentype'), url('../fonts/opensans/OpenSans-ExtraBold.woff') format('woff'), url('../fonts/opensans/OpenSans-ExtraBold.ttf') format('truetype'); font-weight: 800; font-style: normal; } body { background: url("/pic/main/background_stalder1.png") center center; background-size: cover; color: #6c6c6c; font-family: 'PT Sans', sans-serif; font-size: 16px; font-weight: 400; line-height: 1.44; } h1, h2, h3, h4, h5, h6 { font-family: 'PT Sans Caption', sans-serif; margin: 0; padding: 0; color: #006699; } h1 { font-size: 56px; line-height: 1.36; } h2 { font-size: 16px; line-height: 1.38; letter-spacing: 0.7px; } h3 { font-size: 16px; line-height: 1.2; font-weight: bold; color: #6c6c6c; text-transform: uppercase; } h4 { font-size: 16px; line-height: 1.38; font-style: italic; font-weight: bold; color: #6c6c6c; } h5 { font-size: 14px; line-height: 1.2; } h6 { font-size: 12px; line-height: 1.2; } p { padding: 0; margin: 0; } hr { overflow: hidden; height: 1px; background: #e9e9e9; border: 0; margin: 32px 0; } q, blockquote { text-align: center; display: block; font-style: italic; } strong, b { font-weight: 700; } a { color: #217cff; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; text-decoration: none; } a.button { text-decoration: none; } a.button:hover { text-decoration: none; } a:hover { text-decoration: none; } [class*="icon-"] { display: inline-block; vertical-align: top; } img { max-width: 100%; } img[style*="float: left"], img[style*="float:left"], img[align="left"] { margin: 0 20px 5px 0; } img[style*="float: right"], img[style*="float:right"], img[align="right"] { margin: 0 0 5px 20px; } ul { padding: 0; margin: 0; list-style: none; } ul li { padding: 0; margin: 0; } .static-content h2 { color: #00517a; font-size: 16px; text-transform: uppercase; letter-spacing: .7px; padding: 30px 0 16px; line-height: 22px; font-weight: 400; } .static-content h3 { padding: 30px 0 16px; } .static-content ul { margin: -7px 0 14px 23px; } .static-content ul li { position: relative; padding-left: 16px; padding-bottom: 5px; } .static-content ul li:before { content: ''; display: inline-block; position: absolute; top: 11px; left: 0; width: 9px; height: 1px; background: #6c6c6c; margin: 0 10px 0 0; } .static-content p { margin: 0 0 10px; } .static-content a { color: #0299e2; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; text-decoration: none; border-bottom: 1px solid #0299e2; } .static-content a.btn { text-decoration: none; } .static-content a.btn:hover { text-decoration: none; } .static-content a:hover { text-decoration: none; border-bottom: 1px solid transparent; } .static-content table { margin: 0 0 36px; width: 100%; border-collapse: collapse; text-align: left; } @include b(mobile) { display: none; } .static-content th { padding: 27px 5px 27px 22px; background-color: #fff; font-weight: bold; line-height: 1; border-bottom: 2px solid #bfbfbf; } .static-content td { padding: 13px 5px 11px 22px; border-bottom: 2px solid #bfbfbf; min-width: 188px; vertical-align: top; } .static-content .content-desc { font-size: 24px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.38; letter-spacing: normal; text-align: center; color: #6c6c6c; display: block; max-width: 600px; padding-bottom: 50px; margin: 0 auto 52px; position: relative; } .static-content .content-desc:before { content: ''; position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); width: 300px; height: 2px; background-color: #bfbfbf; } .static-content .content-desc--kitchen { padding-bottom: 40px; } .static-content .content-desc--mod { padding: 44px 0; margin: 39px auto 41px; line-height: 1.21; font-size: 28px; max-width: 645px; letter-spacing: normal; } .static-content .content-desc--mod:after { content: ''; position: absolute; top: 0; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); width: 300px; height: 2px; background-color: #bfbfbf; } @media (max-width: 990px) { .static-content .content-desc--mod { padding: 30px 0; } } @media (max-width: 990px) { .static-content .content-desc { padding-bottom: 30px; margin: 0 auto 42px; } } .static-content .content-title { font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.38; letter-spacing: 0.7px; text-align: left; color: #00517a; text-transform: uppercase; display: block; padding: 30px 0 16px 3px; } @media (max-width: 990px) { .static-content .content-title { padding: 11px 0 16px 3px; } } .static-content h4.content-title { font-size: 16px; line-height: 1.38; font-style: italic; font-weight: bold; color: #6c6c6c; text-transform: inherit; } .static-content .image-desc { font-size: 16px; font-weight: bold; font-style: normal; font-stretch: normal; line-height: 1.44; letter-spacing: normal; text-align: left; color: #4a4a4a; display: block; position: relative; padding-bottom: 17px; margin-bottom: 40px; } .static-content .image-desc:before { content: ''; position: absolute; bottom: 0; width: 100%; height: 2px; background-color: #bfbfbf; } .static-content .image-desc--kitchen { margin-bottom: 30px; } .static-content .image-desc--mod { margin-bottom: 13px; } ol { list-style-type: decimal; list-style-position: inside; counter-reset: item; margin: 0; padding: 0; } ol li { display: block; position: relative; } ol li:before { content: counters(item, ".") ". "; counter-increment: item; display: inline; vertical-align: top; font-weight: 700; } .upper { text-transform: uppercase; } .title { text-transform: uppercase; font-size: 36px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: 0.1em; text-align: left; color: #006699; padding-bottom: 12px; } .category-tag { display: inline-block; color: #989898; line-height: 1.43; font-size: 14px; border-bottom: 1px solid #989898; } .static-wrap { max-width: 695px; margin: 0 auto; } body.compensate-for-scrollbar { overflow: hidden; } .fancybox-active { height: auto; } .fancybox-is-hidden { left: -9999px; margin: 0; position: absolute !important; top: -9999px; visibility: hidden; } .fancybox-container { -webkit-backface-visibility: hidden; height: 100%; left: 0; outline: none; position: fixed; -webkit-tap-highlight-color: transparent; top: 0; -ms-touch-action: manipulation; touch-action: manipulation; -webkit-transform: translateZ(0); transform: translateZ(0); width: 100%; z-index: 99992; } .fancybox-container * { -webkit-box-sizing: border-box; box-sizing: border-box; } .fancybox-outer, .fancybox-inner, .fancybox-bg, .fancybox-stage { bottom: 0; left: 0; position: absolute; right: 0; top: 0; } .fancybox-outer { -webkit-overflow-scrolling: touch; overflow-y: auto; } .fancybox-bg { background: #1e1e1e; opacity: 0; -webkit-transition-duration: inherit; transition-duration: inherit; -webkit-transition-property: opacity; transition-property: opacity; -webkit-transition-timing-function: cubic-bezier(0.47, 0, 0.74, 0.71); transition-timing-function: cubic-bezier(0.47, 0, 0.74, 0.71); } .fancybox-is-open .fancybox-bg { opacity: .9; -webkit-transition-timing-function: cubic-bezier(0.22, 0.61, 0.36, 1); transition-timing-function: cubic-bezier(0.22, 0.61, 0.36, 1); } .fancybox-infobar, .fancybox-toolbar, .fancybox-caption, .fancybox-navigation .fancybox-button { direction: ltr; opacity: 0; position: absolute; -webkit-transition: opacity .25s ease, visibility 0s ease .25s; transition: opacity .25s ease, visibility 0s ease .25s; visibility: hidden; z-index: 99997; } .fancybox-show-infobar .fancybox-infobar, .fancybox-show-toolbar .fancybox-toolbar, .fancybox-show-caption .fancybox-caption, .fancybox-show-nav .fancybox-navigation .fancybox-button { opacity: 1; -webkit-transition: opacity .25s ease 0s, visibility 0s ease 0s; transition: opacity .25s ease 0s, visibility 0s ease 0s; visibility: visible; } .fancybox-infobar { color: #ccc; font-size: 13px; -webkit-font-smoothing: subpixel-antialiased; height: 44px; left: 0; line-height: 44px; min-width: 44px; mix-blend-mode: difference; padding: 0 10px; pointer-events: none; top: 0; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .fancybox-toolbar { right: 0; top: 0; } .fancybox-stage { direction: ltr; overflow: visible; -webkit-transform: translateZ(0); transform: translateZ(0); z-index: 99994; } .fancybox-is-open .fancybox-stage { overflow: hidden; } .fancybox-slide { -webkit-backface-visibility: hidden; /* Using without prefix would break IE11 */ display: none; height: 100%; left: 0; outline: none; overflow: auto; -webkit-overflow-scrolling: touch; padding: 44px; position: absolute; text-align: center; top: 0; -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; white-space: normal; width: 100%; z-index: 99994; } .fancybox-slide::before { content: ''; display: inline-block; font-size: 0; height: 100%; vertical-align: middle; width: 0; } .fancybox-is-sliding .fancybox-slide, .fancybox-slide--previous, .fancybox-slide--current, .fancybox-slide--next { display: block; } .fancybox-slide--image { overflow: hidden; padding: 44px 0; } .fancybox-slide--image::before { display: none; } .fancybox-slide--html { padding: 6px; } .fancybox-content { background: #fff; display: inline-block; margin: 0; max-width: 100%; overflow: auto; -webkit-overflow-scrolling: touch; padding: 44px; position: relative; text-align: left; vertical-align: middle; } .fancybox-slide--image .fancybox-content { -webkit-animation-timing-function: cubic-bezier(0.5, 0, 0.14, 1); animation-timing-function: cubic-bezier(0.5, 0, 0.14, 1); -webkit-backface-visibility: hidden; background: transparent; background-repeat: no-repeat; background-size: 100% 100%; left: 0; max-width: none; overflow: visible; padding: 0; position: absolute; top: 0; -ms-transform-origin: top left; -webkit-transform-origin: top left; transform-origin: top left; -webkit-transition-property: opacity, -webkit-transform; transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; z-index: 99995; } .fancybox-can-zoomOut .fancybox-content { cursor: -webkit-zoom-out; cursor: zoom-out; } .fancybox-can-zoomIn .fancybox-content { cursor: -webkit-zoom-in; cursor: zoom-in; } .fancybox-can-swipe .fancybox-content, .fancybox-can-pan .fancybox-content { cursor: -webkit-grab; cursor: grab; } .fancybox-is-grabbing .fancybox-content { cursor: -webkit-grabbing; cursor: grabbing; } .fancybox-container [data-selectable='true'] { cursor: text; } .fancybox-image, .fancybox-spaceball { background: transparent; border: 0; height: 100%; left: 0; margin: 0; max-height: none; max-width: none; padding: 0; position: absolute; top: 0; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; width: 100%; } .fancybox-spaceball { z-index: 1; } .fancybox-slide--video .fancybox-content, .fancybox-slide--map .fancybox-content, .fancybox-slide--pdf .fancybox-content, .fancybox-slide--iframe .fancybox-content { height: 100%; overflow: visible; padding: 0; width: 100%; } .fancybox-slide--video .fancybox-content { background: #000; } .fancybox-slide--map .fancybox-content { background: #e5e3df; } .fancybox-slide--iframe .fancybox-content { background: #fff; } .fancybox-video, .fancybox-iframe { background: transparent; border: 0; display: block; height: 100%; margin: 0; overflow: hidden; padding: 0; width: 100%; } /* Fix iOS */ .fancybox-iframe { left: 0; position: absolute; top: 0; } .fancybox-error { background: #fff; cursor: default; max-width: 400px; padding: 40px; width: 100%; } .fancybox-error p { color: #444; font-size: 16px; line-height: 20px; margin: 0; padding: 0; } /* Buttons */ .fancybox-button { background: rgba(30, 30, 30, 0.6); border: 0; border-radius: 0; -webkit-box-shadow: none; box-shadow: none; cursor: pointer; display: inline-block; height: 44px; margin: 0; padding: 10px; position: relative; -webkit-transition: color .2s; transition: color .2s; vertical-align: top; visibility: inherit; width: 44px; } .fancybox-button, .fancybox-button:visited, .fancybox-button:link { color: #ccc; } .fancybox-button:hover { color: #fff; } .fancybox-button:focus { outline: none; } .fancybox-button.fancybox-focus { outline: 1px dotted; } .fancybox-button[disabled], .fancybox-button[disabled]:hover { color: #888; cursor: default; outline: none; } /* Fix IE11 */ .fancybox-button div { height: 100%; } .fancybox-button svg { display: block; height: 100%; overflow: visible; position: relative; width: 100%; } .fancybox-button svg path { fill: currentColor; stroke-width: 0; } .fancybox-button--play svg:nth-child(2), .fancybox-button--fsenter svg:nth-child(2) { display: none; } .fancybox-button--pause svg:nth-child(1), .fancybox-button--fsexit svg:nth-child(1) { display: none; } .fancybox-progress { background: #ff5268; height: 2px; left: 0; position: absolute; right: 0; top: 0; -ms-transform: scaleX(0); -webkit-transform: scaleX(0); transform: scaleX(0); -ms-transform-origin: 0; -webkit-transform-origin: 0; transform-origin: 0; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-transition-timing-function: linear; transition-timing-function: linear; z-index: 99998; } /* Close button on the top right corner of html content */ .fancybox-close-small { background: transparent; border: 0; border-radius: 0; color: #ccc; cursor: pointer; opacity: .8; padding: 8px; position: absolute; right: -12px; top: -44px; z-index: 401; } .fancybox-close-small:hover { color: #fff; opacity: 1; } .fancybox-slide--html .fancybox-close-small { color: currentColor; padding: 10px; right: 0; top: 0; } .fancybox-slide--image.fancybox-is-scaling .fancybox-content { overflow: hidden; } .fancybox-is-scaling .fancybox-close-small, .fancybox-is-zoomable.fancybox-can-pan .fancybox-close-small { display: none; } /* Navigation arrows */ .fancybox-navigation .fancybox-button { background-clip: content-box; height: 100px; opacity: 0; position: absolute; top: calc(50% - 50px); width: 70px; } .fancybox-navigation .fancybox-button div { padding: 7px; } .fancybox-navigation .fancybox-button--arrow_left { left: 0; left: env(safe-area-inset-left); padding: 31px 26px 31px 6px; } .fancybox-navigation .fancybox-button--arrow_right { padding: 31px 6px 31px 26px; right: 0; right: env(safe-area-inset-right); } /* Caption */ .fancybox-caption { background: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.85)), color-stop(50%, rgba(0, 0, 0, 0.3)), color-stop(65%, rgba(0, 0, 0, 0.15)), color-stop(75.5%, rgba(0, 0, 0, 0.075)), color-stop(82.85%, rgba(0, 0, 0, 0.037)), color-stop(88%, rgba(0, 0, 0, 0.019)), to(rgba(0, 0, 0, 0))); background: linear-gradient(to top, rgba(0, 0, 0, 0.85) 0%, rgba(0, 0, 0, 0.3) 50%, rgba(0, 0, 0, 0.15) 65%, rgba(0, 0, 0, 0.075) 75.5%, rgba(0, 0, 0, 0.037) 82.85%, rgba(0, 0, 0, 0.019) 88%, rgba(0, 0, 0, 0) 100%); bottom: 0; color: #eee; font-size: 14px; font-weight: 400; left: 0; line-height: 1.5; padding: 75px 44px 25px 44px; pointer-events: none; right: 0; text-align: center; z-index: 99996; } @supports (padding: max(0px)) { .fancybox-caption { padding: 75px 44px 25px 44px; } } .fancybox-caption--separate { margin-top: -50px; } .fancybox-caption__body { max-height: 50vh; overflow: auto; pointer-events: all; } .fancybox-caption a, .fancybox-caption a:link, .fancybox-caption a:visited { color: #ccc; text-decoration: none; } .fancybox-caption a:hover { color: #fff; text-decoration: underline; } /* Loading indicator */ .fancybox-loading { -webkit-animation: fancybox-rotate 1s linear infinite; animation: fancybox-rotate 1s linear infinite; background: transparent; border: 4px solid #888; border-bottom-color: #fff; border-radius: 50%; height: 50px; left: 50%; margin: -25px 0 0 -25px; opacity: .7; padding: 0; position: absolute; top: 50%; width: 50px; z-index: 99999; } @-webkit-keyframes fancybox-rotate { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes fancybox-rotate { 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } /* Transition effects */ .fancybox-animated { -webkit-transition-timing-function: cubic-bezier(0, 0, 0.25, 1); transition-timing-function: cubic-bezier(0, 0, 0.25, 1); } /* transitionEffect: slide */ .fancybox-fx-slide.fancybox-slide--previous { opacity: 0; -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); } .fancybox-fx-slide.fancybox-slide--next { opacity: 0; -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); } .fancybox-fx-slide.fancybox-slide--current { opacity: 1; -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } /* transitionEffect: fade */ .fancybox-fx-fade.fancybox-slide--previous, .fancybox-fx-fade.fancybox-slide--next { opacity: 0; -webkit-transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1); } .fancybox-fx-fade.fancybox-slide--current { opacity: 1; } /* transitionEffect: zoom-in-out */ .fancybox-fx-zoom-in-out.fancybox-slide--previous { opacity: 0; -webkit-transform: scale3d(1.5, 1.5, 1.5); transform: scale3d(1.5, 1.5, 1.5); } .fancybox-fx-zoom-in-out.fancybox-slide--next { opacity: 0; -webkit-transform: scale3d(0.5, 0.5, 0.5); transform: scale3d(0.5, 0.5, 0.5); } .fancybox-fx-zoom-in-out.fancybox-slide--current { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); } /* transitionEffect: rotate */ .fancybox-fx-rotate.fancybox-slide--previous { opacity: 0; -ms-transform: rotate(-360deg); -webkit-transform: rotate(-360deg); transform: rotate(-360deg); } .fancybox-fx-rotate.fancybox-slide--next { opacity: 0; -ms-transform: rotate(360deg); -webkit-transform: rotate(360deg); transform: rotate(360deg); } .fancybox-fx-rotate.fancybox-slide--current { opacity: 1; -ms-transform: rotate(0deg); -webkit-transform: rotate(0deg); transform: rotate(0deg); } /* transitionEffect: circular */ .fancybox-fx-circular.fancybox-slide--previous { opacity: 0; -webkit-transform: scale3d(0, 0, 0) translate3d(-100%, 0, 0); transform: scale3d(0, 0, 0) translate3d(-100%, 0, 0); } .fancybox-fx-circular.fancybox-slide--next { opacity: 0; -webkit-transform: scale3d(0, 0, 0) translate3d(100%, 0, 0); transform: scale3d(0, 0, 0) translate3d(100%, 0, 0); } .fancybox-fx-circular.fancybox-slide--current { opacity: 1; -webkit-transform: scale3d(1, 1, 1) translate3d(0, 0, 0); transform: scale3d(1, 1, 1) translate3d(0, 0, 0); } /* transitionEffect: tube */ .fancybox-fx-tube.fancybox-slide--previous { -webkit-transform: translate3d(-100%, 0, 0) scale(0.1) skew(-10deg); transform: translate3d(-100%, 0, 0) scale(0.1) skew(-10deg); } .fancybox-fx-tube.fancybox-slide--next { -webkit-transform: translate3d(100%, 0, 0) scale(0.1) skew(10deg); transform: translate3d(100%, 0, 0) scale(0.1) skew(10deg); } .fancybox-fx-tube.fancybox-slide--current { -webkit-transform: translate3d(0, 0, 0) scale(1); transform: translate3d(0, 0, 0) scale(1); } /* Styling for Small-Screen Devices */ @media all and (max-height: 576px) { .fancybox-slide { padding-left: 6px; padding-right: 6px; } .fancybox-slide--image { padding: 6px 0; } .fancybox-close-small { right: -6px; } .fancybox-slide--image .fancybox-close-small { background: #4e4e4e; color: #f2f4f6; height: 36px; opacity: 1; padding: 6px; right: 0; top: 0; width: 36px; } .fancybox-caption { padding-left: 12px; padding-right: 12px; } @supports (padding: max(0px)) { .fancybox-caption { padding-left: 12px; padding-right: 12px; } } } /* Share */ .fancybox-share { background: #f4f4f4; border-radius: 3px; max-width: 90%; padding: 30px; text-align: center; } .fancybox-share h1 { color: #222; font-size: 35px; font-weight: 700; margin: 0 0 20px 0; } .fancybox-share p { margin: 0; padding: 0; } .fancybox-share__button { border: 0; border-radius: 3px; display: inline-block; font-size: 14px; font-weight: 700; line-height: 40px; margin: 0 5px 10px 5px; min-width: 130px; padding: 0 15px; text-decoration: none; -webkit-transition: all .2s; transition: all .2s; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; white-space: nowrap; } .fancybox-share__button:visited, .fancybox-share__button:link { color: #fff; } .fancybox-share__button:hover { text-decoration: none; } .fancybox-share__button--fb { background: #3b5998; } .fancybox-share__button--fb:hover { background: #344e86; } .fancybox-share__button--pt { background: #bd081d; } .fancybox-share__button--pt:hover { background: #aa0719; } .fancybox-share__button--tw { background: #1da1f2; } .fancybox-share__button--tw:hover { background: #0d95e8; } .fancybox-share__button svg { height: 25px; margin-right: 7px; position: relative; top: -1px; vertical-align: middle; width: 25px; } .fancybox-share__button svg path { fill: #fff; } .fancybox-share__input { background: transparent; border: 0; border-bottom: 1px solid #d7d7d7; border-radius: 0; color: #5d5b5b; font-size: 14px; margin: 10px 0 0 0; outline: none; padding: 10px 15px; width: 100%; } /* Thumbs */ .fancybox-thumbs { background: #ddd; bottom: 0; display: none; margin: 0; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar; padding: 2px 2px 4px 2px; position: absolute; right: 0; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); top: 0; width: 212px; z-index: 99995; } .fancybox-thumbs-x { overflow-x: auto; overflow-y: hidden; } .fancybox-show-thumbs .fancybox-thumbs { display: block; } .fancybox-show-thumbs .fancybox-inner { right: 212px; } .fancybox-thumbs__list { font-size: 0; height: 100%; list-style: none; margin: 0; overflow-x: hidden; overflow-y: auto; padding: 0; position: absolute; position: relative; white-space: nowrap; width: 100%; } .fancybox-thumbs-x .fancybox-thumbs__list { overflow: hidden; } .fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar { width: 7px; } .fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-track { background: #fff; border-radius: 10px; -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); } .fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-thumb { background: #2a2a2a; border-radius: 10px; } .fancybox-thumbs__list a { -webkit-backface-visibility: hidden; backface-visibility: hidden; background-color: rgba(0, 0, 0, 0.1); background-position: center center; background-repeat: no-repeat; background-size: cover; cursor: pointer; float: left; height: 75px; margin: 2px; max-height: calc(92%); max-width: calc(46%); outline: none; overflow: hidden; padding: 0; position: relative; -webkit-tap-highlight-color: transparent; width: 100px; } .fancybox-thumbs__list a::before { border: 6px solid #ff5268; bottom: 0; content: ''; left: 0; opacity: 0; position: absolute; right: 0; top: 0; -webkit-transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94); transition: all 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94); z-index: 99991; } .fancybox-thumbs__list a:focus::before { opacity: .5; } .fancybox-thumbs__list a.fancybox-thumbs-active::before { opacity: 1; } /* Styling for Small-Screen Devices */ @media all and (max-width: 576px) { .fancybox-thumbs { width: 110px; } .fancybox-show-thumbs .fancybox-inner { right: 110px; } .fancybox-thumbs__list a { max-width: calc(90%); } } .jq-checkbox, .jq-radio { position: relative; display: inline-block; overflow: hidden; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .jq-checkbox input, .jq-radio input { position: absolute; z-index: -1; margin: 0; padding: 0; opacity: 0; } .jq-file { position: relative; display: inline-block; overflow: hidden; } .jq-file input { position: absolute; top: 0; right: 0; height: auto; margin: 0; padding: 0; opacity: 0; font-size: 100px; line-height: 1em; } .jq-file__name { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .jq-selectbox, .jq-select-multiple { position: relative; display: inline-block; } .jq-selectbox select, .jq-select-multiple select { position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; padding: 0; opacity: 0; } .jq-selectbox li, .jq-select-multiple li { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; white-space: nowrap; } .jq-selectbox { z-index: 10; } .jq-selectbox__select { position: relative; } .jq-selectbox__select-text { overflow: hidden; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; white-space: nowrap; text-overflow: ellipsis; } .jq-selectbox__dropdown { position: absolute; } .jq-selectbox__search input { -webkit-appearance: textfield; } .jq-selectbox__search input::-webkit-search-cancel-button, .jq-selectbox__search input::-webkit-search-decoration { -webkit-appearance: none; } .jq-selectbox__dropdown ul { position: relative; overflow: auto; overflow-x: hidden; list-style: none; -webkit-overflow-scrolling: touch; } .jq-select-multiple ul { position: relative; overflow-x: hidden; -webkit-overflow-scrolling: touch; } .jq-number { display: inline-block; } .jq-number__field input { -moz-appearance: textfield; text-align: left; /* для Opera Presto */ } .jq-number__field input::-webkit-inner-spin-button, .jq-number__field input::-webkit-outer-spin-button { margin: 0; /* в каких-то браузерах присутствует отступ */ -webkit-appearance: none; } .jq-checkbox, .jq-radio { vertical-align: -4px; width: 16px; height: 16px; margin: 0 4px 0 0; border: 1px solid #C3C3C3; background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#E6E6E6)); background: linear-gradient(#FFF, #E6E6E6); -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05), inset -1px -1px #FFF, inset 1px -1px #FFF; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05), inset -1px -1px #FFF, inset 1px -1px #FFF; cursor: pointer; } .jq-checkbox.focused, .jq-radio.focused { border: 1px solid #08C; } .jq-checkbox.disabled, .jq-radio.disabled { opacity: .55; } .jq-checkbox { border-radius: 3px; } .jq-checkbox.checked .jq-checkbox__div { width: 8px; height: 4px; margin: 3px 0 0 3px; border-bottom: 2px solid #666; border-left: 2px solid #666; -webkit-transform: rotate(-50deg); -ms-transform: rotate(-50deg); transform: rotate(-50deg); } .jq-radio { border-radius: 50%; } .jq-radio.checked .jq-radio__div { width: 10px; height: 10px; margin: 3px 0 0 3px; border-radius: 50%; background: #777; -webkit-box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.7); box-shadow: inset 1px 1px 1px rgba(0, 0, 0, 0.7); } .jq-file { width: 270px; border-radius: 4px; -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); } .jq-file input { cursor: pointer; } .jq-file__name { -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; height: 34px; padding: 0 80px 0 10px; border: 1px solid #CCC; border-bottom-color: #B3B3B3; border-radius: 4px; background: #FFF; -webkit-box-shadow: inset 1px 1px #F1F1F1; box-shadow: inset 1px 1px #F1F1F1; font: 14px/32px Arial, sans-serif; color: #333; } .jq-file__browse { position: absolute; top: 1px; right: 1px; padding: 0 10px; border-left: 1px solid #CCC; border-radius: 0 4px 4px 0; background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#E6E6E6)); background: linear-gradient(#FFF, #E6E6E6); -webkit-box-shadow: inset 1px -1px #F1F1F1, inset -1px 0 #F1F1F1, 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: inset 1px -1px #F1F1F1, inset -1px 0 #F1F1F1, 0 1px 2px rgba(0, 0, 0, 0.1); color: #333; text-shadow: 1px 1px #FFF; } .jq-file:hover .jq-file__browse { background: -webkit-gradient(linear, left top, left bottom, from(#F6F6F6), to(#E6E6E6)); background: linear-gradient(#F6F6F6, #E6E6E6); } .jq-file:active .jq-file__browse { background: #F5F5F5; -webkit-box-shadow: inset 1px 1px 3px #DDD; box-shadow: inset 1px 1px 3px #DDD; } .jq-file.focused .jq-file__name { border: 1px solid #5794BF; } .jq-file.disabled, .jq-file.disabled .jq-file__name, .jq-file.disabled .jq-file__browse { border-color: #CCC; background: #F5F5F5; -webkit-box-shadow: none; box-shadow: none; color: #888; } .jq-number { position: relative; vertical-align: middle; padding: 0 36px 0 0; } .jq-number__field { width: 100px; border: 1px solid #CCC; border-bottom-color: #B3B3B3; border-radius: 4px; -webkit-box-shadow: inset 1px 1px #F1F1F1, 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: inset 1px 1px #F1F1F1, 0 1px 2px rgba(0, 0, 0, 0.1); } .jq-number__field:hover { border-color: #B3B3B3; } .jq-number__field input { -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; padding: 8px 9px; border: none; outline: none; background: none; color: #333; } .jq-number__spin { position: absolute; top: 0; right: 0; width: 32px; height: 14px; border: 1px solid #CCC; border-bottom-color: #B3B3B3; border-radius: 4px; background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#E6E6E6)); background: linear-gradient(#FFF, #E6E6E6); -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); -webkit-box-shadow: inset 1px -1px #F1F1F1, inset -1px 0 #F1F1F1, 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: inset 1px -1px #F1F1F1, inset -1px 0 #F1F1F1, 0 1px 2px rgba(0, 0, 0, 0.1); -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; text-shadow: 1px 1px #FFF; cursor: pointer; } .jq-number__spin.minus { top: auto; bottom: 0; } .jq-number__spin:hover { background: -webkit-gradient(linear, left top, left bottom, from(#F6F6F6), to(#E6E6E6)); background: linear-gradient(#F6F6F6, #E6E6E6); } .jq-number__spin:active { background: #F5F5F5; -webkit-box-shadow: inset 1px 1px 3px #DDD; box-shadow: inset 1px 1px 3px #DDD; } .jq-number__spin:after { content: ''; position: absolute; top: 4px; left: 11px; width: 0; height: 0; border-right: 5px solid transparent; border-bottom: 5px solid #999; border-left: 5px solid transparent; } .jq-number__spin.minus:after { top: 5px; border-top: 5px solid #999; border-right: 5px solid transparent; border-bottom: none; border-left: 5px solid transparent; } .jq-number__spin.minus:hover:after { border-top-color: #000; } .jq-number__spin.plus:hover:after { border-bottom-color: #000; } .jq-number.focused .jq-number__field { border: 1px solid #5794BF; } .jq-number.disabled .jq-number__field, .jq-number.disabled .jq-number__spin { border-color: #CCC; background: #F5F5F5; -webkit-box-shadow: none; box-shadow: none; color: #888; } .jq-number.disabled .jq-number__spin:after { border-bottom-color: #AAA; } .jq-number.disabled .jq-number__spin.minus:after { border-top-color: #AAA; } .jq-selectbox { vertical-align: middle; cursor: pointer; } .jq-selectbox__select { height: 32px; padding: 5px 15px 0 10px; border: 1px solid #CCC; border-bottom-color: #B3B3B3; border-radius: 4px; background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#E6E6E6)); background: linear-gradient(#FFF, #E6E6E6); -webkit-box-shadow: inset 1px -1px #F1F1F1, inset -1px 0 #F1F1F1, 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: inset 1px -1px #F1F1F1, inset -1px 0 #F1F1F1, 0 1px 2px rgba(0, 0, 0, 0.1); color: #333; text-shadow: 1px 1px #FFF; } .jq-selectbox__select:hover { background: -webkit-gradient(linear, left top, left bottom, from(#F6F6F6), to(#E6E6E6)); background: linear-gradient(#F6F6F6, #E6E6E6); } .jq-selectbox__select:active { background: #F5F5F5; -webkit-box-shadow: inset 1px 1px 3px #DDD; box-shadow: inset 1px 1px 3px #DDD; } .jq-selectbox.focused .jq-selectbox__select { border: 1px solid #5794BF; } .jq-selectbox.disabled .jq-selectbox__select { border-color: #CCC; background: #F5F5F5; -webkit-box-shadow: none; box-shadow: none; color: #888; } .jq-selectbox__select-text { display: block; width: 100%; } .jq-selectbox .placeholder { color: #888; } .jq-selectbox__trigger { position: absolute; top: 0; right: 0; width: 34px; height: 100%; border-left: 1px solid #CCC; } .jq-selectbox__trigger-arrow { position: absolute; top: 14px; right: 12px; width: 0; height: 0; border-top: 5px solid #999; border-right: 5px solid transparent; border-left: 5px solid transparent; } .jq-selectbox:hover .jq-selectbox__trigger-arrow { border-top-color: #000; } .jq-selectbox.disabled .jq-selectbox__trigger-arrow { border-top-color: #AAA; } .jq-selectbox__dropdown { -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; margin: 2px 0 0; padding: 0; border: 1px solid #CCC; border-radius: 4px; background: #FFF; -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2); box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2); } .jq-selectbox__search { margin: 5px; } .jq-selectbox__search input { -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; margin: 0; padding: 5px 27px 6px 8px; border: 1px solid #CCC; border-radius: 3px; outline: none; background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAMCAYAAABiDJ37AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAO1JREFUeNqU078LAXEYx/FzYfNzk5TJaFNKYjFYSQZ/hvwBsvg1UCY2xT9gM8hukQGThWRjkcFw3pdnujhfT736Xn2fPvfc3fd07V0OFDDFAnM0ENYsZRiGLSc9OpqIYIA9fMhhjCrW2h9VlMlcH/aymMGtOqEugX08PwQucUZKdTozMIqdTc9WepQD7wjY9ARx+ydwhfyXfS+S0qMcOEQJGcueB3VccFINdMgal6NzkmPjRwJXxDBB7/2RDdtAp6wb+dpphHDASG5QQ0V6u2aoSqBZD/lDrNWRJynLK2qpBn4rc6K2XB9/Nb8EGABtf1thzY6X2AAAAABJRU5ErkJggg==') no-repeat 100% 50%; -webkit-box-shadow: inset 1px 1px #F1F1F1; box-shadow: inset 1px 1px #F1F1F1; color: #333; } .jq-selectbox__not-found { margin: 5px; padding: 5px 8px 6px; background: #F0F0F0; font-size: 13px; } .jq-selectbox ul { margin: 0; padding: 0; } .jq-selectbox li { min-height: 18px; padding: 5px 10px 6px; color: #231F20; } .jq-selectbox li.selected { background-color: #A3ABB1; color: #FFF; } .jq-selectbox li:hover { background-color: #08C; color: #FFF; } .jq-selectbox li.disabled { color: #AAA; } .jq-selectbox li.disabled:hover { background: none; } .jq-selectbox li.optgroup { font-weight: bold; } .jq-selectbox li.optgroup:hover { background: none; color: #231F20; cursor: default; } .jq-selectbox li.option { padding-left: 25px; } .jq-select-multiple { -webkit-box-sizing: border-box; box-sizing: border-box; padding: 1px; border: 1px solid #CCC; border-bottom-color: #B3B3B3; border-radius: 4px; background: #FFF; -webkit-box-shadow: inset 1px 1px #F1F1F1, 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: inset 1px 1px #F1F1F1, 0 1px 2px rgba(0, 0, 0, 0.1); color: #333; cursor: default; } .jq-select-multiple.focused { border: 1px solid #5794BF; } .jq-select-multiple.disabled { border-color: #CCC; background: #F5F5F5; -webkit-box-shadow: none; box-shadow: none; color: #888; } .jq-select-multiple ul { margin: 0; padding: 0; } .jq-select-multiple li { padding: 3px 9px 4px; list-style: none; } .jq-select-multiple li:first-child { border-radius: 3px 3px 0 0; } .jq-select-multiple li:last-child { border-radius: 0 0 3px 3px; } .jq-select-multiple li.selected { background: #08C; color: #FFF; } .jq-select-multiple li.disabled { color: #AAA; } .jq-select-multiple li.optgroup { font-weight: bold; } .jq-select-multiple li.option { padding-left: 25px; } .jq-select-multiple.disabled li.selected, .jq-select-multiple li.selected.disabled { background: #CCC; color: #FFF; } input[type='email'].styler, input[type='password'].styler, input[type='search'].styler, input[type='tel'].styler, input[type='text'].styler, input[type='url'].styler, textarea.styler { padding: 8px 9px; border: 1px solid #CCC; border-bottom-color: #B3B3B3; border-radius: 4px; -webkit-box-shadow: inset 1px 1px #F1F1F1, 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: inset 1px 1px #F1F1F1, 0 1px 2px rgba(0, 0, 0, 0.1); color: #333; } input[type='search'].styler { -webkit-appearance: none; -moz-appearance: none; appearance: none; } textarea.styler { overflow: auto; } input[type='email'].styler:hover, input[type='password'].styler:hover, input[type='search'].styler:hover, input[type='tel'].styler:hover, input[type='text'].styler:hover, input[type='url'].styler:hover, textarea.styler:hover { border-color: #B3B3B3; } input[type='email'].styler:hover:focus, input[type='password'].styler:hover:focus, input[type='search'].styler:hover:focus, input[type='tel'].styler:hover:focus, input[type='text'].styler:hover:focus, input[type='url'].styler:hover:focus, textarea.styler:hover:focus { border-color: #CCC; border-top-color: #B3B3B3; outline: none; -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1); } button.styler, input[type='button'].styler, input[type='submit'].styler, input[type='reset'].styler { overflow: visible; padding: 8px 11px; border: 1px solid #CCC; border-bottom-color: #B3B3B3; border-radius: 4px; outline: none; background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#E6E6E6)); background: linear-gradient(#FFF, #E6E6E6); -webkit-box-shadow: inset 1px -1px #F1F1F1, inset -1px 0 #F1F1F1, 0 1px 2px rgba(0, 0, 0, 0.1); box-shadow: inset 1px -1px #F1F1F1, inset -1px 0 #F1F1F1, 0 1px 2px rgba(0, 0, 0, 0.1); color: #333; text-shadow: 1px 1px #FFF; cursor: pointer; } button.styler.styler::-moz-focus-inner, input[type='button'].styler.styler::-moz-focus-inner, input[type='submit'].styler.styler::-moz-focus-inner, input[type='reset'].styler.styler::-moz-focus-inner { padding: 0; border: 0; } button.styler:not([disabled]):hover, input[type='button'].styler:not([disabled]):hover, input[type='submit'].styler:not([disabled]):hover, input[type='reset'].styler:not([disabled]):hover, input[type='reset'].styler:hover { background: -webkit-gradient(linear, left top, left bottom, from(#F6F6F6), to(#E6E6E6)); background: linear-gradient(#F6F6F6, #E6E6E6); } button.styler:active, input[type='button'].styler:active, input[type='submit'].styler:active, input[type='reset'].styler:active { background: #F5F5F5; -webkit-box-shadow: inset 1px 1px 3px #DDD; box-shadow: inset 1px 1px 3px #DDD; } button.styler[disabled], input[type='button'].styler[disabled], input[type='submit'].styler[disabled] { border-color: #CCC; background: #F5F5F5; -webkit-box-shadow: none; box-shadow: none; color: #888; } /* == malihu jquery custom scrollbar plugin == Plugin URI: http://manos.malihu.gr/jquery-custom-content-scroller */ /* CONTENTS: 1. BASIC STYLE - Plugin's basic/essential CSS properties (normally, should not be edited). 2. VERTICAL SCROLLBAR - Positioning and dimensions of vertical scrollbar. 3. HORIZONTAL SCROLLBAR - Positioning and dimensions of horizontal scrollbar. 4. VERTICAL AND HORIZONTAL SCROLLBARS - Positioning and dimensions of 2-axis scrollbars. 5. TRANSITIONS - CSS3 transitions for hover events, auto-expanded and auto-hidden scrollbars. 6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS 6.1 THEMES - Scrollbar colors, opacity, dimensions, backgrounds etc. via ready-to-use themes. */ /* ------------------------------------------------------------------------------------------------------------------------ 1. BASIC STYLE ------------------------------------------------------------------------------------------------------------------------ */ .mCustomScrollbar { -ms-touch-action: pinch-zoom; touch-action: pinch-zoom; /* direct pointer events to js */ } .mCustomScrollbar.mCS_no_scrollbar, .mCustomScrollbar.mCS_touch_action { -ms-touch-action: auto; touch-action: auto; } .mCustomScrollBox { /* contains plugin's markup */ position: relative; overflow: hidden; height: 100%; max-width: 100%; outline: none; direction: ltr; } .mCSB_container { /* contains the original content */ overflow: hidden; width: auto; height: auto; } /* ------------------------------------------------------------------------------------------------------------------------ 2. VERTICAL SCROLLBAR y-axis ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_inside > .mCSB_container { margin-right: 30px; } .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden { margin-right: 0; } /* non-visible scrollbar */ .mCS-dir-rtl > .mCSB_inside > .mCSB_container { /* RTL direction/left-side scrollbar */ margin-right: 0; margin-left: 30px; } .mCS-dir-rtl > .mCSB_inside > .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden { margin-left: 0; } /* RTL direction/left-side scrollbar */ .mCSB_scrollTools { /* contains scrollbar markup (draggable element, dragger rail, buttons etc.) */ position: absolute; width: 16px; height: auto; left: auto; top: 0; right: 0; bottom: 0; } .mCSB_outside + .mCSB_scrollTools { right: -26px; } /* scrollbar position: outside */ .mCS-dir-rtl > .mCSB_inside > .mCSB_scrollTools, .mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools { /* RTL direction/left-side scrollbar */ right: auto; left: 0; } .mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools { left: -26px; } /* RTL direction/left-side scrollbar (scrollbar position: outside) */ .mCSB_scrollTools .mCSB_draggerContainer { /* contains the draggable element and dragger rail markup */ position: absolute; top: 0; left: 0; bottom: 0; right: 0; height: auto; } .mCSB_scrollTools a + .mCSB_draggerContainer { margin: 20px 0; } .mCSB_scrollTools .mCSB_draggerRail { width: 2px; height: 100%; margin: 0 auto; border-radius: 16px; } .mCSB_scrollTools .mCSB_dragger { /* the draggable element */ cursor: pointer; width: 100%; height: 30px; /* minimum dragger height */ z-index: 1; } .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { /* the dragger element */ position: relative; width: 4px; height: 100%; margin: 0 auto; border-radius: 16px; text-align: center; } .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar { width: 12px; /* auto-expanded scrollbar */ } .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { width: 8px; /* auto-expanded scrollbar */ } .mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown { display: block; position: absolute; height: 20px; width: 100%; overflow: hidden; margin: 0 auto; cursor: pointer; } .mCSB_scrollTools .mCSB_buttonDown { bottom: 0; } /* ------------------------------------------------------------------------------------------------------------------------ 3. HORIZONTAL SCROLLBAR x-axis ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_horizontal.mCSB_inside > .mCSB_container { margin-right: 0; margin-bottom: 30px; } .mCSB_horizontal.mCSB_outside > .mCSB_container { min-height: 100%; } .mCSB_horizontal > .mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden { margin-bottom: 0; } /* non-visible scrollbar */ .mCSB_scrollTools.mCSB_scrollTools_horizontal { width: auto; height: 16px; top: auto; right: 0; bottom: 0; left: 0; } .mCustomScrollBox + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal { bottom: -26px; } /* scrollbar position: outside */ .mCSB_scrollTools.mCSB_scrollTools_horizontal a + .mCSB_draggerContainer { margin: 0 20px; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail { width: 100%; height: 2px; margin: 7px 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger { width: 30px; /* minimum dragger width */ height: 100%; left: 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { width: 100%; height: 4px; margin: 6px auto; } .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar { height: 12px; /* auto-expanded scrollbar */ margin: 2px auto; } .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { height: 8px; /* auto-expanded scrollbar */ margin: 4px 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft, .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight { display: block; position: absolute; width: 20px; height: 100%; overflow: hidden; margin: 0 auto; cursor: pointer; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft { left: 0; } .mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight { right: 0; } /* ------------------------------------------------------------------------------------------------------------------------ 4. VERTICAL AND HORIZONTAL SCROLLBARS yx-axis ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_container_wrapper { position: absolute; height: auto; width: auto; overflow: hidden; top: 0; left: 0; right: 0; bottom: 0; margin-right: 30px; margin-bottom: 30px; } .mCSB_container_wrapper > .mCSB_container { padding-right: 30px; padding-bottom: 30px; -webkit-box-sizing: border-box; box-sizing: border-box; } .mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_vertical { bottom: 20px; } .mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_horizontal { right: 20px; } /* non-visible horizontal scrollbar */ .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden + .mCSB_scrollTools.mCSB_scrollTools_vertical { bottom: 0; } /* non-visible vertical scrollbar/RTL direction/left-side scrollbar */ .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal { right: 0; } /* RTL direction/left-side scrollbar */ .mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal { left: 20px; } /* non-visible scrollbar/RTL direction/left-side scrollbar */ .mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal { left: 0; } .mCS-dir-rtl > .mCSB_inside > .mCSB_container_wrapper { /* RTL direction/left-side scrollbar */ margin-right: 0; margin-left: 30px; } .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden > .mCSB_container { padding-right: 0; } .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden > .mCSB_container { padding-bottom: 0; } .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden { margin-right: 0; /* non-visible scrollbar */ margin-left: 0; } /* non-visible horizontal scrollbar */ .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden { margin-bottom: 0; } /* ------------------------------------------------------------------------------------------------------------------------ 5. TRANSITIONS ------------------------------------------------------------------------------------------------------------------------ */ .mCSB_scrollTools, .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown, .mCSB_scrollTools .mCSB_buttonLeft, .mCSB_scrollTools .mCSB_buttonRight { -webkit-transition: opacity 0.2s ease-in-out, background-color 0.2s ease-in-out; transition: opacity 0.2s ease-in-out, background-color 0.2s ease-in-out; } .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, .mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail { -webkit-transition: width 0.2s ease-out 0.2s, height 0.2s ease-out 0.2s, margin-left 0.2s ease-out 0.2s, margin-right 0.2s ease-out 0.2s, margin-top 0.2s ease-out 0.2s, margin-bottom 0.2s ease-out 0.2s, opacity 0.2s ease-in-out, background-color 0.2s ease-in-out; transition: width 0.2s ease-out 0.2s, height 0.2s ease-out 0.2s, margin-left 0.2s ease-out 0.2s, margin-right 0.2s ease-out 0.2s, margin-top 0.2s ease-out 0.2s, margin-bottom 0.2s ease-out 0.2s, opacity 0.2s ease-in-out, background-color 0.2s ease-in-out; } /* ------------------------------------------------------------------------------------------------------------------------ 6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS ------------------------------------------------------------------------------------------------------------------------ */ /* ---------------------------------------- 6.1 THEMES ---------------------------------------- */ /* default theme ("light") */ .mCSB_scrollTools { opacity: 0.75; filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; } .mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools { opacity: 0; filter: "alpha(opacity=0)"; -ms-filter: "alpha(opacity=0)"; } .mCustomScrollbar > .mCustomScrollBox > .mCSB_scrollTools.mCSB_scrollTools_onDrag, .mCustomScrollbar > .mCustomScrollBox ~ .mCSB_scrollTools.mCSB_scrollTools_onDrag, .mCustomScrollBox:hover > .mCSB_scrollTools, .mCustomScrollBox:hover ~ .mCSB_scrollTools, .mCS-autoHide:hover > .mCustomScrollBox > .mCSB_scrollTools, .mCS-autoHide:hover > .mCustomScrollBox ~ .mCSB_scrollTools { opacity: 1; filter: "alpha(opacity=100)"; -ms-filter: "alpha(opacity=100)"; } .mCSB_scrollTools .mCSB_draggerRail { background-color: #000; background-color: rgba(0, 0, 0, 0.4); filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)"; } .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.75); filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; } .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.85); filter: "alpha(opacity=85)"; -ms-filter: "alpha(opacity=85)"; } .mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.9); filter: "alpha(opacity=90)"; -ms-filter: "alpha(opacity=90)"; } .mCSB_scrollTools .mCSB_buttonUp, .mCSB_scrollTools .mCSB_buttonDown, .mCSB_scrollTools .mCSB_buttonLeft, .mCSB_scrollTools .mCSB_buttonRight { background-image: url(mCSB_buttons.png); /* css sprites */ background-repeat: no-repeat; opacity: 0.4; filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)"; } .mCSB_scrollTools .mCSB_buttonUp { background-position: 0 0; /* sprites locations light: 0 0, -16px 0, -32px 0, -48px 0, 0 -72px, -16px -72px, -32px -72px dark: -80px 0, -96px 0, -112px 0, -128px 0, -80px -72px, -96px -72px, -112px -72px */ } .mCSB_scrollTools .mCSB_buttonDown { background-position: 0 -20px; /* sprites locations light: 0 -20px, -16px -20px, -32px -20px, -48px -20px, 0 -92px, -16px -92px, -32px -92px dark: -80px -20px, -96px -20px, -112px -20px, -128px -20px, -80px -92px, -96px -92px, -112 -92px */ } .mCSB_scrollTools .mCSB_buttonLeft { background-position: 0 -40px; /* sprites locations light: 0 -40px, -20px -40px, -40px -40px, -60px -40px, 0 -112px, -20px -112px, -40px -112px dark: -80px -40px, -100px -40px, -120px -40px, -140px -40px, -80px -112px, -100px -112px, -120px -112px */ } .mCSB_scrollTools .mCSB_buttonRight { background-position: 0 -56px; /* sprites locations light: 0 -56px, -20px -56px, -40px -56px, -60px -56px, 0 -128px, -20px -128px, -40px -128px dark: -80px -56px, -100px -56px, -120px -56px, -140px -56px, -80px -128px, -100px -128px, -120px -128px */ } .mCSB_scrollTools .mCSB_buttonUp:hover, .mCSB_scrollTools .mCSB_buttonDown:hover, .mCSB_scrollTools .mCSB_buttonLeft:hover, .mCSB_scrollTools .mCSB_buttonRight:hover { opacity: 0.75; filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; } .mCSB_scrollTools .mCSB_buttonUp:active, .mCSB_scrollTools .mCSB_buttonDown:active, .mCSB_scrollTools .mCSB_buttonLeft:active, .mCSB_scrollTools .mCSB_buttonRight:active { opacity: 0.9; filter: "alpha(opacity=90)"; -ms-filter: "alpha(opacity=90)"; } /* theme: "dark" */ .mCS-dark.mCSB_scrollTools .mCSB_draggerRail { background-color: #000; background-color: rgba(0, 0, 0, 0.15); } .mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.75); } .mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: rgba(0, 0, 0, 0.85); } .mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: rgba(0, 0, 0, 0.9); } .mCS-dark.mCSB_scrollTools .mCSB_buttonUp { background-position: -80px 0; } .mCS-dark.mCSB_scrollTools .mCSB_buttonDown { background-position: -80px -20px; } .mCS-dark.mCSB_scrollTools .mCSB_buttonLeft { background-position: -80px -40px; } .mCS-dark.mCSB_scrollTools .mCSB_buttonRight { background-position: -80px -56px; } /* ---------------------------------------- */ /* theme: "light-2", "dark-2" */ .mCS-light-2.mCSB_scrollTools .mCSB_draggerRail, .mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail { width: 4px; background-color: #fff; background-color: rgba(255, 255, 255, 0.1); border-radius: 1px; } .mCS-light-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { width: 4px; background-color: #fff; background-color: rgba(255, 255, 255, 0.75); border-radius: 1px; } .mCS-light-2.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-light-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { width: 100%; height: 4px; margin: 6px auto; } .mCS-light-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.85); } .mCS-light-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-light-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.9); } .mCS-light-2.mCSB_scrollTools .mCSB_buttonUp { background-position: -32px 0; } .mCS-light-2.mCSB_scrollTools .mCSB_buttonDown { background-position: -32px -20px; } .mCS-light-2.mCSB_scrollTools .mCSB_buttonLeft { background-position: -40px -40px; } .mCS-light-2.mCSB_scrollTools .mCSB_buttonRight { background-position: -40px -56px; } /* theme: "dark-2" */ .mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail { background-color: #000; background-color: rgba(0, 0, 0, 0.1); border-radius: 1px; } .mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.75); border-radius: 1px; } .mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.85); } .mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.9); } .mCS-dark-2.mCSB_scrollTools .mCSB_buttonUp { background-position: -112px 0; } .mCS-dark-2.mCSB_scrollTools .mCSB_buttonDown { background-position: -112px -20px; } .mCS-dark-2.mCSB_scrollTools .mCSB_buttonLeft { background-position: -120px -40px; } .mCS-dark-2.mCSB_scrollTools .mCSB_buttonRight { background-position: -120px -56px; } /* ---------------------------------------- */ /* theme: "light-thick", "dark-thick" */ .mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail, .mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail { width: 4px; background-color: #fff; background-color: rgba(255, 255, 255, 0.1); border-radius: 2px; } .mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { width: 6px; background-color: #fff; background-color: rgba(255, 255, 255, 0.75); border-radius: 2px; } .mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail { width: 100%; height: 4px; margin: 6px 0; } .mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { width: 100%; height: 6px; margin: 5px auto; } .mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.85); } .mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-light-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.9); } .mCS-light-thick.mCSB_scrollTools .mCSB_buttonUp { background-position: -16px 0; } .mCS-light-thick.mCSB_scrollTools .mCSB_buttonDown { background-position: -16px -20px; } .mCS-light-thick.mCSB_scrollTools .mCSB_buttonLeft { background-position: -20px -40px; } .mCS-light-thick.mCSB_scrollTools .mCSB_buttonRight { background-position: -20px -56px; } /* theme: "dark-thick" */ .mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail { background-color: #000; background-color: rgba(0, 0, 0, 0.1); border-radius: 2px; } .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.75); border-radius: 2px; } .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.85); } .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.9); } .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonUp { background-position: -96px 0; } .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonDown { background-position: -96px -20px; } .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonLeft { background-position: -100px -40px; } .mCS-dark-thick.mCSB_scrollTools .mCSB_buttonRight { background-position: -100px -56px; } /* ---------------------------------------- */ /* theme: "light-thin", "dark-thin" */ .mCS-light-thin.mCSB_scrollTools .mCSB_draggerRail { background-color: #fff; background-color: rgba(255, 255, 255, 0.1); } .mCS-light-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { width: 2px; } .mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail { width: 100%; } .mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { width: 100%; height: 2px; margin: 7px auto; } /* theme "dark-thin" */ .mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail { background-color: #000; background-color: rgba(0, 0, 0, 0.15); } .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.75); } .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.85); } .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark-thin.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.9); } .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonUp { background-position: -80px 0; } .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonDown { background-position: -80px -20px; } .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonLeft { background-position: -80px -40px; } .mCS-dark-thin.mCSB_scrollTools .mCSB_buttonRight { background-position: -80px -56px; } /* ---------------------------------------- */ /* theme "rounded", "rounded-dark", "rounded-dots", "rounded-dots-dark" */ .mCS-rounded.mCSB_scrollTools .mCSB_draggerRail { background-color: #fff; background-color: rgba(255, 255, 255, 0.15); } .mCS-rounded.mCSB_scrollTools .mCSB_dragger, .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger, .mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger { height: 14px; } .mCS-rounded.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { width: 14px; margin: 0 1px; } .mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger { width: 14px; } .mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { height: 14px; margin: 1px 0; } .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar { width: 16px; /* auto-expanded scrollbar */ height: 16px; margin: -1px 0; } .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { width: 4px; /* auto-expanded scrollbar */ } .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar { height: 16px; /* auto-expanded scrollbar */ width: 16px; margin: 0 -1px; } .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { height: 4px; /* auto-expanded scrollbar */ margin: 6px 0; } .mCS-rounded.mCSB_scrollTools .mCSB_buttonUp { background-position: 0 -72px; } .mCS-rounded.mCSB_scrollTools .mCSB_buttonDown { background-position: 0 -92px; } .mCS-rounded.mCSB_scrollTools .mCSB_buttonLeft { background-position: 0 -112px; } .mCS-rounded.mCSB_scrollTools .mCSB_buttonRight { background-position: 0 -128px; } /* theme "rounded-dark", "rounded-dots-dark" */ .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.75); } .mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail { background-color: #000; background-color: rgba(0, 0, 0, 0.15); } .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.85); } .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.9); } .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonUp { background-position: -80px -72px; } .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonDown { background-position: -80px -92px; } .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonLeft { background-position: -80px -112px; } .mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonRight { background-position: -80px -128px; } /* theme "rounded-dots", "rounded-dots-dark" */ .mCS-rounded-dots.mCSB_scrollTools_vertical .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools_vertical .mCSB_draggerRail { width: 4px; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail { background-color: transparent; background-position: center; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg=="); background-repeat: repeat-y; opacity: 0.3; filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)"; } .mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail { height: 4px; margin: 6px 0; background-repeat: repeat-x; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonUp { background-position: -16px -72px; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonDown { background-position: -16px -92px; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonLeft { background-position: -20px -112px; } .mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonRight { background-position: -20px -128px; } /* theme "rounded-dots-dark" */ .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail { background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYV2NkIAAYSVFgDFR8BqrBBEifBbGRTfiPZhpYjiQFBK3A6l6CvgAAE9kGCd1mvgEAAAAASUVORK5CYII="); } .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonUp { background-position: -96px -72px; } .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonDown { background-position: -96px -92px; } .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonLeft { background-position: -100px -112px; } .mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonRight { background-position: -100px -128px; } /* ---------------------------------------- */ /* theme "3d", "3d-dark", "3d-thick", "3d-thick-dark" */ .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-repeat: repeat-y; background-image: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0.5)), to(rgba(255, 255, 255, 0))); background-image: linear-gradient(to right, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); } .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { background-repeat: repeat-x; background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0.5)), to(rgba(255, 255, 255, 0))); background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 100%); } /* theme "3d", "3d-dark" */ .mCS-3d.mCSB_scrollTools_vertical .mCSB_dragger, .mCS-3d-dark.mCSB_scrollTools_vertical .mCSB_dragger { height: 70px; } .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger { width: 70px; } .mCS-3d.mCSB_scrollTools, .mCS-3d-dark.mCSB_scrollTools { opacity: 1; filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)"; } .mCS-3d.mCSB_scrollTools .mCSB_draggerRail, .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { border-radius: 16px; } .mCS-3d.mCSB_scrollTools .mCSB_draggerRail, .mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail { width: 8px; background-color: #000; background-color: rgba(0, 0, 0, 0.2); -webkit-box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.5), inset -1px 0 1px rgba(255, 255, 255, 0.2); box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.5), inset -1px 0 1px rgba(255, 255, 255, 0.2); } .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-3d.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-3d.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #555; } .mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { width: 8px; } .mCS-3d.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail { width: 100%; height: 8px; margin: 4px 0; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5), inset 0 -1px 1px rgba(255, 255, 255, 0.2); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5), inset 0 -1px 1px rgba(255, 255, 255, 0.2); } .mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { width: 100%; height: 8px; margin: 4px auto; } .mCS-3d.mCSB_scrollTools .mCSB_buttonUp { background-position: -32px -72px; } .mCS-3d.mCSB_scrollTools .mCSB_buttonDown { background-position: -32px -92px; } .mCS-3d.mCSB_scrollTools .mCSB_buttonLeft { background-position: -40px -112px; } .mCS-3d.mCSB_scrollTools .mCSB_buttonRight { background-position: -40px -128px; } /* theme "3d-dark" */ .mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail { background-color: #000; background-color: rgba(0, 0, 0, 0.1); -webkit-box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1); box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1); } .mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail { -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1); } .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonUp { background-position: -112px -72px; } .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonDown { background-position: -112px -92px; } .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonLeft { background-position: -120px -112px; } .mCS-3d-dark.mCSB_scrollTools .mCSB_buttonRight { background-position: -120px -128px; } /* ---------------------------------------- */ /* theme: "3d-thick", "3d-thick-dark" */ .mCS-3d-thick.mCSB_scrollTools, .mCS-3d-thick-dark.mCSB_scrollTools { opacity: 1; filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)"; } .mCS-3d-thick.mCSB_scrollTools, .mCS-3d-thick-dark.mCSB_scrollTools, .mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer { border-radius: 7px; } .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { border-radius: 5px; } .mCSB_inside + .mCS-3d-thick.mCSB_scrollTools_vertical, .mCSB_inside + .mCS-3d-thick-dark.mCSB_scrollTools_vertical { right: 1px; } .mCS-3d-thick.mCSB_scrollTools_vertical, .mCS-3d-thick-dark.mCSB_scrollTools_vertical { -webkit-box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.5); box-shadow: inset 1px 0 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.5); } .mCS-3d-thick.mCSB_scrollTools_horizontal, .mCS-3d-thick-dark.mCSB_scrollTools_horizontal { bottom: 1px; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.5); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.5); } .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { -webkit-box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.4); box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.4); width: 12px; margin: 2px; position: absolute; height: auto; top: 0; bottom: 0; left: 0; right: 0; } .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4); } .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-3d-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #555; } .mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { height: 12px; width: auto; } .mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer { background-color: #000; background-color: rgba(0, 0, 0, 0.05); -webkit-box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1); box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1); } .mCS-3d-thick.mCSB_scrollTools .mCSB_draggerRail { background-color: transparent; } .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonUp { background-position: -32px -72px; } .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonDown { background-position: -32px -92px; } .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonLeft { background-position: -40px -112px; } .mCS-3d-thick.mCSB_scrollTools .mCSB_buttonRight { background-position: -40px -128px; } /* theme: "3d-thick-dark" */ .mCS-3d-thick-dark.mCSB_scrollTools { -webkit-box-shadow: inset 0 0 14px rgba(0, 0, 0, 0.2); box-shadow: inset 0 0 14px rgba(0, 0, 0, 0.2); } .mCS-3d-thick-dark.mCSB_scrollTools_horizontal { -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.2); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1), inset 0 0 14px rgba(0, 0, 0, 0.2); } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { -webkit-box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.4), inset -1px 0 0 rgba(0, 0, 0, 0.2); box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.4), inset -1px 0 0 rgba(0, 0, 0, 0.2); } .mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), inset 0 -1px 0 rgba(0, 0, 0, 0.2); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), inset 0 -1px 0 rgba(0, 0, 0, 0.2); } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #777; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer { background-color: #fff; background-color: rgba(0, 0, 0, 0.05); -webkit-box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1); box-shadow: inset 1px 1px 16px rgba(0, 0, 0, 0.1); } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerRail { background-color: transparent; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonUp { background-position: -112px -72px; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonDown { background-position: -112px -92px; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonLeft { background-position: -120px -112px; } .mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonRight { background-position: -120px -128px; } /* ---------------------------------------- */ /* theme: "minimal", "minimal-dark" */ .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical, .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical { right: 0; margin: 12px 0; } .mCustomScrollBox.mCS-minimal + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox.mCS-minimal + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools.mCSB_scrollTools_horizontal, .mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal { bottom: 0; margin: 0 12px; } /* RTL direction/left-side scrollbar */ .mCS-dir-rtl > .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical, .mCS-dir-rtl > .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical { left: 0; right: auto; } .mCS-minimal.mCSB_scrollTools .mCSB_draggerRail, .mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail { background-color: transparent; } .mCS-minimal.mCSB_scrollTools_vertical .mCSB_dragger, .mCS-minimal-dark.mCSB_scrollTools_vertical .mCSB_dragger { height: 50px; } .mCS-minimal.mCSB_scrollTools_horizontal .mCSB_dragger, .mCS-minimal-dark.mCSB_scrollTools_horizontal .mCSB_dragger { width: 50px; } .mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.2); filter: "alpha(opacity=20)"; -ms-filter: "alpha(opacity=20)"; } .mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.5); filter: "alpha(opacity=50)"; -ms-filter: "alpha(opacity=50)"; } /* theme: "minimal-dark" */ .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.2); filter: "alpha(opacity=20)"; -ms-filter: "alpha(opacity=20)"; } .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.5); filter: "alpha(opacity=50)"; -ms-filter: "alpha(opacity=50)"; } /* ---------------------------------------- */ /* theme "light-3", "dark-3" */ .mCS-light-3.mCSB_scrollTools .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail { width: 6px; background-color: #000; background-color: rgba(0, 0, 0, 0.2); } .mCS-light-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { width: 6px; } .mCS-light-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-light-3.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_draggerRail { width: 100%; height: 6px; margin: 5px 0; } .mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { width: 12px; } .mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail, .mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail { height: 12px; margin: 2px 0; } .mCS-light-3.mCSB_scrollTools .mCSB_buttonUp { background-position: -32px -72px; } .mCS-light-3.mCSB_scrollTools .mCSB_buttonDown { background-position: -32px -92px; } .mCS-light-3.mCSB_scrollTools .mCSB_buttonLeft { background-position: -40px -112px; } .mCS-light-3.mCSB_scrollTools .mCSB_buttonRight { background-position: -40px -128px; } /* theme "dark-3" */ .mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.75); } .mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.85); } .mCS-dark-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-dark-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.9); } .mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail { background-color: #000; background-color: rgba(0, 0, 0, 0.1); } .mCS-dark-3.mCSB_scrollTools .mCSB_buttonUp { background-position: -112px -72px; } .mCS-dark-3.mCSB_scrollTools .mCSB_buttonDown { background-position: -112px -92px; } .mCS-dark-3.mCSB_scrollTools .mCSB_buttonLeft { background-position: -120px -112px; } .mCS-dark-3.mCSB_scrollTools .mCSB_buttonRight { background-position: -120px -128px; } /* ---------------------------------------- */ /* theme "inset", "inset-dark", "inset-2", "inset-2-dark", "inset-3", "inset-3-dark" */ .mCS-inset.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail { width: 12px; background-color: #000; background-color: rgba(0, 0, 0, 0.2); } .mCS-inset.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { width: 6px; margin: 3px 5px; position: absolute; height: auto; top: 0; bottom: 0; left: 0; right: 0; } .mCS-inset.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar { height: 6px; margin: 5px 3px; position: absolute; width: auto; top: 0; bottom: 0; left: 0; right: 0; } .mCS-inset.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_draggerRail, .mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail { width: 100%; height: 12px; margin: 2px 0; } .mCS-inset.mCSB_scrollTools .mCSB_buttonUp, .mCS-inset-2.mCSB_scrollTools .mCSB_buttonUp, .mCS-inset-3.mCSB_scrollTools .mCSB_buttonUp { background-position: -32px -72px; } .mCS-inset.mCSB_scrollTools .mCSB_buttonDown, .mCS-inset-2.mCSB_scrollTools .mCSB_buttonDown, .mCS-inset-3.mCSB_scrollTools .mCSB_buttonDown { background-position: -32px -92px; } .mCS-inset.mCSB_scrollTools .mCSB_buttonLeft, .mCS-inset-2.mCSB_scrollTools .mCSB_buttonLeft, .mCS-inset-3.mCSB_scrollTools .mCSB_buttonLeft { background-position: -40px -112px; } .mCS-inset.mCSB_scrollTools .mCSB_buttonRight, .mCS-inset-2.mCSB_scrollTools .mCSB_buttonRight, .mCS-inset-3.mCSB_scrollTools .mCSB_buttonRight { background-position: -40px -128px; } /* theme "inset-dark", "inset-2-dark", "inset-3-dark" */ .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.75); } .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.85); } .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-inset-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.9); } .mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail { background-color: #000; background-color: rgba(0, 0, 0, 0.1); } .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonUp, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonUp, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonUp { background-position: -112px -72px; } .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonDown, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonDown, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonDown { background-position: -112px -92px; } .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonLeft, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonLeft, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonLeft { background-position: -120px -112px; } .mCS-inset-dark.mCSB_scrollTools .mCSB_buttonRight, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonRight, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonRight { background-position: -120px -128px; } /* theme "inset-2", "inset-2-dark" */ .mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail, .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail { background-color: transparent; border-width: 1px; border-style: solid; border-color: #fff; border-color: rgba(255, 255, 255, 0.2); -webkit-box-sizing: border-box; box-sizing: border-box; } .mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail { border-color: #000; border-color: rgba(0, 0, 0, 0.2); } /* theme "inset-3", "inset-3-dark" */ .mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail { background-color: #fff; background-color: rgba(255, 255, 255, 0.6); } .mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail { background-color: #000; background-color: rgba(0, 0, 0, 0.6); } .mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.75); } .mCS-inset-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.85); } .mCS-inset-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-inset-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #000; background-color: rgba(0, 0, 0, 0.9); } .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.75); } .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.85); } .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #fff; background-color: rgba(255, 255, 255, 0.9); } /* ---------------------------------------- */ /*! * jReject (jQuery Browser Rejection Plugin) * Version 1.1.x * URL: http://jreject.turnwheel.com/ * Description: jReject is a easy method of rejecting specific browsers on your site * Author: Steven Bower (TurnWheel Designs) http://turnwheel.com/ * Copyright: Copyright (c) 2009-2014 Steven Bower under dual MIT/GPL license. */ #jr_overlay { top: 0; left: 0; padding: 0; margin: 0; z-index: 2147483646; position: absolute; } #jr_wrap { position: absolute; width: 100%; z-index: 2147483647; padding: 0; margin: 0; } #jr_inner { font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif; font-size: 12px; background: #FFF; border: 1px solid #CCC; color: #4F4F4F; margin: 0 auto; height: auto; padding: 20px; position: relative; -webkit-box-sizing: content-box; box-sizing: content-box; } #jr_header { display: block; color: #333; padding: 5px; padding-bottom: 0; margin: 0; font-family: Helvetica, Arial, sans-serif; font-weight: bold; font-size: 20px; line-height: 24px; margin-bottom: 0.5em; } #jr_inner p { padding: 5px; line-height: 20px; font-size: 14px; margin: 0; } #jr_inner ul { list-style-image: none; list-style-position: outside; list-style-type: none; margin: 0; padding: 15px 0; } #jr_inner ul:after { content: ''; display: block; clear: both; } #jr_inner ul li { cursor: pointer; float: left; width: 120px; height: 122px; margin: 0 10px 10px 10px; padding: 0; text-align: center; } #jr_inner li a { color: #333; font-size: 0.8em; text-decoration: none; padding: 0; margin: 0; } #jr_inner li a:hover { text-decoration: underline; } #jr_inner .jr_icon { width: 100px; height: 100px; margin: 1px auto; padding: 0; background: transparent no-repeat center; background-size: 80px 80px; cursor: pointer; } #jr_close { clear: both; padding: 0; margin: 0; } #jr_close a { color: #000; display: block; width: auto; margin: 0; padding: 0; text-decoration: underline; } #jr_close p { padding: 10px 0 0 0; margin: 0; } *, *:before, *:after { -webkit-box-sizing: border-box; box-sizing: border-box; outline: 0; } body { height: 100%; min-width: 768px; } html { height: 100%; } .container { padding: 0 22px; max-width: 1440px; margin: 0 auto; } .container::after { content: ""; display: table; clear: both; } .wrapper { min-height: 100%; overflow: hidden; padding-bottom: 0px !important; } .wrapper--blue { background-color: #031634; } .slider-arrow { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); width: 15px; height: 30px; z-index: 10; cursor: pointer; } .slider-arrow:hover svg { fill: #ffffff; } .slider-arrow svg { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; width: 100%; height: 100%; display: block; fill: rgba(255, 255, 255, 0.6); } .slider-arrow--next { right: 10px; } .slider-arrow--prev { left: 10px; } .tabs__content { display: none; } .tabs__content.active { display: block; } button, .btn { text-align: center; vertical-align: top; font-weight: 400; font-size: 14px; line-height: 1.2; letter-spacing: 0.7px; padding: 12px 10px 12px; text-transform: uppercase; background: #ffcc01; color: #4a4a4a; border: 0; border-radius: 3px; position: relative; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; cursor: pointer; outline: none; width: 100%; display: block; } button:hover, .btn:hover, button.active, .btn.active { color: #fff; background: #006699; } button:hover, .btn:hover { color: #0299e2; } button.disabled, .btn.disabled, button[disabled="disabled"], .btn[disabled="disabled"], button[disabled], .btn[disabled] { background: #ccc; color: #aaa; cursor: not-allowed; } button--sm, .btn--sm { padding: 7px 10px; font-size: 12px; } button--white, .btn--white { background-color: transparent; border: 1px solid #fff; color: #fff; } button--white:hover, .btn--white:hover { border-color: #006699; } input[type="checkbox"] { position: absolute; left: -9999px; } input[type="checkbox"] + label { display: inline-block; vertical-align: top; padding: 0 0 0 30px; position: relative; cursor: pointer; font-size: 15px; line-height: 24px; width: auto !important; } input[type="checkbox"] + label:before, input[type="checkbox"] + label:after { position: absolute; content: ''; } input[type="checkbox"]:checked + label:after { opacity: 1; } .checkbox { display: block; width: 100%; } .checkbox input[type="checkbox"] { display: none; } .checkbox input[type="checkbox"]:checked + span:after { opacity: 1; } .checkbox span { display: block; width: 100%; font-size: 14px; line-height: 20px; color: #ffc400; padding: 0 0 0 30px; position: relative; cursor: pointer; } .checkbox span:before { content: ''; display: block; width: 20px; height: 20px; border: 1px solid #ffc400; position: absolute; top: 0; left: 0; } .checkbox span:after { content: ''; display: block; width: 6px; height: 10px; border-bottom: 2px solid #ffc400; border-right: 2px solid #ffc400; position: absolute; top: 9px; left: 10px; margin: -5px 0 0 -3px; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); opacity: 0; } .icon-search { width: 30px; height: 31px; stroke: #5F88A4; } .icon-card { width: 30px; height: 31px; } .icon-user { width: 30px; height: 31px; stroke: #5F88A4; } .icon-wifi { width: 33px; height: 31px; } .icon-ring { height: 31px; width: 38px; } .icon-fun { width: 35px; height: 31px; } .icon-location { width: 25px; height: 31px; } .icon-service { width: 30px; height: 31px; } .icon-arrow-dark-r { width: 19px; height: 25px; } .icon-photo { width: 43px; height: 40px; } .icon-article { width: 43px; height: 40px; } .icon-economy { width: 100px; height: 100px; } .icon-comfort { width: 100px; height: 100px; } .icon-security { width: 100px; height: 100px; } .icon-late { width: 100px; height: 100px; } .icon-newspaper2 { width: 32px; height: 32px; } .icon-play { width: 33px; height: 33px; } textarea, select, input, .input { background-color: #fff; border-top: 1px solid #979797; border-bottom: 1px solid #979797; border-left: none; border-right: none; color: #6c6c6c; font-size: 16px; line-height: 1.44; padding: 0 9px; height: 67px; width: 100%; display: block; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; -webkit-appearance: none; } textarea--no-border, select--no-border, input--no-border, .input--no-border { height: 65px; border: 0; } textarea:focus, select:focus, input:focus, .input:focus { outline: none; } textarea:invalid, select:invalid, input:invalid, .input:invalid, textarea.error, select.error, input.error, .input.error { color: #fe3824; } textarea.disabled, select.disabled, input.disabled, .input.disabled, textarea[disabled="disabled"], select[disabled="disabled"], input[disabled="disabled"], .input[disabled="disabled"], textarea[disabled], select[disabled], input[disabled], .input[disabled] { background-color: #f3f3f3; } textarea { height: 200px; padding-top: 20px; padding-bottom: 20px; resize: none; } input[type="file"] { display: none; } input[type="file"] + label { display: block; background: #fff; font-size: 14px; line-height: 24px; padding: 25px 15px; color: #969696; text-align: center; border: 1px dashed #c4c4c4; -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out; } input[type="file"] + label:hover { border-color: #979797; background: #e9e9e9; } .error, .parsley-error { color: #fe3824; } .error::-webkit-input-placeholder, .parsley-error::-webkit-input-placeholder { color: #fe3824; } .error:-ms-input-placeholder, .parsley-error:-ms-input-placeholder { color: #fe3824; } .error:focus::-webkit-input-placeholder, .parsley-error:focus::-webkit-input-placeholder { color: transparent; } .error:focus:-ms-input-placeholder, .parsley-error:focus:-ms-input-placeholder { color: transparent; } .error:focus::placeholder, .parsley-error:focus::placeholder { color: transparent; } input[type="radio"] { position: absolute; left: -9999px; } input[type="radio"] + label { display: inline-block; vertical-align: top; padding: 0 0 0 30px; position: relative; cursor: pointer; font-size: 15px; line-height: 24px; width: auto !important; } input[type="radio"] + label:before, input[type="radio"] + label:after { position: absolute; content: ''; } input[type="radio"]:checked + label:after { opacity: 1; } select { display: block; -webkit-transition: none; transition: none; background-position: right 25px center; background-repeat: no-repeat; background-size: 29px 17px; background-color: #fff; } .jq-selectbox .mCSB_container { margin-right: 0; } .jq-selectbox .mCSB_scrollTools { width: 8px; right: -2px; } .jq-selectbox .mCustomScrollBox { margin-right: 0; } .jq-selectbox .mCSB_dragger_bar { background-color: rgba(0, 0, 0, 0.6) !important; } .custom-select { width: 100%; display: block; } .custom-select:hover .jq-selectbox__trigger, .custom-select.focused .jq-selectbox__trigger { -webkit-filter: brightness(0); filter: brightness(0); } .custom-select select.parsley-error + .jq-selectbox__select .jq-selectbox__select-text { color: #fe3824; } .custom-select .jq-selectbox__trigger { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; border: 0; width: 45px; } .custom-select .jq-selectbox__trigger::before { content: ''; position: absolute; right: 9px; width: 16px; height: 10px; background: rgba(0, 0, 0, 0) url(/pic/icons/chevrone-gray.svg) 0 0 no-repeat; background-size: cover; } .custom-select .jq-selectbox__trigger::before { top: 30px; } .custom-select .jq-selectbox__trigger-arrow { display: none; } .custom-select .jq-selectbox__select { height: 67px; border: 0 !important; -webkit-box-shadow: none !important; box-shadow: none !important; border-radius: 0 !important; border-top: 1px solid #979797 !important; border-bottom: 1px solid #979797 !important; background-image: none; background-color: transparent; padding: 0 45px 0 9px; } .custom-select .jq-selectbox__select-text { color: #6c6c6c; font-size: 16px; line-height: 65px; height: 100%; vertical-align: middle; width: 100% !important; text-shadow: none; } .custom-select .jq-selectbox__dropdown ul { max-height: 200px; } .custom-select .mCustomScrollBox { margin-right: 5px; } .custom-select--no-border .jq-selectbox__select { height: 65px; border: 0; } .spinner { font-size: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 50px; } .spinner__minus { display: inline-block; vertical-align: middle; fill: #6c6c6c; width: 12px; height: 25px; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .spinner__minus:hover { fill: #0299e2; } .spinner__minus svg { width: 100%; height: 100%; display: block; } .spinner__plus { display: inline-block; vertical-align: middle; fill: #6c6c6c; width: 12px; height: 25px; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .spinner__plus:hover { fill: #0299e2; } .spinner__plus svg { width: 100%; height: 100%; display: block; } .spinner__text { color: #6c6c6c; padding: 0; border: 0; outline: none; border-radius: 0; height: auto; display: inline-block; vertical-align: middle; width: 20px; text-align: center; font-size: 18px; background-color: transparent; } .authorization-done { padding: 88px 0 159px; } .authorization-done__title { font-family: 'PT Sans Caption'; display: block; text-align: center; padding-bottom: 11px; } @media (max-width: 990px) { .authorization-done__title { font-size: 24px; } } .authorization-done__txt { color: #6c6c6c; display: block; text-align: center; padding-bottom: 42px; } .authorization-done__txt span { display: block; } @media (max-width: 990px) { .authorization-done__txt { padding-bottom: 20px; } } .authorization-done__yandex { max-width: 450px; margin: 0 auto; } .authorization-done__yandex-img { display: inline-block; vertical-align: middle; } .authorization-done__yandex-text { line-height: 1.38; letter-spacing: 0.7px; color: #006699; font-size: 16px; text-transform: uppercase; vertical-align: middle; display: inline-block; max-width: 320px; padding-left: 24px; } .authorization-done__yandex-link { color: #cb1711; text-transform: uppercase; border-bottom: 1px solid transparent; } .authorization-done__yandex-link:hover { border-bottom: 1px solid #cb1711; } @media (max-width: 990px) { .authorization-done { padding: 30px 0 70px; } } .auth { padding-bottom: 50px; } .auth::after { content: ""; display: table; clear: both; } .auth__col { width: 50%; float: right; } @media (max-width: 991px) { .auth__col { float: none; width: 100%; } } .auth__col:first-child { padding: 6px 132px 0 50px; } @media (max-width: 1249px) { .auth__col:first-child { padding: 6px 0 0 20px; } } @media (max-width: 991px) { .auth__col:first-child { padding: 0 0 40px 0; } } .auth__col:last-child { padding-right: 50px; } @media (max-width: 1249px) { .auth__col:last-child { padding-right: 0; } } .auth__txt { font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.44; letter-spacing: normal; text-align: left; color: #6c6c6c; padding-bottom: 10px; padding-right: 100px; } @media (max-width: 1099px) { .auth__txt { padding-right: 50px; } } @media (max-width: 991px) { .auth__txt { padding-right: 0; } } .auth__warn { margin-top: 16px; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.25; letter-spacing: normal; text-align: left; color: #989898; padding-right: 50px; } @media (max-width: 1099px) { .auth__warn { padding-right: 20px; } } @media (max-width: 991px) { .auth__warn { padding-right: 0; } } .auth__tabs-caption { text-align: center; } .auth__tabs-caption li { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; display: inline-block; border-radius: 3px; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: 0.6px; text-align: left; color: #989898; padding: 8px 13px 8px; text-transform: uppercase; cursor: pointer; } .auth__tabs-caption li span { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; border-bottom: 1px solid #989898; } .auth__tabs-caption li:hover span { border-bottom-color: #000; } .auth__tabs-caption li.active { background-color: #003356; color: #fff; } .auth__tabs-caption li.active span { border-bottom-color: transparent; } .auth__tabs-content { margin-top: 21px; text-align: left; } .auth__info { position: relative; padding: 0 25px 13px 10px; } .auth__info-txt { font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.25; letter-spacing: normal; text-align: left; color: #989898; min-height: 69px; } .auth__toast { width: 100%; height: 69px; position: absolute; top: 0; left: 0; padding: 0 40px 0 18px; display: none; } .auth__toast--accept { background-color: #88c425; } .auth__toast--deny { background-color: #fe3824; } .auth__toast-close { width: 18px; height: 18px; position: absolute; right: 13px; top: 50%; margin-top: -9px; cursor: pointer; } .auth__toast-close:hover svg { stroke: #000; } .auth__toast-close svg { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; display: block; width: 100%; height: 100%; stroke: #fff; } .auth__toast-holder { display: table; width: 100%; height: 100%; } .auth__toast-content { display: table-cell; vertical-align: middle; font-size: 18px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: left; color: #ffffff; } .auth__form { border-top: 1px solid #979797; border-bottom: 1px solid #979797; } .auth__form::after { content: ""; display: table; clear: both; } .auth__form-col { float: left; position: relative; } .auth__form-col input { border: 0 !important; } .auth__form-col:first-child { width: calc(100% - 206px); } .auth__form-col:first-child::before { content: ''; width: 1px; height: 33px; background-color: #979797; position: absolute; top: 16px; right: 1px; z-index: 1; } .auth__form-col:last-child { width: 206px; padding: 13px 6px 0 20px; } .auth__form-txt { margin-top: 44px; margin-bottom: 21px; padding: 0 25px 0 10px; font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.25; letter-spacing: normal; text-align: left; color: #989898; } .auth__num-submit { width: 180px; margin: 35px auto 0; } .auth__ticket { margin-top: 5px; padding-left: 18px; cursor: pointer; position: relative; display: inline-block; } .auth__ticket:hover .auth__ticket-txt { text-decoration: none; } .auth__ticket:hover .auth__tooltip-holder { height: 495px; } .auth__ticket-txt { display: inline-block; vertical-align: middle; text-decoration: underline; font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: left; color: #217cff; padding-left: 4px; padding-right: 8px; } .auth__ticket-icon { display: inline-block; vertical-align: middle; font-size: 13.5px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 16px; text-align: center; letter-spacing: normal; color: #217cff; width: 18px; height: 18px; border: solid 1px #217cff; border-radius: 50%; } .auth__tooltip { display: block; width: 380px; -o-object-fit: contain; object-fit: contain; border-radius: 2px; background-color: #e6e6e6; padding: 9px 50px 40px; position: relative; } .auth__tooltip-holder { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; padding-left: 12px; width: 392px; overflow: hidden; height: 0; position: absolute; z-index: 1; left: 100%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } @media (max-width: 1359px) { .auth__tooltip-holder { left: auto; right: 100%; padding-left: 0; padding-right: 12px; } } @media (max-width: 991px) { .auth__tooltip-holder { left: 100%; right: auto; padding-right: 0; padding-left: 12px; } } .auth__tooltip::before { content: ''; position: absolute; left: -33px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); border: 20px solid transparent; border-right: 20px solid #e6e6e6; } .auth__tooltip::after { content: ''; position: absolute; right: -33px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); border: 20px solid transparent; border-left: 20px solid #e6e6e6; } .auth__tooltip-txt { font-size: 18px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: left; color: #6c6c6c; padding-bottom: 14px; padding-top: 20px; } .auth__tooltip-img { width: 278.4px; height: 133.1px; display: block; } .banner { background-size: cover; background-repeat: no-repeat; background-position: top center; height: 200px; width: 100%; border-radius: 3px; position: relative; margin-bottom: 35px; } .banner--music { margin-bottom: 25px; } .banner--shop { margin-top: 11px; } .banner__title { font-size: 36px; color: #fff; font-family: 'PT Sans Caption'; line-height: 1.11; letter-spacing: 1.6px; text-transform: uppercase; position: absolute; left: 40px; bottom: 23px; } .banner__title--shop { bottom: 28px; } .basket-msg { text-align: center; padding: 58px 0 28px; } .basket-msg__title { display: block; text-align: center; padding-bottom: 23px; font-family: 'PT Sans Caption'; } .basket-msg__text { display: block; max-width: 550px; margin: 0 auto; line-height: 1.38; letter-spacing: 0.7px; text-transform: uppercase; color: #006699; } @media (max-width: 990px) { .basket-msg { padding: 20px 0 28px; } } .basket { padding: 0 0 80px; } .basket::after { content: ""; display: table; clear: both; } .basket__col { float: right; width: 50%; } .basket__col:first-child { padding: 0 72px 0 52px; } @media (max-width: 1299px) { .basket__col:first-child { width: 40%; padding: 0 0 0 52px; } } @media (max-width: 1099px) { .basket__col:first-child { width: 100%; float: none; padding: 0 0 30px 0; } } @media (max-width: 1299px) { .basket__col:last-child { width: 60%; } } @media (max-width: 1099px) { .basket__col:last-child { width: 100%; float: none; } } .basket__cost { color: #003356; font-size: 24px; text-transform: uppercase; font-weight: 500; margin-top: 20px; } .basket__goods { display: table; width: 100%; word-spacing: -0.36em; } .basket__goods-holder { margin: 0 -3px; } .basket__goods-item { padding: 0 3px 6px; display: inline-block; word-spacing: normal; vertical-align: top; width: 33.333333%; } @media (max-width: 1099px) { .basket__goods-item { width: 25%; } } @media (max-width: 849px) { .basket__goods-item { width: 33.333333%; } } .basket__item { width: 100%; height: 300px; border-radius: 3px; overflow: hidden; position: relative; } .basket__item--lg::before { content: ''; position: absolute; z-index: 1; top: 0; left: 0; width: 100%; height: 100%; background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.8))); background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.8)); } .basket__item--lg .spinner__plus, .basket__item--lg .spinner__minus { fill: #fff; } .basket__item--lg .spinner__plus:hover, .basket__item--lg .spinner__minus:hover { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; fill: #0299e2; } .basket__item--lg .spinner__text { color: #fff; } .basket__item--lg .basket__item-img { width: 100%; height: 100%; } .basket__item--lg .basket__item-img img { width: 100%; height: 100%; } .basket__item--lg .basket__ctrl-price { color: #fff; } .basket__item--lg .basket__item-title { color: #fff; } .basket__item--lg .basket__ctrl-close::before, .basket__item--lg .basket__ctrl-close::after { background-color: #fff; } .basket__item--lg .basket__ctrl-close:hover::before, .basket__item--lg .basket__ctrl-close:hover::after { background: #0299e2; } .basket__item--sm { border: solid 1px #e6e6e6; } .basket__item--sm .basket__item-img { width: 100%; height: 210px; padding: 10px; text-align: center; } .basket__item--sm .basket__item-img img { display: inline-block; height: 100%; width: auto; } .basket__item--sm .basket__ctrl-price { color: #217cff; } .basket__item--sm .basket__item-title { color: #4a4a4a; } .basket__item--sm .basket__ctrl-close::before, .basket__item--sm .basket__ctrl-close::after { background-color: #4a4a4a; } .basket__item--sm .basket__ctrl-close:hover::before, .basket__item--sm .basket__ctrl-close:hover::after { background-color: #0299e2; } .basket__item-img { position: absolute; top: 0; left: 0; z-index: 0; } .basket__item-img img { display: block; -o-object-fit: cover; object-fit: cover; } .basket__item-body { position: absolute; width: 100%; bottom: 0; left: 0; z-index: 2; padding: 12px 15px; } .basket__item-title { padding: 5px 0; text-transform: uppercase; font-size: 19px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.16; letter-spacing: 0.8px; text-align: left; } .basket__ctrl { height: 25px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .basket__ctrl-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .basket__ctrl-item:nth-child(1) { width: calc(100% - 75px - 25px); } .basket__ctrl-item:nth-child(2) { width: 75px; padding-right: 10px; } .basket__ctrl-item:nth-child(3) { width: 25px; } .basket__ctrl-price { font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.27; letter-spacing: normal; text-align: left; } .basket__ctrl-close { height: 25px; width: 25px; cursor: pointer; position: relative; } .basket__ctrl-close::before, .basket__ctrl-close::after { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; content: ''; width: 35px; height: 1px; position: absolute; top: 12px; left: -5px; } .basket__ctrl-close::after { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .basket__ctrl-close::before { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .basket__title { text-transform: uppercase; font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.38; letter-spacing: 0.7px; text-align: left; color: #003356; padding: 13px 0 18px; } .basket__form { padding-bottom: 18px; } .basket__form-row::after { content: ""; display: table; clear: both; } .basket__form-cell { width: 50%; float: left; } .basket__form-cell:first-child { padding-right: 8px; } .basket__form-cell:last-child { padding-left: 8px; } .basket__form-submit { margin-top: 20px; width: 180px; } .basket__txt { font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.44; letter-spacing: normal; text-align: left; color: #6c6c6c; } .basket__txt-title { padding: 30px 0 9px; text-transform: uppercase; font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.38; letter-spacing: 0.7px; text-align: left; color: #003356; } .basket__toast { position: relative; width: 100%; padding: 0 40px 0 18px; margin-bottom: 15px; } .basket__toast--gray { background-color: #989898; } .basket__toast--blue { background-color: #5f88a4; } .basket__toast-close { width: 18px; height: 18px; position: absolute; right: 13px; top: 50%; margin-top: -9px; cursor: pointer; } .basket__toast-close:hover svg { stroke: #000; } .basket__toast-close svg { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; display: block; width: 100%; height: 100%; stroke: #fff; } .basket__toast-holder { height: 69px; display: table; } .basket__toast-content { padding: 5px 0; display: table-cell; vertical-align: middle; font-size: 18px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: left; color: #ffffff; } .books { padding: 10px 0 84px; } .books__banner { border-radius: 3px; } .books__head { padding: 29px 0 20px; } .books__head--audio { padding: 29px 0; } .books__title { font-family: 'PT Sans Caption'; font-size: 36px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: 1.6px; text-transform: uppercase; display: inline-block; color: #006699; } .books__search { max-width: 605px; width: 100%; padding: 0 20px; float: right; } @media (max-width: 990px) { .books__search { max-width: 400px; } } .books__search .search__input { padding: 0 22px 0 2px; } .books__search .search__icon { right: -2px; bottom: 6px; } .books__search--audio { margin-top: -5px; } .breadcrumbs { text-align: center; padding-bottom: 90px; } .breadcrumbs__list { margin: 0 -10px; word-spacing: -0.36em; } .breadcrumbs__item { word-spacing: normal; display: inline-block; font-weight: 300; padding: 0 13px; position: relative; } .breadcrumbs__item:before { content: ''; position: absolute; width: 1px; background-color: #989898; height: 15px; top: 6px; left: 1px; } .breadcrumbs__item:first-child:before { display: none; } .breadcrumbs__link { border-bottom: 1px solid #0299e2; font-size: 15px; line-height: 1.2; } .breadcrumbs__link:hover { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; color: #cb1711; border-bottom: none; } @media (max-width: 990px) { .breadcrumbs { padding-bottom: 50px; } } .cards-articles__wrap { font-size: 0; line-height: 0; margin: 0 -3px; padding: 10px 0 54px; } .cards-articles__wrap--station { padding-bottom: 0; margin-bottom: -2px; } @media (max-width: 990px) { .cards-articles__wrap { padding: 10px 0 30px; } } .cards-articles__item { display: inline-block; vertical-align: top; line-height: normal; font-size: 16px; padding: 0 3px; width: 33.33%; margin-bottom: 28px; } .cards-articles__item:hover .cards-articles__title { color: #cb1711; } .cards-articles__img { margin-bottom: 8px; } .cards-articles__title { display: block; text-transform: uppercase; letter-spacing: 0.7px; color: #00517a; line-height: 1.38; } .cards-book__wrap { font-size: 0; line-height: 0; margin: 0 -3px -4px; } .cards-book__item { display: inline-block; vertical-align: top; line-height: normal; font-size: 16px; padding: 0 3px; width: 16.66%; margin-bottom: 41px; } @media (max-width: 1299px) { .cards-book__item { width: 20%; } } @media (max-width: 990px) { .cards-book__item { width: 25%; } } .cards-book__item:hover .cards-book__title { color: #cb1711; } .cards-book__img { margin-bottom: 8px; display: block; background-repeat: no-repeat; background-size: cover; background-position: center; max-width: 100%; } .cards-book__title { display: block; text-transform: uppercase; letter-spacing: 0.7px; color: #003356; line-height: 1.38; margin-bottom: 1px; padding-left: 5px; } .cards-book__author { display: block; font-size: 14px; line-height: normal; color: #989898; padding-left: 5px; } .cards-film-top__wrap { font-size: 0; line-height: 0; margin: 0 -3px; } .cards-film-top__item { display: inline-block; vertical-align: top; line-height: normal; font-size: 16px; padding: 0 3px; width: 33.33%; margin-bottom: 30px; position: relative; cursor: pointer; } @media (max-width: 990px) { .cards-film-top__item { margin-bottom: 20px; } } .cards-film-top__img { margin-bottom: 11px; position: relative; } .cards-film-top__img img { display: block; } .cards-film-top__img .one-film__head-info { color: #fff; } .cards-film-top__img .one-film__head-reit { margin-top: 20px; } .cards-film-top__img .one-film__head-reit--sm { color: #fff; } .cards-film-top__img:hover { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .cards-film-top__img:hover > .cards-film-top__description { opacity: 1; top: 99%; visibility: visible; } .cards-film-top__img:hover > .cards-film-top__description--toped { top: auto; bottom: 99%; } .cards-film-top__title { display: block; text-transform: uppercase; letter-spacing: 0.7px; color: #00517a; padding-left: 1px; line-height: 1.38; } .cards-film-top__description { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; line-height: normal; font-size: 16px; background-color: #0c81bb; color: #fff; padding: 22px 20px 35px; position: absolute; top: 0; left: 0; z-index: 10; opacity: 0; visibility: hidden; cursor: auto; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .cards-film-top__description--toped { top: auto; bottom: 0; } .cards-film-top__description .one-film__head-info { color: #fff; } .cards-film-top__description-caption { font-size: 18px; text-transform: uppercase; line-height: 1.22; letter-spacing: 0.8px; display: block; margin-bottom: 18px; } .cards-film-top__description p { font-size: 15px; line-height: 1.27; margin-bottom: 13px; } .cards-film-top__description-link { display: block; margin-bottom: 15px; font-size: 15px; line-height: normal; color: #fff; } .cards-film-top__description-link:hover { text-decoration: underline; } .cards-film-top__description-btn { font-size: 12px; letter-spacing: 0.6px; line-height: 1.2; padding: 7px 11px 8px; max-width: 183px; margin-top: 15px; } .cards-game__wrap { font-size: 0; line-height: 0; margin: 0 -3px; padding-bottom: 13px; } .cards-game__item { display: inline-block; vertical-align: top; line-height: normal; font-size: 16px; padding: 0 3px; width: 16.66%; margin-bottom: 40px; } @media (max-width: 1299px) { .cards-game__item { width: 20%; } } @media (max-width: 990px) { .cards-game__item { width: 25%; margin-bottom: 25px; } } .cards-game__item:hover .cards-game__name { color: #cb1711; } .cards-game__img { margin-bottom: 12px; background-repeat: no-repeat; background-size: cover; background-position: center; display: block; max-width: 100%; height: 228px; border-radius: 3px; } @media (max-width: 990px) { .cards-game__img { height: 176px; } } .cards-game__name { display: block; text-transform: uppercase; letter-spacing: 0.7px; color: #00517a; padding-left: 5px; } .cards-magazine__wrap { font-size: 0; line-height: 0; margin: 0 -3px; padding-bottom: 47px; } @media (max-width: 990px) { .cards-magazine__wrap { padding-bottom: 20px; } } .cards-magazine__item { display: inline-block; vertical-align: top; line-height: normal; font-size: 16px; padding: 0 3px; width: 16.66%; margin-bottom: 38px; } .cards-magazine__item:hover .cards-magazine__title { color: #cb1711; } @media (max-width: 990px) { .cards-magazine__item { margin-bottom: 20px; width: 25%; } } .cards-magazine__img { margin-bottom: 11px; background-repeat: no-repeat; background-size: cover; background-position: center; display: block; max-width: 100%; height: 300px; position: relative; } @media (max-width: 990px) { .cards-magazine__img { height: 250px; } } .cards-magazine__icon { position: absolute; bottom: 0; left: 6px; } .cards-magazine__title { display: block; text-transform: uppercase; letter-spacing: 0.7px; color: #003356; line-height: 1.38; } .cards-music__wrap { font-size: 0; line-height: 0; margin: 0 -3px -2px; padding: 10px 0 0; } @media (max-width: 990px) { .cards-music__wrap { padding: 10px 0 30px; } } .cards-music__item { display: inline-block; vertical-align: top; line-height: normal; font-size: 16px; padding: 0 3px; width: 33.33%; margin-bottom: 51px; } .cards-music__item:hover .cards-music__title { color: #cb1711; } .cards-music__item:hover .cards-music__video { opacity: 1; visibility: visible; -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .cards-music__img { background-size: cover; background-repeat: no-repeat; background-position: top center; height: 255px; width: 100%; display: block; border-radius: 3px; position: relative; margin-bottom: 12px; } @media (max-width: 1199px) { .cards-music__img { height: 200px; } } .cards-music__inner { display: table; text-align: center; width: 100%; height: 100%; } .cards-music__inner-wrap { display: table-cell; vertical-align: middle; } .cards-music__video { margin: auto; display: block; opacity: 0; visibility: hidden; } .cards-music__video svg { width: 79px; height: 79px; } @media (max-width: 990px) { .cards-music__video svg { width: 60px; height: 60px; } } .cards-music__title { display: block; text-transform: uppercase; letter-spacing: 0.7px; color: #00517a; line-height: 1.38; } .cards-pages__wrap { font-size: 0; line-height: 0; margin: 0 -3px; padding: 10px 0 57px; } @media (max-width: 990px) { .cards-pages__wrap { padding: 10px 0 30px; } } .cards-pages__item { display: inline-block; vertical-align: top; line-height: normal; font-size: 16px; padding: 0 3px; width: 33.33%; margin-bottom: 25px; } .fancybox-button:focus, .fancybox-button:hover { background-color: transparent; color: #0299e2; } .fancybox-button[disabled] { background-color: transparent; color: #ccc; cursor: default; opacity: 0.6; } .cards-places__wrap { font-size: 0; line-height: 0; margin: 0 -3px; } .cards-places__item { display: inline-block; vertical-align: top; line-height: normal; font-size: 16px; padding: 0 3px; width: 33.33%; margin-bottom: 30px; position: relative; } .cards-places__img { margin-bottom: 7px; display: block; position: relative; } .cards-places__img img { display: block; } .cards-places__img:hover > .cards-places__description { opacity: 1; top: 99%; visibility: visible; } .cards-places__title { display: block; text-transform: uppercase; letter-spacing: 0.7px; color: #00517a; padding-left: 1px; line-height: 1.38; } .cards-places__description { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; line-height: normal; font-size: 16px; background-color: #0c81bb; color: #fff; padding: 32px 20px 30px; position: absolute; top: 0; left: 0; z-index: 10; opacity: 0; visibility: hidden; cursor: auto; } @media (max-width: 990px) { .cards-places__description { padding: 20px; } } .cards-places__description-caption { font-size: 18px; text-transform: uppercase; line-height: 1.22; letter-spacing: 0.8px; display: block; margin-bottom: 5px; } .cards-places__description-name { font-size: 14px; line-height: 1.29; letter-spacing: 0.7px; display: block; text-transform: uppercase; margin-bottom: 18px; } .cards-places__description p { font-size: 15px; line-height: 1.27; } @media (max-width: 990px) { .cards-places__description p { font-size: 14px; } } .cards-places__description-btn { font-size: 12px; letter-spacing: 0.6px; line-height: 1.2; padding: 7px 11px 8px; max-width: 183px; margin-top: 30px; } @media (max-width: 990px) { .cards-places__description-btn { margin-top: 15px; } } .cards-places__description-text { max-height: 95.25px; overflow: hidden; } .cards-pressa-top__wrap { font-size: 0; line-height: 0; margin: 0 -3px; } .cards-pressa-top__item { display: inline-block; vertical-align: top; line-height: normal; font-size: 16px; padding: 0 3px; width: 33.33%; margin-bottom: 30px; position: relative; cursor: pointer; } @media (max-width: 990px) { .cards-pressa-top__item { margin-bottom: 20px; } } .cards-pressa-top__img { margin-bottom: 11px; position: relative; } .cards-pressa-top__img img { display: block; } .cards-pressa-top__img:hover { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .cards-pressa-top__img:hover > .cards-pressa-top__description { opacity: 1; top: 99%; visibility: visible; } .cards-pressa-top__title { display: block; text-transform: uppercase; letter-spacing: 0.7px; color: #00517a; padding-left: 1px; line-height: 1.38; } .cards-pressa-top__description { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; line-height: normal; font-size: 16px; background-color: #0c81bb; color: #fff; padding: 32px 20px 30px; position: absolute; top: 0; left: 0; z-index: 10; opacity: 0; visibility: hidden; cursor: auto; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; } .cards-pressa-top__description-caption { font-size: 18px; text-transform: uppercase; line-height: 1.22; letter-spacing: 0.8px; display: block; margin-bottom: 14px; } .cards-pressa-top__description p { font-size: 15px; line-height: 1.27; margin-bottom: 13px; } .cards-pressa-top__description-link { display: block; margin-bottom: 15px; font-size: 15px; line-height: normal; color: #fff; } .cards-pressa-top__description-link:hover { text-decoration: underline; } .cards-pressa-top__description-btn { font-size: 12px; letter-spacing: 0.6px; line-height: 1.2; padding: 7px 11px 8px; max-width: 183px; margin-top: 31px; } .cards-pressa__wrap { font-size: 0; line-height: 0; margin: 0 -3px; padding-bottom: 24px; } .cards-pressa__item { display: inline-block; vertical-align: top; line-height: normal; font-size: 16px; padding: 0 3px; width: 16.66%; margin-bottom: 59px; } @media (max-width: 1299px) { .cards-pressa__item { width: 20%; margin-bottom: 35px; } } @media (max-width: 990px) { .cards-pressa__item { width: 25%; } } .cards-pressa__item:hover .cards-pressa__title { color: #cb1711; } .cards-pressa__img { margin-bottom: 8px; } .cards-pressa__title { display: block; text-transform: uppercase; letter-spacing: 0.7px; color: #00517a; line-height: 1.38; margin-bottom: 1px; } .cards-pressa__txt { display: block; font-size: 14px; line-height: normal; color: #989898; text-transform: lowercase; } .content-slider__image { padding: 19px 0 12px; } .content-slider__image img { text-align: center; margin: auto; } .content-slider__wrap { padding-top: 33px; } .content-slider__desc { font-size: 16px; font-weight: bold; font-style: normal; font-stretch: normal; line-height: 1.44; letter-spacing: normal; text-align: left; color: #4a4a4a; display: block; position: relative; padding-bottom: 18px; margin: 0 0 30px; text-align: center; } .content-slider__desc:before { content: ''; position: absolute; bottom: 0; width: 100%; height: 2px; background-color: #bfbfbf; } .content-slider__dots { display: block; text-align: center; color: #4a4a4a; font-size: 14px; line-height: normal; margin-top: 22px; margin-bottom: 12px; } .slider-arrow-content { position: absolute; bottom: 89px; width: 15px; height: 26px; z-index: 10; cursor: pointer; } .slider-arrow-content:hover svg { fill: #cb1711; } .slider-arrow-content svg { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; width: 100%; height: 100%; display: block; fill: #006699; } .slider-arrow-content--next { right: 0; } .slider-arrow-content--prev { left: 0; } .error-404v2 { position: relative; } .error-404v2__inner { display: table; width: 100%; margin: 0 auto -144px; } @media (max-width: 990px) { .error-404v2__inner { margin: 0 auto; } } .error-404v2__description { display: table-cell; vertical-align: top; text-align: center; padding: 83px 40px 0; } @media (max-width: 1199px) { .error-404v2__description { padding: 30px 0; } } @media (max-width: 1099px) { .error-404v2__description { padding: 0 0 30px; } } .error-404v2__num { font-size: 200px; font-weight: 800; font-family: 'Open Sans'; font-style: normal; font-stretch: normal; line-height: 1.2; text-align: center; color: #ffcc01; display: block; } @media (max-width: 1099px) { .error-404v2__num { font-size: 175px; } } .error-404v2__title { font-size: 28px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.29; letter-spacing: 1.2px; text-align: center; color: #006699; display: block; min-width: 370px; font-family: 'PT Sans Caption'; text-transform: uppercase; margin-bottom: 72px; } @media (max-width: 1099px) { .error-404v2__title { margin-bottom: 30px; font-size: 22px; } } .error-404v2__btn { max-width: 245px; display: inline-block; padding: 12px 10px 12px; background: #ffc400; } .error-404v2__image { display: table-cell; position: relative; top: -85px; z-index: 1; } @media (max-width: 990px) { .error-404v2__image { top: auto; } } .error-404 { padding: 22px 0 80px; } @media (max-width: 990px) { .error-404 { padding: 30px 0 70px; } } .error-404__holder { max-width: 1027px; margin: 0 auto; } .error-404__image { margin: 0 0 55px; text-align: center; } @media (max-width: 990px) { .error-404__image { margin: 0 auto 30px; } } .error-404__image img { max-width: 1005px; } @media (max-width: 990px) { .error-404__image img { max-width: 500px; } } .error-404__link { position: relative; padding-left: 23px; margin-top: 3px; display: inline-block; } .error-404__link svg { fill: #0299e2; width: 17px; height: 18px; position: absolute; top: 4px; left: 0; } .error-404__link:hover span { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; color: #cb1711; border-bottom-color: #cb1711; } .error-404__link:hover svg { fill: #cb1711; } .error-404__link span { border-bottom: 1px solid #0299e2; } .error-404__title { font-size: 28px; line-height: 1.29; letter-spacing: 1.2px; font-family: 'PT Sans Caption'; float: right; padding-right: 17px; } @media (max-width: 990px) { .error-404__title { font-size: 24px; } } .error-500v2 { position: relative; } .error-500v2__inner { display: table; width: 100%; margin: 0 auto -167px; } @media (max-width: 1199px) { .error-500v2__inner { margin: 0; } } .error-500v2__description { display: table-cell; vertical-align: top; padding: 130px 0 0; } @media (max-width: 1199px) { .error-500v2__description { padding: 70px 0; } } @media (max-width: 990px) { .error-500v2__description { padding: 30px 0 30px; } } .error-500v2__num { font-size: 200px; font-weight: 800; font-family: 'Open Sans'; font-style: normal; font-stretch: normal; line-height: 1.2; text-align: center; color: #ffcc01; display: block; } @media (max-width: 990px) { .error-500v2__num { font-size: 175px; } } .error-500v2__title { font-size: 28px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.29; letter-spacing: 1.2px; text-align: center; color: #006699; display: block; max-width: 600px; margin: auto; font-family: 'PT Sans Caption'; text-transform: uppercase; } @media (max-width: 990px) { .error-500v2__title { margin-bottom: 30px; font-size: 22px; } } .error-500v2__image { display: table-cell; position: relative; top: -85px; } @media (max-width: 1199px) { .error-500v2__image { top: auto; } } .error-500 { padding: 30px 0 57px; } @media (max-width: 990px) { .error-500 { padding: 30px 0 70px; } } .error-500__holder { text-align: center; } .error-500__image { max-width: 1055px; margin: 0 auto 58px; } .error-500__image img { max-width: 954px; } @media (max-width: 990px) { .error-500__image img { max-width: 500px; } } @media (max-width: 990px) { .error-500__image { margin: 0 auto 30px; } } .error-500__title { font-size: 28px; line-height: 1.29; letter-spacing: 1.2px; font-family: 'PT Sans Caption'; } @media (max-width: 990px) { .error-500__title { font-size: 24px; } } .football { height: 223px; border-right: 3px; overflow: hidden; background: rgba(255, 255, 255, 0) url(/pic/football/football-bg.jpg) 0 0 no-repeat; background-size: cover; padding: 0 0 0 33px; width: 100%; display: table; } .football__col { display: table-cell; vertical-align: middle; } .football__icon { width: 100px; } .football__icon img { width: 100px; height: 100px; display: block; } .football__title { width: 350px; padding: 0 0 0 30px; } @media (max-width: 990px) { .football__title { width: 300px; } } .football__title-txt { font-size: 36px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.03; letter-spacing: 0.08em; text-align: left; color: #ffffff; } @media (max-width: 990px) { .football__title-txt { font-size: 26px; } } .football__title-year { margin-top: 1px; font-size: 36px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: normal; text-align: left; color: #fecf01; } .football__title-link { margin-top: 20px; text-transform: uppercase; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: 0.7px; text-align: left; color: #ffffff; display: inline-block; } .football__title-link:hover span { border-bottom-color: #fff; } .football__title-link svg { display: inline-block; vertical-align: middle; width: 7px; height: 14px; fill: #fff; } .football__title-link span { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; display: inline-block; vertical-align: middle; margin-right: 10px; border-bottom: 1px solid transparent; } .football__team { padding-left: 40px; } @media (max-width: 1439px) { .football__team { text-align: center; } } @media (max-width: 990px) { .football__team { padding-left: 0; } } .football__team-holder { display: block; width: 100%; } @media (max-width: 1439px) { .football__team-holder { width: 640px; display: inline-block; } } @media (max-width: 1199px) { .football__team-holder { width: 320px; display: inline-block; } } .football__team-cell { display: block; vertical-align: bottom; padding: 0 25px; width: 293px; } @media (max-width: 1439px) { .football__team-cell { padding: 0 44px; } } .football__item { width: 233px; height: 38px; display: table; margin-bottom: 53px; } .football__item:last-child { margin-bottom: 0; } .football__item-cell { display: table-cell; vertical-align: middle; } .football__item-cell:first-child, .football__item-cell:last-child { width: 56.6px; } .football__item-cell:first-child img, .football__item-cell:last-child img, .football__item-cell:first-child svg, .football__item-cell:last-child svg { display: block; width: 56.6px; height: 38px; } .football__item-cell:nth-child(2) { text-align: center; color: #fff; } .football__item-score { font-size: 20px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: normal; color: #ffffff; } .football__item-type { margin-top: 1px; font-size: 18px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: 0.8px; color: #ffffff; } .footer { width: 100%; overflow: hidden; padding: 0 0 15px; margin-top: 0px !important; } .footer--error { background-color: transparent; position: relative; z-index: 2; } .footer--lifhak { background-color: #ecfcfc; } .footer--dark { background-color: #031634; } .footer--dark .footer__nav-link { color: #fff; } .footer--dark .footer__info-title, .footer--dark .footer__info-call, .footer--dark .footer__info-address { color: #fff; } .footer__nav { float: left; padding-left: 34px; width: 67%; } @media (max-width: 1219px) { .footer__nav { padding-left: 0; } } .footer__nav-list { word-spacing: -0.36em; } .footer__nav-item { word-spacing: normal; padding-bottom: 20px; vertical-align: top; display: inline-block; width: 33.33333%; line-height: 1; padding-right: 10px; } .footer__nav-link { font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.21; letter-spacing: normal; text-align: left; color: #003356; } .footer__nav-link:hover { text-decoration: underline; } .footer__info { float: left; width: 33%; } .footer__info-title { font-size: 18px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.22; letter-spacing: 0.8px; text-align: left; color: #003356; text-transform: uppercase; margin-bottom: 13px; } .footer__info-tel-link { font-size: 24px; font-weight: normal; font-style: normal; font-stretch: normal; letter-spacing: normal; text-align: left; color: #ffcc01; line-height: 1; } .footer__info-tel-link:hover { text-decoration: underline; } .footer__info-tel-link span { color: #ffcc01; } .footer__info-call { margin-top: 3px; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: left; color: #003356; } .footer__info-email { text-decoration: underline; margin-top: 25px; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: left; color: #cc9902; display: inline-block; margin-right: 5px; } .footer__info-address { margin-top: 21px; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.29; letter-spacing: normal; text-align: left; color: #003356; padding-right: 185px; } @media (max-width: 1199px) { .footer__info-address { padding-right: 0; } } .footer__info-logo { margin-top: 39px; } .footer__copy { display: block; margin-top: 11px; } .footer__copy-item { display: inline-block; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.29; letter-spacing: normal; text-align: left; color: #989898; margin-right: 50px; } @media (max-width: 1199px) { .footer__copy-item { margin-right: 20px; } } .footer__copy-item:last-child { margin-right: 0; } .footer__copy-link { text-decoration: underline; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.21; letter-spacing: normal; text-align: left; color: #989898; } .footer__copy-link:hover { text-decoration: none; } .footer__logo-rt { display: inline-block; width: 40px; height: 40px; } .footer__logo-rt:hover { opacity: .7; } .footer__logo-rt img, .footer__logo-rt svg { width: 100%; height: 100%; display: block; } .footer__logo-bonus { display: inline-block; margin-left: 10px; width: 170px; height: 40px; } .footer__logo-bonus img, .footer__logo-bonus svg { width: 100%; height: 100%; display: block; } .footer__logo-bonus:hover { opacity: .7; } .footer__bot { margin-top: 9px; } .footer__contact { float: left; width: 286px; padding-right: 20px; } @media (max-width: 1023px) { .footer__contact { float: none; } } .footer__addr { float: left; width: 270px; } @media (max-width: 1023px) { .footer__addr { float: none; margin-top: 15px; } } .footer__addr .footer__info-address { padding-right: 0; margin-top: 0; } .footer__addr .footer__info-email { margin-top: 22px; } .footer__right { float: right; } .footer__right-copy { margin-top: 11px; } .footer__right-copy-txt { margin-top: 15px; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.29; letter-spacing: normal; text-align: left; color: #989898; } .footer__left { float: left; } .game-banner { background-color: #8ec4d6; border-radius: 3px; min-height: 250px; position: relative; padding: 38px 65px 0 24px; margin-bottom: 6px; } @media (max-width: 1023px) { .game-banner { padding: 38px 24px 0 24px; } } .game-banner__logo { display: inline-block; vertical-align: middle; width: 325px; } .game-banner__logo img { display: block; margin: 0 0 6px 29px; height: 150px; } @media (max-width: 1023px) { .game-banner__logo { width: 290px; } } .game-banner__title { font-family: 'PT Sans Caption'; font-size: 26px; font-weight: bold; font-style: normal; font-stretch: normal; line-height: 2.19; letter-spacing: normal; text-transform: uppercase; color: #fff; } .game-banner__content { font-size: 0; line-height: 0; margin: 0 -4px; width: calc(100% - 325px); display: inline-block; vertical-align: top; } @media (max-width: 1023px) { .game-banner__content { width: calc(100% - 290px); } } .game-banner__img { margin-bottom: 11px; background-repeat: no-repeat; background-size: cover; background-position: center; display: block; width: 100%; height: 130px; border-radius: 3px; } .game-banner__name { font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.38; letter-spacing: 0.7px; text-transform: uppercase; color: #00517a; } .game-banner__slider { width: 100%; } .game-banner__slider .slick-slide { width: 170px; padding-right: 40px; } .game-banner__slider-item { width: 130px; display: block; } .game-banner__slider-item:hover .game-banner__name { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; color: #cb1711; } .game-banner__slider .slider-arrow { width: 35px; height: 40px; padding: 5px 10px; background-color: rgba(0, 0, 0, 0.6); border-radius: 3px; } .genres { border-top: 1px solid #0299e2; padding-top: 22px; margin-bottom: 65px; font-size: 0; line-height: 0; } @media (max-width: 1299px) { .genres { margin-bottom: 45px; } } @media (max-width: 990px) { .genres { margin-bottom: 35px; } } .genres--audio { margin-bottom: 79px; } .genres--shop { text-align: left; } .genres__list { font-size: 16px; line-height: normal; width: 25%; display: inline-block; vertical-align: top; } .genres__item { padding: 0 36px 5px 0; } .genres__link { font-size: 26px; line-height: 1.38; color: #006699; font-family: 'PT Sans Caption'; display: inline-block; } @media (max-width: 1299px) { .genres__link { font-size: 21px; } } @media (max-width: 990px) { .genres__link { font-size: 18px; } } .genres__link:hover { color: #cb1711; } .genres__link--active { border-bottom: 3px solid #006699; } @media (max-width: 990px) { .genres__link--active { border-bottom: 2px solid #006699; } } .genres__link--active:hover { border-bottom-color: #cb1711; } .header { -webkit-transition: backbround-color 0.3s ease-in-out; transition: backbround-color 0.3s ease-in-out; padding: 15px 0 15px; position: relative; z-index: 20; background-image: url('/pic/main/header_stadler.png'); /* <-- твой файл */ background-repeat: no-repeat; background-position: center top; background-size: contain; /* или "contain" — см. ниже */ } .header.fixed { position: fixed; left: 0; right: 0; top: 0; background-color: rgba(255, 255, 255, 0.95); padding: 5px 0; -webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4); } .header--transparent { background-color: transparent; } .header__logo { width: 208px; height: 80px; display: block; float: left; position: relative; display: none; } .header__logo::before { content: attr(data-text); position: absolute; top: 8px; right: 0; font-size: 13px; color: #4a4a4a; font-family: 'PT Sans'; } .header__logo svg, .header__logo img { width: 100%; height: 100%; display: block; } .header__ctrl { float: left; text-align: right; width: calc(100% - 0px); height: 80px; padding: 25px 0; word-spacing: -0.36em; font-size: 0; } .header__ctrl-item { word-spacing: normal; font-size: 16px; display: inline-block; vertical-align: top; height: 100%; } .header__lang { border-left: solid 1px #006699; padding-left: 40px; padding-right: 27px; position: relative; } @media (max-width: 1199px) { .header__lang { padding-left: 24px; } } .header__lang:hover .header__drop { opacity: 1; height: auto; } .header__lang-chevron { position: absolute; right: 0; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); width: 13px; height: 8px; } .header__lang-chevron svg { width: 100%; height: 100%; display: block; fill: #0c81bb; } .header__lang-title { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; display: block; cursor: pointer; } .header__lang-title:hover { opacity: .8; } .header__lang-icon { width: 30px; height: 30px; overflow: hidden; border-radius: 50%; display: inline-block; vertical-align: middle; } .header__lang-icon img, .header__lang-icon svg { width: 100%; height: 100%; display: block; } .header__lang-txt { text-transform: uppercase; padding-left: 5px; display: inline-block; vertical-align: middle; font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.25; letter-spacing: normal; text-align: left; color: #6c6c6c; } .header__menu { border-left: solid 1px #5f88a4; padding-left: 22px; padding-right: 18px; } @media (max-width: 1199px) { .header__menu { padding-left: 9px; padding-right: 0; } } @media (max-width: 990px) { .header__menu { padding-left: 0; } } .header__menu-list li { display: inline-block; padding: 0 18px; } @media (max-width: 990px) { .header__menu-list li { padding: 0 10px; } } .header__menu-link { cursor: pointer; display: block; position: relative; } .header__menu-link svg { display: block; fill: #5F88A4; } .header__menu-link:hover .header__drop { opacity: 1; height: auto; } .header__service { padding-left: 0; padding-right: 9px; } .header__service-list { padding: 0 45px 0 0; } .header__service-list li { display: inline-block; padding: 0 0 0 45px; } @media (max-width: 1199px) { .header__service-list li { padding: 0 15px; } } @media (max-width: 990px) { .header__service-list li { padding: 0 10px; } } .header__service-link { display: block; position: relative; } .header__service-link svg { display: block; fill: #069; } .header__service-link:hover .header__drop { opacity: 1; height: auto; } .header__drop { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; position: absolute; top: 100%; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); z-index: 10; opacity: 0; height: 0; overflow: hidden; } .header__drop--menu { width: 167px; } .header__drop--menu .header__drop-inner { background-color: #e6e6e6; padding: 25px; font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.25; letter-spacing: normal; text-align: center; color: #ffffff; } .header__drop--menu .header__drop-inner::before { border-bottom-color: #e6e6e6; } .header__drop--tooltip { width: 194px; } .header__drop--tooltip .header__drop-inner { background-color: #ffc400; padding: 13px 5px; font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.25; letter-spacing: normal; text-align: center; color: #ffffff; } .header__drop--tooltip .header__drop-inner::before { border-bottom-color: #ffc400; } .header__drop--lang { width: 124px; text-align: left; margin-left: 6px; } @media (max-width: 1199px) { .header__drop--lang { margin-left: 0; } } .header__drop--lang .header__drop-inner { background-color: #e6e6e6; padding: 25px; font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.25; letter-spacing: normal; text-align: center; color: #ffffff; } .header__drop--lang .header__drop-inner::before { border-bottom-color: #e6e6e6; } .header__drop--search { width: auto; left: auto; -webkit-transform: none; -ms-transform: none; transform: none; right: -45px; } .header__drop--search .header__drop-inner { background-color: #e6e6e6; padding: 0; font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.25; letter-spacing: normal; text-align: center; color: #ffffff; } .header__drop--search .header__drop-inner::before { border-bottom-color: #e6e6e6; left: auto; right: 20px; } .header__drop-list { width: 100%; display: block; } .header__drop-list li { display: block; padding: 0 0 10px 0; text-align: left; } .header__drop-list li.active .header__lang-txt { color: #217cff; font-weight: 700; } .header__drop-list li:last-child { padding-bottom: 0; } .header__drop-list li a { display: block; width: 100%; font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.25; letter-spacing: normal; text-align: left; color: #6c6c6c; } .header__drop-list li a:hover { color: #000; } .header__drop-inner { margin-top: 20px; border-radius: 3px; width: 100%; position: relative; } .header__drop-inner::before { content: ''; position: absolute; top: -35px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); border: 20px solid transparent; border-bottom: 20px solid transparent; } .header__search { width: 528px; position: relative; } .header__search-cross { position: absolute; z-index: 2; top: 0; right: 0; width: 50px; height: 100%; background-color: #e6e6e6; } .header__search-cross:hover svg { stroke: #000; } .header__search-cross svg { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; display: block; width: 20px; height: 20px; fill: #6c6c6c; stroke: #6c6c6c; position: relative; left: 10px; top: 50%; margin-top: -10px; } .header__search-input { position: relative; z-index: 1; height: 65px; background-color: transparent; border: 0; padding: 0 50px 0 20px; font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.25; letter-spacing: normal; text-align: left; color: #000; } .header__search-input::-webkit-input-placeholder { color: #6c6c6c; } .header__search-input:-ms-input-placeholder { color: #6c6c6c; } .header__search-input:focus::-webkit-input-placeholder { color: transparent; } .header__search-input:focus:-ms-input-placeholder { color: transparent; } .header__search-input:focus::placeholder { color: transparent; } .header__basket { position: relative; } .header__basket-num { position: absolute; top: -5px; right: -10px; width: 20px; height: 20px; border-radius: 50%; background-color: #217cff; font-size: 11px; font-weight: bold; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: 0.5px; color: #ffffff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; } .header__home-link { position: absolute; left: 1030px; /* отступ слева */ top: 30px; /* отступ сверху */ width: 200px; /* ширина кликабельной зоны */ height: 70px; /* высота */ display: block; z-index: 30; background: none; } .fancybox-active header.fixed { margin-right: 17px; } .history { padding: 0 0 70px 0; } .history__table { width: 100%; border-collapse: collapse; } .history__table td, .history__table th { padding: 5px 10px; } .history__table td:first-child, .history__table th:first-child { padding-left: 30px; text-transform: uppercase; } .history__table td:last-child, .history__table th:last-child { padding-right: 30px; } .history__table th { font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.44; letter-spacing: normal; text-align: left; color: #6c6c6c; padding-bottom: 16px; border-bottom: 1px solid #bfbfbf; } .history__table td { height: 94px; font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: 0.7px; color: #003356; } .history__table td:last-child { text-align: right; } .history__table-row { cursor: pointer; } .history__table-row--hidden td { padding: 0 !important; text-align: left !important; height: auto; border-bottom: 1px solid #bfbfbf; } .history__table-row.is-opened .history__table-arrow { -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); } .history__table-row.is-opened .history__table-col { border-bottom-color: transparent; font-weight: 700; } .history__table-row:hover .history__table-arrow svg { fill: #000; } .history__table-arrow { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; display: inline-block; vertical-align: top; height: 40px; width: 20px; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); position: relative; right: 20px; } .history__table-arrow svg { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; display: block; width: 100%; height: 100%; fill: #989898; } .history__table-drop { display: none; padding: 0 0 35px; margin-top: -10px; } .history__slider .slick-slide { width: 234px; padding-right: 6px; } .history__slider-item { width: 228px; display: block; } .history__slider .slider-arrow { width: 35px; height: 40px; padding: 5px 10px; background-color: rgba(0, 0, 0, 0.6); border-radius: 3px; } .interest-place { padding: 13px 0 63px; } .interest-place__head { height: 647px; background-size: cover; background-position: center; margin-bottom: 41px; border-radius: 3px; } @media (max-width: 990px) { .interest-place__head { height: 452px; } } .interest-place__overlay { background-color: rgba(0, 0, 0, 0.5); display: table; width: 100%; height: 100%; } .interest-place__inner { display: table-cell; vertical-align: middle; text-align: center; } .interest-place__link { color: #fff; font-size: 14px; line-height: 1.43; border-bottom: 1px solid #fff; display: inline-block; margin-bottom: 15px; } .interest-place__link:hover { border-bottom: 1px solid #0299e2; color: #0299e2; } .interest-place__caption { font-family: 'PT Sans Caption'; font-size: 56px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.36; letter-spacing: 2.5px; text-align: center; color: #ffffff; text-transform: uppercase; display: block; } .interest-place__content-image { padding: 19px 0 12px; } .interest-place__content-bg { height: 780px; background-size: cover; background-position: center; border-radius: 3px; margin: 31px 0 41px; } @media (max-width: 990px) { .interest-place__content-bg { height: 552px; } } .interest-place__content-info { border-top: solid 2px #bfbfbf; padding: 18px 0 11px; text-align: center; margin-top: 30px; } .interest-place__content .content-slider__dots { margin-top: 16px; } .interest-place__player { border-radius: 3px; position: relative; } @media (max-width: 990px) { .interest-place__player { text-align: right; } } @media (max-width: 990px) { .interest-place__player img { max-width: 565px; } } .interest-place__player-audio { position: absolute; top: -18px; left: -139px; width: 111px; height: 111px; background-color: #ffcc01; border-radius: 50%; display: table; } @media (max-width: 990px) { .interest-place__player-audio { top: -24px; left: -4px; } } .interest-place__player-audio span { text-transform: uppercase; display: table-cell; vertical-align: middle; font-size: 15px; line-height: 1.07; letter-spacing: 0.7px; color: #fff; text-align: center; } .interest-places { padding: 12px 0 83px; } @media (max-width: 990px) { .interest-places { padding: 12px 0 30px; } } .interest-places__head { margin-top: -5px; } .interest-places__title { font-family: 'PT Sans Caption'; font-size: 36px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: 1.6px; text-transform: uppercase; display: inline-block; color: #006699; margin-bottom: 17px; } .interest-places .cards-places { margin-bottom: -4px; } .interest-places .cards-places__img { margin-bottom: 10px; } .interest-places .cards-places__title:hover { color: #cb1711; } .kitchen { padding: 13px 0 63px; } .kitchen__head { height: 650px; background-size: cover; background-position: center; margin-bottom: 41px; border-radius: 3px; } @media (max-width: 990px) { .kitchen__head { height: 452px; } } .kitchen__overlay { background-color: rgba(0, 0, 0, 0.2); display: table; width: 100%; height: 100%; } .kitchen__inner { display: table-cell; vertical-align: middle; text-align: center; } .kitchen__caption { text-transform: uppercase; letter-spacing: 2.5px; color: #fff; font-weight: normal; } .kitchen__content-image { padding: 19px 0 12px; } .kitchen__content-bg { height: 780px; background-size: cover; background-position: center; border-radius: 3px; margin: 31px 0 12px; } @media (max-width: 990px) { .kitchen__content-bg { height: 552px; } } @media (max-width: 990px) { .kitchen { padding: 13px 0 30px; } } .lifhak-comfort { font-size: 0; line-height: 0; padding: 0 0 152px 0; } .lifhak-comfort::after { content: ""; display: table; clear: both; } @media (max-width: 1399px) { .lifhak-comfort { padding: 0 0 18px 0; } } .lifhak-comfort__holder { display: block; width: 100%; height: 100%; position: relative; padding-left: 60px; } .lifhak-comfort__holder::after { content: ""; display: table; clear: both; } @media (max-width: 1399px) { .lifhak-comfort__holder { padding-left: 0; } } .lifhak-comfort__caption { font-family: 'PT Sans Caption'; font-size: 36px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: 1.6px; text-transform: uppercase; color: #003356; display: block; text-align: center; padding-bottom: 87px; padding-left: 29px; } @media (max-width: 1399px) { .lifhak-comfort__caption { padding: 0 0 48px 0; } } .lifhak-comfort__category { font-size: 16px; line-height: normal; display: block; max-width: 380px; text-align: center; height: auto; position: absolute; left: 0; top: 0; } @media (max-width: 1399px) { .lifhak-comfort__category { max-width: 338px; margin-left: -8px; } } .lifhak-comfort__btn { max-width: 345px; display: inline-block; background-color: #5f88a4; margin-bottom: 10px; padding: 17px 15px; } @media (max-width: 1399px) { .lifhak-comfort__btn { padding: 13px 15px; margin-bottom: 8px; font-size: 12px; max-width: 276px; } } .lifhak-comfort__btn:hover { color: #fff; max-width: 370px; } @media (max-width: 1399px) { .lifhak-comfort__btn:hover { max-width: 297px; } } .lifhak-comfort__content { float: right; font-size: 16px; line-height: normal; display: inline-block; vertical-align: top; width: calc(100% - 380px); } @media (max-width: 1399px) { .lifhak-comfort__content { width: calc(100% - 345px); padding-left: 0; } } .lifhak-comfort__item { font-size: 0; line-height: 0; padding-bottom: 38px; } .lifhak-comfort__img { display: inline-block; vertical-align: top; font-size: 16px; line-height: normal; width: 30%; } @media (max-width: 1399px) { .lifhak-comfort__img { width: 32%; text-align: center; } } @media (max-width: 991px) { .lifhak-comfort__img { display: block; margin: 0 auto 15px; } } .lifhak-comfort__description { display: inline-block; vertical-align: top; font-size: 16px; line-height: normal; width: 70%; padding: 0 105px 0 43px; } @media (max-width: 1399px) { .lifhak-comfort__description { padding: 0 15px 0 38px; width: 68%; margin-top: -2px; } } @media (max-width: 991px) { .lifhak-comfort__description { display: block; width: 100%; padding: 0; } } .lifhak-comfort__description--first { margin-top: -5px; } @media (max-width: 1399px) { .lifhak-comfort__description--first { margin-top: -2px; } } .lifhak-comfort__description p { line-height: 1.44; } .lifhak-comfort__title { font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.38; letter-spacing: 0.7px; text-transform: uppercase; color: #006699; display: block; margin-bottom: 20px; } @media (max-width: 1399px) { .lifhak-comfort__title { margin-bottom: 10px; } } .lifhak { padding: 13px 0; } @media (max-width: 1399px) { .lifhak { padding: 4px 0; } } .lifhak__wrapper { background-color: #ecfcfc; } .lifhak__head { height: 650px; background-size: cover; background-position: center; margin-bottom: 41px; border-radius: 3px; } @media (max-width: 1399px) { .lifhak__head { height: 452px; margin-bottom: 44px; } } .lifhak__overlay { background-color: rgba(0, 0, 0, 0.5); display: table; width: 100%; height: 100%; border-radius: 3px; } .lifhak__inner { display: table-cell; vertical-align: middle; text-align: center; } .lifhak__caption { text-transform: uppercase; letter-spacing: 2.5px; color: #fff; font-weight: normal; display: block; max-width: 700px; margin: auto; } .lifhak__desc { font-size: 24px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.38; letter-spacing: normal; text-align: center; color: #6c6c6c; display: block; max-width: 595px; padding-bottom: 20px; margin: 0 auto; } @media (max-width: 1399px) { .lifhak__desc { padding-bottom: 32px; } } .lifhak-interest { padding: 93px 60px 138px; line-height: 0; font-size: 0; } @media (max-width: 1399px) { .lifhak-interest { padding: 65px 0 33px; } } @media (max-width: 990px) { .lifhak-interest__content { display: table; } } .lifhak-interest__content-inner { font-size: 0; line-height: 0; text-align: center; max-width: 407px; padding-top: 48px; display: inline-block; vertical-align: top; } @media (max-width: 1399px) { .lifhak-interest__content-inner { width: 400px; margin-left: -33px; } } .lifhak-interest__title { font-family: 'PT Sans Caption'; font-size: 26px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.38; letter-spacing: 0.9px; text-transform: uppercase; color: #006699; padding-bottom: 48px; } @media (max-width: 1399px) { .lifhak-interest__title { padding-left: 21px; } } .lifhak-interest__item { display: inline-block; letter-spacing: normal; vertical-align: top; font-size: 16px; width: 50%; padding: 0 10px; margin-bottom: 80px; } @media (max-width: 1399px) { .lifhak-interest__item { width: 45%; } } .lifhak-interest__item:hover .lifhak-interest__item-title { color: #cb1711; } .lifhak-interest__item-title { display: block; text-transform: uppercase; font-size: 14px; font-stretch: normal; line-height: 1.29; letter-spacing: 0.7px; color: #006699; } .lifhak-interest__icon { display: block; margin-bottom: 20px; } .lifhak-interest__image { display: inline-block; font-size: 16px; line-height: normal; width: calc(100% - 407px); padding-left: 43px; margin-top: -68px; text-align: right; vertical-align: middle; } @media (max-width: 1399px) { .lifhak-interest__image { width: calc(100% - 400px); margin-top: -7px; padding-left: 0; } } @media (max-width: 799px) { .lifhak-interest__image { display: table-cell; } } .lifhak-late { height: 720px; background-size: cover; background-position: center; margin-bottom: 74px; } @media (max-width: 1399px) { .lifhak-late { height: 590px; margin-bottom: 72px; } } .lifhak-late__caption { font-family: 'PT Sans Caption'; font-size: 36px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: 1.6px; text-transform: uppercase; color: #003356; display: block; text-align: center; padding-bottom: 37px; } @media (max-width: 1399px) { .lifhak-late__caption { padding-bottom: 22px; } } .lifhak-late__overlay { background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.1))); background-image: linear-gradient(to left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.1)); display: table; width: 100%; height: 100%; } .lifhak-late__inner { display: table-cell; vertical-align: middle; padding: 0 0 18px 82px; } @media (max-width: 1399px) { .lifhak-late__inner { padding-left: 34px; } } .lifhak-late__inner-item { max-width: 450px; color: #fff; } .lifhak-late__inner-item:first-child { padding-bottom: 80px; } .lifhak-late__title { text-transform: uppercase; display: block; font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.38; letter-spacing: 0.7px; margin-bottom: 20px; } .lifhak-saving { padding-bottom: 103px; } @media (max-width: 1399px) { .lifhak-saving { padding-bottom: 13px; } } .lifhak-saving__caption { font-family: 'PT Sans Caption'; font-size: 36px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: 1.6px; text-transform: uppercase; color: #006699; padding-bottom: 88px; text-align: center; display: block; } @media (max-width: 1399px) { .lifhak-saving__caption { padding-bottom: 48px; } } .lifhak-saving__inner { padding: 0 0 59px 56px; font-size: 0; line-height: 0; } @media (max-width: 1399px) { .lifhak-saving__inner { padding: 0 0 40px 0; display: table; } } .lifhak-saving__description { width: 461px; display: inline-block; font-size: 16px; line-height: normal; } @media (max-width: 1399px) { .lifhak-saving__description { width: calc(100% - 535px); display: table-cell; } } @media (max-width: 899px) { .lifhak-saving__description { width: calc(100% - 430px); } } .lifhak-saving__description a { color: #fe3824; border-bottom-color: #fe3824; } .lifhak-saving__description p { line-height: 1.44; } .lifhak-saving__description--mod { width: 500px; padding: 51px 0 0 31px; } @media (max-width: 1399px) { .lifhak-saving__description--mod { padding: 0 0 0 31px; width: calc(100% - 520px); } } @media (max-width: 899px) { .lifhak-saving__description--mod { padding: 0 0 0 15px; width: calc(100% - 430px); } } .lifhak-saving__title { font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.38; letter-spacing: 0.7px; display: block; margin-bottom: 20px; text-transform: uppercase; color: #006699; } .lifhak-saving__numbers { display: inline-block; vertical-align: top; width: calc(100% - 461px); } @media (max-width: 1399px) { .lifhak-saving__numbers { display: table-cell; vertical-align: middle; width: 625px; } } @media (max-width: 1099px) { .lifhak-saving__numbers { width: 535px; } } @media (max-width: 899px) { .lifhak-saving__numbers { width: 430px; } } .lifhak-saving__numbers--mod { width: calc(100% - 579px); margin-left: -31px; } @media (max-width: 1399px) { .lifhak-saving__numbers--mod { padding-top: 44px; width: 625px; } } @media (max-width: 1099px) { .lifhak-saving__numbers--mod { width: 520px; } } @media (max-width: 899px) { .lifhak-saving__numbers--mod { width: 430px; } } .lifhak-saving__item { font-family: 'PT Sans Caption'; max-width: 367px; width: 50%; text-align: center; display: inline-block; vertical-align: top; font-size: 16px; line-height: normal; padding: 17px 0 24px; margin-left: -4px; } @media (max-width: 1399px) { .lifhak-saving__item { padding: 4px 0 28px; } } @media (max-width: 899px) { .lifhak-saving__item { padding: 4px 15px 28px; } } .lifhak-saving__item--mod { width: 45%; max-width: 100%; padding-bottom: 34px; } @media (max-width: 1399px) { .lifhak-saving__item--mod { padding: 4px 10px 33px; width: 50%; } } .lifhak-saving__num { font-size: 86px; font-weight: bold; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: 3px; color: #006699; } @media (max-width: 1399px) { .lifhak-saving__num { font-size: 69px; letter-spacing: 2.4px; } } @media (max-width: 899px) { .lifhak-saving__num { font-size: 45px; letter-spacing: normal; } } .lifhak-saving__num sup, .lifhak-saving__num sub { font-size: 26px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: 0.9px; } @media (max-width: 1399px) { .lifhak-saving__num sup, .lifhak-saving__num sub { font-size: 20px; } } .lifhak-saving__num sup { position: relative; top: -40px; left: 23px; } @media (max-width: 1399px) { .lifhak-saving__num sup { top: -31px; } } @media (max-width: 899px) { .lifhak-saving__num sup { left: 15px; } } .lifhak-saving__num sub { position: relative; left: -22px; } @media (max-width: 899px) { .lifhak-saving__num sub { left: -10px; } } .lifhak-saving__num--txt { font-size: 56px; font-weight: bold; font-style: normal; font-stretch: normal; line-height: 0.95; letter-spacing: 1.9px; text-transform: uppercase; } @media (max-width: 1399px) { .lifhak-saving__num--txt { font-size: 44px; } } @media (max-width: 899px) { .lifhak-saving__num--txt { font-size: 36px; } } .lifhak-saving__text { font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: 0.6px; display: block; color: #006699; } @media (max-width: 1399px) { .lifhak-saving__text { font-size: 14px; letter-spacing: 0.5px; } } .lifhak-saving__text--mod { max-width: 250px; margin: 3px auto 0; padding-bottom: 5px; } .lifhak-security { padding: 0 0 197px 60px; } @media (max-width: 1399px) { .lifhak-security { padding: 0 0 77px 44px; } } .lifhak-security__caption { font-family: 'PT Sans Caption'; font-size: 36px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: 1.6px; text-transform: uppercase; color: #006699; display: block; text-align: center; padding-bottom: 67px; } @media (max-width: 1399px) { .lifhak-security__caption { padding-bottom: 37px; } } .lifhak-security__content { display: table; width: 100%; } .lifhak-security__description { display: table-cell; vertical-align: middle; width: 527px; padding-right: 66px; } @media (max-width: 1399px) { .lifhak-security__description { padding-right: 34px; } } .lifhak-security__title { text-transform: uppercase; font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.38; letter-spacing: 0.7px; display: block; padding: 16px 0 20px; color: #006699; } @media (max-width: 1399px) { .lifhak-security__title { padding: 0 0 20px; } } .lifhak-security__image { background-size: cover; background-position: top center; display: table-cell; vertical-align: middle; border-radius: 3px; width: calc(100% - 527px); height: 503px; } .magazine { border-top: solid 2px #003356; padding: 50px 0 10px; } .magazine__inner { padding-bottom: 40px; } .magazine__inner::after { content: ""; display: table; clear: both; } @media (max-width: 990px) { .magazine__inner { padding-bottom: 30px; } } .magazine__image { float: left; background-repeat: no-repeat; background-size: cover; background-position: center; width: 345px; height: 429px; position: relative; } .magazine__icon { position: absolute; bottom: 0; left: 9px; } .magazine__icon svg { width: 65px; height: 60px; } .magazine__description { float: left; width: calc(100% - 345px); padding-left: 35px; } .magazine .category-tag { margin-bottom: 2px; position: relative; top: -6px; } .magazine__name { font-size: 28px; font-family: 'PT Sans Caption'; line-height: 1.11; color: #006699; display: block; padding-bottom: 5px; } .magazine__category { font-size: 14px; line-height: 1.29; letter-spacing: 0.7px; text-transform: uppercase; color: #0299e2; display: inline-block; margin-bottom: 20px; } .magazine__editions { display: inline-block; margin-top: 10px; } .magazine__title { font-size: 16px; line-height: 1.38; letter-spacing: 0.7px; color: #00517a; text-transform: uppercase; } @media (max-width: 990px) { .magazine { padding: 30px 0 10px; } } .main { padding-bottom: 43px; } .main__football { width: 100%; display: block; } .main__restaurant { margin-top: 25px; position: relative; z-index: 1; } .main__restaurant-title { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; text-transform: uppercase; position: relative; font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: 0.7px; text-align: left; color: #00517a; border-bottom: 1px solid transparent; } .main__restaurant-title:hover { border-bottom-color: #003356; } .main__restaurant-title svg { height: 23px; width: 11px; display: block; fill: #003356; position: absolute; right: -30px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .main__restaurant-slider { margin: 10px -3px 0; } .main__restaurant-slider .slider-arrow { margin-top: -75px; } .main__restaurant-slider .slider-arrow::before { content: ''; position: absolute; left: -5px; top: -5px; width: 25px; height: 40px; -webkit-box-shadow: inset 1px 1px 4px #000000; box-shadow: inset 1px 1px 4px #000000; } .main__restaurant-slide { height: 550px; padding: 0 3px 250px; } .main__restaurant-compensator { margin-top: -250px !important; z-index: 0; position: relative; padding-top: 1px; } .main__joy { margin-top: 49px !important; } .main__rus { margin-top: 80px; } @media (max-width: 1219px) { .main__rus { margin-top: 41px; } } .main--v .main__football { top: 0; } .map-content { width: 100%; margin-bottom: 55px; } .map-content--place { margin: 38px 0 40px; } .map-content__yandex { border-radius: 3px; height: 405px; margin-bottom: 16px; } .map-content__inner { border-bottom: solid 2px #bfbfbf; padding-bottom: 17px; text-align: center; word-spacing: -0.36em; } .map-content__btn { background-color: transparent; display: inline-block; border: 1px solid #4a4a4a !important; color: #4a4a4a !important; font-size: 12px; letter-spacing: 0.6px; word-spacing: normal; max-width: 221px; padding: 7px 15px; margin: 0 13px; } .map-content__btn:hover { color: #fff !important; } .map { margin-bottom: 50px; width: 100%; height: calc(100vh - 85px); min-height: 800px; background-color: #ccc; position: relative; } @media (max-width: 1023px) { .map { min-height: 500px; } } .map #way-map { width: 100%; height: 100%; z-index: 1; } .map__info { position: absolute; bottom: 12px; right: 12px; z-index: 2; width: 262px; } .map__info-btn { margin-bottom: 5px; } .map__net { border-radius: 3px; background-color: #003356; padding: 6px 0 7px 0; color: #ffffff; } .map__net-title { font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.27; letter-spacing: normal; text-align: center; padding-bottom: 9px; } .map__net-item { margin-bottom: 7px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .map__net-color { width: 44px; height: 22px; border-top-right-radius: 3px; border-bottom-right-radius: 3px; } .map__net-color--green { background-color: #22ce01; } .map__net-color--blue { background-color: #7c90f9; } .map__net-txt { padding-left: 11px; font-size: 13px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: 0.6px; text-align: left; } .music-onelist { border-top: 1px solid #006699; padding: 50px 0 78px; } @media (max-width: 990px) { .music-onelist { padding: 50px 0 30px; } } .music-onelist__inner::after { content: ""; display: table; clear: both; } .music-onelist__head { padding-bottom: 9px; } .music-onelist__image { width: 347px; float: left; padding-top: 38px; border-radius: 3px; } @media (max-width: 990px) { .music-onelist__image { width: 250px; padding-top: 36px; } } .music-onelist .category-tag { margin-bottom: 2px; position: relative; top: -6px; word-spacing: normal; } .music-onelist__name { font-size: 28px; font-family: 'PT Sans Caption'; line-height: 1.11; color: #006699; display: block; padding-bottom: 8px; word-spacing: normal; } .music-onelist__tracks { border-bottom: none; font-size: 14px; line-height: 1.29; letter-spacing: 0.7px; text-transform: uppercase; color: #0299e2; display: block; margin-bottom: 21px; word-spacing: normal; } @media (max-width: 990px) { .music-onelist__tracks { margin-bottom: 10px; } } .music-onelist__player { float: left; width: calc(100% - 347px); padding-left: 35px; } .audiobook-onelist__player { float: left; width: calc(100% - 90px); padding-left: 85px; } @media (max-width: 990px) { .music-onelist__player { width: calc(100% - 250px); } } .music-onelist__player-title { display: inline-block; color: #003356; line-height: 1.38; letter-spacing: 0.7px; text-transform: uppercase; padding-bottom: 14px; } .music { padding-bottom: 33px; } .one-audiobook { border-top: 2px solid #006699; padding: 50px 0 69px; } @media (max-width: 990px) { .one-audiobook { padding: 50px 0 30px; } } .one-audiobook__inner::after { content: ""; display: table; clear: both; } .one-audiobook__image { width: 345px; float: left; } @media (max-width: 990px) { .one-audiobook__image { width: 250px; } } .one-audiobook__description { float: left; width: calc(100% - 345px); padding-left: 35px; word-spacing: -0.36em; } @media (max-width: 990px) { .one-audiobook__description { width: calc(100% - 250px); } } .one-audiobook__description-list { display: inline-block; vertical-align: top; margin-top: 3px; width: 285px; } .one-audiobook .category-tag { margin-bottom: 2px; position: relative; top: -6px; word-spacing: normal; } .one-audiobook__name { font-size: 28px; font-family: 'PT Sans Caption'; line-height: 1.11; color: #006699; display: block; padding-bottom: 8px; word-spacing: normal; } .one-audiobook__author { border-bottom: none; font-size: 14px; line-height: 1.29; letter-spacing: 0.7px; text-transform: uppercase; color: #0299e2; display: block; margin-bottom: 21px; word-spacing: normal; } .one-audiobook__content { display: inline-block; vertical-align: top; word-spacing: normal; max-width: 678px; padding-right: 80px; width: calc(100% - 285px); } @media (max-width: 1199px) { .one-audiobook__content { padding-right: 40px; } } @media (max-width: 990px) { .one-audiobook__content { width: 100%; max-width: 100%; } } .one-audiobook__list { display: inline-block; margin-right: 36px; word-spacing: normal; } .one-audiobook__list--last { margin-right: 0; } .one-audiobook__list-item { padding: 7px 0; font-size: 14px; letter-spacing: 0.8px; line-height: normal; color: #0299e2; } @media (max-width: 990px) { .one-audiobook__list-item { padding: 3px 0; } } .one-audiobook__list-item:first-child { padding-top: 0; } .one-audiobook__list-item a { border-bottom: 1px solid transparent; } .one-audiobook__list-item a:hover { border-bottom: 1px solid #0299e2; } .one-audiobook__player { margin-top: 30px; } @media (max-width: 990px) { .one-audiobook__player { margin-top: 20px; } } .one-audiobook__player-title { display: inline-block; color: #003356; line-height: 1.38; letter-spacing: 0.7px; text-transform: uppercase; padding-bottom: 12px; } .one-book { border-top: 2px solid #006699; padding: 50px 0 81px; } @media (max-width: 990px) { .one-book { padding: 50px 0 30px; } } .one-book__inner { max-width: 931px; margin: 0 auto; } .one-book__inner::after { content: ""; display: table; clear: both; } .one-book__image { width: 345px; float: left; } @media (max-width: 990px) { .one-book__image { width: 250px; } } .one-book__link { display: inline-block; color: #006699; line-height: 1.38; letter-spacing: 0.7px; text-transform: uppercase; margin-top: 13px; } .one-book__download { word-spacing: -0.36em; margin: 5px -11px 0; } .one-book__download-item { display: inline-block; padding: 0 14px; word-spacing: normal; position: relative; } .one-book__download-item:before { content: ''; position: absolute; top: 6px; left: -1px; width: 1px; height: 13px; background-color: #989898; } .one-book__download-item:first-child:before { display: none; } .one-book__download-item-link { color: #989898; text-transform: lowercase; } .one-book__download-item-link:hover { color: #0299e2; } .one-book__description { float: left; width: calc(100% - 345px); padding-left: 35px; } @media (max-width: 990px) { .one-book__description { width: calc(100% - 250px); } } .one-book__description-list { margin-top: 20px; } .one-book .category-tag { margin-bottom: 2px; position: relative; top: -6px; } .one-book__name { font-size: 28px; font-family: 'PT Sans Caption'; line-height: 1.11; color: #006699; display: block; padding-bottom: 5px; } .one-book__author { border-bottom: none; font-size: 14px; line-height: 1.29; letter-spacing: 0.7px; text-transform: uppercase; color: #0299e2; display: inline-block; margin-bottom: 21px; } .one-book__list { display: inline-block; margin-right: 31px; } .one-book__list--last { margin-right: 0; } .one-book__list-item { padding: 7px 0; font-size: 14px; letter-spacing: 0.8px; line-height: normal; color: #0299e2; } @media (max-width: 990px) { .one-book__list-item { padding: 3px 0; } } .one-book__list-item a { border-bottom: 1px solid transparent; } .one-book__list-item a:hover { border-bottom: 1px solid #0299e2; } .one-film { padding: 0 0 80px 0; } .one-film__head { display: table; width: 100%; height: 600px; margin: 0 0 20px 0; background-position: center; background-size: cover; background-repeat: no-repeat; } .one-film__head-inner { display: table-cell; width: 100%; height: 100%; vertical-align: middle; padding: 30px 50px; } .one-film__head-caption { max-width: 400px; } .one-film__head-caption .cards-pressa-top__description-btn { margin-top: 13px; } .one-film__head-title { font-size: 28px; line-height: 1.11; color: #fff; padding: 0 0 4px; font-family: 'PT Sans Caption'; } .one-film__head-title-eng { font-size: 14px; line-height: 18px; color: #989898; letter-spacing: .7px; padding: 0 0 22px 0; text-transform: uppercase; } .one-film__head-year { font-size: 14px; line-height: 16px; color: #989898; padding: 0 0 18px 0; } .one-film__head-people { color: #0299e2; padding: 0 0 22px 0; font-size: 15px; line-height: 17px; } .one-film__head-info { font-size: 14px; line-height: 14px; color: #989898; } .one-film__head-info span { margin-left: 10px; } .one-film__head-description { font-size: 15px; line-height: 1.27; color: #fff; padding: 0 0 20px; } .one-film__head-reit { margin-top: 12px; } .one-film__head-reit--lg { display: inline-block; font-size: 35px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: left; color: #ffc400; margin-left: 15px; } .one-film__head-reit--sm { display: inline-block; vertical-align: bottom; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: left; color: #989898; padding-bottom: 3px; } .one-film__head-star { display: inline-block; } .one-film__head-star svg { width: 17.3px; height: 16.5px; display: block; } .one-film__cols::after { content: ""; display: table; clear: both; } .one-film__descr-col { float: left; width: 33.33%; padding: 0 70px 0 0; } .one-film__video-col { float: left; width: 66.66%; } .one-film__col-title { font-size: 16px; text-transform: uppercase; line-height: 23px; color: #006699; letter-spacing: normal; display: block; margin-bottom: 10px; } .one-film__player { display: block; position: relative; width: 100%; background-size: cover; background-position: center; } .one-film__player:before { content: ''; display: block; width: 100%; padding-bottom: 65.3%; } .one-film__player svg { width: 110px; height: 110px; position: absolute; top: 50%; left: 50%; margin: -55px 0 0 -55px; -webkit-transition: all .2s ease; transition: all .2s ease; } .one-film__player:hover svg { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .one-film__top-title { font-family: 'PT Sans Caption'; font-size: 36px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: 1.6px; text-transform: uppercase; display: block; color: #006699; margin-bottom: 17px; } .one-film__search { max-width: 584px; width: 100%; padding: 0 9px; float: right; } @media (max-width: 990px) { .one-film__search { max-width: 400px; } } .one-film__search .search__input { padding: 0 22px 0 2px; } .one-film__search .search__icon { bottom: 6px; } .one-game { border-top: 2px solid #006699; padding: 45px 0 63px; } .one-game__inner::after { content: ""; display: table; clear: both; } .one-game__image { width: 228px; float: left; } .one-game__description { float: left; width: calc(100% - 228px); padding-left: 28px; } .one-game .category-tag { margin-bottom: 2px; position: relative; top: -6px; } .one-game__name { font-size: 28px; font-family: 'PT Sans Caption'; line-height: 1.11; color: #006699; display: block; padding-bottom: 5px; } .one-game__category { border-bottom: none; font-size: 14px; line-height: 1.29; letter-spacing: 0.7px; text-transform: uppercase; color: #0299e2; display: inline-block; margin-bottom: 21px; } .one-game__btn { font-size: 12px; line-height: normal; letter-spacing: 0.6px; padding: 7px 15px; background-color: #0299e2; margin-top: 13px; } .one-game__desc { padding: 34px 0 0; } @media (max-width: 990px) { .one-game__desc { padding: 20px 0 0; } } .one-game__desc-title { font-size: 16px; text-transform: uppercase; line-height: 23px; color: #006699; letter-spacing: normal; display: block; margin-bottom: 10px; } .one-station { padding: 13px 0 63px; } .one-station__head { height: 647px; background-size: cover; background-position: center; margin-bottom: 41px; border-radius: 3px; } @media (max-width: 990px) { .one-station__head { height: 452px; } } .one-station__overlay { background-color: rgba(0, 0, 0, 0.2); display: table; width: 100%; height: 100%; } .one-station__inner { display: table-cell; vertical-align: middle; text-align: center; } .one-station__link { color: #fff; font-size: 14px; line-height: 1.43; border-bottom: 1px solid #fff; display: inline-block; margin-bottom: 15px; } .one-station__link:hover { border-bottom: 1px solid #0299e2; color: #0299e2; } .one-station__caption { font-family: 'PT Sans Caption'; font-size: 56px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: 1.6px; text-align: center; color: #ffffff; text-transform: uppercase; display: block; } .one-station__content-image { padding: 19px 0 12px; } .pagination { font-size: 0; line-height: 0; display: block; margin-bottom: 12px; } .pagination__list { display: inline-block; vertical-align: middle; } .pagination__list-item { font-size: 20px; line-height: normal; padding-right: 25px; display: inline-block; } .pagination__list-item:last-child { padding-right: 35px; } .pagination__list-link { color: #0c81bb; } .pagination__list-link:hover { color: #ffcc01; } .pagination__list-link--active { position: relative; display: inline-block; } .pagination__list-link--active:before { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; content: ''; position: absolute; bottom: -15px; left: 2px; width: 8px; height: 8px; background-color: #0c81bb; border-radius: 50%; } .pagination__list-link--active:hover:before { background-color: #ffcc01; } .pagination__arrow { display: inline-block; line-height: normal; font-size: 16px; border-left: 1px solid #0c81bb; padding-left: 26px; vertical-align: middle; } .pagination__arrow svg { fill: #0299e2; } .pagination__arrow svg:hover { fill: #ffcc01; } .pagination__arrow-left { display: inline-block; padding: 0 5px; } .pagination__arrow-right { display: inline-block; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); padding: 0 5px; } .city { width: 100%; height: 100%; border-radius: 3px; overflow: hidden; } .city__slide { width: 100%; height: 100%; } .city__slide::after { content: ""; display: table; clear: both; } .city__slide-title { position: absolute; bottom: 18px; left: 0; padding: 0 24px; font-size: 19px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.16; letter-spacing: 0.8px; text-align: left; color: #ffffff; text-transform: uppercase; z-index: 1; height: auto; } .city__slide-img { position: relative; float: left; width: calc(100% - 235px); height: 100%; } @media (max-width: 1219px) { .city__slide-img { display: none; } } .city__slide-img img { width: 100%; height: 100%; display: block; } .city__slide-img:before { content: ''; display: block; position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 1; background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0)), to(#000000)); background-image: linear-gradient(to left, rgba(0, 0, 0, 0), #000000); opacity: .8; } .city__slide-txt { float: left; width: 235px; height: 100%; padding: 25px 18px; background-color: #003356; } @media (max-width: 1219px) { .city__slide-txt { width: 100%; } } @media (max-width: 990px) { .city__slide-txt { padding: 10px; } } .city__slide-txt p { font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.27; letter-spacing: normal; text-align: left; color: #ffffff; margin-bottom: 10px; } @media (max-width: 1219px) { .city__slide-txt p { font-size: 14px; } } @media (max-width: 990px) { .city__slide-txt p { font-size: 13px; } } .city__slide-link { text-decoration: underline; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.57; letter-spacing: normal; text-align: left; color: #d8d8d8; } .city__slide-link:hover { text-decoration: none; } .city__slide-name-mob { display: none; margin-bottom: 5px; font-size: 19px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.16; letter-spacing: 0.8px; text-align: left; color: #ffffff; } @media (max-width: 1219px) { .city__slide-name-mob { display: block; } } @media (max-width: 990px) { .city__slide-name-mob { font-size: 15px; } } .city .slider-arrow { top: 154px; } @media (max-width: 1219px) { .city .slider-arrow { display: none !important; } } .city .slider-arrow--next { left: 48px; } .city .slider-arrow--prev { right: auto; left: 20px; } .city .slick-track, .city .slick-list { height: 100%; } .city .slick-track div:not([class]), .city .slick-list div:not([class]) { height: 100%; } .plate__container { display: block; margin: 0 -3px -6px; word-spacing: -0.36em; font-size: 0; } .plate__container::after { content: ""; display: table; clear: both; } .plate__col { display: inline-block; float: left; word-spacing: normal; vertical-align: top; padding: 0 3px 6px; position: relative; font-size: 16px; } .plate__col::after { content: ""; display: table; clear: both; } .plate__col--ib { float: none; } .plate__col:last-child { margin-right: 0; } .plate__col--1 { width: 16.666666%; } .plate__col--2 { width: 33.333333%; } .plate__col--3 { width: 50%; } .plate__col--4 { width: 66.666666%; } .plate__col--5 { width: 83.333333%; } .plate__col--6 { width: 100%; } @media (max-width: 1439px) { .plate__col-d-1-2 { width: 25%; } } @media (max-width: 1439ps) { .plate__col-d-1-5 { width: 20%; } } @media (max-width: 1439px) { .plate__col-d-2-5 { width: 40%; } } @media (max-width: 1439px) { .plate__col-d-1 { width: 16.666666%; } } @media (max-width: 1439px) { .plate__col-d-2 { width: 33.333333%; } } @media (max-width: 1439px) { .plate__col-d-3 { width: 50%; } } @media (max-width: 1439px) { .plate__col-d-4 { width: 66.666666%; } } @media (max-width: 1439px) { .plate__col-d-5 { width: 83.333333%; } } @media (max-width: 1439px) { .plate__col-d-6 { width: 100%; } } @media (max-width: 1299px) { .plate__col-ds-1-2 { width: 25%; } } @media (max-width: 1299px) { .plate__col-ds-1-5 { width: 20%; } } @media (max-width: 1299px) { .plate__col-ds-2-5 { width: 40%; } } @media (max-width: 1299px) { .plate__col-ds-1 { width: 16.666666%; } } @media (max-width: 1299px) { .plate__col-ds-2 { width: 33.333333%; } } @media (max-width: 1299px) { .plate__col-ds-3 { width: 50%; } } @media (max-width: 1299px) { .plate__col-ds-4 { width: 66.666666%; } } @media (max-width: 1299px) { .plate__col-ds-5 { width: 83.333333%; } } @media (max-width: 1299px) { .plate__col-ds-6 { width: 100%; } } @media (max-width: 1219px) { .plate__col-md-1-2 { width: 25%; } } @media (max-width: 1219px) { .plate__col-md-1-5 { width: 20%; } } @media (max-width: 1219px) { .plate__col-md-2-5 { width: 40%; } } @media (max-width: 1219px) { .plate__col-md-1 { width: 16.666666%; } } @media (max-width: 1219px) { .plate__col-md-2 { width: 33.333333%; } } @media (max-width: 1219px) { .plate__col-md-3 { width: 50%; } } @media (max-width: 1219px) { .plate__col-md-3-4 { width: 75%; } } @media (max-width: 1219px) { .plate__col-md-4 { width: 66.666666%; } } @media (max-width: 1219px) { .plate__col-md-5 { width: 83.333333%; } } @media (max-width: 1219px) { .plate__col-md-6 { width: 100%; } } @media (max-width: 1219px) { .plate__col-hidden-md { display: none; } } @media (max-width: 1099px) { .plate__col-mds-1-2 { width: 25%; } } @media (max-width: 1099px) { .plate__col-mds-1 { width: 16.666666%; } } @media (max-width: 1099px) { .plate__col-mds-2 { width: 33.333333%; } } @media (max-width: 1099px) { .plate__col-mds-3 { width: 50%; } } @media (max-width: 1099px) { .plate__col-mds-3-4 { width: 75%; } } @media (max-width: 1099px) { .plate__col-mds-4 { width: 66.666666%; } } @media (max-width: 1099px) { .plate__col-mds-5 { width: 83.333333%; } } @media (max-width: 1099px) { .plate__col-mds-6 { width: 100%; } } @media (max-width: 990px) { .plate__col-sm-1-2 { width: 25% !important; } } @media (max-width: 990px) { .plate__col-sm-1 { width: 16.666666% !important; } } @media (max-width: 990px) { .plate__col-sm-2 { width: 33.333333% !important; } } @media (max-width: 990px) { .plate__col-sm-3 { width: 50% !important; } } @media (max-width: 990px) { .plate__col-sm-4 { width: 66.666666% !important; } } @media (max-width: 990px) { .plate__col-sm-5 { width: 83.333333% !important; } } @media (max-width: 990px) { .plate__col-sm-6 { width: 100% !important; } } .plate__item { border-radius: 3px; width: 100%; margin: 0 0 6px 0; } .plate__item:last-child { margin: 0; } .plate__item--x1 { height: 147px; } .plate__item--x1-2 { height: 233px; } .plate__item--x2 { height: 300px; } .plate__item--x3 { height: 453px; } .plate__item--x4 { height: 606px; } @media (max-width: 1219px) { .plate__item--md1 { height: 147px; } } @media (max-width: 1219px) { .plate__item--md1-2 { height: 233px; } } @media (max-width: 1219px) { .plate__item--md2 { height: 300px; } } @media (max-width: 1219px) { .plate__item--md3 { height: 453px; } } @media (max-width: 1219px) { .plate__item--md4 { height: 606px; } } @media (max-width: 990px) { .plate__item--s1 { height: 147px; } } @media (max-width: 990px) { .plate__item--s1-2 { height: 233px; } } @media (max-width: 990px) { .plate__item--s2 { height: 300px; } } @media (max-width: 990px) { .plate__item--s3 { height: 453px; } } @media (max-width: 990px) { .plate__item--s4 { height: 606px; } } .plate--bg { position: absolute; top: 0; left: 0; overflow: hidden; -webkit-transition: -webkit-transform .5s linear; transition: -webkit-transform .5s linear; transition: transform .5s linear; transition: transform .5s linear, -webkit-transform .5s linear; width: 100%; height: 100%; z-index: 0; display: block; will-change: transform; } .plate--bg img { width: 100%; height: 100%; display: block; -o-object-fit: cover; object-fit: cover; } .plate--bg { width: 100%; height: 100%; display: block; -o-object-fit: cover; object-fit: cover; } .plate__slide-link { text-decoration: underline; font-size: 20px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 0; margin-left: 0%; letter-spacing: normal; color: #217cff; } .plate--t-container { display: table; height: 100%; width: 100%; position: relative; z-index: 1; } .plate__auth { background: rgba(255, 255, 255, 0) url(/pic/main/autorization.png) 0 0 no-repeat; background-size: cover; width: 100%; height: 100%; display: table; padding: 0 25px; border-radius: 3px; position: relative; z-index: 10; } @media (max-width: 1349px) { .plate__auth { padding: 0 10px; } } @media (max-width: 1219px) { .plate__auth { padding: 0 25px; } } .plate__auth:hover .plate--bg { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .plate__auth-bg-holder { z-index: 0; position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; border-radius: 3px; } .plate__auth-holder { display: table-cell; vertical-align: middle; position: relative; z-index: 1; } .plate__auth-icon { display: block; width: 33px; height: 24px; } .plate__auth-icon svg { width: 100%; height: 100%; display: block; fill: #fff; } .plate__auth-title { margin-top: 11px; font-size: 18px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.17; letter-spacing: normal; text-align: left; color: #ffffff; } .plate__auth-tel { margin-top: 20px; } .plate__auth-btn { margin-top: 24px; } .plate__taxi { position: relative; border-radius: 15px; overflow: visible; width: 100%; height: 100%; padding: 20px 20px 0; text-align: center; display: block; background: url("/pic/main/taxi_stadler.webp") no-repeat center center; background-size: contain; } .plate__taxi:hover .plate__taxi-bg { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .plate__taxi-bg { position: absolute; top: 0; left: 0; overflow: hidden; -webkit-transition: -webkit-transform .5s linear; transition: -webkit-transform .5s linear; transition: transform .5s linear; transition: transform .5s linear, -webkit-transform .5s linear; width: 100%; height: 100%; z-index: 0; display: block; /* фон */ background: url("pic/main/taxi.png") no-repeat center center; background-size: cover; } .plate__taxi-select-wrapper { margin-top: 10px; /* небольшой отступ от заголовка */ margin-bottom: 15px; /* отступ от телефонов */ position: relative; z-index: 1; } /* блок телефонов */ .plate__taxi-zones { position: relative; z-index: 1; } .plate__taxi-main, .plate__taxi-zone { position: relative; z-index: 1; margin-top: 25px; /* отступ сверху */ margin-bottom: 12px; /* отступ между группами */ text-align: center; /* выравнивание */ } .plate__serv-title { position: relative; z-index: 1; /* всегда поверх фона */ color: #fff; /* белый текст на тёмном фоне */ } .plate__taxi-map { position: relative; z-index: 1; margin-bottom: 10px; } .plate__taxi-map img { max-width: 100%; margin: 0 auto; display: block; } .plate__taxi-car { max-width: 160px; height: auto; } .plate__taxi-ya { max-width: 195%; height: auto; margin-top: 5px; } .plate__taxi-icon { width: 50px; height: 33px; } .plate__taxi-icon svg { width: 100%; height: 100%; fill: #fff; } .plate__taxi-select { display: block; width: 100%; margin: 6px 0 12px 0; } .plate__taxi-select .jq-selectbox__dropdown { position: absolute !important; top: 100% !important; left: 0 !important; width: 100% !important; z-index: 9999 !important; background: #fff; /* чтобы не сливалось */ color: #000; /* читаемый текст */ border-radius: 5px; box-shadow: 0 4px 10px rgba(0,0,0,0.2); max-height: 200px; /* ограничение по высоте */ overflow-y: auto; /* скролл если список длинный */ } .plate__taxi-select .jq-selectbox__select-text { font-size: 14px; line-height: 16px; } .plate__taxi-select .jq-selectbox__trigger { width: auto; border-left: none; } .plate__taxi-select .jq-selectbox__trigger-arrow { width: 7px; height: 7px; border-bottom: 1px solid #fff; border-right: 1px solid #fff; border-top: none; border-left: none; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); top: 50%; right: 0; margin: -4px 2px 0 0; } .plate__taxi-select.focused .jq-selectbox__select { border: none; border-bottom: 1px solid #fff; } .plate__taxi-phone { margin: 4px 0; /* расстояние между номерами */ font-size: 13px; line-height: 15px; color: #fff; } .plate__buy { width: 100%; height: 100%; border-radius: 3px; overflow: hidden; display: block; padding: 10px 20px; position: relative; } .plate__buy--lg { padding-top: 130px; } .plate__buy:hover .plate--bg { -webkit-transform: scale(1.15); -ms-transform: scale(1.15); transform: scale(1.15); } .plate__buy-bg { position: absolute; top: 0; left: 0; overflow: hidden; -webkit-transition: -webkit-transform .5s linear; transition: -webkit-transform .5s linear; transition: transform .5s linear; transition: transform .5s linear, -webkit-transform .5s linear; width: 100%; height: 100%; z-index: 0; display: block; will-change: transform; } .plate__buy-bg img { width: 100%; height: 100%; display: block; } .plate__buy-holder { display: table-cell; vertical-align: middle; position: relative; z-index: 1; } .plate__buy-icon { width: 38px; height: 52px; } .plate__buy-icon svg { display: block; width: 100%; height: 100%; stroke: #fff; } .plate__buy-title { font-size: 19px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.16; letter-spacing: 0.8px; text-align: left; color: #ffffff; margin-top: 8px; text-transform: uppercase; } .plate__serv { width: 100%; height: 100%; border-radius: 15px; overflow: hidden; display: block; padding: 20px; position: relative; background: rgba(255, 255, 255, 0.7); backdrop-filter: blur(10px); box-shadow: 0 4px 10px rgba(0,0,0,0.1); } .plate__serv:hover .plate--bg { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .plate__serv-holder { display: table-cell; vertical-align: middle; position: relative; z-index: 1; } .plate__serv-icon { width: 49.5px; height: 50px; } .plate__serv-icon svg { width: 100%; height: 100%; fill: #fff; } .plate__serv-title { margin-top: 2px; font-size: 19px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: 0.8px; text-align: left; color: #ffffff; text-transform: uppercase; } .plate__hack { background: url("pic/main/akparat.png") no-repeat center center; background-size: cover; /* или contain если нужно целиком */ width: 100%; height: 100%; border-radius: 3px; overflow: hidden; display: table; padding: 10px 5px 10px 20px; position: relative; } .plate__hack-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; } .plate__hack-bg img { width: 100%; height: 100%; object-fit: cover; /* чтобы картинка не искажалась */ } .plate__hack-holder { display: table-cell; vertical-align: middle; position: relative; z-index: 1; /* контент поверх фона */ } .plate__hack-icon { width: 40px; height: 50px; } .plate__hack-icon svg { width: 100%; height: 100%; fill: #4a4a4a; } .plate__hack-title { margin-top: 10px; font-size: 18px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.22; letter-spacing: 0.8px; text-align: left; color: #4a4a4a; text-transform: uppercase; } @media (max-width: 1299px) { .plate__hack-title { font-size: 17px; } } .plate__shop { width: 100%; height: 100%; border-radius: 3px; overflow: hidden; display: block; padding: 10px 20px; position: relative; } .plate__shop:hover .plate--bg { -webkit-transform: scale(1.15); -ms-transform: scale(1.15); transform: scale(1.15); } .plate__shop-holder { position: absolute; bottom: 0; left: 0; width: 100%; padding: 19px 17px; } .plate__shop-icon { width: 40px; height: 34.8px; } .plate__shop-icon svg { width: 100%; height: 100%; display: block; fill: #fff; } .plate__shop-title { margin-top: 10px; font-size: 19px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.16; letter-spacing: 0.8px; text-align: left; color: #ffffff; text-transform: uppercase; } .plate__resq { background-color: #cb1711; width: 100%; height: 100%; border-radius: 3px; overflow: hidden; display: table; padding: 10px 20px 25px; text-align: center; } .plate__resq-holder { display: table-cell; vertical-align: middle; } .plate__resq-num { font-size: 50px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: left; color: #ffffff; display: inline-block; } .plate__resq-title { margin-top: 5px; font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: normal; text-align: center; color: #ffffff; } .plate__resq-icon { display: inline-block; width: 40px; height: 40px; } .plate__resq-icon svg { width: 100%; height: 100%; display: block; fill: #fff; } .plate__currency { width: 100%; height: 100%; border-radius: 3px; overflow: hidden; display: block; padding: 10px 20px; position: relative; } @media (max-width: 990px) { .plate__currency { padding: 10px; } } .plate__currency--lg { text-align: center; padding-top: 73px; display: block; } .plate__currency--lg .plate__currency-holder { display: block; } .plate__currency--lg .plate__currency-title { text-align: center; margin-bottom: 16px; } .plate__currency--lg .plate__currency-title .br { display: inline; } .plate__currency--lg .plate__currency-item { margin-bottom: 15px; margin-top: 0; padding-left: 0; } .plate__currency--lg .plate__currency-item:last-child { margin-bottom: 0; } .plate__currency:hover .plate--bg { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .plate__currency-holder { display: table-cell; vertical-align: middle; position: relative; z-index: 1; } .plate__currency-title { text-transform: uppercase; font-size: 18px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.22; letter-spacing: 0.8px; text-align: left; color: #ffffff; } .plate__currency-item { margin-bottom: 12px; display: block; white-space: nowrap; padding-left: 10px; } .plate__currency-item:last-child { margin-bottom: 0; } .plate__currency-icon { display: inline-block; vertical-align: middle; width: 30px; height: 30px; } .plate__currency-icon svg { fill: #fff; width: 100%; height: 100%; display: block; } .plate__currency-arrow { display: inline-block; vertical-align: middle; width: 20px; height: 20px; padding: 3px 6px; } .plate__currency-arrow svg { width: 100%; height: 100%; display: block; } .plate__currency-txt { display: inline-block; vertical-align: middle; font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; letter-spacing: normal; text-align: left; color: #ffffff; } .plate__poster { position: relative; width: 100%; height: 100%; display: block; } .plate__poster--additional { display: none; } @media (max-width: 1439px) { .plate__poster--additional { display: inline-block; } } @media (max-width: 1219px) { .plate__poster--additional { display: none; } } .plate__poster .back { background-color: #212121; padding: 27px 25px; border-radius: 3px; overflow: hidden; } .plate__poster .front { border-radius: 3px; overflow: hidden; } .plate__poster .front img { width: 100%; height: 100%; display: block; -o-object-fit: cover; object-fit: cover; } .plate__poster-title { font-size: 28px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.11; letter-spacing: normal; text-align: left; color: #ffffff; } .plate__poster-title--en { text-transform: uppercase; margin-top: 6px; line-height: 1; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; letter-spacing: 0.7px; text-align: left; color: #217cff; } .plate__poster-descr { margin-top: 24px; font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.27; letter-spacing: normal; text-align: left; color: #ffffff; } .plate__poster-role { margin-top: 11px; font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: left; color: #217cff; } .plate__poster-duration { margin-top: 16px; font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: left; color: #217cff; } .plate__poster-duration-type { padding-left: 20px; } .plate__poster-reit { margin-top: 12px; } .plate__poster-reit--lg { display: inline-block; font-size: 35px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: left; color: #ff8d00; margin-left: 15px; } .plate__poster-reit--sm { display: inline-block; vertical-align: bottom; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: left; color: #217cff; padding-bottom: 3px; } .plate__poster-star { display: inline-block; } .plate__poster-star svg { width: 17.3px; height: 16.5px; display: block; } .plate__poster-btn { margin-top: 14px; width: 182px; } .plate__poster-sm { position: relative; width: 100%; height: 100%; display: block; overflow: hidden; border-radius: 3px; z-index: 1; } .plate__poster-sm .plate--bg { display: block; position: static; } .plate__poster-sm:hover .plate--bg { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .plate__books { display: block; width: 100%; height: 100%; overflow: hidden; padding: 27px; position: relative; border-radius: 3px; z-index: 1; } @media (max-width: 1439px) { .plate__books { padding: 14px; } } .plate__books:hover .plate--bg { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .plate__books-holder { display: table-cell; vertical-align: middle; z-index: 1; } .plate__books-holder::after { content: ""; display: table; clear: both; } @media (max-width: 1439px) { .plate__books-holder { display: block; } } .plate__books-item { display: table; float: left; width: 100%; } .plate__books-col { display: table-cell; vertical-align: middle; } @media (max-width: 1439px) { .plate__books-col { display: block; } } .plate__books-col:nth-child(1) { vertical-align: bottom; width: 113px; } .plate__books-col:nth-child(2) { width: 144px; height: 220px; } @media (max-width: 1439px) { .plate__books-col:nth-child(2) { width: 72px; height: 110px; position: absolute; left: 0; top: calc(50% + 77px/2); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } } .plate__books-col:nth-child(2) img { display: inline-block; width: 100%; height: 100%; } .plate__books-col:nth-child(3) { padding-left: 15px; } @media (max-width: 1439px) { .plate__books-col:nth-child(3) { padding-left: 92px; position: absolute; left: 0; top: calc(50% + 77px/2); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } } .plate__books-type { text-transform: uppercase; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.29; letter-spacing: 0.7px; text-align: left; color: #ffffff; } .plate__books-title { font-size: 28px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.11; letter-spacing: normal; text-align: left; color: #ffffff; } @media (max-width: 1149px) { .plate__books-title { font-size: 20px; margin-top: 12px; } } .plate__books-author { margin-top: 6px; font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.27; letter-spacing: normal; text-align: left; color: #ffffff; } @media (max-width: 1149px) { .plate__books-author { padding-top: 11px; margin-top: 15px; border-top: 1px solid rgba(255, 255, 255, 0.4); } } .plate__books-icon svg { width: 43px; height: 34px; display: block; fill: #fff; } .plate__books-link { margin-top: 5px; text-transform: uppercase; font-size: 19px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.16; letter-spacing: 0.8px; text-align: left; color: #ffffff; } .plate__books-link span { display: inline-block; vertical-align: middle; padding-right: 5px; } .plate__books-link svg { display: inline-block; vertical-align: middle; width: 10px; height: 20px; fill: #fff; stroke: #fff; } .plate__pressa { width: 100%; height: 100%; position: relative; overflow: hidden; padding: 40px 45px 40px 20px; display: block; border-radius: 3px; z-index: 1; } .plate__pressa:hover .plate--bg { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .plate__pressa-holder { position: relative; z-index: 1; display: table-cell; vertical-align: middle; } .plate__pressa-holder--icon { width: 120px; vertical-align: bottom; } .plate__pressa-icon svg { width: 40px; height: 35px; display: block; fill: #ffffff; } .plate__pressa-link { margin-top: 5px; font-size: 19px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.16; letter-spacing: 0.8px; text-align: left; color: #ffffff; } .plate__pressa-link span { display: inline-block; vertical-align: middle; margin-right: 5px; text-transform: uppercase; } .plate__pressa-link svg { display: inline-block; vertical-align: middle; width: 10px; height: 20px; fill: #fff; } .plate__pressa-type { font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.29; letter-spacing: 0.7px; text-align: left; color: #ffffff; text-transform: uppercase; } .plate__pressa-title { margin-top: 6px; font-size: 28px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.11; letter-spacing: normal; text-align: left; color: #ffffff; } .plate__pressa-descr { margin-top: 5px; font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.27; letter-spacing: normal; text-align: left; color: #ffffff; } .plate__pressa-footer { margin-top: 16px; padding-top: 14px; border-top: 1px solid #fff; font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.27; letter-spacing: normal; text-align: left; color: #ffffff; } .plate__audio { width: 100%; height: 100%; position: relative; overflow: hidden; padding: 0; display: block; border-radius: 3px; z-index: 1; } .plate__audio--dark.plate__audio-icon svg { background-color: transparent; fill: #000000; width: 33px; height: 33px; } .plate__audio--dark .plate__audio-title { font-size: 18px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.22; letter-spacing: 0.8px; text-align: left; color: #ffffff; } .plate__audio:hover .plate--bg { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .plate__audio-holder { position: absolute; bottom: 0; left: 0; width: 100%; height: auto; padding: 23px 23px 40px; } .plate__audio-icon { width: 40px; height: 40px; display: block; } .plate__audio-icon svg { width: 100%; height: 100%; display: block; fill: #ffffff; } .plate__audio-title { margin-top: 5px; font-size: 19px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.16; letter-spacing: 0.8px; text-align: left; color: #ffffff; text-transform: uppercase; } .plate__img { position: relative; width: 100%; height: 100%; display: block; overflow: hidden; border-radius: 3px; z-index: 1; } .plate__img--lg .plate__img-title { padding: 19px 60px 0; bottom: 54px; } .plate__img:hover .plate--bg { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .plate__img-title { text-transform: uppercase; position: absolute; left: 0; bottom: 17px; padding: 19px 19px 0; z-index: 1; font-size: 19px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.16; letter-spacing: 0.8px; text-align: left; color: #ffffff; } .plate__img-icon { display: block; margin-bottom: 5px; width: 51px; height: 70px; } .plate__img-icon svg { display: block; width: 100%; height: 100%; fill: #fff; } .plate__news { border-radius: 15px; /* чуть мягче углы */ background: url("/pic/main/news_stadler.webp") no-repeat center center; background-size: cover; width: 100%; height: 100%; overflow: hidden; position: relative; padding: 38px 28px; /* стеклянный эффект */ background-color: rgba(255, 255, 255, 0.25); /* белая полупрозрачная вуаль */ backdrop-filter: blur(10px); /* размывает фон */ -webkit-backdrop-filter: blur(10px); /* для Safari */ box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); /* лёгкая тень */ } .plate__news-title { display: table; width: 100%; margin-bottom: 21px; } .plate__news-title-item { display: table-cell; } .plate__news-title-item:first-child { text-transform: uppercase; font-size: 18px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.22; letter-spacing: 0.8px; text-align: left; color: #fff; } .plate__news-title-item:last-child { text-align: right; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; color: #fff; } .plate__news-body { height: calc(100% - 30px); margin-right: -30px; } .plate__news-item { display: block; margin-bottom: 17px; } .plate__news-item::after { content: ""; display: table; clear: both; } .plate__news-time { float: left; width: 60px; padding-right: 5px; font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.25; letter-spacing: normal; text-align: left; color: #fff; } .plate__news-txt { float: left; width: calc(100% - 60px); font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.25; letter-spacing: normal; text-align: left; color: #fff; } .plate__news-txt:hover { text-decoration: underline; } .plate__news-mob { display: none; height: 398px; width: 100%; } @media (max-width: 1219px) { .plate__news-mob { display: block; } } .plate__tourist { border-radius: 3px; background-color: #e6e6e6; width: 100%; height: 100%; overflow: hidden; position: relative; padding: 0; display: block; z-index: 1; } .plate__tourist:hover .plate--bg { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .plate__tourist:hover .plate__tourist-btn-icon-arrow { -webkit-animation: arrow 1s linear infinite; animation: arrow 1s linear infinite; } .plate__tourist-holder { position: absolute; bottom: 0; left: 0; width: 100%; padding: 30px 20px; } .plate__tourist-title { text-transform: uppercase; font-size: 19px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.16; letter-spacing: 0.8px; text-align: left; color: #ffffff; } .plate__tourist-txt { margin-top: 3px; font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.27; letter-spacing: normal; text-align: left; color: #ffffff; } .plate__tourist-btn { margin-top: 20px; } .plate__tourist-btn-icon { display: inline-block; vertical-align: middle; width: 20px; height: 20px; border: 1px solid #217cff; border-top: 0; position: relative; } .plate__tourist-btn-icon::before, .plate__tourist-btn-icon::after { content: ''; position: absolute; top: 0; width: 7px; height: 1px; background-color: #217cff; } .plate__tourist-btn-icon::before { left: 0; } .plate__tourist-btn-icon::after { right: 0; } .plate__tourist-btn-icon-arrow { position: absolute; top: -7px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); width: 12px; height: 17px; z-index: 1; } .plate__tourist-btn-icon-arrow svg { width: 100%; height: 100%; fill: #fff; display: block; } .plate__tourist-btn-txt { display: inline-block; vertical-align: middle; padding-left: 3px; font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: left; color: #217cff; } .plate__board-inner { text-align: center; position: relative; z-index: 1; color: #fff; font-family: 'PT Sans Caption'; padding: 36px 0 0 0; } @media (max-width: 1219px) { .plate__board-inner { padding: 0; display: table; height: 100%; color: #00517a; } } @media (max-width: 1219px) { .plate__board-inner-cell { display: table-cell; height: 100%; vertical-align: middle; } } .plate__board-year { display: block; font-size: 25.2px; } @media (max-width: 1219px) { .plate__board-year { font-size: 16.8px; } } .plate__board-subtitle { display: block; font-size: 21.6px; } @media (max-width: 1219px) { .plate__board-subtitle { font-size: 14.4px; } } .plate__board-title { display: block; font-size: 59.4px; line-height: 1; text-transform: uppercase; } @media (max-width: 1219px) { .plate__board-title { font-size: 39.6px; } } .plate__audiogid { background: #ffc400 url("/pic/main/audiogid_stadler.webp") no-repeat center center; background-size: cover; /* или contain, если нужно вписать */ width: 100%; height: 100%; border-radius: 3px; overflow: hidden; display: table; padding: 10px 20px; } .plate__audiogid-holder { display: table-cell; vertical-align: middle; } .plate__audiogid-icon { width: 55px; height: 47px; margin: 0 auto; } .plate__audiogid-icon svg { fill: #ffffff; width: 100%; height: 100%; } .plate__audiogid-title { margin-top: 10px; font-size: 18px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.22; letter-spacing: 0.8px; text-align: left; color: #ffffff; text-transform: uppercase; text-align: center; } @media (max-width: 1219px) { .rsp-t-top { margin-top: -3px; } .rsp-t-top::after { content: ""; display: table; clear: both; } .rsp-t-top .plate__item { float: right; width: 50%; } .rsp-t-top .plate__item:first-child { padding-left: 3px; } .rsp-t-top .plate__item:last-child { padding-right: 3px; } .rsp-t-top .plate__item .plate__item { width: 100%; float: none; padding: 0 !important; } .rsp-t-top .plate__item--x3 { height: 147px; } } .rsp-t-top__sr { margin-bottom: 6px; } @media (max-width: 990px) { .rsp-t-top__sr { width: 50%; float: left; } } .rsp-t-top__sr:last-child { margin-bottom: 0; } @media (max-width: 990px) { .rsp-t-top__sr:last-child { padding-left: 3px; } } @media (max-width: 990px) { .rsp-t-top__sr:first-child { padding-right: 3px; } } @media (max-width: 1439px) { .rsp-t-bot__collapse::after { content: ""; display: table; clear: both; } .rsp-t-bot__collapse .plate__item { width: 33.333333%; float: left; } .rsp-t-bot__collapse .plate__item:first-child { padding-right: 3px; } .rsp-t-bot__collapse .plate__item:last-child { padding-left: 3px; } } @media (max-width: 1299px) { .rsp-t-bot__collapse .plate__item { width: 50%; } } @media (max-width: 1299px) { .rsp-t-bot__collapse--left { width: 60%; } .rsp-t-bot__collapse--left .plate__item { width: 33.3333333%; } } @media (max-width: 1099px) { .rsp-t-bot__collapse--left { width: 50%; } .rsp-t-bot__collapse--left .plate__item { width: 50%; } } @media (max-width: 899px) { .rsp-t-bot__collapse--left { width: 66.666666%; } } @media (max-width: 1299px) { .rsp-t-bot__collapse--right { width: 40%; } } @media (max-width: 1099px) { .rsp-t-bot__collapse--right { width: 50%; } } @media (max-width: 899px) { .rsp-t-bot__collapse--right { width: 33.333333%; } .rsp-t-bot__collapse--right .plate__item { width: 100%; } .rsp-t-bot__collapse--right .plate__item:first-child { display: none; } } .rsp-t-bot__stub { display: none; padding: 0 3px; } @media (max-width: 1439px) { .rsp-t-bot__stub { display: block; } } @media (max-width: 1299px) { .rsp-t-bot__stub { display: none; } } @media (max-width: 1299px) { .rsp-t-bot__stub--show-5th { display: block; } } @media (max-width: 1099px) { .rsp-t-bot__stub--show-5th { display: none; } } @media (max-width: 1439px) { .rsp-t-bot__fix-mt { margin-top: -3px; } } @media (max-width: 1439px) { .rsp-t-bot__audio .plate__item { height: 147px; } } @media (max-width: 1219px) { .rsp-r-top__collapse { width: 50%; float: left; clear: none; margin: 0; } .rsp-r-top__collapse:first-child .plate__col:first-child { padding-left: 0; } .rsp-r-top__collapse:last-child .plate__col:last-child { padding-right: 0; } } @media (max-width: 990px) { .rsp-r-top__float::after { content: ""; display: table; clear: both; } .rsp-r-top__float .plate__item { float: left; width: 50%; } .rsp-r-top__float .plate__item:first-child { padding-right: 3px; } .rsp-r-top__float .plate__item:last-child { padding-left: 3px; } } @-webkit-keyframes arrow { 0% { top: -17px; opacity: 0; } 10% { opacity: 1; top: -15px; } 90% { opacity: 1; top: 0; } 100% { opacity: 0; top: 2px; } } @keyframes arrow { 0% { top: -17px; opacity: 0; } 10% { opacity: 1; top: -15px; } 90% { opacity: 1; top: 0; } 100% { opacity: 0; top: 2px; } } .weather { width: 100%; height: 100%; } .weather__item { background-size: cover; background-repeat: no-repeat; background-position: 50% 50%; border-radius: 3px; overflow: hidden; width: 100%; height: 100%; padding: 15px 17px; } .weather__title { width: 100%; height: auto !important; } .weather__title-icon { display: inline-block; vertical-align: middle; width: 21px; height: 27px; position: relative; bottom: -3px; } .weather__title-icon svg { display: block; width: 100%; height: 100%; fill: #fff; } .weather__title-txt { margin-left: 4px; width: calc(100% - 30px); display: inline-block; vertical-align: middle; font-size: 18px; font-weight: bold; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: left; color: #ffffff; position: relative; } .weather__title-txt::before { content: ''; width: 100%; height: 1px; background-color: #fff; position: absolute; bottom: -8px; left: 0; } .weather__temperature { padding-left: 10px; margin-top: 19px; height: auto !important; font-size: 60px; font-weight: bold; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; color: #ffffff; text-align: center; } .weather__temperature-deg { font-weight: 300; } .weather__date { text-align: center; margin-top: 0; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; color: #ffffff; height: auto !important; } .weather__icon { text-align: center; height: auto !important; margin-top: 14px; } .weather__icon svg, .weather__icon img { width: 62px; height: 62px; display: inline-block; fill: #fff; } .weather__other { text-align: center; margin-top: 1px; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; color: #ffffff; height: auto !important; } .weather__other span { display: inline-block; vertical-align: bottom; } .weather__other-icon { height: 6px; width: 6px; margin-left: 8px; margin-right: 3px; position: relative; display: inline-block; bottom: 5px; border-right: 1px solid #fff; border-bottom: 1px solid #fff; } .weather__other-icon::before { content: ''; width: 8px; height: 1px; background-color: #fff; position: absolute; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); top: 2px; left: -2px; } .weather__other-icon--s { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .weather__other-icon--sw { -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); } .weather__other-icon--w { -webkit-transform: rotate(135deg); -ms-transform: rotate(135deg); transform: rotate(135deg); } .weather__other-icon--e { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .weather__other-icon--ne { -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); } .weather__other-icon--n { -webkit-transform: rotate(-135deg); -ms-transform: rotate(-135deg); transform: rotate(-135deg); } .weather__other-icon--nw { -webkit-transform: rotate(-180deg); -ms-transform: rotate(-180deg); transform: rotate(-180deg); } .weather .slick-list, .weather .slick-track { height: 100%; } .weather .slick-slide { height: 100%; } .weather .slick-slide > div { height: 100%; } .popup { display: none; padding: 0; background-color: transparent; width: 790px; max-width: 100%; overflow: visible !important; } .popup__close { position: absolute; bottom: 10px; right: 11px; width: 30px; height: 30px; background-color: transparent; cursor: pointer; } .popup__close:hover::before, .popup__close:hover::after { background-color: #8ba0ff; } .popup__close::before, .popup__close::after { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; content: ''; width: 42px; height: 1px; background-color: #ffcc01; position: absolute; left: -6px; top: 14px; } .popup__close::before { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .popup__close::after { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .popup__title { position: relative; padding: 0 50px 20px 10px; } .popup__title-sup { font-size: 36px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: 0; color: #ffffff; text-transform: uppercase; margin-left: -2px; font-family: 'PT Sans Caption'; } .popup__title-sub { margin-top: 10px; font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.27; letter-spacing: normal; color: #ffffff; font-family: 'PT Sans'; max-width: 500px; } .popup__body { height: auto; border-radius: 8px; background-color: #ffffff; padding: 10px 30px 19px; } .popup__form { display: block; } .popup__form-row { display: block; width: 100%; } .popup__form-row::after { content: ""; display: table; clear: both; } .popup__form-row .input, .popup__form-row .textarea, .popup__form-row .custom-select .jq-selectbox__select { border-top: 0 !important; } .popup__form-item { width: 50%; float: left; position: relative; } .popup__form-item:first-child::before { content: ''; height: 33px; width: 1px; background: #979797; position: absolute; right: 0; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .popup__form-item:first-child .jq-selectbox__trigger::after, .popup__form-item:first-child .jq-selectbox__trigger::before { right: 17px; } .popup__form-item:last-child .jq-selectbox__select { padding-left: 23px; } .popup__form-item:last-child .input { padding-left: 23px; } .popup__form-btn { margin: 18px auto 0; width: 180px; } .popup__txt .popup__title { text-align: center; margin-top: 35px; padding: 0 10px 20px; } .popup__txt .popup__title-sub { padding: 0; margin-left: auto; margin-right: auto; } .popup__txt .popup__close { margin: 0 auto; position: relative; top: auto; left: auto; bottom: auto; right: auto; } .popup__txt-links { text-align: center; margin-top: 46px; word-spacing: -0.36em; } .popup__txt-links li { word-spacing: normal; display: inline-block; padding: 0 12px; position: relative; } .popup__txt-links li::before { content: ''; height: 15px; width: 1px; background-color: #989898; position: absolute; right: 0; top: 6px; } .popup__txt-links li:last-child::before { display: none; } .popup__txt-links li a { font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: normal; text-align: left; color: #ffcc01; border-bottom: 1px solid #ffcc01; } .popup__txt-links li a:hover { border-bottom-color: rgba(255, 255, 255, 0); } .popup__scroll { margin: 10px 0 0 0; height: 558px; overflow: hidden; color: #fff; font-size: 15px; line-height: 1.27; font-family: 'PT Sans'; } .popup__scroll .mCSB_inside > .mCSB_container { margin-right: 0; margin-left: 105px; } .popup__scroll .mCSB_scrollTools { right: auto; left: 59px; width: 10px; opacity: 1; } .popup__scroll .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { width: 10px; border-radius: 0; background: #fff; } .popup__scroll .mCSB_scrollTools .mCSB_draggerRail { opacity: 0; } .popup__offert-btm { padding: 13px 180px 0 105px; } .popup__offert-btm::after { content: ""; display: table; clear: both; } .popup__offert-checkbox { float: left; width: 100%; padding: 10px 10px 0 0; } .popup__offert-btn { float: right; width: 180px; margin: -180px; } .fancybox-bg { background-color: #006699; } .fancybox-close-small { display: none; } .fancybox-is-open .fancybox-bg { opacity: .9; } #preloader { position: fixed; margin: 0 auto; top: 0; bottom: 0; right: 0; left: 0; background: #fff; z-index: 9999; } #preloader .preloader-wrapper { position: absolute; margin: auto; top: 0; bottom: 0; right: 0; left: 0; } body.overflow-hidden { overflow: hidden; } body.overflow-hidden .compensate-for-preloader { margin-right: 17px; } @include b(tablet) { margin: 0; } /* @license Copyright (c) 2014 The Polymer Project Authors. All rights reserved. This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt Code distributed by Google as part of the polymer project is also subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt */ /**************************/ /* STYLES FOR THE SPINNER */ /**************************/ /* * Constants: * STROKEWIDTH = 3px * ARCSIZE = 270 degrees (amount of circle the arc takes up) * ARCTIME = 1333ms (time it takes to expand and contract arc) * ARCSTARTROT = 216 degrees (how much the start location of the arc * should rotate each time, 216 gives us a * 5 pointed star shape (it's 360/5 * 3). * For a 7 pointed star, we might do * 360/7 * 3 = 154.286) * CONTAINERWIDTH = 28px * SHRINK_TIME = 400ms */ .preloader-wrapper.small { width: 36px; height: 36px; } .preloader-wrapper.big { width: 64px; height: 64px; } .preloader-wrapper.active { /* duration: 360 * ARCTIME / (ARCSTARTROT + (360-ARCSIZE)) */ -webkit-animation: container-rotate 1568ms linear infinite; animation: container-rotate 1568ms linear infinite; } @-webkit-keyframes container-rotate { to { -webkit-transform: rotate(360deg); } } @keyframes container-rotate { to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } .spinner-layer { position: absolute; width: 100%; height: 100%; opacity: 0; border-color: blue; } .spinner-blue, .spinner-blue-only { border-color: #4285f4; } .spinner-red, .spinner-red-only { border-color: #db4437; } .spinner-yellow, .spinner-yellow-only { border-color: #f4b400; } .spinner-green, .spinner-green-only { border-color: #0f9d58; } /** * IMPORTANT NOTE ABOUT CSS ANIMATION PROPERTIES (keanulee): * * iOS Safari (tested on iOS 8.1) does not handle animation-delay very well - it doesn't * guarantee that the animation will start _exactly_ after that value. So we avoid using * animation-delay and instead set custom keyframes for each color (as redundant as it * seems). * * We write out each animation in full (instead of separating animation-name, * animation-duration, etc.) because under the polyfill, Safari does not recognize those * specific properties properly, treats them as -webkit-animation, and overrides the * other animation rules. See https://github.com/Polymer/platform/issues/53. */ .active .spinner-layer.spinner-blue { /* durations: 4 * ARCTIME */ -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, blue-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, blue-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; } .active .spinner-layer.spinner-red { /* durations: 4 * ARCTIME */ -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, red-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, red-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; } .active .spinner-layer.spinner-yellow { /* durations: 4 * ARCTIME */ -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, yellow-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, yellow-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; } .active .spinner-layer.spinner-green { /* durations: 4 * ARCTIME */ -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, green-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both, green-fade-in-out 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; } .active .spinner-layer, .active .spinner-layer.spinner-blue-only, .active .spinner-layer.spinner-red-only, .active .spinner-layer.spinner-yellow-only, .active .spinner-layer.spinner-green-only { /* durations: 4 * ARCTIME */ opacity: 1; -webkit-animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; animation: fill-unfill-rotate 5332ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; } @-webkit-keyframes fill-unfill-rotate { 12.5% { -webkit-transform: rotate(135deg); } /* 0.5 * ARCSIZE */ 25% { -webkit-transform: rotate(270deg); } /* 1 * ARCSIZE */ 37.5% { -webkit-transform: rotate(405deg); } /* 1.5 * ARCSIZE */ 50% { -webkit-transform: rotate(540deg); } /* 2 * ARCSIZE */ 62.5% { -webkit-transform: rotate(675deg); } /* 2.5 * ARCSIZE */ 75% { -webkit-transform: rotate(810deg); } /* 3 * ARCSIZE */ 87.5% { -webkit-transform: rotate(945deg); } /* 3.5 * ARCSIZE */ to { -webkit-transform: rotate(1080deg); } /* 4 * ARCSIZE */ } @keyframes fill-unfill-rotate { 12.5% { -webkit-transform: rotate(135deg); transform: rotate(135deg); } /* 0.5 * ARCSIZE */ 25% { -webkit-transform: rotate(270deg); transform: rotate(270deg); } /* 1 * ARCSIZE */ 37.5% { -webkit-transform: rotate(405deg); transform: rotate(405deg); } /* 1.5 * ARCSIZE */ 50% { -webkit-transform: rotate(540deg); transform: rotate(540deg); } /* 2 * ARCSIZE */ 62.5% { -webkit-transform: rotate(675deg); transform: rotate(675deg); } /* 2.5 * ARCSIZE */ 75% { -webkit-transform: rotate(810deg); transform: rotate(810deg); } /* 3 * ARCSIZE */ 87.5% { -webkit-transform: rotate(945deg); transform: rotate(945deg); } /* 3.5 * ARCSIZE */ to { -webkit-transform: rotate(1080deg); transform: rotate(1080deg); } /* 4 * ARCSIZE */ } @-webkit-keyframes blue-fade-in-out { from { opacity: 1; } 25% { opacity: 1; } 26% { opacity: 0; } 89% { opacity: 0; } 90% { opacity: 1; } 100% { opacity: 1; } } @keyframes blue-fade-in-out { from { opacity: 1; } 25% { opacity: 1; } 26% { opacity: 0; } 89% { opacity: 0; } 90% { opacity: 1; } 100% { opacity: 1; } } @-webkit-keyframes red-fade-in-out { from { opacity: 0; } 15% { opacity: 0; } 25% { opacity: 1; } 50% { opacity: 1; } 51% { opacity: 0; } } @keyframes red-fade-in-out { from { opacity: 0; } 15% { opacity: 0; } 25% { opacity: 1; } 50% { opacity: 1; } 51% { opacity: 0; } } @-webkit-keyframes yellow-fade-in-out { from { opacity: 0; } 40% { opacity: 0; } 50% { opacity: 1; } 75% { opacity: 1; } 76% { opacity: 0; } } @keyframes yellow-fade-in-out { from { opacity: 0; } 40% { opacity: 0; } 50% { opacity: 1; } 75% { opacity: 1; } 76% { opacity: 0; } } @-webkit-keyframes green-fade-in-out { from { opacity: 0; } 65% { opacity: 0; } 75% { opacity: 1; } 90% { opacity: 1; } 100% { opacity: 0; } } @keyframes green-fade-in-out { from { opacity: 0; } 65% { opacity: 0; } 75% { opacity: 1; } 90% { opacity: 1; } 100% { opacity: 0; } } /** * Patch the gap that appear between the two adjacent div.circle-clipper while the * spinner is rotating (appears on Chrome 38, Safari 7.1, and IE 11). */ .gap-patch { position: absolute; top: 0; left: 45%; width: 10%; height: 100%; overflow: hidden; border-color: inherit; } .gap-patch .circle { width: 1000%; left: -450%; } .circle-clipper { display: inline-block; position: relative; width: 50%; height: 100%; overflow: hidden; border-color: inherit; } .circle-clipper .circle { width: 200%; height: 100%; border-width: 3px; /* STROKEWIDTH */ border-style: solid; border-color: inherit; border-bottom-color: transparent !important; border-radius: 50%; -webkit-animation: none; animation: none; position: absolute; top: 0; right: 0; bottom: 0; } .circle-clipper.left .circle { left: 0; border-right-color: transparent !important; -webkit-transform: rotate(129deg); -ms-transform: rotate(129deg); transform: rotate(129deg); } .circle-clipper.right .circle { left: -100%; border-left-color: transparent !important; -webkit-transform: rotate(-129deg); -ms-transform: rotate(-129deg); transform: rotate(-129deg); } .active .circle-clipper.left .circle { /* duration: ARCTIME */ -webkit-animation: left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; animation: left-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; } .active .circle-clipper.right .circle { /* duration: ARCTIME */ -webkit-animation: right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; animation: right-spin 1333ms cubic-bezier(0.4, 0, 0.2, 1) infinite both; } @-webkit-keyframes left-spin { from { -webkit-transform: rotate(130deg); } 50% { -webkit-transform: rotate(-5deg); } to { -webkit-transform: rotate(130deg); } } @keyframes left-spin { from { -webkit-transform: rotate(130deg); transform: rotate(130deg); } 50% { -webkit-transform: rotate(-5deg); transform: rotate(-5deg); } to { -webkit-transform: rotate(130deg); transform: rotate(130deg); } } @-webkit-keyframes right-spin { from { -webkit-transform: rotate(-130deg); } 50% { -webkit-transform: rotate(5deg); } to { -webkit-transform: rotate(-130deg); } } @keyframes right-spin { from { -webkit-transform: rotate(-130deg); transform: rotate(-130deg); } 50% { -webkit-transform: rotate(5deg); transform: rotate(5deg); } to { -webkit-transform: rotate(-130deg); transform: rotate(-130deg); } } #spinnerContainer.cooldown { /* duration: SHRINK_TIME */ -webkit-animation: container-rotate 1568ms linear infinite, fade-out 400ms cubic-bezier(0.4, 0, 0.2, 1); animation: container-rotate 1568ms linear infinite, fade-out 400ms cubic-bezier(0.4, 0, 0.2, 1); } @-webkit-keyframes fade-out { from { opacity: 1; } to { opacity: 0; } } @keyframes fade-out { from { opacity: 1; } to { opacity: 0; } } .pressa-article { padding: 13px 0 63px; } .pressa-article__head { height: 647px; background-size: cover; background-position: center; margin-bottom: 41px; } @media (max-width: 990px) { .pressa-article__head { height: 452px; } } .pressa-article__overlay { background-color: rgba(0, 0, 0, 0.5); display: table; width: 100%; height: 100%; } .pressa-article__inner { display: table-cell; vertical-align: middle; text-align: center; } .pressa-article__breadcrumbs { margin-bottom: 7px; } .pressa-article__breadcrumbs-item { display: inline-block; } .pressa-article__breadcrumbs-link { color: #fff; font-size: 14px; line-height: 1.43; border-bottom: 1px solid #fff; } .pressa-article__breadcrumbs-link:hover { border-bottom: 1px solid #0299e2; color: #0299e2; } .pressa-article__breadcrumbs-arrow svg { -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); fill: #fff; width: 23px; height: 13px; } .pressa-article__caption { text-transform: uppercase; letter-spacing: 2.5px; color: #fff; font-weight: normal; } .pressa-article__content-image { padding: 19px 0 12px; } .pressa-article__content-bg { height: 780px; background-size: cover; background-position: center; border-radius: 3px; margin: 39px 0 41px; } @media (max-width: 990px) { .pressa-article__content-bg { height: 552px; } } @media (max-width: 990px) { .pressa-article { padding: 13px 0 30px; } } .pressa { padding: 12px 0 0; } .pressa--top { padding-bottom: 52px; } @media (max-width: 990px) { .pressa--top { padding-bottom: 30px; } } .pressa__head { padding: 6px 0 23px; } .pressa__head--top { padding: 0px 0 32px; margin-top: -3px; } .pressa__search { max-width: 584px; width: 100%; padding: 0 9px; float: right; margin-top: -9px; } @media (max-width: 990px) { .pressa__search { max-width: 400px; } } .pressa__search .search__input { padding: 0 22px 0 2px; } .pressa__search .search__icon { bottom: 6px; } .restaurant { padding: 6px 0 85px 0; } .restaurant__plate { padding: 9px 0 15px 0; } .restaurant__plate--filter { padding-top: 0; } .restaurant__tmp { display: none; } @media (max-width: 1219px) { .restaurant__tmp { display: inline-block; } } @media (max-width: 1099px) { .restaurant__tmp { display: none; } } .restaurant__tmp-mds { display: none; } @media (max-width: 1099px) { .restaurant__tmp-mds { display: inline-block; } } .restaurant .plate__item { position: relative; z-index: 1; } .restaurant .plate__item + .plate__item { z-index: 0; } .restaurant .plate__col { position: relative; z-index: 1; } .restaurant .plate__col:hover ~ .plate__col { z-index: 0; } .restaurant-item { height: 100%; width: 100%; border-radius: 15px; position: relative; cursor: pointer; overflow: hidden; } .restaurant-item--lg .restaurant-item__title { font-size: 24px; line-height: 1; max-height: 72px; overflow: hidden; } .restaurant-item--lg .restaurant-item__body { padding: 25px 18px 21px; } .restaurant-item--lg .restaurant-item__drop-txt { max-height: 60px; overflow: hidden; } .restaurant-item--lg .restaurant-item__cost { margin-top: 17px; } .restaurant-item--lg .restaurant-item__cost-price { font-size: 20px; } .restaurant-item--lg .restaurant-item__cost-order span { font-size: 19px; margin-left: 8px; } .restaurant-item--lg .restaurant-item__cost-order svg { width: 34px; height: 30px; } .restaurant-item:hover .restaurant-item__body { background-color: #0c81bb; background-image: none; border-radius: 0; -webkit-transform: translate(0, 100%); -ms-transform: translate(0, 100%); transform: translate(0, 100%); } .restaurant-item:hover .restaurant-item__drop { top: 100%; opacity: 1; visibility: visible; } .restaurant-item:hover .restaurant-item__title { color: #fff; } .restaurant-item:hover .restaurant-item__img { border-radius: 3px 3px 0 0; } .restaurant-item:hover .restaurant-item__cost-price { color: #fff; } .restaurant-item:hover .restaurant-item__cost-order svg { fill: #fff; } .restaurant-item:hover .restaurant-item__cost-order span { color: #fff; } .restaurant-item__drop { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; position: absolute; z-index: 0; top: 5px; left: 0; width: 100%; background-color: #0c81bb; padding: 9px 15px 30px; opacity: 0; visibility: hidden; } .restaurant-item__drop-spacer { padding: 0 10px; } .restaurant-item__drop-txt { font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 20px; letter-spacing: normal; text-align: left; color: #ffffff; margin-bottom: 10px; } .restaurant-item__drop-txt:last-child { margin-bottom: 0; } .restaurant-item__img { position: relative; top: 0; right: 0; width: 100%; height: 100%; z-index: 1; border-radius: 3px; overflow: hidden; } .restaurant-item__img img { display: block; width: 100%; height: 100%; border-radius: 6px; -o-object-fit: cover; object-fit: cover; } /* Контейнер бейджа */ .ai-badge.tooltip { position: absolute; top: 8px; right: 8px; width: 28px; height: 28px; background-color: white; color: #FF6A00; font-weight: bold; font-size: 13px; border-radius: 50%; display: flex; align-items: center; justify-content: center; box-shadow: 0 0 6px rgba(255, 102, 0, 0.5); cursor: default; z-index: 20; } /* Подсказка */ .tooltip .tooltip-text { visibility: hidden; opacity: 0; width: max-content; max-width: 200px; background-color: rgba(0, 0, 0, 0.85); color: #fff; text-align: center; padding: 6px 10px; border-radius: 4px; position: absolute; top: 32px; /* Чуть ниже значка */ right: 0; transform: translateX(0); transition: opacity 0.3s; font-size: 12px; z-index: 999; white-space: normal; pointer-events: none; } /* Стрелочка */ .tooltip .tooltip-text::after { content: ""; position: absolute; top: -5px; left: 50%; transform: translateX(-50%); border-width: 5px; border-style: solid; border-color: transparent transparent rgba(0, 0, 0, 0.85) transparent; } /* Показываем при наведении */ .tooltip:hover .tooltip-text { visibility: visible; opacity: 1; } .restaurant-item__body { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; position: absolute; z-index: 2; bottom: 0; left: 0; width: 100%; padding: 20px 15px 9px; background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.7)), color-stop(90%, rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0))); background-image: linear-gradient(to top, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0.2) 90%, rgba(0, 0, 0, 0) 100%); border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; } @media (max-width: 839px) { .restaurant-item__body { padding: 20px 10px 9px; } } .restaurant-item__title { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; text-transform: uppercase; font-size: 19px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.16; letter-spacing: 0.8px; text-align: left; color: #ffffff; } @media (max-width: 991px) { .restaurant-item__title { font-size: 16px; } } .restaurant-item__cost { margin-top: 11px; } .restaurant-item__cost::after { content: ""; display: table; clear: both; } .restaurant-item__cost-price { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; float: left; font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.27; letter-spacing: normal; text-align: left; color: #ffffff; } .restaurant-item__cost-order { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; float: right; display: block; position: relative; top: -5px; } @media (max-width: 990px) { .restaurant-item__cost-order { padding-right: 10px; } } .restaurant-item__cost-order:hover span { border-bottom-color: #fff; } .restaurant-item__cost-order svg { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; display: inline-block; vertical-align: middle; width: 23px; height: 20px; fill: #fff; stroke: #fff; } .restaurant-item__cost-order span { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; display: inline-block; vertical-align: middle; margin-left: 4px; text-transform: uppercase; font-size: 12px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: 0.6px; color: #ffffff; border-bottom: 1px solid transparent; } .restaurant-item__cost-order span.restaurant-item__cost-order-count { display: none; } .restaurant-item__cost-order-count { font-size: 15px; line-height: 18px; color: #fff; letter-spacing: .8px; padding: 3px; border-radius: 3px; background: #ffcc01; margin-left: 5px; min-width: 24px; text-align: center; } .restaurant-item__cost-order.in-cart svg { display: none; } .restaurant-item__cost-order.in-cart .restaurant-item__cost-order-count { display: inline-block; } .goods { border-radius: 3px; border: solid 1px #e6e6e6; } .goods .restaurant-item__img { background-color: #fff; height: 210px; border-bottom-left-radius: 0; border-bottom-right-radius: 0; text-align: center; padding: 5px; } .goods .restaurant-item__img-holder { width: 100%; height: 100%; position: relative; } .goods .restaurant-item__img img { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); max-height: 100%; max-width: 100%; width: auto; height: auto; vertical-align: top; display: inline-block; } .goods .restaurant-item__body { background-color: #fff; background-image: none; } .goods .restaurant-item__title { color: #4a4a4a; } .goods .restaurant-item__cost-price { color: #217cff; } .goods .restaurant-item__cost-order svg { fill: #003356; } .goods .restaurant-item__cost-order span { color: #003356; } .schedule { height: 100%; background: url(/pic/main/schedule_stadler.webp) no-repeat center center; background-size: cover; border-radius: 3px; overflow: hidden; position: relative; } .schedule__title { text-transform: uppercase; background-color: #6c6c6c; padding: 16px 10px; text-align: center; font-size: 19px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 30px; letter-spacing: 0.8px; color: #ffffff; } @media (max-width: 990px) { .schedule__title { font-size: 16px; } } .schedule__scroll { overflow: hidden; height: calc(100% - 75px); max-height: 375px; margin: 0 -47px 0 -54px; } .schedule__scroll--nm { margin: 0; height: calc(100% - 26px); max-height: 311px; } @media (max-width: 1417px) { .schedule__scroll--nm { max-height: 290px; } } @media (max-width: 1119px) { .schedule__scroll--nm { max-height: 310px; } } .schedule__scroll--nm .mCSB_container { padding-left: 0 !important; padding-right: 0 !important; margin-right: 0; } .schedule__scroll .mCSB_container { padding-left: 54px; padding-right: 17px; } .schedule__body--dir { padding: 34px 47px 60px 54px; position: relative; height: calc(100% - 62px); overflow: hidden; } .schedule__body--dir td:nth-child(1) { width: 50%; } .schedule__body--dir td:nth-child(2) { width: 25%; } .schedule__body--dir td:nth-child(3) { width: 25%; } .schedule__body--schedule { padding: 22px 38px 29px 38px; position: relative; height: calc(100% - 62px); overflow: hidden; } .schedule__body--schedule .schedule__dir-head td::before { background-color: #6c6c6c; } .schedule__body--schedule .schedule__dir-head td:first-child { color: #9a9a9a; } .schedule__body--schedule .schedule--long td:nth-child(1) { width: 5%; text-align: center; } .schedule__body--schedule .schedule--long td:nth-child(2) { width: 25%; padding-left: 15px; } .schedule__body--schedule .schedule--long td:nth-child(3) { width: 25%; } .schedule__body--schedule .schedule--long td:nth-child(4) { width: 15%; } .schedule__body--schedule .schedule--long td:nth-child(5) { width: 20%; padding-left: 10px; } .schedule__body--schedule .schedule--long td:nth-child(6) { width: 10%; } .schedule__body--schedule .schedule--short td:nth-child(1) { width: 10%; text-align: center; } .schedule__body--schedule .schedule--short td:nth-child(2) { width: 40%; padding-left: 15px; } .schedule__body--schedule .schedule--short td:nth-child(3) { width: 20%; } .schedule__body--schedule .schedule--short td:nth-child(4) { width: 20%; padding-left: 10px; } .schedule__body--schedule .schedule--short td:nth-child(5) { width: 10%; } .schedule__ctrl { padding: 0 13px 18px; position: absolute; bottom: 0; right: 0; width: 100%; } .schedule__ctrl--dir { padding-left: 30px; padding-right: 39px; } .schedule__ctrl--schedule { padding-left: 30px; padding-right: 38px; } .schedule__ctrl--schedule .schedule__ctrl-btn { float: left; } .schedule__ctrl-btn { display: inline-block; vertical-align: top; width: 182px; float: right; } @media (max-width: 990px) { .schedule__ctrl-btn { width: 170px; } } .schedule__ctrl-map { display: inline-block; vertical-align: top; } .schedule__ctrl-map:hover span { text-decoration: none; } .schedule__ctrl-map svg { display: inline-block; vertical-align: top; width: 15.4px; height: 20.2px; fill: #e6e6e6; } .schedule__ctrl-map span { margin-left: 5px; display: inline-block; vertical-align: top; text-decoration: underline; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: center; color: #e6e6e6; } .schedule__ctrl-arrows { float: right; padding: 0 28px; position: relative; text-align: center; font-size: 14px; line-height: 20px; color: #cc9902; margin: 5px 0 0; } .schedule__ctrl-arrows-btn { position: absolute; top: 0; left: 0; } .schedule__ctrl-arrows-btn svg { width: 12px; height: 20px; fill: #cc9902; } .schedule__ctrl-arrows-btn:nth-child(2) { left: auto; right: 0; } .schedule__ctrl-arrows-btn:hover svg { fill: #ffc400; } .schedule__dir { width: 100%; border-collapse: collapse; margin-right: 17px; } .schedule__dir-head { width: 100%; } .schedule__dir-head td { text-align: left; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.21; letter-spacing: normal; padding-bottom: 29px; color: #6c6c6c; position: relative; } .schedule__dir-head td::before { content: ''; width: 100%; height: 1px; background-color: #e6e6e6; position: absolute; left: 0; bottom: 13px; } .schedule__dir td { font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: left; color: #6c6c6c; padding-bottom: 13px; } .schedule__dir td a { font-size: 14px; color: #6c6c6c; border-bottom: 1px solid transparent; } .schedule__dir td a:hover { border-bottom-color: #cc9902; } .schedule__dir td:first-child { position: relative; } .schedule__dir td:first-child::before { content: ''; width: 15px; height: 15px; border: solid 1px #cc9902; position: absolute; left: -37px; top: 3px; border-radius: 50%; z-index: 10; background-color: #e6e6e6; } .schedule__dir td:first-child::after { content: ''; width: 1px; height: 100%; background-color: #cc9902; position: absolute; left: -30px; top: 15px; z-index: 5; } .schedule__dir tr:last-child td:first-child::after { display: none; } .schedule__dir tr.past td:first-child::before { background-color: #6c6c6c; border-color: #6c6c6c; } .schedule__dir tr.past td:first-child::after { background-color: #6c6c6c; } .schedule__dir tr.current td:first-child::before { background-color: #cc9902; } .schedule__dir tr.next td:first-child::before { -webkit-animation: blinker 1.5s linear infinite; animation: blinker 1.5s linear infinite; } .schedule__sh { width: 100%; border-collapse: collapse; } .schedule__sh-head td { padding-bottom: 35px; } .schedule__sh-head td::before { bottom: 19px; } .schedule__sh td { font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: left; color: #ffffff; padding-bottom: 13px; } .schedule__sh tr.hidden { display: none; } .schedule__sub-content { display: none; } .schedule__sub-content.active { display: block; } .schedule__caption { padding: 5px 0; } .schedule__caption::after { content: ""; display: table; clear: both; } .schedule__caption li { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; cursor: pointer; width: 47%; float: left; opacity: 0.4; line-height: 30px; position: relative; text-align: right; padding: 0 22px; } @media (max-width: 991px) { .schedule__caption li { width: 47.5%; } } .schedule__caption li:first-child { text-align: left; width: 53%; } @media (max-width: 991px) { .schedule__caption li:first-child { width: 52.5%; } } .schedule__caption li:first-child::before { content: ''; height: 100%; width: 1px; background-color: rgba(255, 255, 255, 0.58); position: absolute; right: 0; top: 0; } .schedule__caption li.active, .schedule__caption li:hover { opacity: 1; } .schedule__filter { padding-bottom: 19px; } .schedule__filter::after { content: ""; display: table; clear: both; } .schedule__filter-item { width: 50%; float: left; } .schedule__filter-caption { display: block; } .schedule__filter-caption::after { content: ""; display: table; clear: both; } .schedule__filter-caption li { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; border-radius: 3px; display: inline-block; padding: 5px 12px 6px; cursor: pointer; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: left; color: #fff; } .schedule__filter-caption li:hover span { border-bottom-color: transparent; } .schedule__filter-caption li.active { background-color: #fff; color: #4a4a4a; } .schedule__filter-caption li:first-child { margin-right: 12px; } .schedule__filter-caption li span { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; border-bottom: 1px solid #fff; } .schedule__filter-search { background-color: transparent; padding: 0; height: 36px; border: 0; border-bottom: 1px solid #9a9a9a; color: #fff; font-size: 14px; position: relative; top: -8px; } .schedule__slider { height: calc(100% - 62px); } .schedule__slider .slick-list { height: 100%; } .schedule__slider .slick-track { height: 100%; } .schedule__slider .slick-slide { height: 100%; } .schedule__slider .slick-slide > div { height: 100%; } .schedule__slider-item { height: 100%; padding: 23px 40px 80px 30px; } .schedule__slider-scroll { margin: 0 -40px 0 0; height: 100%; } .schedule__slider-scroll .mCSB_inside > .mCSB_container { margin-right: 42px; } .schedule__slider-scroll .mCSB_scrollTools { opacity: 1; right: 7px; width: 13px; } .schedule__slider-scroll .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background: #cc9902; border-radius: 4px; width: 100%; } .schedule__slider-scroll .mCSB_scrollTools .mCSB_draggerRail { opacity: 0; } .schedule__slider-title { font-size: 16px; line-height: 18px; color: #fff; text-align: center; text-transform: uppercase; padding: 0 0 16px 0; } .schedule__slider-table { border-collapse: collapse; width: 100%; font-size: 14px; line-height: 17px; margin: 0 0 40px 0; color: #fff; } .schedule__slider-table:last-child { margin: 0; } .schedule__slider-table th { text-align: left; padding: 0 10px 13px 0; border-bottom: 1px solid #6c6c6c; font-weight: 400; margin: 0 0 7px 0; } .schedule__slider-table td { padding: 15px 10px 0 0; } .schedule-lg { background-color: #031634; min-height: calc(100% - 85px - 310px); padding-bottom: 79px; } .schedule-lg__title { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 86px; } .schedule-lg__title-txt { text-transform: uppercase; font-size: 36px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.11; letter-spacing: 1.6px; text-align: left; color: #ffffff; } .schedule-lg__title-link a { font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: center; color: #e6e6e6; display: inline-block; } .schedule-lg__title-link a:hover span { border-bottom-color: transparent; } .schedule-lg__title-link a span { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; display: inline-block; vertical-align: middle; border-bottom: 1px solid #e6e6e6; line-height: 1; margin-left: 5px; } .schedule-lg__title-link a svg { display: inline-block; vertical-align: middle; width: 16px; height: 21px; fill: #e6e6e6; } .schedule-lg__caption::after { content: ""; display: table; clear: both; } .schedule-lg__caption li { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; opacity: 0.4; width: 50%; float: left; cursor: pointer; } .schedule-lg__caption li:first-child { text-align: right; padding-right: 25px; position: relative; } .schedule-lg__caption li:first-child::before { content: ''; height: 100%; width: 1px; background-color: rgba(255, 255, 255, 0.58); position: absolute; right: 0; top: 0; } .schedule-lg__caption li:last-child { text-align: left; padding-left: 25px; } .schedule-lg__caption li.active, .schedule-lg__caption li:hover { opacity: 1; } .schedule-lg__search { position: relative; padding-left: 28%; } @media (max-width: 1149px) { .schedule-lg__search { padding-left: 20%; } } @media (max-width: 991px) { .schedule-lg__search { padding-left: 0; } } .schedule-lg__search-icon { position: absolute; right: 0; top: 0; width: 20px; height: 20px; } .schedule-lg__search-icon svg { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; width: 100%; height: 100%; display: block; stroke: #989898; } .schedule-lg__search .input { padding-right: 30px; } .schedule-lg__search .input:focus { border-bottom-color: #fff; } .schedule-lg__search .input:focus + .schedule-lg__search-icon svg { stroke: #fff; } .schedule-lg__table { width: 100%; margin-top: 8px; } .schedule-lg__table th, .schedule-lg__table td { padding: 0 14px; } .schedule-lg__table th { text-align: left; font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.06; letter-spacing: normal; color: #e6e6e6; border-bottom: 1px solid #6c6c6c; padding-bottom: 23px; } .schedule-lg__table th:first-child { color: #9a9a9a; } .schedule-lg__table td { font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: left; color: #e6e6e6; padding-top: 17px; padding-bottom: 14px; } .schedule-lg .schedule__title { padding: 21px 10px; } .schedule-lg .schedule__body--schedule { height: auto; min-height: 1px; padding: 22px 0 0 0; } .schedule-lg .schedule__sub-content { border-bottom: 1px solid #6c6c6c; padding-bottom: 20px; } @-webkit-keyframes blinker { 0% { background-color: #cc9902; } 50% { background-color: #e6e6e6; } 100% { background-color: #cc9902; } } @keyframes blinker { 0% { background-color: #cc9902; } 50% { background-color: #e6e6e6; } 100% { background-color: #cc9902; } } .search { display: block; width: 100%; position: relative; border-bottom: 1px solid #0c81bb; z-index: 10; } .search__input { display: block; width: 100%; border: 0; padding: 0 22px; height: 32px; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.43; letter-spacing: normal; text-align: left; color: #5f88a4; } .search__input::-webkit-input-placeholder { color: #0c81bb; } .search__input:-ms-input-placeholder { color: #0c81bb; } .search__input:focus::-webkit-input-placeholder { color: transparent; } .search__input:focus:-ms-input-placeholder { color: transparent; } .search__input:focus::placeholder { color: transparent; } .search__icon { width: 25px; height: 25px; position: absolute; right: 0; bottom: 8px; } .search__icon:hover svg { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; stroke: #cb1711; } .search__icon svg { width: 100%; height: 100%; display: block; stroke: #0c81bb; } .search__drop { position: absolute; z-index: 1; top: 100%; left: 0; display: none; background-color: #5f88a4; width: 100%; max-height: 240px; padding: 25px 23px; overflow: hidden; } .search__drop::before { content: 'ничего не найдено...'; position: absolute; left: 25px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); line-height: 1; font-size: 14px; color: rgba(255, 255, 255, 0.6); } .search__drop.is-active { display: block; } .search__drop-list { display: block; background-color: #5f88a4; } .search__drop-item { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; padding-bottom: 5px; color: #fff; cursor: pointer; display: none; } .search__drop-item.is-shown { display: block; } .search__drop-item:hover { color: #003356; } .shop { padding: 6px 0 85px 0; text-align: center; } .shop__plate { padding: 9px 0 15px 0; margin: 0 -5px; } .shop .pressa__head { text-align: left; } .shop .plate__col { position: relative; z-index: 1; } .shop .plate__col:hover ~ .plate__col { z-index: 0; } .slider-head { position: relative; } .slider-head__img { height: 600px; background-size: cover; background-position: center; margin-bottom: 32px; border-radius: 3px; } @media (max-width: 990px) { .slider-head__img { height: 452px; } } .slider-head__overlay { background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0)), to(#000000)); background-image: linear-gradient(to left, rgba(0, 0, 0, 0), #000000); display: table; width: 100%; height: 100%; border-radius: 3px; } .slider-head__inner { display: table-cell; vertical-align: middle; padding-left: 56px; } @media (max-width: 990px) { .slider-head__inner { padding-left: 20px; } } .slider-head__inner-wrap { max-width: 400px; color: #fff; } .slider-head__caption { font-family: 'PT Sans Caption'; font-size: 28px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.11; letter-spacing: normal; display: block; max-width: 320px; margin-bottom: 20px; } .slider-head__description { font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.27; letter-spacing: normal; } .slider-head__btn { max-width: 182px; font-size: 12px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: 0.6px; padding: 5px 11px 8px; display: inline-block; margin-top: 37px; } .slider-head .slick-dots { min-width: 262px; height: 46px; background-color: rgba(0, 0, 0, 0.4); position: absolute; bottom: 50px; right: 0; padding: 6px 0 0 14px; } .slider-head .slick-dots li { display: inline-block; border-radius: 50%; padding: 0 14px; width: 17px; height: 17px; position: relative; } .slider-head .slick-dots li:last-child:after { content: ''; width: 2px; height: 18px; position: absolute; top: 0; right: -30px; background-color: #fff; } .slider-head .slick-dots li.slick-active button { background-color: #fff; border: solid 2px #fff; } .slider-head .slick-dots button { border: solid 2px #ffc400; background-color: transparent; border-radius: 50%; font-size: 0; padding: 7px; } .slider-arrow-head { position: absolute; bottom: 63px; width: 15px; height: 20px; z-index: 10; cursor: pointer; } .slider-arrow-head:hover svg { fill: #ffc400; } .slider-arrow-head svg { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; width: 100%; height: 100%; display: block; fill: #fff; } .slider-arrow-head--next { right: 21px; } .slider-arrow-head--prev { right: 50px; } .sort { font-size: 0; line-height: 0; display: block; } .sort--pressa { display: inline-block; } .sort__item { display: inline-block; font-size: 18px; line-height: 1.11; padding-right: 30px; } .sort__item:last-child { padding-right: 0; } .sort__link { color: #6c6c6c; } .sort__link--active { color: #0299e2; font-weight: bold; } .stations { padding: 13px 0 85px; } @media (max-width: 990px) { .stations { padding-bottom: 30px; } } .stations__title { font-family: 'PT Sans Caption'; font-size: 36px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: 1.6px; text-transform: uppercase; display: inline-block; color: #006699; margin-bottom: 7px; } .taxi { display: block; width: 100%; margin-bottom: 40px; } .taxi__title { height: 80px; border-radius: 3px; background-color: #ffcc00; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 0 17px; cursor: pointer; } .taxi__title:hover .taxi__title-txt { border-bottom-color: #000; } .taxi__title-img { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .taxi__title-img--yt { height: 40px; width: auto; } .taxi__title-img--yc { width: 144px; height: 46px; } .taxi__title-txt { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; border-bottom: 1px solid transparent; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; font-size: 32px; font-weight: bold; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-transform: uppercase; color: #000000; } .taxi__drop { display: none; } .taxi__map { height: 218px; width: 100%; } .taxi__map #call-taxi-map { width: 100%; height: 100%; display: block; } .taxi__form { background-color: #003356; padding: 5px 30px 23px; } .taxi__row { border-bottom: 1px solid #fff; } .taxi__row::after { content: ""; display: table; clear: both; } .taxi__row--first .taxi__col:first-child .jq-selectbox__trigger::after { right: 20px; } .taxi__row--last { border-bottom: 0; } .taxi__row--last .taxi__col { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .taxi__row--last .taxi__col:first-child { padding-left: 8px; } .taxi__row--last .taxi__col:first-child::before { display: none; } .taxi__col { float: left; width: 50%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .taxi__col:first-child { position: relative; } .taxi__col:first-child::before { content: ''; height: 33px; width: 1px; background: #fff; position: absolute; right: 0; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .taxi__col:first-child .jq-selectbox__trigger::after { top: 50%; right: 31px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .taxi__col:last-child .jq-selectbox__select, .taxi__col:last-child .input { padding-left: 20px; } .taxi__col .jq-selectbox__select, .taxi__col .input { border: 0 !important; } .taxi__col .jq-selectbox__select-text, .taxi__col .input { color: #dce1e2; } .taxi__col .jq-selectbox__trigger::after, .taxi__col .jq-selectbox__trigger::before { -webkit-filter: brightness(150%); filter: brightness(150%); } .taxi__col .jq-selectbox__trigger::after { top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .taxi__col .jq-selectbox__trigger::before { display: none; } .taxi__col .custom-select:hover .jq-selectbox__trigger, .taxi__col .custom-select.focused .jq-selectbox__trigger { -webkit-filter: brightness(50%); filter: brightness(50%); } .taxi__col .custom-select li::before { display: none; } .taxi__col .input { background-color: transparent; } .taxi__col .input::-webkit-input-placeholder { color: #dce1e2; } .taxi__col .input:-ms-input-placeholder { color: #dce1e2; } .taxi__col .input:focus::-webkit-input-placeholder { color: transparent; } .taxi__col .input:focus:-ms-input-placeholder { color: transparent; } .taxi__col .input:focus::placeholder { color: transparent; } .taxi__reverse { width: 47px; height: 33px; border-left: 1px solid #fff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .taxi__reverse svg { width: 20px; height: 25px; fill: #fff; } .taxi__comment { display: inline-block !important; margin: 26px 0 19px !important; font-size: 15px !important; text-align: left !important; color: #dce1e2 !important; line-height: 1 !important; border-bottom: 1px solid #dce1e2 !important; } .taxi__comment:hover { border-bottom-color: transparent !important; } .taxi__txt { font-size: 15px; line-height: 1.07; color: #dce1e2; } .taxi__submit { margin-top: 24px; width: 160px; } .taxi__submit .btn:hover { border-color: #fff; text-decoration: underline; } .taxi__info { font-size: 13px !important; line-height: 1.08 !important; text-align: left !important; color: #dce1e2 !important; margin-top: 11px !important; text-decoration: underline !important; border-bottom: 0 !important; } .select-tel { position: relative; } .select-tel .input--tel { height: 33px; padding: 0 5px 0 45px; font-size: 14px; color: #fff; background-color: transparent; border: 0; border-bottom: 1px solid #fff; } .select-tel .input--tel::-webkit-input-placeholder { color: #fff; } .select-tel .input--tel:-ms-input-placeholder { color: #fff; } .select-tel .input--tel:focus::-webkit-input-placeholder { color: transparent; } .select-tel .input--tel:focus:-ms-input-placeholder { color: transparent; } .select-tel .input--tel:focus::placeholder { color: transparent; } .select-tel .select-city { position: absolute; top: 0; left: 0; } .select-tel .jq-selectbox.select-city__item { background-position: 0 50% !important; background-repeat: no-repeat; background-size: 22px auto; } .select-tel .jq-selectbox__trigger { border: 0; width: 23px; } .select-tel .jq-selectbox__trigger-arrow { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); border: 0; height: 6px; width: 10px; background: rgba(255, 255, 255, 0) url(/pic/icons/chevrone.svg) 0 0 no-repeat; background-size: cover; } .select-tel .jq-selectbox__select { width: 44px; background-image: none !important; -webkit-box-shadow: none !important; box-shadow: none !important; background-color: transparent !important; border: 0 !important; height: 32px; padding: 0 20px 0 0; } .select-tel .jq-selectbox__select-text { text-indent: -999999px; width: 30px !important; height: 20px !important; background-repeat: no-repeat; } .select-tel .jq-selectbox__dropdown ul { max-height: 250px; width: 50px; } .select-tel .jq-selectbox__dropdown li { background-repeat: no-repeat; text-indent: -999999px; height: 13px; margin: 5px 0; padding: 10px; background-color: transparent !important; background-position: 50% 50%; } .select-tel .jq-selectbox select { width: 0 !important; } .select-tel--lg { position: relative; } .select-tel--lg .input { padding-left: 82px; } .select-tel--lg .select-city { position: absolute; top: 0; left: 9px; } .select-tel--lg .jq-selectbox.select-city__item { background-position: 0 50% !important; background-repeat: no-repeat; background-size: 30px 20px; } .select-tel--lg .jq-selectbox__trigger { border: 0; width: 26px; } .select-tel--lg .jq-selectbox__trigger-arrow { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); right: 5px; border: 0; height: 10px; width: 16px; background: rgba(255, 255, 255, 0) url(/pic/icons/chevrone-gray.svg) 0 0 no-repeat; background-size: cover; } .select-tel--lg .jq-selectbox__select { width: 60px; background-image: none !important; -webkit-box-shadow: none !important; box-shadow: none !important; background-color: transparent !important; border: 0 !important; height: 66px; padding: 0 20px 0 0; } .select-tel--lg .jq-selectbox__select-text { text-indent: -999999px; width: 30px !important; height: 20px !important; background-repeat: no-repeat; } .select-tel--lg .jq-selectbox__dropdown ul { max-height: 250px; width: 100%; } .select-tel--lg .jq-selectbox__dropdown li { display: block; background-repeat: no-repeat; text-indent: -999999px; height: 13px; margin: 5px 0; padding: 10px; background-color: transparent !important; background-position: 50% 50%; } .type { padding: 13px 0 85px; } .type__head { height: 650px; background-size: cover; background-position: center; margin-bottom: 41px; border-radius: 3px; } @media (max-width: 990px) { .type__head { height: 452px; } } .type__overlay { background-color: rgba(0, 0, 0, 0.2); display: table; width: 100%; height: 100%; } .type__inner { display: table-cell; vertical-align: middle; text-align: center; } .type__caption { text-transform: uppercase; letter-spacing: 2.5px; color: #fff; font-weight: normal; display: block; max-width: 700px; margin: auto; } .type__content-image { padding: 19px 0 12px; } .type__content-bg { height: 780px; background-size: cover; background-position: center; border-radius: 3px; margin: 31px 0 12px; } @media (max-width: 990px) { .type__content-bg { height: 552px; } } @media (max-width: 990px) { .type { padding: 13px 0 30px; } } .popup__locale-list{ text-align: center; color: white; } .popup__locale-list a{ color: white; } .plate__poster-t-container { position: absolute; bottom: 20px; /* если нужно внизу */ left: 0; right: 0; text-align: center; z-index: 2; } .plate__poster-holder { display: flex; flex-direction: column; align-items: center; justify-content: center; } .plate__poster-icon { width: 50px; height: 50px; margin: 0 auto; } .plate__poster-icon svg { width: 100%; height: 100%; display: block; fill: #ffffff; /* цвет иконки */ } .plate__poster-title { margin-top: 5px; font-size: 19px; line-height: 1.16; letter-spacing: 0.8px; text-align: center; color: #ffffff; text-transform: uppercase; } .plate__poster-titleflipper { margin-top: 5px; font-size: 19px; line-height: 1.16; letter-spacing: 0.8px; text-align: center; color: #ffffff; text-transform: uppercase; }