@charset "UTF-8"; .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; } body { background: url("/pic/main/background2.webp") 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: #00517a; } h1 { font-size: 24px; line-height: 3.17; letter-spacing: 1.1px; } 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 ul { margin: -7px 0 14px 15px; } .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; } .static-content td, .static-content th { padding: 13px 10px; } .static-content th { background-color: #fff; font-weight: bold; line-height: 1; border-bottom: 2px solid #bfbfbf; } @media (max-width: 479px) { .static-content th { font-size: 14px; } } .static-content td { border-bottom: 2px solid #bfbfbf; vertical-align: top; } @media (max-width: 479px) { .static-content td { font-size: 13px; line-height: 1.2; } } .static-content .content-desc { font-size: 20px; 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: 20px; margin: 0 auto 30px; 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--mod { padding: 30px 0; margin: 20px auto 20px; line-height: 1.21; font-size: 20px; 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; } .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: 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: 30px; } .static-content .image-desc:before { content: ''; position: absolute; bottom: 0; width: 100%; height: 2px; background-color: #bfbfbf; } .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: 26px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.38; letter-spacing: 1.2px; text-align: left; color: #0c81bb; padding-bottom: 7px; } .title--main { padding-bottom: 13px; } .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.fancybox-active { overflow: hidden; } body.fancybox-iosfix { position: fixed; left: 0; right: 0; } .fancybox-is-hidden { position: absolute; top: -9999px; left: -9999px; visibility: hidden; } .fancybox-container { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 99992; -webkit-tap-highlight-color: transparent; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transform: translateZ(0); transform: translateZ(0); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; } .fancybox-outer, .fancybox-inner, .fancybox-bg, .fancybox-stage { position: absolute; top: 0; right: 0; bottom: 0; left: 0; } .fancybox-outer { overflow-y: auto; -webkit-overflow-scrolling: touch; } .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: 0.87; -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-wrap { position: absolute; direction: ltr; z-index: 99997; opacity: 0; visibility: hidden; -webkit-transition: opacity .25s, visibility 0s linear .25s; transition: opacity .25s, visibility 0s linear .25s; -webkit-box-sizing: border-box; box-sizing: border-box; } .fancybox-show-infobar .fancybox-infobar, .fancybox-show-toolbar .fancybox-toolbar, .fancybox-show-caption .fancybox-caption-wrap { opacity: 1; visibility: visible; -webkit-transition: opacity .25s, visibility 0s; transition: opacity .25s, visibility 0s; } .fancybox-infobar { top: 0; left: 0; font-size: 13px; padding: 0 10px; height: 44px; min-width: 44px; line-height: 44px; color: #ccc; text-align: center; pointer-events: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent; -webkit-font-smoothing: subpixel-antialiased; mix-blend-mode: exclusion; } .fancybox-toolbar { top: 0; right: 0; margin: 0; padding: 0; } .fancybox-stage { overflow: hidden; direction: ltr; z-index: 99994; -webkit-transform: translate3d(0, 0, 0); } .fancybox-is-closing .fancybox-stage { overflow: visible; } .fancybox-slide { position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; padding: 0; overflow: auto; outline: none; white-space: normal; -webkit-box-sizing: border-box; box-sizing: border-box; text-align: center; z-index: 99994; -webkit-overflow-scrolling: touch; display: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; transition-property: opacity, -webkit-transform; -webkit-transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; } .fancybox-slide::before { content: ''; display: inline-block; vertical-align: middle; height: 100%; width: 0; } .fancybox-is-sliding .fancybox-slide, .fancybox-slide--previous, .fancybox-slide--current, .fancybox-slide--next { display: block; } .fancybox-slide--image { overflow: visible; } .fancybox-slide--image::before { display: none; } .fancybox-slide--video .fancybox-content, .fancybox-slide--video iframe { background: #000; } .fancybox-slide--map .fancybox-content, .fancybox-slide--map iframe { background: #E5E3DF; } .fancybox-slide--next { z-index: 99995; } .fancybox-slide > * { display: inline-block; position: relative; padding: 24px; margin: 44px 0 44px; border-width: 0; vertical-align: middle; text-align: left; background-color: #fff; overflow: auto; -webkit-box-sizing: border-box; box-sizing: border-box; } .fancybox-slide > title, .fancybox-slide > style, .fancybox-slide > meta, .fancybox-slide > link, .fancybox-slide > script, .fancybox-slide > base { display: none; } .fancybox-slide .fancybox-image-wrap { position: absolute; top: 0; left: 0; margin: 0; padding: 0; border: 0; z-index: 99995; background: transparent; cursor: default; overflow: visible; -webkit-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; background-size: 100% 100%; background-repeat: no-repeat; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; transition-property: opacity, -webkit-transform; -webkit-transition-property: opacity, -webkit-transform; transition-property: transform, opacity; transition-property: transform, opacity, -webkit-transform; } .fancybox-can-zoomOut .fancybox-image-wrap { cursor: -webkit-zoom-out; cursor: zoom-out; } .fancybox-can-zoomIn .fancybox-image-wrap { cursor: -webkit-zoom-in; cursor: zoom-in; } .fancybox-can-drag .fancybox-image-wrap { cursor: -webkit-grab; cursor: grab; } .fancybox-is-dragging .fancybox-image-wrap { cursor: -webkit-grabbing; cursor: grabbing; } .fancybox-image, .fancybox-spaceball { position: absolute; top: 0; left: 0; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; max-width: none; max-height: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .fancybox-spaceball { z-index: 1; } .fancybox-slide--iframe .fancybox-content { padding: 0; width: 80%; height: 80%; max-width: calc(0%); max-height: calc(12%); overflow: visible; background: #fff; } .fancybox-iframe { display: block; margin: 0; padding: 0; border: 0; width: 100%; height: 100%; background: #fff; } .fancybox-error { margin: 0; padding: 40px; width: 100%; max-width: 380px; background: #fff; cursor: default; } .fancybox-error p { margin: 0; padding: 0; color: #444; font-size: 16px; line-height: 20px; } /* Buttons */ .fancybox-button { -webkit-box-sizing: border-box; box-sizing: border-box; display: inline-block; vertical-align: top; width: 44px; height: 44px; margin: 0; padding: 10px; border: 0; border-radius: 0; background: rgba(30, 30, 30, 0.6); -webkit-transition: color .3s ease; transition: color .3s ease; cursor: pointer; outline: none; } .fancybox-button, .fancybox-button:visited, .fancybox-button:link { color: #ccc; } .fancybox-button:focus, .fancybox-button:hover { color: #fff; } .fancybox-button[disabled] { color: #ccc; cursor: default; opacity: 0.6; } .fancybox-button svg { display: block; position: relative; overflow: visible; shape-rendering: geometricPrecision; } .fancybox-button svg path { fill: currentColor; stroke: currentColor; stroke-linejoin: round; stroke-width: 3; } .fancybox-button--share svg path { stroke-width: 1; } .fancybox-button--play svg path:nth-child(2) { display: none; } .fancybox-button--pause svg path:nth-child(1) { display: none; } .fancybox-button--zoom svg path { fill: transparent; } /* Navigation arrows */ .fancybox-navigation { display: none; } .fancybox-show-nav .fancybox-navigation { display: block; } .fancybox-navigation button { position: absolute; top: 50%; margin: -50px 0 0 0; z-index: 99997; background: transparent; width: 60px; height: 100px; padding: 17px; } .fancybox-navigation button:before { content: ""; position: absolute; top: 30px; right: 10px; width: 40px; height: 40px; background: rgba(30, 30, 30, 0.6); } .fancybox-navigation .fancybox-button--arrow_left { left: 0; } .fancybox-navigation .fancybox-button--arrow_right { right: 0; } /* Close button on the top right corner of html content */ .fancybox-close-small { position: absolute; top: 0; right: 0; width: 44px; height: 44px; padding: 0; margin: 0; border: 0; border-radius: 0; background: transparent; z-index: 10; cursor: pointer; } .fancybox-close-small:after { content: '×'; position: absolute; top: 5px; right: 5px; width: 30px; height: 30px; font: 20px/30px Arial, "Helvetica Neue", Helvetica, sans-serif; color: #888; font-weight: 300; text-align: center; border-radius: 50%; border-width: 0; background-color: transparent; -webkit-transition: background-color 0.25s; transition: background-color 0.25s; -webkit-box-sizing: border-box; box-sizing: border-box; z-index: 2; } .fancybox-close-small:focus { outline: none; } .fancybox-close-small:focus:after { outline: 1px dotted #888; } .fancybox-close-small:hover:after { color: #555; background: #eee; } .fancybox-slide--image .fancybox-close-small, .fancybox-slide--iframe .fancybox-close-small { top: 0; right: -44px; } .fancybox-slide--image .fancybox-close-small:after, .fancybox-slide--iframe .fancybox-close-small:after { font-size: 35px; color: #aaa; } .fancybox-slide--image .fancybox-close-small:hover:after, .fancybox-slide--iframe .fancybox-close-small:hover:after { color: #fff; background: transparent; } .fancybox-is-scaling .fancybox-close-small, .fancybox-is-zoomable.fancybox-can-drag .fancybox-close-small { display: none; } /* Caption */ .fancybox-caption-wrap { bottom: 0; left: 0; right: 0; padding: 60px 2vw 0 2vw; background: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(20%, rgba(0, 0, 0, 0.1)), color-stop(40%, rgba(0, 0, 0, 0.2)), color-stop(80%, rgba(0, 0, 0, 0.6)), to(rgba(0, 0, 0, 0.8))); background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.1) 20%, rgba(0, 0, 0, 0.2) 40%, rgba(0, 0, 0, 0.6) 80%, rgba(0, 0, 0, 0.8) 100%); pointer-events: none; } .fancybox-caption { padding: 30px 0; border-top: 1px solid rgba(255, 255, 255, 0.4); font-size: 14px; color: #fff; line-height: 20px; -webkit-text-size-adjust: none; } .fancybox-caption a, .fancybox-caption button, .fancybox-caption select { pointer-events: all; position: relative; /* Fix IE11 */ } .fancybox-caption a { color: #fff; text-decoration: underline; } /* Loading indicator */ .fancybox-slide > .fancybox-loading { border: 6px solid rgba(100, 100, 100, 0.4); border-top: 6px solid rgba(255, 255, 255, 0.6); border-radius: 100%; height: 50px; width: 50px; -webkit-animation: fancybox-rotate 0.8s infinite linear; animation: fancybox-rotate 0.8s infinite linear; background: transparent; position: absolute; top: 50%; left: 50%; margin-top: -30px; margin-left: -30px; z-index: 99999; } @-webkit-keyframes fancybox-rotate { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(359deg); transform: rotate(359deg); } } @keyframes fancybox-rotate { from { -webkit-transform: rotate(0deg); transform: rotate(0deg); } to { -webkit-transform: rotate(359deg); transform: rotate(359deg); } } /* 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 { -webkit-transform: translate3d(-100%, 0, 0); transform: translate3d(-100%, 0, 0); opacity: 0; } .fancybox-fx-slide.fancybox-slide--next { -webkit-transform: translate3d(100%, 0, 0); transform: translate3d(100%, 0, 0); opacity: 0; } .fancybox-fx-slide.fancybox-slide--current { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1; } /* 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 { -webkit-transform: scale3d(1.5, 1.5, 1.5); transform: scale3d(1.5, 1.5, 1.5); opacity: 0; } .fancybox-fx-zoom-in-out.fancybox-slide--next { -webkit-transform: scale3d(0.5, 0.5, 0.5); transform: scale3d(0.5, 0.5, 0.5); opacity: 0; } .fancybox-fx-zoom-in-out.fancybox-slide--current { -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); opacity: 1; } /* transitionEffect: rotate */ .fancybox-fx-rotate.fancybox-slide--previous { -webkit-transform: rotate(-360deg); -ms-transform: rotate(-360deg); transform: rotate(-360deg); opacity: 0; } .fancybox-fx-rotate.fancybox-slide--next { -webkit-transform: rotate(360deg); -ms-transform: rotate(360deg); transform: rotate(360deg); opacity: 0; } .fancybox-fx-rotate.fancybox-slide--current { -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); opacity: 1; } /* transitionEffect: circular */ .fancybox-fx-circular.fancybox-slide--previous { -webkit-transform: scale3d(0, 0, 0) translate3d(-100%, 0, 0); transform: scale3d(0, 0, 0) translate3d(-100%, 0, 0); opacity: 0; } .fancybox-fx-circular.fancybox-slide--next { -webkit-transform: scale3d(0, 0, 0) translate3d(100%, 0, 0); transform: scale3d(0, 0, 0) translate3d(100%, 0, 0); opacity: 0; } .fancybox-fx-circular.fancybox-slide--current { -webkit-transform: scale3d(1, 1, 1) translate3d(0, 0, 0); transform: scale3d(1, 1, 1) translate3d(0, 0, 0); opacity: 1; } /* 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); } /* Share */ .fancybox-share { padding: 30px; border-radius: 3px; background: #f4f4f4; max-width: 90%; } .fancybox-share h1 { color: #222; margin: 0 0 20px 0; font-size: 33px; font-weight: 700; text-align: center; } .fancybox-share p { margin: 0; padding: 0; text-align: center; } .fancybox-share p:first-of-type { margin-right: -10px; } .fancybox-share_button { display: inline-block; text-decoration: none; margin: 0 10px 10px 0; padding: 10px 20px; border: 0; border-radius: 3px; -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.16); background: #fff; white-space: nowrap; font-size: 16px; line-height: 23px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; min-width: 140px; color: #707070; -webkit-transition: all .2s; transition: all .2s; } .fancybox-share_button:focus, .fancybox-share_button:hover { text-decoration: none; color: #333; -webkit-box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.3); box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.3); } .fancybox-share_button svg { margin-right: 5px; width: 20px; height: 20px; vertical-align: text-bottom; } .fancybox-share input { -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; margin: 5px 0 0 0; padding: 10px 15px; border: 1px solid #d7d7d7; border-radius: 3px; background: #ebebeb; color: #5d5b5b; font-size: 14px; outline: none; } /* Thumbs */ .fancybox-thumbs { display: none; position: absolute; top: 0; bottom: 0; right: 0; width: 212px; margin: 0; padding: 2px 2px 4px 2px; background: #fff; -webkit-tap-highlight-color: transparent; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar; -webkit-box-sizing: border-box; box-sizing: border-box; z-index: 99995; } .fancybox-thumbs-x { overflow-y: hidden; overflow-x: auto; } .fancybox-show-thumbs .fancybox-thumbs { display: block; } .fancybox-show-thumbs .fancybox-inner { right: 212px; } .fancybox-thumbs > ul { list-style: none; position: absolute; position: relative; width: 100%; height: 100%; margin: 0; padding: 0; overflow-x: hidden; overflow-y: auto; font-size: 0; white-space: nowrap; } .fancybox-thumbs-x > ul { overflow: hidden; } .fancybox-thumbs-y > ul::-webkit-scrollbar { width: 7px; } .fancybox-thumbs-y > ul::-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 > ul::-webkit-scrollbar-thumb { background: #2a2a2a; border-radius: 10px; } .fancybox-thumbs > ul > li { float: left; overflow: hidden; padding: 0; margin: 2px; width: 100px; height: 75px; max-width: calc(46%); max-height: calc(92%); position: relative; cursor: pointer; outline: none; -webkit-tap-highlight-color: transparent; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-box-sizing: border-box; box-sizing: border-box; } li.fancybox-thumbs-loading { background: rgba(0, 0, 0, 0.1); } .fancybox-thumbs > ul > li > img { position: absolute; top: 0; left: 0; max-width: none; max-height: none; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .fancybox-thumbs > ul > li:before { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; border: 4px solid #4ea7f9; z-index: 99991; opacity: 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); } .fancybox-thumbs > ul > li.fancybox-thumbs-active:before { opacity: 1; } /* Styling for Small-Screen Devices */ @media all and (max-width: 800px) { .fancybox-thumbs { width: 110px; } .fancybox-show-thumbs .fancybox-inner { right: 110px; } .fancybox-thumbs > ul > li { 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: 0 45px 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: 320px; } html { height: 100%; } .container { padding: 0 8px; max-width: 784px; margin: 0 auto; } .container::after { content: ""; display: table; clear: both; } .container--white { background-color: #fff; } .wrapper { min-height: 100%; overflow: hidden; } .wrapper--blue { background-color: #031634; } .wrapper--light-blue { background-color: #ecfcfc; } .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 svg { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; width: 100%; height: 100%; display: block; fill: #ffffff; } .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; text-transform: uppercase; background: #ffc400; 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: #00517a; } 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: #00517a; } 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-play { width: 33px; height: 33px; } .icon-newspaper2 { width: 32px; height: 32px; } 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%; border-radius: 0; 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: 150px; 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; } select option { color: #00517a; } select::-ms-expand { display: none; } .jq-selectbox .mCSB_container { margin-right: 0; } .jq-selectbox .mCSB_scrollTools { width: 8px; right: -2px; } .jq-selectbox .mCustomScrollBox { margin-right: 10px; } .jq-selectbox .mCSB_dragger_bar { background-color: rgba(0, 0, 0, 0.6) !important; } .custom-select { width: 100%; display: block; padding-right: 10px; } .custom-select__cover { position: absolute; width: 40px; height: calc(100% - 2px); right: 0; top: 1px; background-color: #fff; } .custom-select__holder { position: relative; } .custom-select__holder::after, .custom-select__holder::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; background-color: #fff; z-index: 5; } .custom-select__holder::before { top: 19px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .custom-select__holder::after { top: 39px; } .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::after, .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: 19px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .custom-select .jq-selectbox__trigger::after { top: 39px; } .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: 10px 0 30px; } .authorization-done__title { font-family: 'PT Sans Caption'; display: block; text-align: center; padding-bottom: 11px; font-size: 24px; } .authorization-done__txt { color: #6c6c6c; display: block; text-align: center; padding-bottom: 20px; } .authorization-done__txt span { display: block; } .authorization-done__yandex { max-width: 380px; margin: 0 auto; text-align: center; } .authorization-done__yandex-img { display: inline-block; vertical-align: middle; width: 60px; } .authorization-done__yandex-text { line-height: 1.38; letter-spacing: 0.7px; color: #00517a; text-align: left; font-size: 16px; text-transform: uppercase; vertical-align: middle; display: inline-block; width: calc(100% - 75px); padding-left: 15px; } .authorization-done__yandex-link { color: #cb1711; text-transform: uppercase; border-bottom: 1px solid transparent; } .authorization-done__yandex-link:hover { border-bottom: 1px solid #cb1711; } .auth { padding-bottom: 46px; } .auth::after { content: ""; display: table; clear: both; } .auth__col { width: 100%; } .auth__col:first-child { padding: 0 0 40px 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; } .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; } .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: #00517a; 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: 70px; position: relative; padding: 0 40px 0 18px; margin-bottom: 10px; 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; } @media (max-width: 479px) { .auth__form { border-bottom: 0; } } .auth__form-col { float: left; position: relative; } @media (max-width: 479px) { .auth__form-col { float: none; } } .auth__form-col input { border: 0 !important; } .auth__form-col:first-child { width: calc(100% - 206px); } @media (max-width: 479px) { .auth__form-col:first-child { width: 100%; } } .auth__form-col:first-child::before { content: ''; width: 1px; height: 33px; background-color: #979797; position: absolute; top: 16px; right: 1px; z-index: 6; } @media (max-width: 479px) { .auth__form-col:first-child::before { display: none; } } .auth__form-col:last-child { width: 206px; padding: 13px 6px 0 20px; } @media (max-width: 479px) { .auth__form-col:last-child { padding: 0; width: 100%; } } .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__form .select-city, .auth__form .select-tel--lg { border-bottom: 0; } .auth__num-submit { width: 180px; margin: 35px auto 0; } .auth__ticket { margin-top: 5px; padding-left: 18px; cursor: pointer; position: relative; display: inline-block; } @media (max-width: 539px) { .auth__ticket { padding-left: 0; } } .auth__ticket-txt { display: inline-block; vertical-align: middle; text-decoration: underline; font-size: 13px; 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; } @media (max-width: 639px) { .auth__tooltip { padding: 9px 20px 20px; width: 280px; } } .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; } } @media (max-width: 639px) { .auth__tooltip-holder { width: 292px; } } @media (max-width: 539px) { .auth__tooltip-holder { left: 20px; } } .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: 79px; width: 100%; border-radius: 3px; position: relative; margin-bottom: 20px; } .banner__title { font-size: 24px; color: #fff; font-family: 'PT Sans Caption'; line-height: 1.08; letter-spacing: 1.1px; text-transform: uppercase; position: absolute; left: 21px; bottom: 15px; text-shadow: 0 0 6px rgba(0, 0, 0, 0.6); } .basket-msg { text-align: center; padding: 10px 0 10px; } .basket-msg__title { display: block; text-align: center; font-family: 'PT Sans Caption'; } .basket-msg__text { display: block; max-width: 550px; margin: 0 auto; line-height: 1.38; letter-spacing: 0.7px; font-size: 14px; text-transform: uppercase; color: #00517a; } .basket { padding: 0 0 46px; } .basket::after { content: ""; display: table; clear: both; } .basket__col { width: 100%; } .basket__cost { color: #00517a; font-size: 24px; text-transform: uppercase; font-weight: 500; margin-top: 20px; } .basket__goods { display: table; width: 100%; word-spacing: -0.36em; 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: 619px) { .basket__goods-item { width: 50%; } } @media (max-width: 399px) { .basket__goods-item { width: 100%; } } .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: #00517a; 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; } @media (max-width: 479px) { .basket__form-cell { float: none; width: 100%; padding: 0 0 10px !important; } } .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: #00517a; } .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 30px; } .books__banner { border-radius: 3px; } .books__head { padding: 20px 0 20px; position: relative; } .books .genres { margin-top: 0; } .books__title { font-family: 'PT Sans Caption'; font-size: 26px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: 1.6px; text-transform: uppercase; display: inline-block; color: #00517a; margin-bottom: 10px; } @media (max-width: 539px) { .books__title { display: block; } } .books__search { position: absolute; right: 0; top: 45px; } @media (max-width: 539px) { .books__search { float: none; max-width: 100%; padding: 0 0 20px; } } .books__search .search__icon { right: 0; bottom: 6px; } .breadcrumbs { text-align: center; padding-bottom: 50px; } .breadcrumbs__list { margin: 0 -10px; word-spacing: -0.36em; } @media (max-width: 559px) { .breadcrumbs__list { max-width: 300px; margin: 0 auto; } } .breadcrumbs__item { word-spacing: normal; display: inline-block; font-weight: 300; padding: 0 13px; position: relative; } @media (max-width: 559px) { .breadcrumbs__item { width: 50%; padding-bottom: 5px; } } .breadcrumbs__item:before { content: ''; position: absolute; width: 1px; background-color: #989898; height: 15px; top: 6px; left: 1px; } .breadcrumbs__item:first-child:before { display: none; } @media (max-width: 559px) { .breadcrumbs__item:nth-child(odd):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; } .cards-articles__wrap { font-size: 0; line-height: 0; margin: 0 -3px; padding: 10px 0 5px; } .cards-articles__wrap--station { padding-bottom: 0; margin-bottom: -2px; } .cards-articles__item { display: inline-block; vertical-align: top; line-height: normal; font-size: 16px; padding: 0 3px; width: 50%; margin-bottom: 20px; } @media (max-width: 539px) { .cards-articles__item { width: 100%; } } .cards-articles__item:hover .cards-articles__title { color: #cb1711; } .cards-articles__img { margin-bottom: 8px; width: 100%; } .cards-articles__title { display: block; text-transform: uppercase; font-size: 14px; letter-spacing: 0.7px; color: #00517a; line-height: 1.38; } .cards-book__wrap { font-size: 0; line-height: 0; margin: 0 -3px -4px; padding-bottom: 20px; } .cards-book__item { display: inline-block; vertical-align: top; line-height: normal; font-size: 16px; padding: 0 3px; width: 33.33%; margin-bottom: 20px; } @media (max-width: 539px) { .cards-book__item { width: 50%; } } .cards-book__item:hover .cards-book__title { color: #cb1711; } .cards-book__img { margin-bottom: 8px; display: block; width: 100%; } .cards-book__title { display: block; text-transform: uppercase; letter-spacing: 0.7px; color: #00517a; line-height: 1.38; font-size: 14px; margin-bottom: 1px; } .cards-book__author { display: block; font-size: 14px; line-height: normal; color: #989898; } .cards-film__wrap { font-size: 0; line-height: 0; margin: 0 -3px; padding-bottom: 20px; } .cards-film__item { display: inline-block; vertical-align: top; line-height: normal; font-size: 16px; padding: 0 3px; width: 50%; margin-bottom: 6px; position: relative; } @media (max-width: 539px) { .cards-film__item { width: 100%; } } .cards-film__item img { display: block; width: 100%; } .cards-film__title { display: block; text-transform: uppercase; letter-spacing: 0.7px; color: #00517a; padding-left: 1px; line-height: 1.38; } .cards-film__description { display: block; line-height: normal; font-size: 16px; background-color: #00517a; color: #fff; padding: 23px 15px 15px; cursor: auto; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; position: relative; top: -2px; } .cards-film__description-caption { font-size: 15px; text-transform: uppercase; line-height: 1.22; letter-spacing: 0.8px; display: block; margin-bottom: 5px; } .cards-film__description-name { font-size: 14px; line-height: 1.29; letter-spacing: 0.7px; color: #989898; display: block; text-transform: uppercase; margin-bottom: 10px; } .cards-film__description p { font-size: 15px; line-height: 1.27; } .cards-film__description-btn { font-size: 12px; letter-spacing: 0.6px; line-height: 1.2; padding: 7px 11px 8px; margin-top: 20px; } .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: 33.33%; margin-bottom: 20px; } @media (max-width: 539px) { .cards-game__item { width: 50%; } } .cards-game__item:hover .cards-game__name { color: #cb1711; } .cards-game__img { margin-bottom: 5px; display: block; width: 100%; border-radius: 3px; } .cards-game__name { font-size: 14px; 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: 10px; } .cards-magazine__item { display: inline-block; vertical-align: top; line-height: normal; font-size: 16px; padding: 0 3px; width: 33.33%; margin-bottom: 15px; } @media (max-width: 539px) { .cards-magazine__item { width: 50%; } } .cards-magazine__item:hover .cards-magazine__title { color: #cb1711; } .cards-magazine__image { margin-bottom: 5px; display: block; position: relative; } .cards-magazine__image img { display: block; width: 100%; } .cards-magazine__icon { position: absolute; bottom: 0; left: 6px; } .cards-magazine__title { font-size: 14px; display: block; text-transform: uppercase; letter-spacing: 0.7px; color: #00517a; line-height: 1.38; } .cards-music__wrap { font-size: 0; line-height: 0; margin: 0 -3px; } .cards-music__item { display: inline-block; vertical-align: top; line-height: normal; font-size: 16px; padding: 0 3px; width: 50%; margin-bottom: 20px; } @media (max-width: 539px) { .cards-music__item { width: 100%; } } .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: 200px; width: 100%; display: block; border-radius: 3px; position: relative; margin-bottom: 5px; } .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: 60px; height: 60px; } .cards-music__title { font-size: 14px; 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 10px; } .cards-pages__item { display: inline-block; vertical-align: top; line-height: normal; font-size: 16px; padding: 0 3px; width: 50%; margin-bottom: 20px; } @media (max-width: 539px) { .cards-pages__item { width: 100%; } } .cards-pages__img { width: 100%; } .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; padding-bottom: 20px; } .cards-places__item { display: inline-block; vertical-align: top; line-height: normal; font-size: 16px; padding: 0 3px; width: 50%; margin-bottom: 6px; position: relative; } @media (max-width: 539px) { .cards-places__item { width: 100%; } } .cards-places__item img { display: block; width: 100%; } .cards-places__title { display: block; text-transform: uppercase; letter-spacing: 0.7px; color: #00517a; padding-left: 1px; line-height: 1.38; } .cards-places__description { display: block; line-height: normal; font-size: 16px; background-color: #00517a; color: #fff; padding: 23px 15px 15px; cursor: auto; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; position: relative; top: -2px; } .cards-places__description-caption { font-size: 15px; 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; color: #989898; display: block; text-transform: uppercase; margin-bottom: 10px; } .cards-places__description p { font-size: 15px; line-height: 1.27; } .cards-places__description-btn { font-size: 12px; letter-spacing: 0.6px; line-height: 1.2; padding: 7px 11px 8px; margin-top: 20px; } .cards-pressa-top__wrap { font-size: 0; line-height: 0; margin: 0 -3px; padding-bottom: 20px; } .cards-pressa-top__item { display: inline-block; vertical-align: top; line-height: normal; font-size: 16px; padding: 0 3px; width: 50%; margin-bottom: 6px; position: relative; } @media (max-width: 539px) { .cards-pressa-top__item { width: 100%; } } .cards-pressa-top__item img { display: block; width: 100%; } .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 { display: block; line-height: normal; font-size: 16px; background-color: #00517a; color: #fff; padding: 23px 15px 15px; cursor: auto; border-bottom-right-radius: 3px; border-bottom-left-radius: 3px; margin-top: -2px; } .cards-pressa-top__description-caption { font-size: 15px; 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: 10px; font-size: 15px; line-height: normal; } .cards-pressa-top__description-btn { font-size: 12px; letter-spacing: 0.6px; line-height: 1.2; padding: 7px 11px 8px; margin-top: 20px; } .cards-pressa__wrap { font-size: 0; line-height: 0; margin: 0 -3px; } .cards-pressa__item { display: inline-block; vertical-align: top; line-height: normal; font-size: 16px; padding: 0 3px; width: 33.33%; margin-bottom: 20px; } @media (max-width: 539px) { .cards-pressa__item { width: 50%; } } .cards-pressa__item:hover .cards-pressa__title { color: #cb1711; } .cards-pressa__img { margin-bottom: 8px; width: 100%; } .cards-pressa__title { font-size: 14px; 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__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 20px; 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: 10px; margin-bottom: 5px; } .slider-arrow-content { position: absolute; bottom: 60px; 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: #00517a; } .slider-arrow-content--next { right: 0; } .slider-arrow-content--prev { left: 0; } .error-404v2 { position: relative; } .error-404v2__inner { word-spacing: -0.36em; } .error-404v2__description { display: inline-block; vertical-align: middle; word-spacing: normal; text-align: center; padding: 0 0 30px; width: 50%; } @media (max-width: 559px) { .error-404v2__description { display: block; width: 100%; } } .error-404v2__num { font-size: 100px; font-weight: 800; font-style: normal; font-stretch: normal; line-height: 1.2; text-align: center; color: #00517a; display: block; } .error-404v2__title { font-size: 18px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.29; letter-spacing: 1.2px; text-align: center; color: #00517a; display: block; font-family: 'PT Sans Caption'; text-transform: uppercase; margin-bottom: 30px; } .error-404v2__btn { max-width: 245px; display: inline-block; } .error-404v2__image { display: inline-block; vertical-align: middle; width: 50%; } @media (max-width: 559px) { .error-404v2__image { display: block; width: 100%; text-align: center; } .error-404v2__image img { max-height: 300px; } } .error-404 { padding: 30px 0 20px; } .error-404__holder { margin: 0 auto; } @media (max-width: 479px) { .error-404__holder { text-align: center; } } .error-404__image { margin: 0 auto 30px; text-align: center; } .error-404__image img { max-width: 400px; } @media (max-width: 479px) { .error-404__image img { max-width: 100%; } } .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: 18px; line-height: 1.29; letter-spacing: 1.2px; font-family: 'PT Sans Caption'; float: right; padding: 4px 0 0; } @media (max-width: 479px) { .error-404__title { display: block; float: none; text-align: center; padding: 0 0 10px; } } .error-500v2 { position: relative; } .error-500v2__inner { word-spacing: -0.36em; } .error-500v2__description { display: inline-block; word-spacing: normal; vertical-align: middle; width: 50%; } @media (max-width: 559px) { .error-500v2__description { display: block; width: 100%; } } .error-500v2__num { font-size: 100px; font-weight: 800; font-style: normal; font-stretch: normal; line-height: 1.2; text-align: center; color: #00517a; display: block; } .error-500v2__title { font-size: 18px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.29; letter-spacing: 1.2px; text-align: center; color: #00517a; display: block; margin: 0 auto 15px; font-family: 'PT Sans Caption'; text-transform: uppercase; } .error-500v2__image { display: inline-block; vertical-align: middle; width: 50%; } @media (max-width: 559px) { .error-500v2__image { display: block; width: 100%; } } .error-500 { padding: 30px 0 20px; } .error-500__holder { text-align: center; } .error-500__image { margin: 0 auto 30px; text-align: center; } .error-500__image img { max-width: 400px; } @media (max-width: 479px) { .error-500__image img { max-width: 100%; } } .error-500__title { font-size: 18px; line-height: 1.29; letter-spacing: 1.2px; font-family: 'PT Sans Caption'; } .films-top__head { padding: 0 0 15px 0; } .footer { width: 100%; overflow: hidden; background: transparent; padding: 18px 16px; } .footer--dark { background-color: #031634; } .footer--dark .footer__title, .footer--dark .footer__free, .footer--dark .footer__address { color: #fff; } .footer__title { margin-bottom: 13px; 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: #00517a; } .footer__tel { display: inline-block; font-size: 24px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: normal; text-align: left; color: #ffcc01; margin-bottom: 2px; } .footer__tel span { color: #ffcc01; } .footer__free { margin-top: 8px; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: normal; text-align: left; color: #00517a; } .footer__links { padding: 23px 0 20px 0; } .footer__email { margin-top: 25px; text-decoration: underline; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: left; color: #cc9902; margin-right: 10px; } .footer__address { margin-top: 24px; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.29; letter-spacing: normal; text-align: left; color: #00517a; } .footer__logo { margin: 34px 0 30px; } .footer__logo a { display: inline-block; margin-left: 30px; } .footer__logo a:first-child { margin-left: 0; } .footer__logo-train { width: 40px; height: 40px; } .footer__logo-train svg { width: 100%; height: 100%; display: block; } .footer__logo-ya { width: 75px; height: 30px; } .footer__logo-ya svg { width: 100%; height: 100%; display: block; } .footer__logo-rgd { width: 170px; height: 40px; margin-left: 5px !important; } .footer__logo-rgd svg { width: 100%; height: 100%; display: block; } .footer__copy { margin-bottom: 11px; 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__copy a { color: #989898; text-decoration: underline; } .game-banner { background-repeat: no-repeat; background-size: cover; border-radius: 3px; position: relative; padding: 20px; margin-bottom: 6px; background-color: #8ec4d6; } @media (max-width: 539px) { .game-banner { width: 100%; display: block; padding: 10px 10px 20px; } } .game-banner__logo { display: inline-block; vertical-align: middle; max-width: 200px; text-align: center; padding-right: 20px; } @media (max-width: 539px) { .game-banner__logo { display: block; width: 100%; vertical-align: top; margin: 0 auto 10px; } } .game-banner__title { font-family: 'PT Sans Caption'; font-size: 18px; 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% - 220px); display: inline-block; vertical-align: middle; } @media (max-width: 539px) { .game-banner__content { width: 100%; display: block; margin: 0; } } .game-banner__img { margin-bottom: 11px; display: block; width: 100%; border-radius: 3px; } .game-banner__name { font-size: 13px; 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: 130px; padding-right: 20px; } .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 { background-color: #e6e6e6; padding: 21px 0 20px; margin: 20px 0 35px; border-radius: 3px; font-size: 0; line-height: 0; position: relative; } .genres:before { content: ''; position: absolute; top: -20px; left: 12px; border: 10px solid transparent; border-bottom: 10px solid #e6e6e6; } .genres--audio:before { left: 233px; } .genres--pressa:before { left: 82px; } .genres--shop { text-align: left; } .genres__list { font-size: 16px; line-height: normal; width: 50%; display: inline-block; vertical-align: top; } @media (max-width: 539px) { .genres__list { width: 100%; } } .genres__item { padding: 0 0 5px 27px; } .genres__link { font-size: 20px; line-height: 1.38; color: #6c6c6c; font-family: 'PT Sans Caption'; display: inline-block; } .genres__link:hover { color: #cb1711; } .genres__link--active { border-bottom: 1px solid #6c6c6c; } .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: 13px 0; position: relative; z-index: 20; } .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.fixed .header__menu { max-height: calc(100vh - 70px); } .header--transparent { background-color: transparent; } .header__logo { width: 209px; height: 80px; display: block; float: left; position: relative; } .header__logo svg, .header__logo img { width: 100%; height: 100%; display: block; } .header__btn { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; width: 40px; height: 20px; position: absolute; right: 16px; top: 30px; cursor: pointer; } .header__btn-line { height: 1px; width: 100%; background-color: #00517a; position: absolute; top: 50%; left: 0; } .header__btn::before, .header__btn::after { content: ''; height: 1px; width: 100%; background-color: #00517a; position: absolute; left: 0; } .header__btn::before { top: 0; } .header__btn::after { bottom: 0; } .header__menu { position: absolute; display: none; width: 100%; left: 0; top: 100%; padding: 0 8px 15px; background-color: #f2f2f2; -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3); box-shadow: 0 1px 5px rgba(0, 0, 0, 0.3); max-height: calc(100vh - 120px); overflow-y: auto; } .header__service { padding: 25px 0; border-top: solid 1px #5f88a4; border-bottom: solid 1px #5f88a4; } .header__service-item { padding: 0 25px 30px; } .header__service-item:last-child { padding-bottom: 0; } .header__service-link { font-size: 16px; line-height: 1.38; letter-spacing: 0.7px; text-align: left; color: #00517a; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-transform: uppercase; } .header__service-link:hover { color: #cc9902; } .header__service-link:hover svg { fill: #cc9902; } .header__service-icon { width: 35px; text-align: center; margin-right: 20px; } .header__service-icon svg { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; fill: #00517a; } .header__ctrl { 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: center; -ms-flex-pack: center; justify-content: center; position: relative; width: 100%; padding-top: 20px; } .header__ctrl-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 0 22px; cursor: pointer; } .header__ctrl-item svg { width: 100%; height: 100%; display: block; fill: #5f88a4; } .header__basket { width: 36px; height: 36px; position: relative; float: right; margin-right: 76px; margin-top: 5px; } .header__basket svg { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; width: 100%; height: 100%; display: block; fill: #5f88a4; } .header__basket-num { width: 24px; height: 24px; background-color: #217cff; border-radius: 50%; position: absolute; top: -7px; right: -13px; font-size: 13.2px; font-weight: 700; letter-spacing: 0.6px; color: #ffffff; line-height: 24px; text-align: center; } .header__basket-drop { position: absolute; width: calc(100% - 16px); top: calc(100% + 14px); left: 8px; background-color: #e6e6e6; padding: 24px 30px; z-index: 10; display: none; } .header__basket-drop::before { content: ''; position: absolute; top: -30px; right: 70px; border: 20px solid transparent; border-bottom: 20px solid #e6e6e6; } .header__user { width: 36px; height: 36px; } .header__search { width: 40px; height: 40px; } .header__lang-title { width: 36px; height: 36px; border-radius: 50%; display: block; margin: 0 0 15px 0; position: relative; } .header__lang-title:before { content: ''; display: block; width: 20px; height: 4px; background: #0c81bb; border-radius: 2px; position: absolute; top: 100%; left: 50%; margin: 8px 0 0 -10px; opacity: 0; } .header__lang-title.active:before { opacity: 1; } .header__lang-title img { display: block; width: 100%; height: 100%; border-radius: 50%; } .header__lang-list { margin-bottom: -38px; } .header__lang-list::after { content: ""; display: table; clear: both; } .header__lang-list li { display: block; float: left; width: 50%; padding-bottom: 38px; white-space: nowrap; padding-left: 20%; } @media (max-width: 439px) { .header__lang-list li { padding-left: 7px; } } .header__lang-list li.active .header__lang-txt { color: #217cff; font-weight: 700; } .header__lang-list li:nth-child(even) { text-align: right; padding-right: 20%; } @media (max-width: 439px) { .header__lang-list li:nth-child(even) { padding-right: 7px; } } .header__lang-list li a { display: inline-block; } .header__lang-icon { display: inline-block; vertical-align: middle; width: 36px; height: 36px; overflow: hidden; border-radius: 50%; } .header__lang-icon img, .header__lang-icon svg { display: block; width: 100%; height: 100%; } .header__lang-txt { display: inline-block; vertical-align: middle; font-size: 19.2px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: normal; text-align: left; color: #6c6c6c; padding-left: 8px; text-transform: uppercase; } .header__drop { padding-top: 22px; width: 100%; position: relative; display: none; overflow: hidden; } .header__drop::before { content: ''; position: absolute; top: -10px; border: 20px solid transparent; border-bottom: 20px solid #e6e6e6; } .header__drop-inner { background-color: #e6e6e6; padding: 24px 30px; } .header__drop-inner--lang { padding: 38px 30px; } .header__drop-list li { display: block; padding-bottom: 9px; } .header__drop-list li:last-child { padding-bottom: 0; } .header__drop-list li a { 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-user::before { left: 0; } .header__drop-search::before { left: 50%; margin-left: -20px; } .header__drop-lang::before { left: auto; right: 0; } .header__form { width: 100%; position: relative; } .header__form .input { height: 20px; border: 0; background-color: transparent; padding: 0 40px 0 0; position: relative; z-index: 0; width: 100%; } .header__form-icon { position: absolute; top: 0; right: 0; width: 20px; height: 20px; z-index: 1; cursor: pointer; } .header__form-icon svg { width: 100%; height: 100%; display: block; stroke: #6c6c6c; } .header .container { position: relative; } .history { padding: 0 0 46px 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 { text-transform: uppercase; } .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: 50px; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: 0.7px; color: #00517a; } .history__table td:last-child { text-align: right; padding-right: 0; } .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: 20px; width: 10px; -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); position: relative; right: 5px; } .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 15px; } .history__table-date { text-transform: none; width: 100%; } .history__table-title { color: #6c6c6c; } .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: 10px 0 10px; } .interest-place__head { height: 141px; background-size: cover; background-position: center; margin-bottom: 20px; border-radius: 3px; } .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: 24px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.36; letter-spacing: 1.1px; text-align: center; color: #ffffff; text-transform: uppercase; display: block; } .interest-place__content-image { padding: 19px 0 12px; } .interest-place__content-image img { width: 100%; } .interest-place__content-bg { height: 300px; background-size: cover; background-position: center; border-radius: 3px; margin: 30px 0; } .interest-place__content-info { border-top: solid 2px #bfbfbf; padding: 18px 0 11px; text-align: center; margin-top: 20px; } .interest-place__content .content-slider__dots { margin-top: 16px; } .interest-place__player { border-radius: 3px; } .interest-place__player img { width: 100%; } .interest-places { padding: 10px 0 30px; } .interest-places__head { margin-top: -5px; } .interest-places__title { font-family: 'PT Sans Caption'; font-size: 26px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: 1.1px; text-transform: uppercase; display: inline-block; color: #00517a; margin-bottom: 17px; } .kitchen { padding: 13px 0 10px; } .kitchen__head { height: 141px; background-size: cover; background-position: center; margin-bottom: 20px; border-radius: 3px; } .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-image img { border-radius: 3px; width: 100%; } .lifhak-comfort { font-size: 0; line-height: 0; padding: 0; } .lifhak-comfort::after { content: ""; display: table; clear: both; } .lifhak-comfort__holder { display: block; width: 100%; height: 100%; position: relative; } .lifhak-comfort__holder::after { content: ""; display: table; clear: both; } .lifhak-comfort__caption { display: block; text-align: center; font-size: 20px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.8; letter-spacing: 0.9px; color: #00517a; text-transform: uppercase; margin-bottom: 30px; } .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: 100%; } .lifhak-comfort__item { font-size: 0; line-height: 0; padding-bottom: 32px; } .lifhak-comfort__item:last-child { padding-bottom: 20px; } .lifhak-comfort__img { display: block; vertical-align: top; font-size: 16px; line-height: normal; width: 200px; margin: 0 auto; } .lifhak-comfort__description { display: inline-block; vertical-align: top; font-size: 16px; line-height: normal; width: 100%; margin-top: 13px; } .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: #00517a; 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: 141px; background-size: cover; background-position: center; margin-bottom: 22px; border-radius: 3px; } .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: 20px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.35; letter-spacing: normal; text-align: center; color: #6c6c6c; padding: 0 22px 14px; } .lifhak-interest { padding: 35px 0 20px; line-height: 0; font-size: 0; } .lifhak-interest__content { display: table; width: 100%; } .lifhak-interest__content-inner { font-size: 0; line-height: 0; text-align: center; width: 100%; padding-top: 29px; display: inline-block; vertical-align: top; } .lifhak-interest__title { font-family: 'PT Sans Caption'; font-size: 20px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.3; letter-spacing: 0.7px; text-transform: uppercase; color: #00517a; padding: 0 10px 0; text-align: center; display: block; } .lifhak-interest__item { display: inline-block; letter-spacing: normal; vertical-align: top; font-size: 16px; width: 45%; padding: 0 10px; margin-bottom: 20px; } .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: #00517a; } .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-saving { padding-bottom: 13px; } .lifhak-saving__caption { font-family: 'PT Sans Caption'; font-size: 20px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: 0.9px; text-transform: uppercase; color: #00517a; padding-bottom: 20px; text-align: center; display: block; } .lifhak-saving__inner { padding: 0 0; font-size: 0; line-height: 0; } .lifhak-saving__description { display: block; font-size: 16px; line-height: normal; width: 100%; } .lifhak-saving__description a { color: #fe3824; border-bottom-color: #fe3824; } .lifhak-saving__description p { line-height: 1.44; } .lifhak-saving__description--mod { margin-top: 20px; width: 100%; } .lifhak-saving__title { font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.38; letter-spacing: 0.7px; display: block; text-transform: uppercase; color: #00517a; } .lifhak-saving__numbers { display: table-cell; vertical-align: middle; } .lifhak-saving__numbers--mod { padding-top: 5px; } .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: 4px 15px 28px; margin-left: -4px; } @media (max-width: 479px) { .lifhak-saving__item { padding: 4px 10px 9px; } } @media (max-width: 339px) { .lifhak-saving__item { padding: 4px 5px 9px; } } .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: #00517a; } @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: 13.4px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: 0.5px; } .lifhak-saving__num sup { position: relative; top: -21px; left: 11px; } .lifhak-saving__num sub { position: relative; left: -7px; } .lifhak-saving__num--txt { font-size: 29px; font-weight: bold; font-style: normal; font-stretch: normal; line-height: 0.95; letter-spacing: -0.01em; text-transform: uppercase; } .lifhak-saving__text { font-size: 12px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: 0.6px; display: block; color: #00517a; margin-top: -4px; } .lifhak-saving__text--mod { max-width: 250px; margin: 3px auto 0; padding-bottom: 5px; } .lifhak-security { padding: 0 0 20px; } .lifhak-security__caption { text-transform: uppercase; display: block; text-align: center; font-size: 20px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.8; letter-spacing: 0.9px; color: #00517a; margin-bottom: 10px; } .lifhak-security__content { display: block; width: 100%; } .lifhak-security__description { display: block; width: 100%; padding: 0 6px; } .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: 18px 0 5px; color: #00517a; } .lifhak-security__image { background-size: cover; background-position: top center; display: block; width: 100%; height: 187px; } .magazine { border-top: solid 2px #00517a; padding: 20px 0 10px; } .magazine__inner { padding-bottom: 20px; } .magazine__inner::after { content: ""; display: table; clear: both; } .magazine__image { float: left; background-repeat: no-repeat; background-size: cover; background-position: center; width: 50%; position: relative; border-radius: 3px; } @media (max-width: 539px) { .magazine__image { width: 100%; margin: 0 0 20px; } } .magazine__image img { display: block; margin: auto; width: 100%; } .magazine__icon { position: absolute; bottom: 0; left: 9px; } .magazine__icon svg { width: 45px; height: 43px; } .magazine__description { float: left; width: 50%; padding-left: 20px; } @media (max-width: 539px) { .magazine__description { width: 100%; padding-left: 0; } } .magazine .category-tag { margin-bottom: 2px; position: relative; top: -6px; } .magazine__name { font-size: 22px; font-family: 'PT Sans Caption'; line-height: 1.8; color: #00517a; 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: 10px; } .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; } .main { padding-bottom: 43px; } .main__restaurant { margin-top: 31px; 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: #00517a; } .main__restaurant-title svg { height: 23px; width: 11px; display: block; fill: #00517a; position: absolute; right: -30px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .main__restaurant-slider { margin: 15px -3px 0; } .main__restaurant-slider .slider-arrow { margin-top: -75px; } .main__restaurant-slide { padding: 0 3px; } .main__joy { margin-top: 38px; } .main__rus { margin-top: 10px; } .main--v .main__football { top: 0; } .map-content { width: 100%; margin-bottom: 15px; } .map-content--place { margin: 20px 0 25px; } .map-content__yandex { border-radius: 3px; height: 305px; margin-bottom: 16px; } .map-content__inner { border-bottom: solid 2px #bfbfbf; padding-bottom: 15px; text-align: center; word-spacing: -0.36em; } @media (max-width: 539px) { .map-content__inner { padding-bottom: 5px; } } .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; } @media (max-width: 539px) { .map-content__btn { display: block; max-width: 100%; margin: 0 0 10px; } } .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: #00517a; 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 #00517a; padding: 20px 0 20px; } .music-onelist__inner::after { content: ""; display: table; clear: both; } .music-onelist__image { width: 30%; float: left; padding-top: 36px; border-radius: 3px; } @media (max-width: 639px) { .music-onelist__image { width: 100%; padding-top: 10px; } .music-onelist__image img { max-height: 300px; display: block; margin: 0 auto 5px; } } @media (max-width: 639px) and (max-width: 374px) { .music-onelist__image img { max-height: 100%; } } .music-onelist .category-tag { margin-bottom: 2px; position: relative; top: -6px; word-spacing: normal; } .music-onelist__name { font-size: 22px; font-family: 'PT Sans Caption'; line-height: 1.11; color: #00517a; 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: 10px; word-spacing: normal; } .music-onelist__player { float: left; width: 70%; padding-left: 8px; } .audiobook-onelist__player { float: left; width: 99%; padding-left: 8px; } @media (max-width: 639px) { .music-onelist__player { width: 100%; padding: 0; } } .music-onelist__player-title { font-size: 14px; display: inline-block; color: #00517a; line-height: 1.38; letter-spacing: 0.7px; text-transform: uppercase; padding-bottom: 14px; } .one-audiobook { border-top: 2px solid #00517a; padding: 30px 0 20px; } .one-audiobook__inner::after { content: ""; display: table; clear: both; } .one-audiobook__image { width: 50%; float: left; } @media (max-width: 639px) { .one-audiobook__image { width: 100%; text-align: center; padding-bottom: 10px; float: none; } } .one-audiobook__image img { width: 100%; } @media (max-width: 639px) { .one-audiobook__image img { width: auto; } } .one-audiobook__description { float: left; width: 50%; padding-left: 20px; } @media (max-width: 639px) { .one-audiobook__description { width: 100%; padding: 0 0 20px; } } .one-audiobook__description-list { display: inline-block; vertical-align: top; margin-top: 3px; } .one-audiobook .category-tag { margin-bottom: 2px; position: relative; top: -6px; } .one-audiobook__name { font-size: 22px; font-family: 'PT Sans Caption'; line-height: 1.11; color: #00517a; 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: 15px; word-spacing: normal; } .one-audiobook__content { display: inline-block; vertical-align: top; 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: 3px 0; font-size: 14px; letter-spacing: 0.8px; line-height: normal; color: #0299e2; } .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: 20px; } .one-audiobook__player-title { font-size: 14px; display: inline-block; color: #00517a; line-height: 1.38; letter-spacing: 0.7px; text-transform: uppercase; padding-bottom: 12px; } .one-book { border-top: 2px solid #00517a; padding: 30px 0 20px; } .one-book__inner::after { content: ""; display: table; clear: both; } .one-book__image { width: 50%; float: left; } @media (max-width: 639px) { .one-book__image { width: 100%; text-align: center; padding-bottom: 10px; float: none; } } .one-book__image img { width: 100%; } @media (max-width: 639px) { .one-book__image img { width: auto; } } .one-book__link { display: inline-block; color: #00517a; line-height: 1.38; letter-spacing: 0.7px; text-transform: uppercase; margin-top: 13px; } @media (max-width: 639px) { .one-book__link { display: block; margin-top: 5px; } } .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: 50%; padding-left: 20px; } @media (max-width: 639px) { .one-book__description { width: 100%; padding: 0; } } .one-book__description-list { margin-top: 20px; } .one-book .category-tag { margin-bottom: 2px; position: relative; top: -6px; } .one-book__name { font-size: 22px; font-family: 'PT Sans Caption'; line-height: 1.11; color: #00517a; 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: 15px; } .one-book__list { display: inline-block; margin-right: 31px; } .one-book__list--last { margin-right: 0; } .one-book__list-item { padding: 3px 0; font-size: 14px; letter-spacing: 0.8px; line-height: normal; color: #0299e2; } .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: 340px; 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: 20px 15px; background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, 0)), to(#202227)); background-image: linear-gradient(to left, rgba(0, 0, 0, 0), #202227); } .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: 24px; 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 10px 0; text-transform: uppercase; } .one-film__head-year { font-size: 14px; line-height: 16px; color: #989898; padding: 0 0 10px 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__slider.slider-head .slick-dots { bottom: 0; } .one-film__slider.slider-head .slick-arrow { display: none!important; } .one-film__descr { padding: 0 0 20px 0; } .one-film__col-title { font-size: 16px; text-transform: uppercase; line-height: 23px; color: #00517a; 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-game { border-top: 2px solid #00517a; padding: 30px 0 20px; } .one-game__inner::after { content: ""; display: table; clear: both; } .one-game__image { width: 228px; float: left; } @media (max-width: 539px) { .one-game__image { width: 100%; float: none; padding-bottom: 20px; } } .one-game__image img { width: 100%; } .one-game__description { float: left; width: calc(100% - 228px); padding-left: 20px; } @media (max-width: 539px) { .one-game__description { width: 100%; float: none; padding: 0; } } .one-game .category-tag { margin-bottom: 2px; position: relative; top: -6px; } .one-game__name { font-size: 22px; font-family: 'PT Sans Caption'; line-height: 1.11; color: #00517a; 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: 15px; } .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: 15px 0 0; } .one-game__desc-title { font-size: 14px; text-transform: uppercase; line-height: 23px; color: #00517a; letter-spacing: normal; display: block; margin-bottom: 10px; } .one-station { padding: 10px 0 10px; } .one-station__head { height: 141px; background-size: cover; background-position: center; margin-bottom: 20px; border-radius: 3px; } .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: 24px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.36; letter-spacing: 1.1px; text-align: center; color: #ffffff; text-transform: uppercase; display: block; } .one-station__content-image { padding: 19px 0 12px; } .one-station__content-image img { width: 100%; } .pagination { font-size: 0; line-height: 0; display: block; margin-bottom: 12px; } .pagination__list { display: inline-block; } .pagination__list-item { font-size: 20px; line-height: normal; padding-right: 21px; display: inline-block; } .pagination__list-link { color: #0c81bb; } .pagination__list-link:hover { color: #cb1711; } .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: #cb1711; } .pagination__arrow { display: inline-block; line-height: normal; font-size: 16px; border-left: 1px solid #00517a; padding-left: 30px; } .pagination__arrow svg { fill: #00517a; } .pagination__arrow svg:hover { fill: #cb1711; } .pagination__arrow-left { display: inline-block; padding: 0 3px; } .pagination__arrow-right { display: inline-block; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); padding: 0 3px; } .city { min-height: 216px; margin: 0 -3px; } .city__slide { width: 100%; min-height: 216px; padding: 0 3px; } .city__slide::after { content: ""; display: table; clear: both; } .city__slide-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; margin-bottom: 6px; } .city__slide-txt { width: 100%; min-height: 216px; padding: 14px 20px 9px; background-color: #031634; border-radius: 3px; overflow: hidden; } .city__slide-txt p { font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.36; letter-spacing: normal; text-align: left; color: #ffffff; margin-bottom: 10px; } .city__slide-link { font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.57; letter-spacing: normal; text-align: left; color: #d8d8d8; border-bottom: 1px solid #d8d8d8; } .city__slide-link:hover { border-bottom: 1px solid transparent; } .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; display: none !important; } @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 .slider-arrow--prev::before { content: ''; position: absolute; top: -5px; left: -5px; width: 53px; height: 40px; -webkit-box-shadow: inset 1px 1px 4px #000000; box-shadow: inset 1px 1px 4px #000000; } .city .slick-track, .city .slick-list { height: 100%; } .city .slick-track div:not([class]), .city .slick-list div:not([class]) { height: 100%; } .plate { display: block; margin: 0 -2.5px; word-spacing: -0.36em; font-size: 0; } .plate__col { display: inline-block; word-spacing: normal; vertical-align: top; padding: 2.5px 2px; position: relative; font-size: 16px; } .plate__col-1 { width: 100%; } .plate__col-2-3 { width: 66.666666%; } .plate__col-1-2 { width: 50%; } .plate__col-1-3 { width: 33.333333%; } .plate__col-1-4 { width: 25%; } @media (max-width: 479px) { .plate__col-xs-1 { width: 100%; } } @media (max-width: 479px) { .plate__col-xs-2-3 { width: 66.666666%; } } @media (max-width: 479px) { .plate__col-xs-1-2 { width: 50%; } } @media (max-width: 479px) { .plate__col-xs-1-3 { width: 33.333333%; } } @media (max-width: 479px) { .plate__col-xs-1-4 { width: 25%; } } .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; } .plate__slide-link { font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 0; letter-spacing: normal; text-align: left; margin-left: 57%; color: #217cff; border-bottom: 1px solid #217cff; } .plate--bg img { width: 100%; height: 100%; display: block; -o-object-fit: cover; object-fit: cover; } .plate--t-container { display: table; height: 100%; width: 100%; position: relative; z-index: 1; } .plate__football { margin-top: 5px; width: 100%; height: 290px; border-radius: 3px; overflow: hidden; background: rgba(255, 255, 255, 0) url(../pic/football/football-bg.jpg) 0 0 no-repeat; background-size: cover; display: block; padding: 27px 18px; } .plate__football-icon { width: 70px; height: 70px; background: rgba(255, 255, 255, 0) url(../pic/football/football.png) 0 0 no-repeat; background-size: contain; } .plate__football-title { margin-top: 18px; font-size: 28px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.14; letter-spacing: normal; text-align: left; color: #ffffff; } .plate__football-year { margin-top: 2px; font-size: 36px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: normal; text-align: left; color: #fecf01; } .plate__football-result { margin-top: 18px; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: 0.6px; text-align: left; color: #ffffff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; text-transform: uppercase; } .plate__football-result-icon { display: block; width: 7px; height: 14px; margin-left: 10px; } .plate__football-result-icon svg { display: block; width: 100%; height: 100%; fill: #fff; } .plate__auth { background: rgba(255, 255, 255, 0) url(../pic/main/autorization.png) 0 0 no-repeat; background-size: cover; width: 100%; height: 180px; display: table; padding: 10px 25px; border-radius: 3px; position: relative; z-index: 10; } @media (max-width: 479px) { .plate__auth { padding: 10px 12px; } } .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: inline-block; vertical-align: middle; width: 33px; height: 24px; } .plate__auth-icon svg { width: 100%; height: 100%; display: block; fill: #fff; } .plate__auth-title { display: inline-block; vertical-align: middle; font-size: 16px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.31; letter-spacing: normal; text-align: left; color: #ffffff; padding-left: 17px; } .plate__auth-tel { margin-top: 20px; } .plate__auth-tel .select-city { height: 100%; } .plate__auth-btn { margin-top: 24px; } .plate__taxi { background: #0c81bb url("/pic/main/taxi.webp"); background-size: cover; width: 100%; height: 180px; display: block; border-radius: 3px; text-align: center; outline-color: #000; position: relative; padding: 15px 20px; z-index: 1; } .plate__taxi:hover .plate__taxi-bg { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .plate__taxi-bg { padding: 17px 5px 5px; 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; } .plate__taxi-map { position: absolute; top: 20px; bottom: 20px; left: 25px; right: 25px; z-index: -1; } .plate__taxi-map img { height: 100%; display: block; margin: 0 auto; max-width: 100%; } .plate__taxi-main { text-align: left; } .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; display: inline-block; vertical-align: middle; margin-right: 5px; } .plate__taxi-icon svg { width: 100%; height: 100%; fill: #fff; } .plate__taxi-title { display: inline-block; font-size: 19px; line-height: 22px; letter-spacing: .8px; color: #fff; text-transform: uppercase; } .plate__taxi-select { display: block; width: 100%; margin: 5px 0; font-size: 18px; line-height: 20px; padding: 6px 15px 6px 0; background-color: transparent; background-image: url(data:image/svg+xml;base64,PHN2ZyBpZD0i0KHQu9C+0LlfMSIgZGF0YS1uYW1lPSLQodC70L7QuSAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMCAxMiI+DQogIDxwb2x5Z29uIGlkPSJhcnJvdy1sIiBwb2ludHM9IjEuMjEgMCAwIDEuMjkgMTAgMTIgMjAgMS4yOSAxOC43OSAwIDEwIDkuNDEgMS4yMSAwIiBmaWxsPSIjZmZmIi8+DQo8L3N2Zz4NCg==); background-size: 10px 6px; background-position: center right; border: none; color: #fff; border-bottom: 1px solid #fff; height: 32px; } .plate__taxi-phone { text-align: center; font-size: 14px; line-height: 13px; color: #fff; } .plate__buy { width: 100%; height: 98px; border-radius: 3px; overflow: hidden; display: block; padding: 10px 20px; position: relative; } @media (max-width: 479px) { .plate__buy { padding: 10px; } } .plate__buy--lg { padding-top: 130px; } .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; } .plate__buy-bg img { width: 100%; height: 100%; display: block; } .plate__buy-holder { display: table-cell; vertical-align: bottom; position: relative; z-index: 1; } .plate__buy-title { margin-top: 22px; text-transform: uppercase; font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.07; letter-spacing: 0.7px; text-align: left; color: #ffffff; } .plate__serv { width: 100%; height: 98px; border-radius: 3px; overflow: hidden; display: block; padding: 10px 20px; position: relative; } @media (max-width: 479px) { .plate__serv { padding: 10px; } } .plate__serv-holder { display: table-cell; vertical-align: bottom; 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 { text-transform: uppercase; font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; letter-spacing: 0.7px; text-align: left; color: #ffffff; } .plate__hack { background: url("pic/main/akparat.png") no-repeat center center; background-size: cover; /* или contain если нужно целиком */ width: 100%; height: 98px; border-radius: 3px; overflow: hidden; display: table; padding: 10px 20px; } @media (max-width: 479px) { .plate__hack { padding: 10px 5px; } } .plate__hack-holder { display: table-cell; vertical-align: bottom; } .plate__hack-title { text-transform: uppercase; font-size: 12px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.33; letter-spacing: 0.6px; text-align: left; color: #4a4a4a; font-family: 'PT Sans Caption'; } @media (max-width: 479px) { .plate__hack-title .br { display: inline; } } .plate__shop { width: 100%; height: 180px; 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: 16px 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: 8px; 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: 98px; border-radius: 3px; overflow: hidden; display: table; padding: 5px; text-align: center; } .plate__resq-holder { display: table-cell; vertical-align: middle; } .plate__resq-num { font-size: 30px; 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: 98px; border-radius: 3px; overflow: hidden; display: block; padding: 10px 20px; position: relative; } @media (max-width: 479px) { .plate__currency { padding: 10px; } } .plate__currency-holder { display: table-cell; vertical-align: middle; position: relative; z-index: 1; } .plate__currency-title { margin-top: 55px; text-transform: uppercase; font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.07; letter-spacing: 0.7px; text-align: left; color: #ffffff; } .plate__poster { position: relative; width: 100%; height: 410px; display: block; } .plate__poster .front { border-radius: 3px; overflow: hidden; height: 100%; } @media (max-width: 499px) { .plate__poster .front { height: auto; } } .plate__poster .front img { width: 100%; height: 100%; display: block; -o-object-fit: cover; object-fit: cover; } .plate__film { position: relative; width: 100%; height: 98px; display: block; overflow: hidden; border-radius: 3px; z-index: 1; padding: 16px 20px; } .plate__film img { height: auto; width: 100%; display: block; position: absolute; top: 0; left: 0; z-index: 0; -o-object-fit: cover; object-fit: cover; } .plate__film-icon { position: relative; z-index: 2; width: 38px; height: 38px; } .plate__film-icon img, .plate__film-icon svg { display: block; width: 100%; height: 100%; } .plate__film-txt { margin-top: 10px; position: relative; z-index: 2; 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 { display: block; width: 100%; height: 201px; overflow: hidden; position: relative; border-radius: 3px; z-index: 1; padding: 17px 7.5px 17px 13px; } .plate__books-img { width: 72px; float: left; } .plate__books-auth { width: calc(100% - 72px); padding-left: 10.5px; float: left; } .plate__books-holder { margin-top: 20px; } .plate__books-holder::after { content: ""; display: table; clear: both; } .plate__books-type { font-size: 12px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.5; letter-spacing: 0.6px; text-align: left; color: #ffffff; text-transform: uppercase; } .plate__books-title { margin-top: 8px; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.14; letter-spacing: normal; text-align: left; color: #ffffff; } .plate__books-author { margin-top: 10px; padding-top: 8px; border-top: 1px solid rgba(255, 255, 255, 0.4); font-size: 13px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.46; letter-spacing: normal; text-align: left; color: #ffffff; } .plate__books-icon { 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; } .plate__books-icon svg { width: 43px; height: 34px; display: block; fill: #fff; } .plate__books-link { padding-left: 13px; text-transform: uppercase; font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.16; letter-spacing: 0.8px; text-align: left; color: #ffffff; 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; } .plate__books-link span { padding-right: 10px; } .plate__books-link svg { width: 10px; height: 20px; fill: #fff; stroke: #fff; } .plate__pressa { width: 100%; height: 300px; position: relative; overflow: hidden; padding: 14px 14px; display: block; border-radius: 3px; z-index: 1; } .plate__pressa-holder { position: relative; z-index: 2; } .plate__pressa-type { margin-top: 17px; 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__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-txt { margin-top: -2px; font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.27; letter-spacing: normal; text-align: left; color: #ffffff; max-height: 57px; overflow: hidden; } .plate__pressa-author { padding-top: 14px; margin-top: 16px; border-top: 1px solid rgba(255, 255, 255, 0.4); 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-icon svg { width: 40px; height: 35px; display: block; fill: #fff; } .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__audio { width: 100%; height: 98px; position: relative; overflow: hidden; padding: 0; display: block; border-radius: 3px; z-index: 1; margin-top: 5px; } .plate__audio:first-child { margin-top: 0; } .plate__audio--dark .plate__audio-icon svg { background-color: transparent; fill: #4a4a4a; 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: #4a4a4a; } .plate__audio-holder { position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; padding: 13px; } .plate__audio-icon { width: 40px; height: 40px; display: block; } .plate__audio-icon svg { width: 100%; height: 100%; display: block; fill: #fff; } .plate__audio-title { margin-top: 5px; font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.07; letter-spacing: 0.7px; text-align: left; color: #ffffff; text-transform: uppercase; } .plate__img { position: relative; width: 100%; height: 235px; display: block; overflow: hidden; border-radius: 3px; z-index: 1; } .plate__img-interest { height: 234.5px; } .plate__img--sm { height: 145.6px; } .plate__img--sm .plate__img-title { font-size: 15px; line-height: 1.07; } .plate__img--md { height: 180px; } .plate__img--md .plate__img-title { font-size: 15px; line-height: 1.07; } .plate__img--shadow .plate--bg::before { content: ''; background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.8)), color-stop(40%, rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0))); background-image: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.2) 40%, rgba(0, 0, 0, 0) 100%); height: 100%; width: 100%; z-index: 1; position: absolute; left: 0; top: 0; } .plate__img-title { text-transform: uppercase; position: absolute; left: 0; bottom: 0; padding: 9px 14px; z-index: 1; font-size: 19px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.16; letter-spacing: 0.7px; text-align: left; color: #ffffff; } .plate__img-title--lg { font-size: 19px; line-height: 1.16; } .plate__img-icon { display: block; margin-bottom: 11px; width: 51px; height: 70px; } .plate__img-icon svg { display: block; width: 100%; height: 100%; fill: #fff; } .plate__news { border-radius: 3px; background: #0c81bb url("/pic/main/news_mob.webp") no-repeat center center; background-size: cover; /* или contain, если важно вписать */ width: 100%; height: 633px; overflow: hidden; position: relative; padding: 16px 14px; } .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; } @media (max-width: 479px) { .plate__news-title-item:first-child { font-size: 15px; } } .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: -15px; } .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__tourist { border-radius: 3px; background-color: #e6e6e6; width: 100%; height: 180px; overflow: hidden; position: relative; display: block; z-index: 1; padding: 20px; } .plate__tourist .plate--bg::before { content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; opacity: .5; background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.6)), to(rgba(0, 0, 0, 0.6))), -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(#000000)); background-image: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)), linear-gradient(to bottom, rgba(0, 0, 0, 0), #000000); } .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-title { text-transform: uppercase; font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.16; letter-spacing: 0.8px; text-align: left; position: relative; z-index: 2; color: #ffffff; } .plate__tourist-txt { margin-top: 7px; font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.27; letter-spacing: normal; text-align: left; color: #ffffff; position: relative; z-index: 2; } .plate__tourist-btn { margin-top: 20px; position: relative; z-index: 2; } .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 { height: 430px; border-radius: 3px; overflow: hidden; width: 100%; display: block; position: relative; } .plate__board-inner { text-align: center; position: relative; z-index: 1; color: #fff; font-family: 'PT Sans Caption'; padding: 0; display: table; height: 100%; width: 100%; color: #00517a; padding: 10px; } .plate__board-inner-cell { display: table-cell; height: 100%; width: 100%; vertical-align: bottom; } .plate__board-year { display: block; font-size: 28px; line-height: 33px; } .plate__board-subtitle { display: block; font-size: 24px; line-height: 23px; } .plate__board-title { display: block; font-size: 42px; line-height: 1.6; text-transform: uppercase; } .plate__audiogid { background-color: #ffc400; width: 100%; height: 180px; 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: #4a4a4a; 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: #4a4a4a; text-transform: uppercase; text-align: center; } .plate__review { width: 100%; height: 180px; border-radius: 3px; overflow: hidden; display: block; padding: 20px; position: relative; } .plate__review-holder { display: table-cell; vertical-align: bottom; position: relative; z-index: 1; } .plate__review-title { margin-top: 8px; text-transform: uppercase; font-size: 19px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.07; letter-spacing: 0.7px; text-align: left; color: #ffffff; } .plate__review-icon { width: 50px; height: 42px; } .plate__review-icon svg { width: 100%; height: 100%; fill: #fff; } .plate__games { display: block; width: 100%; position: relative; overflow: hidden; border-radius: 3px; z-index: 1; padding: 10px; height: 201px; color: #fff; } .plate__games-holder { display: table-cell; height: 100%; vertical-align: bottom; } .plate__games-icon { width: 50px; height: 50px; } .plate__games-icon svg { width: 100%; height: 100%; display: block; fill: #fff; } .plate__games-icon2 { width: 32px; height: 32px; } .plate__games-icon2 svg { width: 100%; height: 100%; display: block; fill: #ffffff; } .plate__games-title { display: block; font-size: 15px; line-height: 22px; text-transform: uppercase; letter-spacing: .7px; margin: 7px 0 0 0; } .plate__games-title--dark { color: #ffffff; } @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; } } .poster-slider { margin: 0 -1px 2px; } .poster-slider-item { padding: 0 2.5px; } @-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__holder { 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: end; -ms-flex-align: end; align-items: flex-end; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-top: 13px; } .weather__holder-left { width: 50%; } .weather__holder-right { width: 50%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .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 24px; } .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 { 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; } .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: 95%; overflow: visible !important; } .popup__title { position: relative; padding: 0 50px 20px 10px; } .popup__title-sup { font-size: 24px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: 0; color: #ffffff; text-transform: uppercase; margin-left: -2px; } .popup__title-sub { margin-top: 10px; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.27; letter-spacing: normal; color: #ffffff; } .popup__body { height: auto; border-radius: 8px; background-color: #ffffff; padding: 10px 15px 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 { border-top: 0 !important; } .popup__form-item { position: relative; } .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 50px; } @media (max-width: 379px) { .popup__txt .popup__title-sub { padding: 0 10px; } } .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: #217cff; border-bottom: 1px solid #217cff; } @media (max-width: 379px) { .popup__txt-links li a { font-size: 13px; } } .popup__txt-links li a:hover { border-bottom-color: rgba(255, 255, 255, 0); } .popup__scroll { height: 250px; overflow: hidden; color: #fff; font-size: 15px; line-height: 1.27; font-family: 'PT Sans'; } .popup__scroll .mCSB_inside > .mCSB_container { margin-right: 20px; margin-left: 20px; } .popup__scroll .mCSB_scrollTools { right: auto; left: 0; 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: 17px 0 0 0; } .popup__offert-btm::after { content: ""; display: table; clear: both; } .popup__offert-checkbox { padding: 0 0 10px 0; } .fancybox-bg { background-color: #006699; } .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: 10px 0 10px; } .pressa-article__head { height: 141px; background-size: cover; background-position: center; margin-bottom: 20px; } .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: 15px; } .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 { font-size: 24px; line-height: 1.36; text-transform: uppercase; letter-spacing: 1.1px; color: #fff; font-weight: normal; } .pressa-article__content-image { padding: 19px 0 12px; } .pressa-article__content-image img { width: 100%; } .pressa-article__content-bg { height: 300px; background-size: cover; background-position: center; border-radius: 3px; margin: 30px 0; } .pressa { padding: 12px 0 0; } .pressa--top { padding-bottom: 30px; } .pressa__head { padding: 0 0 20px; position: relative; } .pressa .genres { margin-top: 0; } .pressa__search { position: absolute; right: 0; top: 0; } .pressa__search .search__input { padding: 0 35px 0 2px; } .pressa__search .search__icon { bottom: 6px; } .restaurant { padding: 6px 0 46px 0; } .restaurant__plate { padding: 20px 0 12px; } .restaurant .pressa__head { padding-bottom: 0; } .restaurant-item { height: 559px; width: 100%; border-radius: 3px; position: relative; cursor: pointer; } .restaurant-item--lg .restaurant-item__title { font-size: 36px; line-height: 1; } .restaurant-item--lg .restaurant-item__body { padding: 40px 18px 21px; } .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__drop { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; position: absolute; z-index: 1; bottom: 0; left: 0; width: 100%; background-color: #0c81bb; color: #fff; padding: 23px 15px 15px; min-height: calc(100% - 380px); border-bottom-left-radius: 3px; border-bottom-right-radius: 3px; } .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: 1.27; letter-spacing: normal; text-align: left; color: #ffffff; margin-bottom: 10px; } .restaurant-item__drop-txt:last-child { margin-bottom: 0; } .restaurant-item__drop::before { content: attr(data-title); width: 100%; display: block; padding: 0 0 10px 0; text-transform: uppercase; font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.07; letter-spacing: 0.7px; text-align: left; color: #ffffff; } .restaurant-item__img { position: relative; top: 0; right: 0; width: 100%; height: 380px; z-index: 0; border-top-left-radius: 3px; border-top-right-radius: 3px; overflow: hidden; } .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__img::before { content: ''; background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, 0.8)), color-stop(40%, rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0))); background-image: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.2) 40%, rgba(0, 0, 0, 0) 100%); height: 100%; width: 100%; z-index: 1; position: absolute; left: 0; top: 0; } .restaurant-item__img img { display: block; width: 100%; height: 100%; border-radius: 6px; -o-object-fit: cover; object-fit: cover; } .restaurant-item__cost { padding: 0 0 10px 0; } .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: 20px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: left; color: #fff; } .restaurant-item__cost-order { padding-top: 8px; float: left; display: block; position: relative; top: -5px; padding-right: 14px; margin-left: 30px; font-size: 13px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: 0.6px; text-align: left; color: #ffffff; } .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; } .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; text-align: left; color: #ffffff; border-bottom: 1px solid transparent; } .goods { border-radius: 3px; border: solid 1px #e6e6e6; height: 400px; background-color: #031634; overflow: hidden; } @media (max-width: 579px) { .goods { height: auto; } } .goods .restaurant-item__img { background-color: #fff; height: 210px; border-bottom-left-radius: 0; border-bottom-right-radius: 0; text-align: center; padding: 5px; position: static; } .goods .restaurant-item__img::before { display: none; } .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: transparent; background-image: none; } .goods .restaurant-item__title { color: #fff; text-align: left; } .goods .restaurant-item__cost { position: absolute; bottom: 0; left: 0; margin-top: 0; width: 100%; padding: 0 15px 15px; background-color: #031634; z-index: 1; } .goods .restaurant-item__cost-price { color: #217cff; } .goods .restaurant-item__cost-order svg { fill: #fff; } .goods .restaurant-item__cost-order span { color: #fff; } .goods .restaurant-item__drop { display: block; position: static; z-index: 0 !important; min-height: 1px; padding-bottom: 50px; } .goods .restaurant-item__drop-txt { margin-top: 10px; } .schedule { height: 600px; border-radius: 3px; overflow: hidden; position: relative; background: #e6e6e6 url("/pic/main/schedule.webp") no-repeat center center; background-size: cover; /* картинка растягивается и красиво закрывает блок */ } .schedule--mod { height: 654px; } .schedule__title { text-transform: uppercase; background-color: #6c6c6c; padding: 20px 10px; text-align: center; font-size: 11.2px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.38; letter-spacing: 0.5px; color: #ffffff; } .schedule__scroll { overflow: hidden; height: calc(100% - 80px); } .schedule__scroll--nm { margin: 0; height: 300px; } .schedule__scroll--nm .mCSB_container { padding-left: 0 !important; padding-right: 0 !important; margin-right: 0; } .schedule__scroll .mCSB_container { margin-right: 0; } .schedule__body--dir { padding: 28px 14px 60px; position: relative; height: calc(100% - 62px); overflow: hidden; } .schedule__body--dir td:nth-child(1) { width: 50%; } @media (max-width: 479px) { .schedule__body--dir td:nth-child(1) { width: 44%; } } .schedule__body--dir td:nth-child(2) { width: 25%; } @media (max-width: 479px) { .schedule__body--dir td:nth-child(2) { width: 29%; } } .schedule__body--dir td:nth-child(3) { width: 25%; } @media (max-width: 479px) { .schedule__body--dir td:nth-child(3) { width: 29%; } } .schedule__body--schedule { padding: 15px 12px 29px 12px; position: relative; height: calc(100% - 80px); 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: 10%; text-align: center; } @media (max-width: 479px) { .schedule__body--schedule .schedule--long td:nth-child(1) { width: 15%; } } .schedule__body--schedule .schedule--long td:nth-child(2) { width: 45%; padding-left: 15px; } @media (max-width: 479px) { .schedule__body--schedule .schedule--long td:nth-child(2) { width: 55%; } } .schedule__body--schedule .schedule--long td:nth-child(3) { width: 45%; } @media (max-width: 479px) { .schedule__body--schedule .schedule--long td:nth-child(3) { width: 30%; } } .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 24px; position: absolute; bottom: 0; right: 0; width: 100%; 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; } .schedule__ctrl-btn { display: inline-block; vertical-align: top; width: 180px; } .schedule__ctrl-map { 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; padding-left: 10px; } .schedule__ctrl-map:hover span { text-decoration: none; } .schedule__ctrl-map svg { width: 26.4px; height: 20.2px; fill: #e6e6e6; } .schedule__ctrl-map span { padding-left: 10px; text-decoration: underline; font-size: 14px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 0.93; letter-spacing: normal; text-align: left; color: #e6e6e6; } .schedule__ctrl--schedule { padding-bottom: 25px; } .schedule__ctrl-arrows { float: right; padding: 0 28px; position: relative; text-align: center; font-size: 14px; line-height: 20px; color: #cc9902; } .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; } .schedule__dir-head { width: 100%; } .schedule__dir-head td { text-align: left; font-size: 13px; 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: 15px; 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; text-decoration: underline; } .schedule__dir td:first-child { position: relative; } .schedule__dir td:first-child a { color: #6c6c6c; } .schedule__dir tr.past td:first-child a { color: rgba(108, 108, 108, 0.3); font-weight: 700; text-decoration: none; } .schedule__dir tr.current td:first-child a { color: #cc9902; font-weight: 700; text-decoration: none; } .schedule__dir tr.next td:first-child a { -webkit-animation: blinker 1.5s linear infinite; animation: blinker 1.5s linear infinite; text-decoration: none; } .schedule__sh { width: 100%; border-collapse: collapse; } .schedule__sh-head td { padding-bottom: 35px; color: #d8d8d8; } .schedule__sh-head td::before { bottom: 19px; } .schedule__sh td { font-size: 15px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: normal; text-align: left; color: #d8d8d8; padding-bottom: 13px; vertical-align: top; } .schedule__sh tr.hidden { display: none; } .schedule__sub-content { display: none; } .schedule__sub-content.active { display: block; } .schedule__caption { padding: 5px 0; 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; } .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: 50%; opacity: 0.4; line-height: 1.38; position: relative; text-align: center; padding: 0 22px; } @media (max-width: 379px) { .schedule__caption li { padding: 0 15px; } } .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: 16px; } .schedule__filter::after { content: ""; display: table; clear: both; } .schedule__filter-item { width: 100%; text-align: center; } .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; } .schedule__filter-search-container { margin-top: 20px; width: 100%; padding: 0 12px 19px; } .schedule__slider { height: 450px; } .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: 11px 28px 0 11px; } .schedule__slider-scroll { margin: 0 -28px 0 0; height: 100%; } .schedule__slider-scroll .mCSB_inside > .mCSB_container { margin-right: 28px; } .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: #6c6c6c; 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: #6c6c6c; } .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; vertical-align: bottom; } .schedule__slider-table td { padding: 15px 10px 0 0; } .schedule-lg { background-color: #031634; min-height: calc(100% - 85px - 310px); padding-bottom: 46px; padding-left: 12px; padding-right: 12px; } .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: 66px; } .schedule-lg__title-txt { text-transform: uppercase; font-size: 24px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.5; letter-spacing: 1.1px; 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 { 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; } .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%; cursor: pointer; text-align: center; } .schedule-lg__caption li:first-child { padding-right: 20px; position: relative; } @media (max-width: 379px) { .schedule-lg__caption li:first-child { width: 60%; } } .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 { padding-left: 20px; } @media (max-width: 379px) { .schedule-lg__caption li:last-child { width: 40%; } } .schedule-lg__caption li.active, .schedule-lg__caption li:hover { opacity: 1; } .schedule-lg__search { position: relative; margin-top: 20px; } .schedule-lg__search-icon { position: absolute; right: 0; top: 10px; 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 thead th { padding-bottom: 8px; } .schedule-lg__table th, .schedule-lg__table td { padding: 0 10px; } @media (max-width: 379px) { .schedule-lg__table th, .schedule-lg__table td { padding: 0 5px; } } @media (max-width: 479px) { .schedule-lg__table th:nth-child(2), .schedule-lg__table td:nth-child(2) { width: 52%; } } .schedule-lg__table th { text-align: left; font-size: 13px; 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; } @media (max-width: 479px) { .schedule-lg__table th:first-child { padding-left: 0; } } .schedule-lg__table th:nth-child(3), .schedule-lg__table th:nth-child(4) { overflow-wrap: break-word; word-wrap: break-word; word-break: break-all; } .schedule-lg__table td { font-size: 15px; 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; } @media (max-width: 479px) { .schedule-lg__table td:first-child { padding-left: 0; } } .schedule-lg .schedule { height: auto; } .schedule-lg .schedule__title { padding: 21px 10px; } .schedule-lg .schedule__body--schedule { height: auto; min-height: 1px; padding: 18px 0 0 0; } .schedule-lg .schedule__sub-content { padding-bottom: 20px; } .s-row { font-size: 13px; } @-webkit-keyframes blinker { 0% { color: #cc9902; } 50% { color: #6c6c6c; } 100% { color: #cc9902; } } @keyframes blinker { 0% { color: #cc9902; } 50% { color: #6c6c6c; } 100% { color: #cc9902; } } .search { -webkit-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; display: block; width: 30px; position: relative; border-bottom: 1px solid transparent; z-index: 10; } .search.active { border-bottom: 1px solid #0c81bb; width: 100%; } .search.active .search__input { width: calc(100vw - 16px); padding: 0 40px 0 2px !important; } .search__input { display: block; width: 0; max-width: 768px; border: 0; padding: 0 !important; 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; z-index: 5; } .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: 20px 15px; 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: #00517a; } .shop { padding: 6px 0 85px 0; text-align: center; } .shop__plate { padding: 9px 0 15px 0; margin: 0 -5px; } .shop__plate .plate__col { overflow: hidden; } @media (max-width: 579px) { .shop__plate .plate__col { width: 100%; } } .shop .pressa__head { text-align: left; } .slider-head { position: relative; margin-bottom: 20px; } .slider-head__img { height: 300px; background-size: cover; background-position: center; border-radius: 3px; } .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: 0 30px; } .slider-head__inner-wrap { max-width: 400px; color: #fff; } .slider-head__caption { font-family: 'PT Sans Caption'; font-size: 24px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1.11; letter-spacing: normal; display: block; margin-bottom: 10px; } .slider-head__description { font-size: 14px; 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: 20px; } .slider-head .slick-dots { min-width: 73px; position: absolute; bottom: 15px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); padding: 0; } .slider-head .slick-dots li { display: inline-block; border-radius: 50%; padding: 0 8px; } .slider-head .slick-dots li.slick-active button { background-color: #0299e2; } .slider-head .slick-dots button { border: solid 2px #0299e2; background-color: transparent; border-radius: 50%; font-size: 0; width: 10px; height: 10px; padding: 0; } .slider-arrow-head { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); width: 15px; height: 25px; z-index: 10; cursor: pointer; } .slider-arrow-head:hover svg { fill: #0299e2; } .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: 5px; } .slider-arrow-head--prev { left: 5px; } .sort { font-size: 0; line-height: 0; display: block; } .sort--pressa { display: inline-block; } .sort__item { display: inline-block; font-size: 18px; font-weight: 700; line-height: 1.11; padding-right: 20px; } .sort__item:last-child { padding-right: 0; } .sort__link { color: #6c6c6c; } .sort__link--active { color: #0299e2; font-weight: bold; } .stations { padding: 10px 0 30px; } .stations__title { font-family: 'PT Sans Caption'; font-size: 26px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: 1; letter-spacing: 1.1px; text-transform: uppercase; display: inline-block; color: #00517a; 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; } @media (max-width: 479px) { .taxi__title-img--yt { display: none; } } .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: 24px; font-weight: bold; font-style: normal; font-stretch: normal; line-height: 1.1; letter-spacing: normal; text-transform: uppercase; color: #000000; } @media (max-width: 479px) { .taxi__title-txt { font-size: 18px; } } .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: #00517a; padding: 5px 30px 23px; } @media (max-width: 499px) { .taxi__form { padding: 5px 15px 23px; } } @media (max-width: 499px) { .taxi__form .custom-select, .taxi__form .input { border-bottom: 1px solid #fff !important; } } .taxi__form .custom-select { background-color: transparent; color: #fff; border: 0; } .taxi__form .custom-select option { color: #000; } .taxi__row { border-bottom: 1px solid #fff; } .taxi__row::after { content: ""; display: table; clear: both; } @media (max-width: 499px) { .taxi__row { border-bottom: 0; } } .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; } @media (max-width: 499px) { .taxi__col { float: none; width: 100%; } } .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%); } @media (max-width: 499px) { .taxi__col:first-child::before { display: none; } } .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; } .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; } @media (max-width: 499px) { .taxi__reverse { display: none; } } .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; } @media (max-width: 499px) { .taxi__submit { width: 100%; padding-bottom: 20px; } } .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-city { position: absolute; top: 0; left: 0; opacity: 0; z-index: 4; } .select-tel { position: relative; border-bottom: 1px solid #fff; } .select-tel-flag { width: 30px; height: 23px; position: absolute; left: -5px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); z-index: 3; background-color: transparent; background-size: contain; background-position: 50% 50%; background-repeat: no-repeat; } .select-tel-flag::before { content: ''; width: 10px; height: 6px; background: rgba(255, 255, 255, 0) url(../pic/icons/chevrone.svg) 0 0 no-repeat; background-size: cover; position: absolute; left: 100%; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .select-tel .input--tel { height: 33px; padding: 0 5px; margin-left: 40px; width: calc(100% - 40px); font-size: 14px; color: #fff; background-color: transparent; border: 0; border-bottom: 1px solid #fff; position: relative; z-index: 5; border-bottom: 0; } .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--lg { position: relative; border-bottom: 1px solid #979797; } .select-tel--lg .input { padding-left: 20px; width: calc(100% - 60px); margin-left: 60px; border-bottom: 0; position: relative; z-index: 5; } .select-tel--lg .select-city { border-top: 0; } .select-tel--lg .select-tel-flag { width: 35px; height: 25px; } .select-tel--lg .select-tel-flag::before { background: rgba(255, 255, 255, 0) url(../pic/icons/chevrone-gray.svg) 0 0 no-repeat; width: 16px; height: 10px; background-size: contain; left: calc(100% + 10px); margin-top: 2px; } .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: 552px; background-size: cover; background-position: center; border-radius: 3px; margin: 31px 0 12px; } @media (max-width: 479px) { .type__content-bg { height: 300px; } } @media (max-width: 990px) { .type { padding: 13px 0 30px; } } .popup__locale-list{ text-align: center; color: white; } .popup__locale-list a{ color: white; } .restaurant-item__body { display: none !important; } /* Адаптивная карточка с соотношением сторон */ .restaurant-item { aspect-ratio: 16 / 9; overflow: hidden; border-radius: 10px; position: relative; } /* Видео или изображение растянуто */ .restaurant-item__img, .restaurant-item__img video { height: 100%; width: 100%; object-fit: cover; display: block; border-radius: 10px; } .plate__timelapse { position: relative; display: block; overflow: hidden; } .plate__timelapse-icon { position: absolute; top: 20px; /* отступ сверху */ left: 20px; /* отступ слева */ width: 38px; height: 38px; z-index: 2; } .plate__timelapse-icon svg { width: 100%; height: 100%; stroke: #fff; /* белая иконка */ fill: none; } .plate__timelapse-txt { position: absolute; bottom: 15px; left: 95px; z-index: 2; text-transform: uppercase; font-size: 30px; line-height: 1.16; letter-spacing: 0.8px; color: #fff; }