/* author: Pavel Lavrus email: onechifu@gmail.com */ @font-face { font-family: 'OpenSans'; src: url('fonts/opensans-bold/opensans-bold.eot?'); src: url('fonts/opensans-bold/opensans-bold.eot?#iefix') format('embedded-opentype'), url('fonts/opensans-bold/opensans-bold.ttf?') format('truetype'), url('fonts/opensans-bold/opensans-bold.woff?') format('woff'), url('fonts/opensans-bold/opensans-bold.woff2?') format('woff2'), url('fonts/opensans-bold/opensans-bold.svg?#OpenSans') format('svg'); font-weight: 700; font-style: normal; } @font-face { font-family: 'OpenSans'; src: url('fonts/opensans-semibold/opensans-semibold.eot?'); src: url('fonts/opensans-semibold/opensans-semibold.eot?#iefix') format('embedded-opentype'), url('fonts/opensans-semibold/opensans-semibold.ttf?') format('truetype'), url('fonts/opensans-semibold/opensans-semibold.woff?') format('woff'), url('fonts/opensans-semibold/opensans-semibold.woff2?') format('woff2'), url('fonts/opensans-semibold/opensans-semibold.svg?#OpenSans') format('svg'); font-weight: 600; font-style: normal; } @font-face { font-family: 'OpenSans'; src: url('fonts/opensans-regular/opensans-regular.eot?'); src: url('fonts/opensans-regular/opensans-regular.eot?#iefix') format('embedded-opentype'), url('fonts/opensans-regular/opensans-regular.ttf?') format('truetype'), url('fonts/opensans-regular/opensans-regular.woff?') format('woff'), url('fonts/opensans-regular/opensans-regular.woff2?') format('woff2'), url('fonts/opensans-regular/opensans-regular.svg?#OpenSans') format('svg'); font-weight: 400; font-style: normal; } @font-face { font-family: 'OpenSans'; src: url('fonts/opensans-light/opensans-light.eot?'); src: url('fonts/opensans-light/opensans-light.eot?#iefix') format('embedded-opentype'), url('fonts/opensans-light/opensans-light.ttf?') format('truetype'), url('fonts/opensans-light/opensans-light.woff?') format('woff'), url('fonts/opensans-light/opensans-light.woff2?') format('woff2'), url('fonts/opensans-light/opensans-light.svg?#OpenSans') format('svg'); font-weight: 300; font-style: normal; } @font-face { font-family: 'OpenSans'; src: url('fonts/opensans-lightitalic/opensans-lightitalic.eot?'); src: url('fonts/opensans-lightitalic/opensans-lightitalic.eot?#iefix') format('embedded-opentype'), url('fonts/opensans-lightitalic/opensans-lightitalic.ttf?') format('truetype'), url('fonts/opensans-lightitalic/opensans-lightitalic.woff?') format('woff'), url('fonts/opensans-lightitalic/opensans-lightitalic.woff2?') format('woff2'), url('fonts/opensans-lightitalic/opensans-lightitalic.svg?#OpenSans') format('svg'); font-weight: normal; font-style: italic; } @font-face { font-family: 'OpenSans'; src: url('fonts/opensans-semibolditalic/opensans-semibolditalic.eot?'); src: url('fonts/opensans-semibolditalic/opensans-semibolditalic.eot?#iefix') format('embedded-opentype'), url('fonts/opensans-semibolditalic/opensans-semibolditalic.ttf?') format('truetype'), url('fonts/opensans-semibolditalic/opensans-semibolditalic.woff?') format('woff'), url('fonts/opensans-semibolditalic/opensans-semibolditalic.woff2?') format('woff2'), url('fonts/opensans-semibolditalic/opensans-semibolditalic.svg?#OpenSans') format('svg'); font-weight: 600; font-style: italic; } /*! HTML5 Boilerplate v5.2.0 | MIT License | https://html5boilerplate.com/ */ /* * What follows is the result of much research on cross-browser styling. * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal, * Kroc Camen, and the H5BP dev community and team. */ /* ========================================================================== Base styles: opinionated defaults ========================================================================== */ * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; font-family: 'OpenSans', Helvetica, Arial, sans-serif; } *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } html { overflow: visible; height: 100%; min-height: 100%; font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); } body { padding: 0; height: 100%; position: relative; background: #f5f5f5; color: #222222; font-size: 14px; line-height: 20px; } body.lock { height: auto; overflow: hidden !important; } a { text-decoration: none; color: #00AFCA; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } a:active, .no-touch a:hover { color: #00AFCA; text-decoration: underline; } .msie a { outline: 1px solid transparent; } .msie a:active, .no-touch.msie a:active { outline: 0; } article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; } audio, canvas, progress, video { display: inline-block; vertical-align: baseline; } audio:not([controls]) { display: none; height: 0; } [hidden], template { display: none; } a { background-color: transparent; } a:active, .no-touch a:hover { outline: 0; } abbr[title] { border-bottom: 1px dotted; } b, strong { font-weight: bold; } dfn { font-style: italic; } mark { background: #ff0; color: #000; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } img { border: 0; } svg:not(:root) { overflow: hidden; } figure { margin: 1em 40px; } hr { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; height: 0; } pre { overflow: auto; } code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; } button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; } button { overflow: visible; } button, select { text-transform: none; } button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; } button[disabled], html input[disabled] { cursor: default; } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } input { line-height: normal; } input[type="checkbox"], input[type="radio"] { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 0; } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; } input[type="search"] { -webkit-appearance: textfield; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } legend { border: 0; padding: 0; } textarea { overflow: auto; } optgroup { font-weight: bold; } table { border-collapse: collapse; border-spacing: 0; } td, th { padding: 0; } /* * Remove text-shadow in selection highlight: * https://twitter.com/miketaylr/status/12228805301 * * These selection rule sets have to be separate. * Customize the background color to match your design. */ ::-moz-selection { background: #b3d4fc; text-shadow: none; } ::selection { background: #b3d4fc; text-shadow: none; } /* * A better looking default horizontal rule */ hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; } /* * Remove the gap between audio, canvas, iframes, * images, videos and the bottom of their containers: * https://github.com/h5bp/html5-boilerplate/issues/440 */ audio, canvas, iframe, img, svg, video { vertical-align: middle; } /* * Remove default fieldset styles. */ fieldset { border: 0; margin: 0; padding: 0; } /* * Allow only vertical resizing of textareas. */ textarea { resize: vertical; } /* ========================================================================== Browser Upgrade Prompt ========================================================================== */ .browserupgrade { margin: 0.2em 0; background: #ccc; color: #000; padding: 0.2em 0; } /* ========================================================================== Helper classes ========================================================================== */ /* * Hide visually and from screen readers: */ .hidden { display: none !important; } /* * Hide only visually, but have it available for screen readers: * http://snook.ca/archives/html_and_css/hiding-content-for-accessibility */ .visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } /* * Extends the .visuallyhidden class to allow the element * to be focusable when navigated to via the keyboard: * https://www.drupal.org/node/897638 */ .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } /* * Hide visually and from screen readers, but maintain layout */ .invisible { visibility: hidden; } /* * Clearfix: contain floats * * For modern browsers * 1. The space content is one way to avoid an Opera bug when the * `contenteditable` attribute is included anywhere else in the document. * Otherwise it causes space to appear at the top and bottom of elements * that receive the `clearfix` class. * 2. The use of `table` rather than `block` is only necessary if using * `:before` to contain the top-margins of child elements. */ .clearfix:before, .clearfix:after { content: " "; /* 1 */ display: table; /* 2 */ } .clearfix:after { clear: both; } /* ========================================================================== EXAMPLE Media Queries for Responsive Design. These examples override the primary ('mobile first') styles. Modify as content requires. ========================================================================== */ @media print, (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 1.25dppx), (min-resolution: 120dpi) { /* Style adjustments for high resolution devices */ } /* ========================================================================== Print styles. Inlined to avoid the additional HTTP request: http://www.phpied.com/delay-loading-your-print-css/ ========================================================================== */ @media print { *, *:before, *:after { background: transparent !important; color: #000000 !important; box-shadow: none !important; text-shadow: none !important; outline: none !important } .cover { background: none !important; width: 100%; float: left; } .cover img { display: block !important; width: 100%; } a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } abbr[title]:after { content: " (" attr(title) ")"; } /* * Don't show links that are fragment identifiers, * or use the `javascript:` pseudo protocol */ a[href^="#"]:after, a[href^="javascript:"]:after { content: ""; } pre, blockquote { page-break-inside: avoid; } /* * Printing Tables: * http://css-discuss.incutio.com/wiki/Printing_Tables */ thead { display: table-header-group; } img { max-width: none !important; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } body { padding: 0 !important; } #wrapper { padding: 0 !important; margin: auto !important; height: auto !important; } .page_banner_block, .infobook_block, .article__info, .article__info_bottom, .page_comments, .sidebar, .footer_stick, .read_block, .topicread_block, .section_separator, .sides_article, .category_menu, .branding, .footer { display: none !important; } .header { border: none; display: block !important; position: relative !important; margin: 0; float: left; text-align: center; } .header__mainmenu__btn-open, .header__search__btn-open, .header__bottom { display: none !important; } .header__top { width: 100% !important; position: relative !important; margin: 0 !important; padding: 0 !important; } .header__logo { position: relative !important; margin: auto !important; float: none !important; } .article_page__triple_gallery { display: table !important; } .article_page__triple_gallery__item { width: 33.333333% !important; display: table-cell; padding-left: 10px; padding-right: 10px; } .article_page__triple_gallery__item:nth-child(4n), .article_page__triple_gallery__item:first-child { padding-left: 0; } .article_page__triple_gallery__item:nth-child(3), .article_page__triple_gallery__item:nth-child(2), .article_page__triple_gallery__item:nth-child(1) { margin-top: 0; } .article_page__triple_gallery__item:nth-child(3n) { padding-right: 0; } .article_page__triple_gallery__item:nth-child(2), .article_page__triple_gallery__item:nth-child(5n) { padding-left: 5px; padding-right: 5px; } } /* ========================================================================== Общие стили для карусели и слайдшоу - Owl Carousel 2 ========================================================================== */ .owl-stage .animated { -webkit-animation-duration: 1000ms; -moz-animation-duration: 1000ms; animation-duration: 1000ms; -webkit-animation-fill-mode: both; -moz-animation-fill-mode: both; animation-fill-mode: both; } .owl-stage .owl-animated-in { z-index: 0; } .owl-stage .owl-animated-out { z-index: 1; } .owl-stage .fadeIn { -webkit-animation-name: fadeOut; -moz-animation-name: fadeOut; animation-name: fadeOut; } .owl-stage .fadeOut { -webkit-animation-name: fadeOut; -moz-animation-name: fadeOut; animation-name: fadeOut; } @-webkit-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @-moz-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @-webkit-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } @-moz-keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } /* * Owl Carousel - Auto Height Plugin */ .owl-height { -webkit-transition: height 500ms ease-in-out; -moz-transition: height 500ms ease-in-out; -ms-transition: height 500ms ease-in-out; -o-transition: height 500ms ease-in-out; transition: height 500ms ease-in-out; } .owl-stage { position: relative; -ms-touch-action: pan-Y; } .owl-stage:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .owl-stage-outer { position: relative; overflow: hidden; -webkit-transform: translate3d(0px, 0px, 0px); } .owl-nav.disabled, .owl-carousel .owl-dots.disabled { display: none; } .owl-nav .owl-prev, .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-dot { cursor: pointer; cursor: hand; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .owl-loaded { display: block; } .owl-loading { opacity: 0; display: block; } .owl-hidden { opacity: 0; } .owl-refresh .owl-item { display: none; } .owl-drag .owl-item { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .owl-grab { cursor: move; cursor: -webkit-grab; cursor: -o-grab; cursor: -ms-grab; cursor: grab; } .owl-rtl { direction: rtl; } .owl-rtl .owl-item { float: right; } .owl-refresh .owl-item { display: none; } .owl-item { position: relative; min-height: 1px; float: left; tap-highlight-color: transparent; -webkit-touch-callout: none; -moz-touch-callout: none; touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .owl-item img { display: block; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; } .owl-text-select-on .owl-item { -webkit-user-select: auto; -moz-user-select: auto; -ms-user-select: auto; user-select: auto; } .owl-grab { cursor: move; cursor: -webkit-grab; cursor: -o-grab; cursor: -ms-grab; cursor: grab; } .owl-rtl { direction: rtl; } .owl-rtl .owl-item { float: right; } .owl-item .owl-lazy { opacity: 0; -webkit-transition: opacity 400ms ease; -moz-transition: opacity 400ms ease; -ms-transition: opacity 400ms ease; -o-transition: opacity 400ms ease; transition: opacity 400ms ease; } .owl-video-wrapper { position: relative; height: 100%; background: #000; } .owl-video-play-icon { position: absolute; height: 80px; width: 80px; left: 50%; top: 50%; margin-left: -40px; margin-top: -40px; cursor: pointer; z-index: 1; -webkit-backface-visibility: hidden; -webkit-transition: scale 100ms ease; -moz-transition: scale 100ms ease; -ms-transition: scale 100ms ease; -o-transition: scale 100ms ease; transition: scale 100ms ease; } .owl-video-play-icon:hover { -webkit-transition: scale(1.3, 1.3); -moz-transition: scale(1.3, 1.3); -ms-transition: scale(1.3, 1.3); -o-transition: scale(1.3, 1.3); transition: scale(1.3, 1.3); } .owl-video-playing .owl-video-tn, .owl-video-playing .owl-video-play-icon { display: none; } .owl-video-tn { opacity: 0; height: 100%; background-position: center center; background-repeat: no-repeat; -webkit-background-size: contain; -moz-background-size: contain; -o-background-size: contain; background-size: contain; -webkit-transition: opacity 400ms ease; -moz-transition: opacity 400ms ease; -ms-transition: opacity 400ms ease; -o-transition: opacity 400ms ease; transition: opacity 400ms ease; } .owl-video-frame { position: relative; z-index: 1; } /*.carousel_container { width: inherit; float: left; overflow: hidden; }*/ /*.carousel_container .container { display: block; }*/ .carousel { position: relative; } .carousel .owl-next, .carousel .owl-prev { position: absolute; z-index: 10; cursor: pointer; top: 0; left: 0; width: 36px; height: 100%; color: #9f9f9f; background-repeat: no-repeat; background-position: center; background-size: 14px auto; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .carousel .owl-prev { } .carousel .owl-next { left: auto; right: 0; } .carousel .owl-prev:after, .carousel .owl-next:after { display: block; position: absolute; width: 36px; height: 36px; top: 50%; left: 0; margin-top: -18px; font-family: Font Awesome\ 5 Free; line-height: 36px; font-size: 36px; font-weight: 900; text-align: center; } .carousel .owl-next:after { content: '\f105'; right: 0; left: auto; } .carousel .owl-prev:after { content: '\f104'; } .carousel .owl-next:active, .carousel .owl-next:hover { } .carousel .owl-prev:active, .carousel .owl-prev:hover { } .carousel .owl-next.disabled, .carousel .owl-prev.disabled { cursor: default; opacity: 0.6; } /*.carousel .owl-next i, .carousel .owl-prev i { display: block; width: 100%; height: 100%; color: #f44336; font-size: 20px; text-align: center; line-height: 45px; padding-left: 5px; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; }*/ /*.carousel .owl-next.disabled i, .carousel .owl-prev.disabled i { color: #cacaca; } .carousel .owl-prev i { padding-right: 5px; padding-left: 0; }*/ /*.carousel .owl-next { left: auto; right: 0; }*/ @media only screen and (min-width: 768px) { /* .carousel .owl-next, .carousel .owl-prev { background: #ffffff; box-shadow: 0 2px 10px rgba(107,107,107,.3); }*/ } /* ========================================================================== END Общие стили для карусели и слайдшоу - Owl Carousel 2 ========================================================================== */ /* ========================================================================== Selectric v1.9.5 ========================================================================== */ .selectric-wrapper { position: relative; cursor: pointer; text-align: left; } .selectric-responsive { width: 100%; } .selectric { background: #ffffff; position: relative; overflow: hidden; border: 1px solid #d7d7d7; box-shadow: 0 1px 3px rgba(0,0,0,.10); -webkit-transition: border-color 0.1s linear; -moz-transition: border-color 0.1s linear; transition: border-color 0.1s linear; } .selectric .label { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin: 0 35px 0 10px; font-size: 13px; line-height: 38px; color: #888888; height: 38px; padding-right: 10px; } .selectric .button { display: block; position: absolute; right: 0; top: 0; width: 35px; height: 38px; color: #00AFCA; text-align: center; font-family: Font Awesome\ 5 Free; speak: none; font-style: normal; font-variant: normal; text-transform: none; line-height: 38px; text-align: center; font-size: 26px; margin: 0; border-left: 1px solid #f5f5f5; } .selectric .button:before { content: "\f107"; } .selectric-open .selectric .button:before { content: "\f106"; } .selectric-hover .selectric { border-color: #00AFCA; } .selectric-open .selectric .button, .selectric-hover .selectric .button { color: #00AFCA; } .selectric-hover .selectric .button:after { } .selectric-open { z-index: 9999; } .selectric-open .selectric { border-top: 1px solid #00AFCA; border-right: 1px solid #00AFCA; border-left: 1px solid #00AFCA; border-bottom: none; padding-bottom: 1px; } .selectric-open .selectric-items { display: block; border-bottom: 1px solid #00AFCA; border-right: 1px solid #00AFCA; border-left: 1px solid #00AFCA; } .selectric-disabled { border-color: #d7d7d7; color: #d7d7d7; cursor: default; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .selectric-disabled .selectric { border-color: #d7d7d7; } .selectric-disabled .button, .selectric-disabled .label { color: #d7d7d7; } .selectric-hide-select { position: relative; overflow: hidden; width: 0; height: 0; } .selectric-hide-select select { position: absolute; left: -100%; display: none; } .selectric-input { position: absolute !important; top: 0 !important; left: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; margin: 0 !important; padding: 0 !important; width: 1px !important; height: 1px !important; outline: none !important; border: none !important; *font: 0/0 a !important; background: none !important; } .selectric-temp-show { position: absolute !important; visibility: hidden !important; display: block !important; } /* Items box */ .selectric-items { display: none; position: absolute; top: 100%; left: 0; background: #ffffff; z-index: -1; overflow: hidden; } .selectric-items .selectric-scroll { height: 100%; overflow: auto; } .selectric-above .selectric-items { top: auto; bottom: 100%; } .selectric-items ul, .selectric-items li { list-style: none; padding: 0; margin: 0; font-size: 13px; line-height: 18px; font-weight: 400; } .selectric-items li { display: block; padding: 10px; color: #6b6b6b; cursor: pointer; border-top: 1px solid #ededed; } .selectric-items li.selected { background: #f7f7f7; display: none; } .selectric-items li:hover { background: #f7f7f7; } .selectric-items .disabled { filter: alpha(opacity=50); opacity: 0.5; cursor: default !important; background: none !important; color: #666 !important; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .selectric-items .selectric-group .selectric-group-label { font-weight: bold; padding-left: 10px; cursor: default; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background: none; color: #444; } .selectric-items .selectric-group.disabled li { filter: alpha(opacity=100); opacity: 1; } .selectric-items .selectric-group li { padding-left: 25px; } /* ========================================================================== END Selectric v1.9.5 ========================================================================== */ /*! * 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-size: 12px; background: #FFF; border: 1px solid #CCC; color: #4F4F4F; margin: 0 auto; height: auto; padding: 20px; position: relative; box-sizing: content-box; min-width: 300px !important; } #jr_header { display: block; color: #333; padding: 5px; padding-bottom: 0; margin: 0; font-weight: bold; font-size: 1.3em; margin-bottom: 0.5em; } #jr_inner p { padding: 5px; margin: 0; line-height: 16px; } #jr_inner ul { list-style-image: none; list-style-position: outside; list-style-type: none; margin: 20px 0 0 0; padding: 0; text-align: center; } #jr_inner ul li { cursor: pointer; float: none; display: inline-block; width: 100px; height: 102px; 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: 80px; height: 80px; margin: 1px auto; padding: 0; background: transparent no-repeat scroll left top; cursor: pointer; background-size: contain !important; } #jr_close { clear: both; padding: 0; margin: 0; text-align: center; } #jr_close a { color: #000; display: block; width: auto; margin: 0; padding: 10px 0 0 0; text-decoration: underline; } #jr_close p { text-align: left; padding: 10px 0 0 0; margin: 0; } @media only screen and (max-width: 767px) { #jr_wrap { top: 0 !important; } } @media only screen and (min-width: 768px) { #jr_wrap { position: absolute; width: 100%; z-index: 2147483647; padding: 0; margin: 0; } #jr_inner ul li { cursor: pointer; float: left; width: 120px; height: 122px; margin: 0 10px 10px 10px; padding: 0; text-align: center; } #jr_inner .jr_icon { width: 100px; height: 100px; } } /* ========================================================================== Tooltips ========================================================================== */ .tip { position: relative; } /* This is the default Tooltipster theme (feel free to modify or duplicate and create multiple themes!): */ .tooltipster-default { border-radius: 4px; box-shadow: 0 2px 14px rgba(0,0,0,.2); background: #379fe0; } /* Use this next selector to style things like font-size and line-height: */ .tooltipster-default .tooltipster-content { padding: 10px; overflow: hidden; max-width: 280px; color: #ffffff; font-size: 13px; line-height: 15px; } .tooltipster-default a { color: #ffffff; } .tooltipster-default a:active, .no-touch .tooltipster-default a:hover { color: #ffffff; } /* This next selector defines the color of the border on the outside of the arrow. This will automatically match the color and size of the border set on the main tooltip styles. Set display: none; if you would like a border around the tooltip but no border around the arrow */ .tooltipster-default .tooltipster-arrow .tooltipster-arrow-border { /* border-color: ... !important; */ } /* If you're using the icon option, use this next selector to style them */ .tooltipster-icon { cursor: help; margin-left: 4px; } /* This is the base styling required to make all Tooltipsters work */ .tooltipster-base { padding: 0; font-size: 0; line-height: 0; position: absolute; left: 0; top: 0; z-index: 9999999; pointer-events: none; width: auto; overflow: visible; } .tooltipster-base .tooltipster-content { overflow: hidden; } /* These next classes handle the styles for the little arrow attached to the tooltip. By default, the arrow will inherit the same colors and border as what is set on the main tooltip itself. */ .tooltipster-arrow { display: block; text-align: center; width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: -1; } .tooltipster-arrow span, .tooltipster-arrow-border { display: block; width: 0; height: 0; position: absolute; } .tooltipster-arrow-top span, .tooltipster-arrow-top-right span, .tooltipster-arrow-top-left span { border-left: 8px solid transparent !important; border-right: 8px solid transparent !important; border-top: 8px solid; bottom: -7px; } .tooltipster-arrow-top .tooltipster-arrow-border, .tooltipster-arrow-top-right .tooltipster-arrow-border, .tooltipster-arrow-top-left .tooltipster-arrow-border { border-left: 9px solid transparent !important; border-right: 9px solid transparent !important; border-top: 9px solid; bottom: -7px; } .tooltipster-arrow-bottom span, .tooltipster-arrow-bottom-right span, .tooltipster-arrow-bottom-left span { border-left: 8px solid transparent !important; border-right: 8px solid transparent !important; border-bottom: 8px solid; top: -7px; } .tooltipster-arrow-bottom .tooltipster-arrow-border, .tooltipster-arrow-bottom-right .tooltipster-arrow-border, .tooltipster-arrow-bottom-left .tooltipster-arrow-border { border-left: 9px solid transparent !important; border-right: 9px solid transparent !important; border-bottom: 9px solid; top: -7px; } .tooltipster-arrow-top span, .tooltipster-arrow-top .tooltipster-arrow-border, .tooltipster-arrow-bottom span, .tooltipster-arrow-bottom .tooltipster-arrow-border { left: 0; right: 0; margin: 0 auto; } .tooltipster-arrow-top-left span, .tooltipster-arrow-bottom-left span { left: 6px; } .tooltipster-arrow-top-left .tooltipster-arrow-border, .tooltipster-arrow-bottom-left .tooltipster-arrow-border { left: 5px; } .tooltipster-arrow-top-right span, .tooltipster-arrow-bottom-right span { right: 6px; } .tooltipster-arrow-top-right .tooltipster-arrow-border, .tooltipster-arrow-bottom-right .tooltipster-arrow-border { right: 5px; } .tooltipster-arrow-left span, .tooltipster-arrow-left .tooltipster-arrow-border { border-top: 8px solid transparent !important; border-bottom: 8px solid transparent !important; border-left: 8px solid; top: 50%; margin-top: -7px; right: -7px; } .tooltipster-arrow-left .tooltipster-arrow-border { border-top: 9px solid transparent !important; border-bottom: 9px solid transparent !important; border-left: 9px solid; margin-top: -8px; } .tooltipster-arrow-right span, .tooltipster-arrow-right .tooltipster-arrow-border { border-top: 8px solid transparent !important; border-bottom: 8px solid transparent !important; border-right: 8px solid; top: 50%; margin-top: -7px; left: -7px; } .tooltipster-arrow-right .tooltipster-arrow-border { border-top: 9px solid transparent !important; border-bottom: 9px solid transparent !important; border-right: 9px solid; margin-top: -8px; } /* Some CSS magic for the awesome animations - feel free to make your own custom animations and reference it in your Tooltipster settings! */ .tooltipster-fade { opacity: 0; -webkit-transition-property: opacity; -moz-transition-property: opacity; -o-transition-property: opacity; -ms-transition-property: opacity; transition-property: opacity; } .tooltipster-fade-show { opacity: 1; } .tooltipster-grow { -webkit-transform: scale(0,0); -moz-transform: scale(0,0); -o-transform: scale(0,0); -ms-transform: scale(0,0); transform: scale(0,0); -webkit-transition-property: -webkit-transform; -moz-transition-property: -moz-transform; -o-transition-property: -o-transform; -ms-transition-property: -ms-transform; transition-property: transform; -webkit-backface-visibility: hidden; } .tooltipster-grow-show { -webkit-transform: scale(1,1); -moz-transform: scale(1,1); -o-transform: scale(1,1); -ms-transform: scale(1,1); transform: scale(1,1); -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); -moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); -ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); -o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); } .tooltipster-swing { opacity: 0; -webkit-transform: rotateZ(4deg); -moz-transform: rotateZ(4deg); -o-transform: rotateZ(4deg); -ms-transform: rotateZ(4deg); transform: rotateZ(4deg); -webkit-transition-property: -webkit-transform, opacity; -moz-transition-property: -moz-transform; -o-transition-property: -o-transform; -ms-transition-property: -ms-transform; transition-property: transform; } .tooltipster-swing-show { opacity: 1; -webkit-transform: rotateZ(0deg); -moz-transform: rotateZ(0deg); -o-transform: rotateZ(0deg); -ms-transform: rotateZ(0deg); transform: rotateZ(0deg); -webkit-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 1); -webkit-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4); -moz-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4); -ms-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4); -o-transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4); transition-timing-function: cubic-bezier(0.230, 0.635, 0.495, 2.4); } .tooltipster-fall { top: 0; -webkit-transition-property: top; -moz-transition-property: top; -o-transition-property: top; -ms-transition-property: top; transition-property: top; -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); -moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); -ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); -o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); } .tooltipster-fall-show { } .tooltipster-fall.tooltipster-dying { -webkit-transition-property: all; -moz-transition-property: all; -o-transition-property: all; -ms-transition-property: all; transition-property: all; top: 0px !important; opacity: 0; } .tooltipster-slide { left: -40px; -webkit-transition-property: left; -moz-transition-property: left; -o-transition-property: left; -ms-transition-property: left; transition-property: left; -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1); -webkit-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); -moz-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); -ms-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); -o-transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); transition-timing-function: cubic-bezier(0.175, 0.885, 0.320, 1.15); } .tooltipster-slide.tooltipster-slide-show { } .tooltipster-slide.tooltipster-dying { -webkit-transition-property: all; -moz-transition-property: all; -o-transition-property: all; -ms-transition-property: all; transition-property: all; left: 0px !important; opacity: 0; } /* CSS transition for when contenting is changing in a tooltip that is still open. The only properties that will NOT transition are: width, height, top, and left */ .tooltipster-content-changing { opacity: 0.5; -webkit-transform: scale(1.1, 1.1); -moz-transform: scale(1.1, 1.1); -o-transform: scale(1.1, 1.1); -ms-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1); } /* ========================================================================== END Tooltips ========================================================================== */ /* == 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: none; touch-action: none; /* MSPointer events - direct all 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: 0; } .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; -webkit-border-radius: 16px; -moz-border-radius: 16px; 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; -webkit-border-radius: 16px; -moz-border-radius: 16px; 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; } .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; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden > .mCSB_container{ padding-bottom: 0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .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 .2s ease-in-out, background-color .2s ease-in-out; -moz-transition: opacity .2s ease-in-out, background-color .2s ease-in-out; -o-transition: opacity .2s ease-in-out, background-color .2s ease-in-out; transition: opacity .2s ease-in-out, background-color .2s ease-in-out; } .mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, /* auto-expanded scrollbar */ .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 .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; -moz-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; -o-transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; transition: width .2s ease-out .2s, height .2s ease-out .2s, margin-left .2s ease-out .2s, margin-right .2s ease-out .2s, margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s, opacity .2s ease-in-out, background-color .2s ease-in-out; } /* ------------------------------------------------------------------------------------------------------------------------ 6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS ------------------------------------------------------------------------------------------------------------------------ */ /* ---------------------------------------- 6.1 THEMES ---------------------------------------- */ /* theme: "dark" */ .no-touch .mCustomScrollBox .mCS-dark.mCSB_scrollTools { opacity: 0; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .no-touch .mCustomScrollBox .mCS-dark.mCSB_scrollTools_onDrag, .no-touch .mCustomScrollBox:hover .mCS-dark.mCSB_scrollTools { opacity: 1; } .mCS-dark.mCSB_scrollTools .mCSB_draggerRail { background-color: #c3c3c3; } .mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #c3c3c3; } .mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #666666; } .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: "green" */ .no-touch .mCustomScrollBox .mCS-green.mCSB_scrollTools { /*opacity: 0;*/ -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .no-touch .mCustomScrollBox .mCS-green.mCSB_scrollTools_onDrag, .no-touch .mCustomScrollBox:hover .mCS-green.mCSB_scrollTools { /*opacity: 1;*/ } .mCS-green.mCSB_scrollTools .mCSB_draggerRail { background-color: #052214; } .mCS-green.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar { background-color: #60bb57; } .mCS-green.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar { background-color: #76e76b; } .mCS-green.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar, .mCS-green.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar { background-color: #76e76b; } .mCS-green.mCSB_scrollTools .mCSB_buttonUp { background-position: -80px 0; } .mCS-green.mCSB_scrollTools .mCSB_buttonDown { background-position: -80px -20px; } .mCS-green.mCSB_scrollTools .mCSB_buttonLeft { background-position: -80px -40px; } .mCS-green.mCSB_scrollTools .mCSB_buttonRight { background-position: -80px -56px; } /* ---------------------------------------- */ /* ========================================================================== Custom number ========================================================================== */ .custom_number { display: inline-block; vertical-align: middle; } .custom_number input { width: 50px; height: 32px; line-height: 32px; text-align: center; padding: 0; border: 1px solid #dddddd; font-size: 14px; color: #000000; vertical-align: middle; } .custom_number__btn { cursor: pointer; height: 32px; width: 24px; vertical-align: middle; display: inline-block; } .custom_number__btn i { height: 32px; width: 100%; vertical-align: middle; display: inline-block; background: url('../img/icon-arrow-left.png') right center no-repeat; } .custom_number__btn-plus i { background-image: url('../img/icon-arrow-right.png'); background-position: left center; } /* ========================================================================== END Custom number ========================================================================== */ /* ========================================================================== Custom checkbox ========================================================================== */ .custom_checkbox { cursor: pointer; display: inline-block; position: relative; overflow: hidden; vertical-align: middle; font-size: 14px; line-height: 24px; } .custom_checkbox input { position: absolute; left: -99999px; } .custom_checkbox>i { float: left; display: block; width: 24px; height: 24px; font-size: 15px; line-height: 24px; background: #ffffff; border: 1px solid #595959; position: relative; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .custom_checkbox>i:after { left: -1px; top: 0; position: absolute; display: block; width: inherit; height: inherit; font-family: Font Awesome\ 5 Free; font-size: inherit; font-weight: 900; line-height: inherit; text-align: center; color: #000000; content: ''; } .custom_checkbox.active>i:after { content: '\f00c'; } .custom_checkbox span { display: block; margin-left: 25px; line-height: inherit; } /* ========================================================================== END Custom checkbox ========================================================================== */ /* ========================================================================== Tabs default ========================================================================== */ .tabs__menu { display: table; margin: 0 0 20px 0; text-align: center; padding: 0; width: 100%; float: left; list-style: none; } .tabs__menu__item { display: block; float: left; list-style: none; padding: 0; margin: 0; } .tabs__menu__item a { text-align: center; padding: 0 15px; background: #ffffff; width: 100%; margin: 0; display: block; float: left; background: #ffffff; height: 40px; line-height: 40px; font-size: 14px; font-weight: 400; white-space: nowrap; color: #606060; text-decoration: none; border-bottom: 3px solid transparent; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .tabs__menu__item a:focus { outline: none; } .tabs__menu__item a:active, .no-touch .tabs__menu__item a:hover { text-decoration: none; color: #000000; border-color: #a7e5ef; } .tabs__menu__item.ui-state-active a:active, .no-touch .tabs__menu__item.ui-state-active a:hover, .tabs__menu__item.ui-state-active a { color: #000000; border-color: #00AFCA; } /* ========================================================================== END Tabs default ========================================================================== */ /* ========================================================================== Forms ========================================================================== */ .btn { border-radius: 5px; border: 2px solid #ababab; display: inline-block; height: 30px; padding: 0 20px; font-size: 14; text-transform: uppercase; font-weight: 500; line-height: 28px; color: #000000; text-decoration: none; background: #ffffff; text-align: center; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .btn.active, .btn:active, .no-touch .btn:hover { border-color: #00AFCA; color: #000000; text-decoration: none; } .btn-green { border-color: #00AFCA; background: #00AFCA; color: #ffffff; } .btn-green.active, .btn-green:active, .no-touch .btn-green:hover { background: #048396; border-color: #048396; color: #ffffff; text-decoration: none; } .inputbox { vertical-align: middle; border: 1px solid #d7d7d7; color: #000000; height: 40px; line-height: 40px; font-size: 14px; padding: 0 10px; background: #ffffff; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .inputbox:focus { outline: none; border-color: #4b83e5; } .inputbox::-webkit-input-placeholder { color: #ababab; } .inputbox::-moz-placeholder { color: #ababab; } .inputbox:-moz-placeholder { color: #ababab; } .inputbox:-ms-input-placeholder { color: #ababab; } .inputbox:disabled::-webkit-input-placeholder { color: #cccccc; } .inputbox:disabled::-moz-placeholder { color: #cccccc; } .inputbox:disabled:-moz-placeholder { color: #cccccc; } .inputbox:disabled:-ms-input-placeholder { color: #cccccc; } .textbox { vertical-align: middle; border: 1px solid #e6e6e6; color: #6b6b6b; height: 60px; line-height: 18px; font-size: 12px; padding: 5px 10px; border-radius: 4px; background: #ffffff; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .textbox:focus { outline: none; border-color: #999999; } .textbox::-webkit-input-placeholder { color: #888888; } .textbox::-moz-placeholder { color: #888888; } .textbox:-moz-placeholder { color: #888888; } .textbox:-ms-input-placeholder { color: #888888; } /* ========================================================================== END Forms ========================================================================== */ /* ========================================================================== Icons ========================================================================== */ .icon { display: inline-block; background-position: center; background-repeat: no-repeat; background-size: contain; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .icon-search { background-image: url('../img/icon-search.svg'); } .icon-search:active, .no-touch .icon-search:hover { background-image: url('../img/icon-search-hover.svg'); } /* ========================================================================== END Icons ========================================================================== */ /* ========================================================================== Animate icons - Transformicons ========================================================================== */ .tcon { -webkit-appearance: none; -moz-appearance: none; appearance: none; border: none; cursor: pointer; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; height: 40px; transition: 0.3s; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; width: 40px; background: transparent; outline: none; -webkit-tap-highlight-color: transparent; -webkit-tap-highlight-color: transparent; } .tcon > * { display: block; } .tcon:hover, .tcon:focus { outline: none; } .tcon::-moz-focus-inner { border: 0; } .tcon-menu__lines { display: inline-block; height: 4px; width: 24px; border-radius: 1px; transition: 0.3s; background: #4b83e5; position: relative; } .tcon-menu__lines::before, .tcon-menu__lines::after { display: inline-block; height: 4px; width: 24px; border-radius: 1px; transition: 0.3s; background: #4b83e5; content: ''; position: absolute; left: 0; -webkit-transform-origin: 1px center; transform-origin: 1px center; } .tcon-menu__lines::before { top: 8px; } .tcon-menu__lines::after { top: -8px; } .tcon-transform .tcon-menu__lines { -webkit-transform: scale3d(0.8, 0.8, 0.8); transform: scale3d(0.8, 0.8, 0.8); } .tcon-menu--xcross { width: auto; } .tcon-menu--xcross.tcon-transform .tcon-menu__lines { background: transparent; } .tcon-menu--xcross.tcon-transform .tcon-menu__lines::before, .tcon-menu--xcross.tcon-transform .tcon-menu__lines::after { -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; top: 0; width: 24px; } .tcon-menu--xcross.tcon-transform .tcon-menu__lines::before { -webkit-transform: rotate3d(0, 0, 1, 45deg); transform: rotate3d(0, 0, 1, 45deg); } .tcon-menu--xcross.tcon-transform .tcon-menu__lines::after { -webkit-transform: rotate3d(0, 0, 1, -45deg); transform: rotate3d(0, 0, 1, -45deg); } .tcon-visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .tcon-visuallyhidden:active, .tcon-visuallyhidden:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } .tcon-loader--spinner360 { border-radius: 80%; display: block; height: 40px; width: 40px; position: relative; -webkit-animation: tcon-spin360 0.675s linear infinite forwards; animation: tcon-spin360 0.675s linear infinite forwards; background: lightgray; } .tcon-loader--spinner360:before, .tcon-loader--spinner360:after { content: ""; display: block; position: absolute; } .tcon-loader--spinner360:before { border-radius: 0 90px 90px 0; height: 40px; width: 50%; top: 0; right: 0; z-index: 1; background: black; background-image: linear-gradient(lightgray, black); } .tcon-loader--spinner360:after { border-radius: 80%; height: 30px; width: 30px; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 1; background: white; } .preloader.tcon-loader--spinner360 { width: 20px; height: 20px; } .preloader.tcon-loader--spinner360:before { border-radius: 0 45px 45px 0; height: 20px; width: 50%; top: 0; right: 0; z-index: 1; background: black; background-image: linear-gradient(lightgray, black); } .preloader.tcon-loader--spinner360:after { border-radius: 80%; height: 15px; width: 15px; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 1; background: #ffffff; } @-webkit-keyframes tcon-spin360 { to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes tcon-spin360 { to { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } .tcon-visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } .tcon-visuallyhidden:active, .tcon-visuallyhidden:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } /* ========================================================================== END Animate icons - Transformicons ========================================================================== */ /* ========================================================================== Main styles ========================================================================== */ #wrapper { width: 100%; min-height: 100%; height: auto !important; height: 100%; float: none; margin: auto !important; position: relative; z-index: 110; } .wrapper { float: left; width: 100%; position: relative; } #wrapper_inner { width: 100%; float: left; background: #ffffff; position: relative; z-index: 200; } .container { display: block; position: relative; margin-right: auto; margin-left: auto; width: 100%; padding: 0 15px; min-width: 320px; z-index: 10; } .wrapper:before, .wrapper:after, .container:before, .container:after, #wrapper:before, #wrapper:after, #wrapper_inner:before, #wrapper_inner:after { position: relative; width: 100%; height: 0; clear: both; content: ""; display: block; } @media only screen and (min-width: 768px) { #wrapper { width: 750px; } .container { width: 750px; padding-left: 15px; padding-right: 15px; } #wrapper_inner { float: none; margin: auto; width: 750px; } } @media only screen and (min-width: 992px) { #wrapper { width: 960px; } .container { width: 960px; padding-left: 20px; padding-right: 20px; } #wrapper_inner { width: 960px; } } @media only screen and (min-width: 1500px) { #wrapper { width: 1170px; } .container { width: 1170px; padding-left: 30px; padding-right: 30px; } #wrapper_inner { width: 1170px; } } h1 { font-size: 24px; line-height: 34px; font-weight: 400; color: #222222; margin: 0 0 10px 0; } h2 { font-size: 20px; line-height: 26px; font-weight: 400; color: #222222; margin: 0 0 10px 0; } h3 { font-weight: 500; font-size: 18px; line-height: 24px; color: #222222; margin: 0; } h4 { font-size: 16px; line-height: 20px; font-weight: 500; color: #000000; margin: 0 0 10px 0; } .blocktitle { font-size: 18px; color: #838383; font-weight: 500; line-height: 24px; margin: 0; margin-bottom: 20px; } .sectiontitle { text-align: center; font-size: 16px; color: #000000; font-weight: 500; line-height: 22px; margin: 10px 0 0 0; } .pagetitle { text-align: center; font-size: 16px; color: #000000; font-weight: 500; line-height: 22px; margin: 10px 0 10px 0; } h1.articletitle { font-size: 16px; line-height: 22px; font-weight: 500; color: #000000; margin: 0; padding: 0 0 10px 0; } @media only screen and (min-width: 768px) { h1 { font-size: 36px; line-height: 50px; margin-bottom: 20px; } h2 { font-size: 26px; line-height: 32px; margin-bottom: 20px; } h3 { font-size: 22px; line-height: 28px; } h4 { font-size: 16px; line-height: 20px; } .sectiontitle { font-size: 23px; line-height: 28px; } .pagetitle { font-size: 23px; line-height: 28px; } h1.articletitle { font-size: 26px; line-height: 30px; } } .section_separator { height: 0; border: none; margin: 15px 0; width: 100%; float: left; position: relative; } /*.container .section_separator { margin-bottom: 15px; }*/ .section_separator:after { position: absolute; left: 0; content: ''; display: block; top: 0; height: 1px; width: 100%; background: #dfdfdf; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; } .container .section_separator:after { padding-right: 15px; padding-left: 15px; left: -15px; } .quote { border-left: 5px solid #00AFCA; padding: 0 0 0 10px; width: 100%; float: left; margin: 30px 0; } .quote__text { font-size: 16px; line-height: 20px; font-style: italic; color: #000000; font-weight: 500; width: 100%; float: left; } .quote__author { margin-top: 10px; width: 100%; float: left; color: #000000; font-weight: 500; font-size: 16px; line-height: 20px; } .quote__author__desc { width: 100%; float: left; color: #000000; font-weight: 400; font-size: 14px; line-height: 20px; } .content_article { border-left: 5px solid #00AFCA; padding: 10px 0 10px 10px; width: 100%; float: left; margin: 20px 0; text-decoration: none; color: #000000; } .content_article.content_article_right{ float:right; } .content_article:active, .no-touch .content_article:hover { text-decoration: none; color: #000000; } .content_article__title { font-size: 16px; line-height: 20px; font-weight: 500; } .content_article__btn { width: 200px; margin-top: 15px; } .content_article:active .content_article__btn, .no-touch .content_article:hover .content_article__btn { border-color: #00AFCA; } .more_info { width: 100%; text-align: center; float: left; padding: 0; } .more_link, .more_info__link { font-size: 14px; line-height: 20px; color: #6b6b6b; text-decoration: none; text-transform: uppercase; font-weight: 500; } .more_link:active, .no-touch .more_link:hover, .more_info__link:active, .no-touch .more_info__link:hover { text-decoration: none; } .block_categories, .block_categories_select { display: none; } .selectric-block_categories_select { display: block; } .selectric-block_categories_select .selectric-items, .selectric-block_categories_select .selectric { border-color: #4b83e5; } .selectric-block_categories_select .button { color: #4b83e5; } @media only screen and (min-width: 768px) { .quote { padding-left: 30px; } .content_article { width: 50%; padding-left: 30px; padding-right: 10px; margin: 10px 0; border-width: 5px; padding-top: 20px; padding-bottom: 20px; } .section_separator { margin: 15px 0; } .selectric-block_categories_select { display: none; } .block_categories { display: block; width: 100%; float: left; text-align: center; margin: 0 0 30px 0; } .block_categories__item { display: inline-block; border: 2px solid #4b83e5; background: #ffffff; color: #4b83e5; font-size: 13px; line-height: 20px; padding: 3px 12px; font-weight: 400; text-decoration: none; margin: 3px 2px; } .block_categories__item.active, .block_categories__item:active, .no-touch .block_categories__item:hover { background: #4b83e5; color: #ffffff; text-decoration: none; } } @media only screen and (min-width: 992px) { .container .section_separator:after { padding-right: 20px; padding-left: 20px; left: -20px; } } @media only screen and (min-width: 1500px) { .container .section_separator:after { padding-right: 30px; padding-left: 30px; left: -30px; } } .block_more { width: 100%; float: left; text-align: center; margin: 30px 0 0 0; } .block_more__link { background: #ffffff; display: inline-block; border: 2px solid #4b83e5; color: #4b83e5; text-transform: uppercase; font-size: 13px; line-height: 20px; padding: 5px 17px; font-weight: 700; text-decoration: none; position: relative; } .block_more__link:active, .no-touch .block_more__link:hover { background: #4b83e5; color: #ffffff; text-decoration: none; } .block_more__link.loading:active, .no-touch .block_more__link.loading:hover, .block_more__link.loading { border-color: #d7d7d7; background: #ffffff; } .block_more__link.loading span { opacity: 0; } .block_more__link.loading .preloader { opacity: 1; position: absolute; left: 50%; top: 50%; margin: -10px 0 0 -10px; } .image-width { width: 100%; float: left; margin: 6px 0 20px 0; position: relative; } .image-right img, .image-left img, .image-width img { width: 100%; display: block; } .image-left { width: 100%; float: left; margin: 6px 0 20px 0; } .image-right { width: 100%; float: right; margin: 6px 0 20px 0; } .image-width .image__desc, .image-left .image__desc, .image-right .image__desc { font-size: 13px; font-style: italic; line-height: 20px; color: #999999; width: 100%; float: left; margin-top: 6px; } .image__main { position: relative; width: 100%; float: left; } .image__source { position: absolute; bottom: 0; left: 0; width: 100%; padding: 10px 20px; font-size: 13px; line-height: 20px; color: #ffffff; background: rgba(255,255,255,0); background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(0,0,0,0.6) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,0)), color-stop(100%, rgba(0,0,0,0.6))); background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(0,0,0,0.6) 100%); background: -o-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(0,0,0,0.6) 100%); background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(0,0,0,0.6) 100%); background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(0,0,0,0.6) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#000000', GradientType=0 ); } @media only screen and (min-width: 768px) { .image-left { display: inline-block; width: 50%; margin: 6px 40px 20px 0; } .image-right { display: inline-block; width: 50%; margin: 6px 0 20px 40px; } } .contain { background-position: center; background-size: contain; background-repeat: no-repeat; } .cover { background-position: center; background-size: cover; background-repeat: no-repeat; } .contain img, .cover img { display: none; border: none; } .table_container { position: relative; overflow: hidden; width: 290px; margin: auto; margin: 20px 0; } .table { width: 100%; position: relative; font-size: 13px; line-height: 20px; } .table th { font-weight: 700; font-size: 13px; border-bottom: 1px dotted #cacaca; } .table th, .table td { padding: 5px 10px; } .table td { border-top: 1px dotted #cacaca; } .table td:first-child { border-left: none; } .table tr:nth-child(odd) td { /*background: #e4e4e4;*/ } @media only screen and (min-width: 768px) { .table_container { width: 750px; } } @media only screen and (min-width: 992px) { .table_container { width: 900px; } .content-sidebar .table_container { width: 630px; } } @media only screen and (min-width: 1500px) { .table_container { width: 1070px; } .content-sidebar .table_container { width: 800px; } } .blockmore { width: 100%; float: left; margin: 20px 0 10px 0; text-align: center; } .blockmore-btn { border-radius: 5px; border: 2px solid #ababab; display: inline-block; height: 35px; padding: 0 40px; font-size: 14; text-transform: uppercase; font-weight: 500; line-height: 30px; color: #000000; text-decoration: none; background: #ffffff; position: relative; } .blockmore-btn:active, .no-touch .blockmore-btn:hover { border-color: #00AFCA; color: #000000; text-decoration: none; } .blockmore-btn.loading { } .blockmore-btn.loading:active, .no-touch .blockmore-btn.loading:hover, .blockmore-btn.loading { border-color: #d7d7d7; background: #ffffff; } .blockmore-btn.loading span { opacity: 0; } .blockmore-btn.loading .preloader { opacity: 1; position: absolute; left: 50%; top: 50%; margin: -10px 0 0 -10px; } .btn_social { display: inline-block; margin-right: 5px; border-radius: 5px; width: 70px; height: 26px; color: #ffffff; font-size: 18px; line-height: 28px; text-align: center; text-decoration: none; } .btn_social:active, .no-touch .btn_social:hover { color: #ffffff; text-decoration: none; } .btn_social-fb { background-color: #475993; } .btn_social-tw { background-color: #00aced; } .btn_social-gp { background-color: #dd4b39; } ol, ul { margin: 8px 0; width: 100%; float: left; padding-left: 20px; } ol li, ul li { margin: 5px 0; width: 100%; padding-left: 10px; } ol li>span, ul li>span { color: #000000; } ul.list-dash { padding-left: 20px; } ul.list-dash li { position: relative; color: #98d18a; list-style: none; } ul.list-dash li:before { display: block; position: absolute; left: -10px; top: 0px; content: "\2014"; margin-right: 20px; } ol.list-mark li, ul.list-mark li { position: relative; color: #00AFCA; } ol.list-mark li>span, ul.list-mark li>span { color: #000000; } .clearfix:before, .clearfix:after, .dl-horizontal dd:before, .dl-horizontal dd:after, .container:before, .container:after, .container-fluid:before, .container-fluid:after, .row:before, .row:after, .form-horizontal .form-group:before, .form-horizontal .form-group:after, .btn-toolbar:before, .btn-toolbar:after, .btn-group-vertical > .btn-group:before, .btn-group-vertical > .btn-group:after, .nav:before, .nav:after, .navbar:before, .navbar:after, .navbar-header:before, .navbar-header:after, .navbar-collapse:before, .navbar-collapse:after, .pager:before, .pager:after, .panel-body:before, .panel-body:after, .modal-header:before, .modal-header:after, .modal-footer:before, .modal-footer:after { content: " "; display: table; } .clearfix:after, .dl-horizontal dd:after, .container:after, .container-fluid:after, .row:after, .form-horizontal .form-group:after, .btn-toolbar:after, .btn-group-vertical > .btn-group:after, .nav:after, .navbar:after, .navbar-header:after, .navbar-collapse:after, .pager:after, .panel-body:after, .modal-header:after, .modal-footer:after { clear: both; } /* ========================================================================== END Main styles ========================================================================== */ /* ========================================================================== Header ========================================================================== */ .header { position: fixed; left: 0; top: 0; z-index: 5000; top: 0; height: 70px; width: 100%; float: left; z-index: 500; } body { padding-top: 60px; } .header { position: fixed; z-index: 5000; top: -60px; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; transition: all 0.2s linear; } .header.active.scrolled { -webkit-transition: all 0s linear; -moz-transition: all 0s linear; transition: all 0s linear; } .header.active { top: 0; } .header .container { background: #ffffff; box-shadow: 0 1px 3px rgba(0,0,0,.2); height: 60px; } .header__top { position: absolute; top: 0; left: 0; height: 60px; width: 100%; background: #ffffff; z-index: 200; border-bottom: 1px solid #dfdfdf; } .header__logo { position: absolute; left: 10px; top: 17px; height: 30px; width: 170px; z-index: 500; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .header__logo img { width: 100%; display: block; } .header__bottom { display: none; position: absolute; left: 0; top: 0; width: 100%; text-align: center; padding: 10px 0 10px 0; background: #ffffff; border-bottom: 1px solid #dfdfdf; box-shadow: 0 1px 3px rgba(0,0,0,.2); -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .header__bottom.active { top: 60px !important; } .header__mainmenu__btn-open { height: 60px; width: 40px; position: absolute; right: 10px; top: 0; } .header__mainmenu__btn-open .tcon { height: 60px; font-size: 20px; width: 40px; } .header__mainmenu__btn-open .tcon-menu__lines:after, .header__mainmenu__btn-open .tcon-menu__lines:before, .header__mainmenu__btn-open .tcon-menu__lines { background: #333333; } .no-touch .header__mainmenu__btn-open .tcon-transform .tcon-menu__lines:after, .no-touch .header__mainmenu__btn-open .tcon-transform .tcon-menu__lines:before, .header__mainmenu__btn-open:active .tcon-menu__lines:after, .no-touch .header__mainmenu__btn-open:hover .tcon-menu__lines:after, .header__mainmenu__btn-open:active .tcon-menu__lines:before, .no-touch .header__mainmenu__btn-open:hover .tcon-menu__lines:before, .header__mainmenu__btn-open:active .tcon-menu__lines, .no-touch .header__mainmenu__btn-open:hover .tcon-menu__lines { background: #00AFCA; } .header__mainmenu__btn-open:active .tcon-transform .tcon-menu__lines, .no-touch .header__mainmenu__btn-open:hover .tcon-transform .tcon-menu__lines { background: inherit; } .header__menu { padding: 0 20px; width: 100%; float: left; text-align: center; } .header__menu__link { display: inline-block; padding: 4px 5px; color: #000000; text-transform: uppercase; font-size: 15px; line-height: 15px; font-weight: 500; height: 22px; margin: 4px 5px; } .header__menu__link:active, .no-touch .header__menu__link:hover { color: #00AFCA; text-decoration: none; } .header__project_menu { padding: 0 20px; width: 100%; float: left; text-align: center; margin-top: 10px; } .header__project_menu__link { display: inline-block; padding: 4px 0; padding-left: 10px; color: #00AFCA; font-size: 14px; line-height: 14px; height: 20px; margin: 4px 0; margin-left: 8px; border-left: 1px solid #d3d3d3; } .header__project_menu__link:active, .no-touch .header__project_menu__link:hover { color: #00AFCA; text-decoration: underline; } .header__project_menu__link:first-child { margin-left: 0; padding-left: 0; border-left: none; } .header__search { width: 100%; float: left; margin-top: 10px; } .header__search__btn-open { position: absolute; right: 40px; top: 0; z-index: 20; height: 60px; width: 40px; line-height: 56px; background: none; border: none; font-size: 20px; display: block; padding: 0; text-align: center; color: #000000; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; outline: none; } .header__search__options__btn-open { position: absolute; padding: 21px 22px; font-size: 26px; color: #888888; cursor: pointer; } .iradio input { position: absolute; left: -99999px; } .icheckbox input { position: absolute; left: -99999px; } .iradio, .icheckbox { cursor: pointer; } .iradio>i { float: left; display: block; width: 22px; height: 22px; font-size: 15px; line-height: 24px; background: #ffffff; border: 2px solid #cfcfcf; position: relative; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; border-radius: 30px; margin-right: 10px; } .site-index .iradio>i { border:2px solid rgba(97, 183, 57, 0.5); } .iradio input[type="radio"]:checked + i { border: 2px solid #00AFCA; } .iradio input[type="radio"]:checked + i:after { content: ""; background: #00AFCA; border-radius: 10px; width: 12px; height: 12px; display: inline-block; position: relative; top: -2px; left: 3px; } .icheckbox>i { float: left; display: block; width: 20px; height: 20px; font-size: 15px; line-height: 24px; background: #ffffff; border: 2px solid #cfcfcf; position: relative; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; margin-right: 10px; } .icheckbox input[type="checkbox"]:checked + i { border: 2px solid #00AFCA; font-family: Font Awesome\ 5 Free; text-align: center; color: #69bf50; font-weight: 900; } .icheckbox input[type="checkbox"]:checked + i:after { content: '\f00c'; top: -4px; position: relative; left: -1px; } .form-group { display: inline-block; margin-left: 12px; padding-bottom: 10px; } .header__search__options__list { display: none; position: absolute; bottom: -63px; width: 100%; background: #fff; border-top: 1px solid #eee; padding: 17px 10px; text-align: left; } .header__search__options__list .form-group div { display: inline-block; } .header__search__btn-open i { display: inline-block; vertical-align: middle; } .header__search__btn-open span { font-size: 16px; display: inline-block; vertical-align: middle; margin-left: 5px; } .header__lang { position: absolute; top: 15px; right: 80px; z-index: 20; height: 30px; text-align: center; cursor: pointer; } .header__lang__link { display: block; float: left; width: 36px; height: 30px; line-height: 30px; font-weight: 700; text-align: center; text-decoration: none; color: #000000; border: 1px solid #dfdfdf; } .header__lang__link.is-current, .header__lang__link.is-current:active, .no-touch .header__lang__link.is-current:hover { text-decoration: none; color: #ffffff; background: #00AFCA; border-color: #00AFCA; } .header__lang__link:active, .no-touch .header__lang__link:hover { text-decoration: none; color: #000000; } .header__lang__link:first-child { border-right: none; } .header__lang__link:last-child { border-left: none; } .header__lang__link.is-current { } .header__search__block { width: 100%; float: left; text-align: center; position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 6000; display: none; } .header__search__block .container { background: none; } .header__search__block_inner { width: 100%; height: 100%; position: absolute; left: 0; top: 0; } .header__search__block__overlay { position: absolute; z-index: 1; width: 100%; height: 100%; background: rgba(0,0,0,.7); } .header__search__form { margin-top: 0; position: relative; z-index: 10; display: block; float: left; height: auto; width: 100%; padding: 0; background: #ffffff; top: -160px; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; } .header__search__block.active .header__search__form { top: 0; } .header__search__inputbox { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border: none; display: block; float: left; height: 30px; vertical-align: top; margin: 0; width: calc( 100% - 40px ); background: none; text-align: center; color: #000000; font-size: 18px; padding: 20px; border-bottom: 2px solid #00AFCA; -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; transition: all .3s ease-in-out; } .header__search__inputbox::-webkit-input-placeholder { color: #a1a1a1; } .header__search__inputbox::-moz-placeholder { color: #a1a1a1; } .header__search__inputbox:-moz-placeholder { color: #a1a1a1; } .header__search__inputbox:-ms-input-placeholder { color: #a1a1a1; } .header__search__inputbox:focus { outline: none; } .header__search__btn-submit { height: 50px; width: 50%; float: left; line-height: 42px; background: none; border: none; font-size: 14px; display: block; float: left; text-align: center; color: #000000; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .header__search__btn-submit:active, .no-touch .header__search__btn-submit:hover { color: #00AFCA; text-decoration: none; } .header__search__btn-submit:focus { outline: none; } .header__search__btn-submit span { vertical-align: middle; display: inline-block; } .header__search__btn-submit i { font-size: 20px; margin-right: 5px; vertical-align: middle; display: inline-block; } .header__search__btn-close { display: block; float: left; width: 50%; font-size: 14px; height: 50px; line-height: 42px; text-align: center; color: #000000; background: none; text-decoration: none; border: none; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .header__search__btn-close:active, .no-touch .header__search__btn-close:hover { text-decoration: none; color: #00AFCA; } .header__search__btn-close:focus { outline: none; } .header__search__btn-close span { vertical-align: middle; display: inline-block; } .header__search__btn-close i { font-size: 20px; margin-right: 5px; vertical-align: middle; display: inline-block; } .header__search__block .container { padding: 0; } @media only screen and (min-width: 768px) { .header__search__block__overlay { width: 100vw; left: 50%; top: 0; margin-left: -50vw; margin-right: -50vw; } .header__search__form { text-align: center; top: -80px; } .header__search__inputbox { text-align: left; width: calc( 100% - 305px ); padding-left: 66px; } .header__search__btn-submit, .header__search__btn-close { display: block; float: left; height: 72px; width: 100px; border-bottom: 2px solid #00AFCA; } } @media only screen and (min-width: 992px) { body { padding-top: 70px; } .header { left: 50%; width: 960px; margin-left: -480px; height: 70px; top: -70px; } .header .container { height: 70px; } .header__top { position: absolute; left: 0; top: 0; background: none; z-index: 300; width: 100%; height: 70px; } .header__logo { position: absolute; top: 15px; left: 20px; height: 40px; width: 270px; background: none; } .header__logo img { display: block; } .header__mainmenu__btn-open { display: none; } .header__search__btn-open { right: 0; height: 70px; line-height: 66px; z-index: 100; width: 50px; } .header__lang { top: 20px; right: 50px; } .header__menu { display: inline-block; z-index: 1000; float: none; position: relative; width: auto; margin: 0; padding: 0; white-space: nowrap; } .header__menu__link { margin-bottom: 0; margin-top: 0; margin-left: 0; padding-left: 0; } .header__project_menu { width: auto; margin-top: 5px; text-align: left; padding: 0; } .header__project_menu__link { margin-top: 0; margin-bottom: 0; margin-right: 0; } .header__bottom { z-index: 400; height: 70px; position: relative; width: 540px !important; float: left; display: table; top: 0 !important; left: 0; padding: 0; margin-left: 280px; background: none; border-bottom: none; box-shadow: none; -webkit-transition: none; -moz-transition: none; transition: none; text-align: left; } .header__bottom_inner { text-align: left; padding-left: 0; display: table-cell; vertical-align: middle; } } @media only screen and (min-width: 1500px) { .header { width: 1170px; margin-left: -585px; } .header__logo { left: 30px; } .header__bottom { margin-left: 300px; } .header__search__inputbox { padding-left: 75px; padding-right: 30px; text-align: left; width: calc( 100% - 305px ); } .header__search__btn-open { right: 10px; } .header__lang { right: 60px; } } /* ========================================================================== END Header ========================================================================== */ /* ========================================================================== Projects block ========================================================================== */ .projects_block { margin-top: 30px; margin-bottom: 30px; } .projects_carousel_block { width: 100%; float: left; position: relative; overflow: hidden; border: 1px solid #dfdfdf; border-bottom: none; } .projects_carousel { width: 100%; float: left; position: relative; } .projects_carousel__item { width: 100%; float: left; } .projects_carousel__item__image_container { /*height: 220px;*/ width: 100%; /*padding-top: 57.25%;*/ overflow: hidden; float: left; position: relative; } .projects_carousel__item__image { /*height: 100%;*/ position: absolute; top: 0; left: 0; padding-top: 57.25%; width: 100%; float: left; display: block; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; position: relative; } .projects_carousel__item:active .projects_carousel__item__image, .no-touch .projects_carousel__item:hover .projects_carousel__item__image { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); transform: scale(1.1); } .projects_carousel__item__logo { background: #ffffff; position: absolute; left: 30px; top: 0; z-index: 1000; } .projects_carousel__item__content { width: 100%; float: left; padding: 20px; margin: 0; } .projects_carousel__item__title { width: 100%; float: left; font-size: 20px; line-height: 24px; font-weight: 500; color: #333333; margin-bottom: 10px; } .projects_carousel__item__desc { width: 100%; float: left; font-size: 14px; line-height: 18px; font-weight: 500; color: #333333; margin-bottom: 20px; } .projects_carousel__item__link { margin-top: 10px; margin-bottom: 20px; } .projects_thumbs { position: relative; width: 100%; float: left; height: auto; overflow: hidden; padding: 10px 30px 0 30px; background: #ffffff; box-shadow: 0 0 10px rgba(0,0,0,.2); z-index: 100; } .projects_carousel_thumbs { position: relative; z-index: 100; background: #ffffff; } .projects_carousel_thumbs__item { width: 100%; margin: 0; float: left; background: #ffffff; overflow: visible; height: auto; padding: 0 20px; border-bottom: 3px solid transparent; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .projects_carousel_thumbs .owl-item.synced:active .projects_carousel_thumbs__item, .no-touch .projects_carousel_thumbs .owl-item.synced:hover .projects_carousel_thumbs__item, .projects_carousel_thumbs .owl-item.synced .projects_carousel_thumbs__item { border-color: #00AFCA; outline: none; } .projects_carousel_thumbs__item__image { width: 100%; margin: auto; margin-top: 0; height: 50px; max-width: 200px; } .projects_carousel_thumbs__item__title { font-size: 11px; line-height: 14px; text-align: center; color: #000000; font-weight: 500; margin-top: 5px; margin-bottom: 5px; width: 100%; float: left; } .projects_thumbs_container { width: 100%; float: left; margin-top: 10px; } .projects_thumbs_container h4 { color: #838383; margin-bottom: 15px; margin-left: 20px; } .projects_carousel_thumbs .owl-item { cursor: pointer; } .projects_carousel_thumbs .owl-item:active .projects_carousel_thumbs__item, .no-touch .projects_carousel_thumbs .owl-item:hover .projects_carousel_thumbs__item { border-color: #a7e5ef; } .carousel_thumbs__next, .carousel_thumbs__prev { position: absolute; z-index: 10; cursor: pointer; top: 0; left: 0; width: 36px; height: 100%; color: #9f9f9f; background-repeat: no-repeat; background-position: center; background-size: 14px auto; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .carousel_thumbs__prev { left: 0; top: 0; } .carousel_thumbs__next { left: auto; right: 0; top: 0; } .carousel_thumbs__prev:after, .carousel_thumbs__next:after { display: block; position: absolute; width: 36px; height: 36px; top: 50%; left: 0; margin-top: -18px; font-family: Font Awesome\ 5 Free; line-height: 36px; font-size: 36px; font-weight: 900; text-align: center; } .carousel_thumbs__next:after { content: '\f054'; right: 0; left: auto; } .carousel_thumbs__prev:after { content: '\f053'; } .carousel_thumbs__next.disabled, .carousel_thumbs__prev.disabled { cursor: default; opacity: 0.6; } @media only screen and (max-width: 767px) { .projects_menu_block .container, .projects_block .container { padding: 0; } } @media only screen and (min-width: 768px) { .projects_carousel { height: auto; } .projects_carousel__item { height: auto; display: table; position: relative; } .projects_carousel__item__image_container { float: none; width: 300px; height: auto; display: table-cell; vertical-align: top; position: relative; padding: 0; } .projects_carousel__item__image { height: 100%; position: absolute; display: block; left: 0; top: 0; width: 100%; padding: 0; z-index: 10; } .projects_carousel__item__content { margin: 0; float: none; width: auto; padding-left: 20px; display: table-cell; vertical-align: middle; padding-bottom: 140px; } .projects_carousel__item__title { font-size: 24px; margin-top: 30px; line-height: 30px; font-weight: 500; } .projects_thumbs_container { position: absolute; width: 417px; right: 0; bottom: 0; margin-top: 0; } .projects_thumbs_container h4 { margin-left: 20px; } } @media only screen and (min-width: 992px) { .projects_block { margin-bottom: 40px; } .projects_carousel__item__image_container { width: 50%; } .projects_thumbs_container { width: 458px; } } @media only screen and (min-width: 1500px) { .projects_block { margin-bottom: 50px; } .projects_carousel__item__image_container { width: 650px; } .projects_thumbs_block { width: 458px; } } /* ========================================================================== END Projects block ========================================================================== */ /* ========================================================================== Events block ========================================================================== */ .events_carousel_block { width: 100%; float: left; } .events_carousel__item { width: 100%; position: relative; float: left; padding-bottom: 20px; } .events_carousel__item__left { width: 100%; float: left; padding: 30px 0; text-align: center; margin-bottom: 10px; } .events_carousel__item__date_icon { color: #ffffff; font-size: 36px; margin-right: 20px; vertical-align: middle; display: inline-block; } .events_carousel__item__date_icon i { vertical-align: middle; display: inline-block; } .events_carousel__item__date { color: #ffffff; display: inline-block; vertical-align: middle; float: none; font-synthesis: 16px; line-height: 14px; } .events_carousel__item__date div { font-size: 30px; font-weight: 700; line-height: 26px; } .events_carousel__item__title { display: block; font-size: 20px; line-height: 24px; font-weight: 500; color: #000000; width: 100%; float: left; text-decoration: none; } .events_carousel__item__title:active, .no-touch .events_carousel__item__title:hover { text-decoration: none; } .events_carousel__desc { width: 100%; float: left; font-size: 14px; line-height: 18px; margin-top: 10px; color: #5f5f5f; margin-bottom: 20px; max-width: 740px; } .events_carousel__item__image_container { width: 100%; float: left; position: relative; margin: 20px 0; } .events_carousel__item__image_container:before { content: ''; position: absolute; display: block; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,.3); } .events_carousel__item__image { z-index: 10; width: 100%; float: left; padding-top: 57.25%; } .events_carousel__item__bottom { width: 100%; float: left; } .events_carousel__item__address { width: 100%; float: left; font-size: 14px; font-weight: 500; line-height: 18px; color: #333333; margin-bottom: 20px; } .events_carousel__item__address i { color: #00AFCA; display: block; float: left; font-size: 24px; line-height: 18px; } .events_carousel__item__address span { display: block; margin-left: 25px; } .events_carousel__item__calendar { width: 100%; text-align: center; } .events_thumbs_block { width: 100%; float: left; position: relative; margin-top: 10px; padding: 0 25px; } .events_thumbs__prev { margin-left: -15px; } .events_thumbs__next { margin-right: -15px; } .events_carousel_thumbs { position: relative; z-index: 100; background: #ffffff; } .events_carousel_thumbs__item { width: 100%; margin: 0; padding: 0 10px 10px 10px; float: left; height: auto; background: #ffffff; border-bottom: 3px solid transparent; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .events_carousel_thumbs .owl-item.synced:active .events_carousel_thumbs__item, .no-touch .events_carousel_thumbs .owl-item.synced:hover .events_carousel_thumbs__item, .events_carousel_thumbs .owl-item.synced .events_carousel_thumbs__item { border-color: #00AFCA; } .events_carousel_thumbs .owl-item { cursor: pointer; } .events_carousel_thumbs .owl-item:active .events_carousel_thumbs__item, .no-touch .events_carousel_thumbs .owl-item:hover .events_carousel_thumbs__item { border-color: #a7e5ef; } .events_carousel_thumbs__item__date { font-size: 12px; line-height: 14px; color: #5f5f5f; margin-bottom: 5px; width: 100%; float: left; } .events_carousel_thumbs__item__title { width: 100%; float: left; font-weight: 500; font-size: 12px; line-height: 16px; color: #333333; } @media only screen and (min-width: 768px) { .events_carousel__item { display: table; } .events_carousel__item__left { width: 160px; display: table-cell; float: none; padding: 0; vertical-align: middle; text-align: center; margin-bottom: 0; } .events_carousel__item__date_icon { color: #ffffff; font-size: 36px; margin-right: 0; vertical-align: middle; display: block; margin-bottom: 20px; } .events_carousel__item__date_icon i { vertical-align: middle; display: inline-block; } .events_carousel__item__date { color: #ffffff; display: inline-block; vertical-align: middle; float: none; font-synthesis: 18px; line-height: 20px; } .events_carousel__item__date div { font-size: 50px; font-weight: 700; line-height: 46px; } .events_carousel__item__right { display: table-cell; float: none; vertical-align: top; padding-left: 30px; } .events_carousel__item__date { font-size: 20px; } .events_carousel__item__address { margin-bottom: 20px; } .events_carousel__item__calendar { width: 190px; } } /* ========================================================================== END Events block ========================================================================== */ /* ========================================================================== Material item ========================================================================== */ .material_item { position: relative; width: 100%; display: inline-block; vertical-align: top; } .material_item__inner { position: relative; float: left; width: 100%; padding-top: 66.86%; z-index: 10; overflow: hidden; } .material_item__link { color: #000000; text-decoration: none; } .material_item__link:active, .no-touch .material_item__link:hover { color: #000000; text-decoration: none; } .material_item__image_container { padding-bottom: 66.86%; z-index: 10; position: absolute; top: 0; left: 0; width: 100%; overflow: hidden; } .material_item__image { z-index: 10; position: absolute; top: 0; left: 0; width: 100%; height: 100%; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .material_item__image:after { content: ''; display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: #000000; opacity: 0.2; z-index: 10; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .material_item__link:active .material_item__image:after, .no-touch .material_item__link:hover .material_item__image:after { opacity: 0; } .material_item__title { position: relative; display: block; width: 100%; float: left; padding: 0 0 3px 0; bottom: auto; top: 0; left: 0; font-size: 15px; font-weight: 500; line-height: 21px; z-index: 20; } .material_item__title span { display: inline; padding-bottom: 1px; border-bottom: 1px solid transparent; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .material_item__link:active .material_item__title span, .no-touch .material_item__link:hover .material_item__title span { border-color: #999999; } .material_item__info { width: 100%; float: left; margin: 5px 0; position: relative; display: table; vertical-align: middle; } .material_item__info__right, .material_item__info__left { display: table-cell; width: auto; text-align: left; vertical-align: top; } .material_item__info__right { text-align: right; } .material_item__date { font-size: 13px; line-height: 24px; color: #5f5f5f; margin-right: 5px; display: inline-block; vertical-align: middle; } .material_item__category { display: inline-block; font-size: 13px; line-height: 24px; text-decoration: none; vertical-align: middle; } .material_item__category:active, .no-touch .material_item__category:hover { color: #00AFCA; text-decoration: underline; } .material_item__comments, .material_item__views { font-size: 13px; line-height: 16px; color: #b2b2b2; display: inline-block; vertical-align: middle; } .material_item__comments { margin-left: 5px; } .material_item__comments i, .material_item__views i { margin: 0; margin-right: 5px; display: inline-block; vertical-align: middle; } .material_item__comments span, .material_item__views span { line-height: 20px; display: inline-block; vertical-align: middle; } .material_item__desc { font-size: 13px; line-height: 19px; color: #5f5f5f; } @media only screen and (min-width: 768px) { .material_item__title { font-size: 18px; line-height: 24px; } .materials_block-sm-4 .material_item__title, .materials_block-sm-3 .material_item__title { font-size: 15px; line-height: 23px; } } @media only screen and (min-width: 992px) { .materials_block-md-4 .material_item .material_item__title { font-size: 15px; line-height: 23px; } .materials_block-md-3 .material_item .material_item__title { font-size: 16px; line-height: 24px; } } @media only screen and (min-width: 1500px) { .material_item__title { font-size: 22px; line-height: 28px; } .materials_block-lg-4 .material_item .material_item__title { font-size: 15px; line-height: 23px; } .materials_block-lg-3 .material_item .material_item__title { font-size: 16px; line-height: 24px; } } /* ========================================================================== END Material item ========================================================================== */ /* ========================================================================== Material item banner ========================================================================== */ .material_item-banner img { display: block; margin: auto; } @media only screen and (min-width: 768px) { .material_item-banner img { max-width: 100%; } } /* ========================================================================== END Material item banner ========================================================================== */ /* ========================================================================== Material item - Read ========================================================================== */ .materials_block div.material_item.material_item-read { margin: 4px 0 0 0; } .materials_block div.material_item.material_item-read:first-child { margin-top: 0; } .material_item-read .material_item__inner { padding: 0 0 2px 0; } .material_item-read .material_item__info { margin: 0; display: block; width: 100%; float: left; } .material_item-read .material_item__info__right, .material_item-read .material_item__info__left { display: inline-block; width: auto; text-align: left; } .material_item-read .material_item__info__left { margin-right: 10px; } .material_item-read .material_item__title { font-size: 15px; line-height: 22px; font-weight: 400; display: block; width: 100%; float: left; } .material_item-read.important .material_item__title { font-weight: 700; } /* ========================================================================== END Material item - Read ========================================================================== */ /* ========================================================================== Material item - Read ========================================================================== */ .topicread_block { padding-bottom: 20px; } .material_item.material_item-topicread { color: #000000; } .material_item-topicread .material_item__title { font-size: 15px !important; line-height: 20px !important; font-weight: 400; display: block; width: auto; float: none; margin-left: 85px; padding: 0; } .material_item-topicread .material_item__image { width: 70px; height: 70px; float: left; padding: 0; margin: 0; position: relative; top: 0; left: 0; } /* ========================================================================== END Material item - Read ========================================================================== */ /* ========================================================================== Material item - Read News ========================================================================== */ .material_item.material_item-readnews { padding: 0 0 2px 0; margin: 6px 0 0 0 !important; } .material_item.material_item-readnews:first-child { padding: 0 0 2px 0; margin-top: 0 !important; } .material_item-readnews .material_item__inner { padding: 0 0 2px 0; } .material_item-readnews .material_item__info { margin: 0 !important; display: block; width: 50px; float: left; padding: 0 !important; height: auto !important; } .material_item-readnews .material_item__date { font-size: 13px; line-height: 22px; color: #5f5f5f; padding: 0; height: auto; display: block; width: 100%; float: left; margin: 0; } .material_item-readnews .material_item__content { margin: 0 0 0 50px; float: none; padding: 0; } .material_item-readnews .material_item__category { font-size: 13px; line-height: 18px; margin: 4px 0 0 0; float: left; } .material_item-readnews .material_item__title { font-size: 16px; line-height: 22px; font-weight: 400; display: block; width: 100%; float: left; margin: 0; padding: 0; } .material_item-readnews.important .material_item__title { font-weight: 700; } /* ========================================================================== END Material item - Read News ========================================================================== */ /* ========================================================================== Material item - Single ========================================================================== */ .material_item.material_item-single { padding: 0 !important; margin: 0; float: left; display: block; width: 100% !important; } @media only screen and (min-width: 768px) { .material_item.material_item-single .material_item__inner { height: 350px; padding: 0; } .material_item.material_item-single .material_item__link { height: 350px; padding: 0; } .material_item.material_item-single .material_item__image_container { height: 350px; padding: 0; } } /* ========================================================================== END Material item - Single ========================================================================== */ /* ========================================================================== Material item - Cards ========================================================================== */ .material_item-card .material_item__inner { background: #27363b; padding: 0; } .material_item-card .material_item__link { padding-top: 66.86%; position: relative; width: 100%; float: left; } .material_item-card .material_item__image { background: #27363b; } .material_item-card .material_item__image:after { display: none; } .material_item-card .material_item__cardicon { width: 150px; height: 150px; position: absolute; top: 50%; left: 50%; margin: -75px 0 0 -75px; } .material_item-card .material_item__title { width: 100%; color: #ffffff; position: absolute; top: auto; bottom: 40px; left: 0; padding: 0 15px; height: auto; } .material_item-card .material_item__link:active .material_item__title span, .no-touch .material_item-card .material_item__link:hover .material_item__title span { border-color: #ffffff; } .material_item-card .material_item__info { color: #ffffff; position: absolute; padding: 0 15px 10px 15px; margin: 0; bottom: 0; left: 0; z-index: 50; } .material_item__cardscount { font-size: 13px; color: #ffffff; display: inline-block; vertical-align: middle; } .material_item-card .material_item__comments, .material_item-card .material_item__views { color: #ffffff; } /* ========================================================================== END Material item - Cards ========================================================================== */ /* ========================================================================== Material item - Cards 2 ========================================================================== */ .material_item-card-2 .material_item__inner { padding-top: 66.86%; } .material_item-card-2 .material_item__image { background: #27363b; width: 100%; float: left; } .material_item-card-2 .material_item__image:after { display: none; } .material_item-card-2 .material_item__cardicon { width: 150px; height: 150px; position: absolute; top: 50%; left: 50%; margin: -75px 0 0 -75px; } .material_item-card-2 .material_item__info { margin: 0; display: block; width: 100%; float: left; position: relative; top: auto; bottom: auto; } .material_item-card-2 .material_item__info__right, .material_item-card-2 .material_item__info__left { display: inline-block; width: auto; text-align: left; } .material_item-card-2 .material_item__info__left { margin-right: 10px; } .material_item__cardscount { font-size: 13px; line-height: 24px; color: #5f5f5f; margin-right: 5px; display: inline-block; vertical-align: middle; } .material_item-card-2 .material_item__comments, .material_item-card-2 .material_item__views { /*color: #5f5f5f;*/ } /* ========================================================================== END Material item - Cards 2 ========================================================================== */ /* ========================================================================== Material item - Games ========================================================================== */ .material_item-game .material_item__inner { padding: 0; } .material_item-game .material_item__link { padding-top: 66.86%; position: relative; width: 100%; float: left; } .material_item-game .material_item__image:after { opacity: 0.4; } .material_item-game .material_item__link:active .material_item__image:after, .no-touch .material_item-game .material_item__link:hover .material_item__image:after { opacity: 0.3; } .material_item-game .material_item__content { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 0; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .material_item-game .material_item__content_inner { text-align: center; } .material_item-game .material_item__title { width: 100%; padding: 0 15px; color: #ffffff; top: 0; margin-bottom: 5px; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .material_item-game .material_item__link:active .material_item__title span, .no-touch .material_item-game .material_item__link:hover .material_item__title span { border-color: #ffffff; } .material_item-game .material_item__comments, .material_item-game .material_item__views { color: #ffffff; position: relative; z-index: 200; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .material_item-game .material_item__play { z-index: 40; position: absolute; bottom: 15px; left: 50%; margin-left: -80px; width: 160px; border: 2px solid #ffffff; background: none; color: #ffffff; border-radius: 5px; line-height: 30px; font-weight: 500; font-size: 13px; text-transform: uppercase; text-align: center; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .material_item-game .material_item__link:active .material_item__play, .no-touch .material_item-game .material_item__link:hover .material_item__play { color: #ffffff; background: #00AFCA; border-color: #00AFCA; } @media only screen and (min-width: 768px) { .materials_block-sm-4 .material_item-game .material_item__play, .materials_block-sm-3 .material_item-game .material_item__play { opacity: 0; bottom: 50%; margin-bottom: -17px; color: #ffffff; background: #00AFCA; border-color: #00AFCA; } .materials_block-sm-3 .material_item-game .material_item__link:active .material_item__play, .no-touch .materials_block-sm-3 .material_item-game .material_item__link:hover .material_item__play, .materials_block-sm-4 .material_item-game .material_item__link:active .material_item__play, .no-touch .materials_block-sm-4 .material_item-game .material_item__link:hover .material_item__play { opacity: 1; } .materials_block-sm-4 .material_item-game .material_item__link .material_item__title, .materials_block-sm-3 .material_item-game .material_item__link .material_item__title { font-size: 15px; line-height: 23px; opacity: 1; } .materials_block-sm-4 .material_item-game .material_item__link:active .material_item__title, .no-touch .materials_block-sm-4 .material_item-game .material_item__link:hover .material_item__title, .materials_block-sm-4 .material_item-game .material_item__link:active .material_item__comments, .no-touch .materials_block-sm-4 .material_item-game .material_item__link:hover .material_item__comments, .materials_block-sm-4 .material_item-game .material_item__link:active .material_item__views, .no-touch .materials_block-sm-4 .material_item-game .material_item__link:hover .material_item__views, .materials_block-sm-3 .material_item-game .material_item__link:active .material_item__title, .no-touch .materials_block-sm-3 .material_item-game .material_item__link:hover .material_item__title, .materials_block-sm-3 .material_item-game .material_item__link:active .material_item__comments, .no-touch .materials_block-sm-3 .material_item-game .material_item__link:hover .material_item__comments, .materials_block-sm-3 .material_item-game .material_item__link:active .material_item__views, .no-touch .materials_block-sm-3 .material_item-game .material_item__link:hover .material_item__views { opacity: 0; } .materials_block-md-4 .material_item-game .material_item__link:active .material_item__title span, .no-touch .materials_block-md-4 .material_item-game .material_item__link:hover .material_item__title span, .materials_block-md-3 .material_item-game .material_item__link:active .material_item__title span, .no-touch .materials_block-md-3 .material_item-game .material_item__link:hover .material_item__title span { border-color: transparent; } } @media only screen and (min-width: 992px) { .material_item-game .material_item__play { bottom: 30px; } .materials_block-md-4 .material_item-game .material_item__play, .materials_block-md-3 .material_item-game .material_item__play { opacity: 0; bottom: 50%; margin-bottom: -17px; color: #ffffff; background: #00AFCA; border-color: #00AFCA; } .materials_block-md-3 .material_item-game .material_item__link:active .material_item__play, .no-touch .materials_block-md-3 .material_item-game .material_item__link:hover .material_item__play, .materials_block-md-4 .material_item-game .material_item__link:active .material_item__play, .no-touch .materials_block-md-4 .material_item-game .material_item__link:hover .material_item__play { opacity: 1; } .materials_block-md-4 .material_item-game .material_item__link .material_item__title, .materials_block-md-3 .material_item-game .material_item__link .material_item__title { font-size: 16px; line-height: 24px; opacity: 1; } .materials_block-md-4 .material_item-game .material_item__link:active .material_item__title, .no-touch .materials_block-md-4 .material_item-game .material_item__link:hover .material_item__title, .materials_block-md-4 .material_item-game .material_item__link:active .material_item__comments, .no-touch .materials_block-md-4 .material_item-game .material_item__link:hover .material_item__comments, .materials_block-md-4 .material_item-game .material_item__link:active .material_item__views, .no-touch .materials_block-md-4 .material_item-game .material_item__link:hover .material_item__views, .materials_block-md-3 .material_item-game .material_item__link:active .material_item__title, .no-touch .materials_block-md-3 .material_item-game .material_item__link:hover .material_item__title, .materials_block-md-3 .material_item-game .material_item__link:active .material_item__comments, .no-touch .materials_block-md-3 .material_item-game .material_item__link:hover .material_item__comments, .materials_block-md-3 .material_item-game .material_item__link:active .material_item__views, .no-touch .materials_block-md-3 .material_item-game .material_item__link:hover .material_item__views { opacity: 0; } .materials_block-md-4 .material_item-game .material_item__link:active .material_item__title span, .no-touch .materials_block-md-4 .material_item-game .material_item__link:hover .material_item__title span, .materials_block-md-3 .material_item-game .material_item__link:active .material_item__title span, .no-touch .materials_block-md-3 .material_item-game .material_item__link:hover .material_item__title span { border-color: transparent; } } @media only screen and (min-width: 1500px) { .material_item-game .material_item__title { font-size: 28px; line-height: 36px; } .materials_block-lg-4 .material_item-game .material_item__play, .materials_block-lg-3 .material_item-game .material_item__play { opacity: 0; bottom: 50%; margin-bottom: -17px; color: #ffffff; background: #00AFCA; border-color: #00AFCA; } .materials_block-lg-3 .material_item-game .material_item__link:active .material_item__play, .no-touch .materials_block-lg-3 .material_item-game .material_item__link:hover .material_item__play, .materials_block-lg-4 .material_item-game .material_item__link:active .material_item__play, .no-touch .materials_block-lg-4 .material_item-game .material_item__link:hover .material_item__play { opacity: 1; } .materials_block-lg-4 .material_item-game .material_item__link .material_item__title, .materials_block-lg-3 .material_item-game .material_item__link .material_item__title { font-size: 16px; line-height: 24px; opacity: 1; } .materials_block-lg-4 .material_item-game .material_item__link:active .material_item__title, .no-touch .materials_block-lg-4 .material_item-game .material_item__link:hover .material_item__title, .materials_block-lg-4 .material_item-game .material_item__link:active .material_item__comments, .no-touch .materials_block-lg-4 .material_item-game .material_item__link:hover .material_item__comments, .materials_block-lg-4 .material_item-game .material_item__link:active .material_item__views, .no-touch .materials_block-lg-4 .material_item-game .material_item__link:hover .material_item__views, .materials_block-lg-3 .material_item-game .material_item__link:active .material_item__title, .no-touch .materials_block-lg-3 .material_item-game .material_item__link:hover .material_item__title, .materials_block-lg-3 .material_item-game .material_item__link:active .material_item__comments, .no-touch .materials_block-lg-3 .material_item-game .material_item__link:hover .material_item__comments, .materials_block-lg-3 .material_item-game .material_item__link:active .material_item__views, .no-touch .materials_block-lg-3 .material_item-game .material_item__link:hover .material_item__views { opacity: 0; } .materials_block-lg-4 .material_item-game .material_item__link:active .material_item__title span, .no-touch .materials_block-lg-4 .material_item-game .material_item__link:hover .material_item__title span, .materials_block-lg-3 .material_item-game .material_item__link:active .material_item__title span, .no-touch .materials_block-lg-3 .material_item-game .material_item__link:hover .material_item__title span { border-color: transparent; } } /* ========================================================================== END Material item - Games ========================================================================== */ /* ========================================================================== Material item - Interactive ========================================================================== */ .material_item-interactive .material_item__inner { padding: 0; } .material_item-interactive .material_item__link { padding-top: 66.86%; position: relative; width: 100%; float: left; } .material_item-interactive .material_item__image:after { opacity: 0.4; } .material_item-interactive .material_item__link:active .material_item__image:after, .no-touch .material_item-interactive .material_item__link:hover .material_item__image:after { opacity: 0.3; } .material_item-interactive .material_item__image { -webkit-transform: scale(1.2) translate3d(0px, 0px, 0px); -moz-transform: scale(1.2) translate3d(0px, 0px, 0px); transform: scale(1.2) translate3d(0px, 0px, 0px); } .material_item-interactive .material_item__link:active .material_item__image, .no-touch .material_item-interactive .material_item__link:hover .material_item__image { -webkit-transform: scale(1) translate3d(0px, 0px, 0px); -moz-transform: scale(1) translate3d(0px, 0px, 0px); transform: scale(1) translate3d(0px, 0px, 0px); } .material_item-interactive .material_item__content { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 0; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .material_item-interactive .material_item__content_inner { text-align: center; } .material_item-interactive .material_item__title { width: 100%; padding: 0 15px; color: #ffffff; top: 0; font-size: 20px; line-height: 26px; margin-bottom: 5px; } .material_item-interactive .material_item__link:active .material_item__title span, .no-touch .material_item-interactive .material_item__link:hover .material_item__title span { border-color: #ffffff; } .material_item-interactive .material_item__comments, .material_item-interactive .material_item__views { color: #ffffff; position: relative; z-index: 200; } @media only screen and (min-width: 768px) { .materials_block-sm-4 .material_item-interactive .material_item__title, .materials_block-sm-3 .material_item-interactive .material_item__title { font-size: 15px; line-height: 23px; } } @media only screen and (min-width: 992px) { .material_item-interactive .material_item__title { font-size: 24px; line-height: 34px; } .materials_block-md-4 .material_item-interactive .material_item__title { font-size: 15px; line-height: 23px; } .materials_block-md-3 .material_item-interactive .material_item__title { font-size: 16px; line-height: 24px; } } @media only screen and (min-width: 1500px) { .material_item-interactive .material_item__title { font-size: 28px; line-height: 36px; } .materials_block-lg-4 .material_item-interactive .material_item__title { font-size: 15px; line-height: 23px; } .materials_block-lg-3 .material_item-interactive .material_item__title { font-size: 16px; line-height: 24px; } } /* ========================================================================== END Material item - Games ========================================================================== */ /* ========================================================================== Material item - Media ========================================================================== */ .material_item__mediabtn { width: 40px; height: 40px; left: 15px; bottom: 15px; position: absolute; z-index: 100; line-height: 40px; font-size: 50px; opacity: 0.7; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .material_item__link:active .material_item__mediabtn, .no-touch .material_item__link:hover .material_item__mediabtn { opacity: 1; } .material_item__mediabtn:after { width: 100%; height: 100%; left: 0; bottom: 0; content: ''; position: absolute; display: block; text-align: center; color: #ffffff; z-index: 100; font-weight: 900; font-family: Font Awesome\ 5 Free; } .material_item__mediabtn-photo:after { content: '\f030'; } .material_item__mediabtn-video:after { content: '\f144'; } .material_item__mediabtn-infographic:after { content: '\f200'; } .material_item-media .material_item__title { font-size: 16px; line-height: 24px; } @media only screen and (min-width: 768px) { .materials_block-sm-4 .material_item__mediabtn, .materials_block-sm-3 .material_item__mediabtn { width: 40px; height: 40px; font-size: 50px; line-height: 40px; } } @media only screen and (min-width: 992px) { .material_item__mediabtn { width: 60px; height: 60px; line-height: 60px; font-size: 70px; } .materials_block-md-4 .material_item__mediabtn, .materials_block-md-3 .material_item__mediabtn { width: 30px; height: 30px; font-size: 40px; line-height: 30px; } .material_item-media .material_item__title { font-size: 20px; line-height: 28px; } .materials_block-md-4 .material_item-media .material_item__title { font-size: 15px; line-height: 23px; } .materials_block-md-3 .material_item-media .material_item__title { font-size: 16px; line-height: 24px; } } @media only screen and (min-width: 1500px) { .materials_block-lg-4 .material_item__mediabtn, .materials_block-lg-3 .material_item__mediabtn { width: 30px; height: 30px; font-size: 40px; line-height: 30px; } .material_item-media .material_item__title { font-size: 20px; line-height: 28px; } .materials_block-lg-4 .material_item-media .material_item__title { font-size: 15px; line-height: 23px; } .materials_block-lg-3 .material_item-media .material_item__title { font-size: 16px; line-height: 24px; } } /* ========================================================================== END Material item - Media ========================================================================== */ /* ========================================================================== Material item - Read Insert ========================================================================== */ .material_item-readin .material_item__inner { padding: 0; } .material_item-readin .material_item__link { padding-top: 66.86%; position: relative; width: 100%; float: left; } .material_item-readin .material_item__title { width: 100%; color: #ffffff; position: absolute; top: auto; bottom: 40px !important; left: 0; padding: 0 15px; height: auto; } .material_item-readin .material_item__link:active .material_item__title span, .no-touch .material_item-readin .material_item__link:hover .material_item__title span { border-color: #ffffff; } .material_item.material_item-readin .material_item__info { color: #ffffff; position: absolute; padding: 0 15px 10px 15px; margin: 0; top: auto !important; bottom: 0 !important; left: 0; z-index: 50; } .material_item-readin .material_item__date, .material_item-readin .material_item__category, .material_item-readin .material_item__comments, .material_item-readin .material_item__views { color: #ffffff; } .material_item-readin .material_item__category:active, .no-touch .material_item-readin .material_item__category:hover { color: #ffffff; } .material_item-readin .material_item__image:after { opacity: 0.2; } .material_item-readin .material_item__link:active .material_item__image:after, .no-touch .material_item-readin .material_item__link:hover .material_item__image:after { opacity: 0.1; } .material_item-readin .material_item__link:active .material_item__image, .no-touch .material_item-readin .material_item__link:hover .material_item__image { -webkit-transform: scale(1.2) translate3d(0px, 0px, 0px); -moz-transform: scale(1.2) translate3d(0px, 0px, 0px); transform: scale(1.2) translate3d(0px, 0px, 0px); } @media only screen and (min-width: 768px) { .materials_block-sm-4 .material_item-readin .material_item__title, .materials_block-sm-3 .material_item-readin .material_item__title { bottom: 10px; } .materials_block-sm-4 .material_item-readin .material_item__info, .materials_block-sm-3 .material_item-readin .material_item__info { top: 10px; bottom: auto; } } @media only screen and (min-width: 992px) { .materials_block-md-4 .material_item-readin .material_item__title, .materials_block-md-3 .material_item-readin .material_item__title { bottom: 10px; } .materials_block-md-4 .material_item-readin .material_item__info, .materials_block-md-3 .material_item-readin .material_item__info { top: 10px; bottom: auto; } } @media only screen and (min-width: 1500px) { .materials_block-lg-4 .material_item-readin .material_item__title, .materials_block-lg-3 .material_item-readin .material_item__title { bottom: 10px; } .materials_block-lg-4 .material_item-readin .material_item__info, .materials_block-lg-3 .material_item-readin .material_item__info { top: 10px; bottom: auto; } } /* ========================================================================== END Material item - Read Insert ========================================================================== */ /* ========================================================================== Material item - Read Insert News ========================================================================== */ .material_item-readinnews { margin-top: 10px !important; } .material_item-readinnews:first-child { margin-top: 0 !important; } .material_item-readinnews .material_item__inner { padding: 0; height: 170px; } .material_item-readinnews .material_item__link { padding-top: 0; position: relative; width: 100%; float: left; } .material_item-readinnews .material_item__title { width: 100%; color: #ffffff; position: absolute; top: 0 !important; bottom: auto; left: 0; padding: 10px 15px 0 15px; height: auto; font-size: 18px; line-height: 24px; } .material_item-readinnews .material_item__link:active .material_item__title span, .no-touch .material_item-readinnews .material_item__link:hover .material_item__title span { border-color: #ffffff; } .material_item.material_item-readinnews .material_item__info { color: #ffffff; position: absolute; padding: 0 15px 10px 15px; margin: 0; top: auto !important; bottom: 0 !important; left: 0; z-index: 50; } .material_item-readinnews .material_item__date, .material_item-readinnews .material_item__category, .material_item-readinnews .material_item__comments, .material_item-readinnews .material_item__views { color: #ffffff; } .material_item-readinnews .material_item__category:active, .no-touch .material_item-readinnews .material_item__category:hover { color: #ffffff; } .material_item-readinnews .material_item__image:after { opacity: 0.4; } .material_item-readinnews .material_item__link:active .material_item__image:after, .no-touch .material_item-readinnews .material_item__link:hover .material_item__image:after { opacity: 0.4; } .material_item-readinnews .material_item__link:active .material_item__image, .no-touch .material_item-readinnews .material_item__link:hover .material_item__image { -webkit-transform: scale(1.1) translate3d(0px, 0px, 0px); -moz-transform: scale(1.1) translate3d(0px, 0px, 0px); transform: scale(1.1) translate3d(0px, 0px, 0px); } @media only screen and (min-width: 768px) { .materials_block-sm-4 .material_item-readinnews:nth-child(4n), .materials_block-sm-3 .material_item-readinnews:nth-child(3n), .materials_block-sm-2 .material_item-readinnews:nth-child(2n) { margin-top: 0 !important; } .materials_block-sm-4 .material_item-readinnews .material_item__inner, .materials_block-sm-3 .material_item-readinnews .material_item__inner, .materials_block-sm-2 .material_item-readinnews .material_item__inner, .materials_block-sm-1 .material_item-readinnews .material_item__inner { height: 160px; } .materials_block-sm-4 .material_item-readinnews .material_item__title, .materials_block-sm-3 .material_item-readinnews .material_item__title, .materials_block-sm-2 .material_item-readinnews .material_item__title, .materials_block-sm-1 .material_item-readinnews .material_item__title { padding: 20px 15px 0 15px; font-size: 26px; line-height: 32px; } } @media only screen and (min-width: 992px) { .materials_block-md-4 .material_item-readinnews:nth-child(4n), .materials_block-md-3 .material_item-readinnews:nth-child(3n), .materials_block-md-2 .material_item-readinnews:nth-child(2n) { margin-top: 0 !important; } .materials_block-md-4 .material_item-readinnews .material_item__inner, .materials_block-md-3 .material_item-readinnews .material_item__inner, .materials_block-md-2 .material_item-readinnews .material_item__inner, .materials_block-md-1 .material_item-readinnews .material_item__inner { height: 150px; } .materials_block-md-4 .material_item-readinnews .material_item__title, .materials_block-md-3 .material_item-readinnews .material_item__title, .materials_block-md-2 .material_item-readinnews .material_item__title, .materials_block-md-1 .material_item-readinnews .material_item__title { font-size: 18px; line-height: 24px; } } @media only screen and (min-width: 1500px) { .materials_block-lg-4 .material_item-readinnews:nth-child(4n), .materials_block-lg-3 .material_item-readinnews:nth-child(3n), .materials_block-lg-2 .material_item-readinnews:nth-child(2n) { margin-top: 0 !important; } .materials_block-lg-4 .material_item-readinnews .material_item__inner, .materials_block-lg-3 .material_item-readinnews .material_item__inner, .materials_block-lg-2 .material_item-readinnews .material_item__inner, .materials_block-lg-1 .material_item-readinnews .material_item__inner { height: 150px; } .materials_block-lg-4 .material_item-readinnews .material_item__title, .materials_block-lg-3 .material_item-readinnews .material_item__title, .materials_block-lg-2 .material_item-readinnews .material_item__title, .materials_block-lg-1 .material_item-readinnews .material_item__title { font-size: 20px; padding: 20px 15px 0 15px; line-height: 26px; } } /* ========================================================================== END Material item - Read Insert News ========================================================================== */ /* ========================================================================== Material item - Ratings ========================================================================== */ .material_item__rating { position: absolute; right: 15px; top: 15px; font-size: 70px; line-height: 70px; text-align: right; color: #ffffff; font-weight: 700; z-index: 100; opacity: 0.6; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .material_item-rating .material_item__link:active .material_item__rating, .no-touch .material_item-rating .material_item__link:hover .material_item__rating { opacity: 1; } .material_item-rating .material_item__image:after { opacity: 0.4; } .material_item-rating .material_item__link:active .material_item__image:after, .no-touch .material_item-rating .material_item__link:hover .material_item__image:after { opacity: 0.3; } .material_item-rating .material_item__link:active .material_item__image, .no-touch .material_item-rating .material_item__link:hover .material_item__image { -webkit-transform: scale(1.2) translate3d(0px, 0px, 0px); -moz-transform: scale(1.2) translate3d(0px, 0px, 0px); transform: scale(1.2) translate3d(0px, 0px, 0px); } /* ========================================================================== END Material item - Ratings ========================================================================== */ /* ========================================================================== Material item - Agro debate ========================================================================== */ .material_item-agrodebate .material_item__inner { padding: 0; } .material_item-agrodebate .material_item__link { padding-top: 66.86%; position: relative; width: 100%; float: left; } .material_item-agrodebate .material_item__image:after { opacity: 0.2; } .material_item-agrodebate .material_item__link:active .material_item__image:after, .no-touch .material_item-agrodebate .material_item__link:hover .material_item__image:after { opacity: 0.1; } .material_item-agrodebate .material_item__link:active .material_item__image, .no-touch .material_item-agrodebate .material_item__link:hover .material_item__image { -webkit-transform: scale(1.2) translate3d(0px, 0px, 0px); -moz-transform: scale(1.2) translate3d(0px, 0px, 0px); transform: scale(1.2) translate3d(0px, 0px, 0px); } .material_item-agrodebate .material_item__content { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 0; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .material_item-agrodebate .material_item__content_inner { text-align: center; } .material_item-agrodebate .material_item__title { width: 100%; float: left; clear: both; padding: 0 15px; color: #ffffff; top: 0; position: relative; font-size: 20px; line-height: 26px; margin-bottom: 5px; } .material_item-agrodebate .material_item__link:active .material_item__title span, .no-touch .material_item-agrodebate .material_item__link:hover .material_item__title span { border-color: #ffffff; } .material_item__thumbs { width: 100%; float: left; margin-bottom: 5px; } .material_item-agrodebate .material_item__like, .material_item-agrodebate .material_item__dislike, .material_item-agrodebate .material_item__date, .material_item-agrodebate .material_item__comments, .material_item-agrodebate .material_item__views { color: #ffffff; position: relative; z-index: 200; } .material_item-agrodebate .material_item__like, .material_item-agrodebate .material_item__dislike { font-size: 18px; line-height: 24px; display: inline-block; vertical-align: middle; font-weight: 400; } .material_item-agrodebate .material_item__like { margin-right: 4px; } .material_item-agrodebate .material_item__dislike { margin-left: 4px; } .material_item-agrodebate .material_item__like i, .material_item-agrodebate .material_item__dislike i { margin-right: 4px; font-size: 22px; } .material_item-agrodebate .material_item__lock { position: absolute; right: 0; top: 0; background: #f65b5b; color: #ffffff; font-size: 30px; text-align: center; line-height: 48px; width: 38px; height: 48px; z-index: 100; } @media only screen and (min-width: 768px) { .materials_block-sm-4 .material_item-agrodebate .material_item__dislike, .materials_block-sm-3 .material_item-agrodebate .material_item__dislike, .materials_block-sm-4 .material_item-agrodebate .material_item__like, .materials_block-sm-3 .material_item-agrodebate .material_item__like { font-size: 14px; line-height: 21px; } .materials_block-sm-4 .material_item-agrodebate .material_item__dislike i, .materials_block-sm-3 .material_item-agrodebate .material_item__dislike i, .materials_block-sm-4 .material_item-agrodebate .material_item__like i, .materials_block-sm-3 .material_item-agrodebate .material_item__like i { font-size: 16px; line-height: 21px; } .materials_block-sm-4 .material_item-agrodebate .material_item__thumbs, .materials_block-sm-3 .material_item-agrodebate .material_item__thumbs { margin: 0; } .materials_block-sm-4 .material_item-agrodebate .material_item__title, .materials_block-sm-3 .material_item-agrodebate .material_item__title { font-size: 16px; line-height: 24px; } .materials_block-sm-4 .material_item-agrodebate .material_item__lock, .materials_block-sm-3 .material_item-agrodebate .material_item__lock { height: 30px; width: 24px; line-height: 30px; font-size: 20px; } .materials_block-sm-4 .material_item-agrodebate .material_item__comments, .materials_block-sm-3 .material_item-agrodebate .material_item__comments, .materials_block-sm-4 .material_item-agrodebate .material_item__views, .materials_block-sm-3 .material_item-agrodebate .material_item__views, .materials_block-sm-4 .material_item-agrodebate .material_item__date, .materials_block-sm-3 .material_item-agrodebate .material_item__date { display: none; } } @media only screen and (min-width: 992px) { .material_item-agrodebate .material_item__title { font-size: 24px; line-height: 34px; } .materials_block-md-4 .material_item-agrodebate .material_item__dislike, .materials_block-md-3 .material_item-agrodebate .material_item__dislike, .materials_block-md-4 .material_item-agrodebate .material_item__like, .materials_block-md-3 .material_item-agrodebate .material_item__like { font-size: 14px; line-height: 21px; } .materials_block-md-4 .material_item-agrodebate .material_item__dislike i, .materials_block-md-3 .material_item-agrodebate .material_item__dislike i, .materials_block-md-4 .material_item-agrodebate .material_item__like i, .materials_block-md-3 .material_item-agrodebate .material_item__like i { font-size: 16px; line-height: 21px; } .materials_block-md-4 .material_item-agrodebate .material_item__thumbs, .materials_block-md-3 .material_item-agrodebate .material_item__thumbs { margin: 0; } .materials_block-md-4 .material_item-agrodebate .material_item__title { font-size: 17px; line-height: 21px; } .materials_block-md-3 .material_item-agrodebate .material_item__title { font-size: 16px; line-height: 24px; } .materials_block-md-4 .material_item-agrodebate .material_item__lock, .materials_block-md-3 .material_item-agrodebate .material_item__lock { height: 30px; width: 24px; line-height: 30px; font-size: 20px; } .materials_block-md-4 .material_item-agrodebate .material_item__comments, .materials_block-md-3 .material_item-agrodebate .material_item__comments, .materials_block-md-4 .material_item-agrodebate .material_item__views, .materials_block-md-3 .material_item-agrodebate .material_item__views, .materials_block-md-4 .material_item-agrodebate .material_item__date, .materials_block-md-3 .material_item-agrodebate .material_item__date { display: none; } } @media only screen and (min-width: 1500px) { .material_item-agrodebate .material_item__title { font-size: 28px; line-height: 36px; } .materials_block-lg-4 .material_item-agrodebate .material_item__dislike, .materials_block-lg-3 .material_item-agrodebate .material_item__dislike, .materials_block-lg-4 .material_item-agrodebate .material_item__like, .materials_block-lg-3 .material_item-agrodebate .material_item__like { font-size: 14px; line-height: 21px; } .materials_block-lg-4 .material_item-agrodebate .material_item__dislike i, .materials_block-lg-3 .material_item-agrodebate .material_item__dislike i, .materials_block-lg-4 .material_item-agrodebate .material_item__like i, .materials_block-lg-3 .material_item-agrodebate .material_item__like i { font-size: 16px; line-height: 21px; } .materials_block-lg-4 .material_item-agrodebate .material_item__thumbs, .materials_block-lg-3 .material_item-agrodebate .material_item__thumbs { margin: 0; } .materials_block-lg-4 .material_item-agrodebate .material_item__title, .materials_block-lg-3 .material_item-agrodebate .material_item__title { font-size: 16px; line-height: 24px; } .materials_block-lg-4 .material_item-agrodebate .material_item__lock, .materials_block-lg-3 .material_item-agrodebate .material_item__lock { height: 30px; width: 24px; line-height: 30px; font-size: 20px; } .materials_block-lg-4 .material_item-agrodebate .material_item__comments, .materials_block-lg-3 .material_item-agrodebate .material_item__comments, .materials_block-lg-4 .material_item-agrodebate .material_item__views, .materials_block-lg-3 .material_item-agrodebate .material_item__views, .materials_block-lg-4 .material_item-agrodebate .material_item__date, .materials_block-lg-3 .material_item-agrodebate .material_item__date { display: none; } } /* ========================================================================== END Material item - Agro debate ========================================================================== */ /* ========================================================================== Material item - Agro debate 2 ========================================================================== */ .material_item-agrodebate-2 .material_item__image:after { opacity: 0.2; } .material_item-agrodebate-2 .material_item__link:active .material_item__image:after, .no-touch .material_item-agrodebate-2 .material_item__link:hover .material_item__image:after { opacity: 0.1; } .material_item-agrodebate-2 .material_item__link:active .material_item__image, .no-touch .material_item-agrodebate-2 .material_item__link:hover .material_item__image { -webkit-transform: scale(1.2) translate3d(0px, 0px, 0px); -moz-transform: scale(1.2) translate3d(0px, 0px, 0px); transform: scale(1.2) translate3d(0px, 0px, 0px); } .material_item-agrodebate-2 .material_item__thumbs { width: 100%; float: left; margin-bottom: 5px; position: absolute; top: 50%; margin-top: -20px; text-align: center; } .material_item-agrodebate-2 .material_item__like, .material_item-agrodebate-2 .material_item__dislike { color: #ffffff; position: relative; z-index: 200; } .material_item-agrodebate-2 .material_item__like, .material_item-agrodebate-2 .material_item__dislike { font-size: 18px; line-height: 24px; display: inline-block; vertical-align: middle; font-weight: 400; } .material_item-agrodebate-2 .material_item__like { margin-right: 4px; } .material_item-agrodebate-2 .material_item__dislike { margin-left: 4px; } .material_item-agrodebate-2 .material_item__like i, .material_item-agrodebate-2 .material_item__dislike i { margin-right: 4px; font-size: 22px; } .material_item-agrodebate-2 .material_item__lock { position: absolute; right: 0; top: 0; background: #f65b5b; color: #ffffff; font-size: 30px; text-align: center; line-height: 48px; width: 38px; height: 48px; z-index: 100; } /* ========================================================================== END Material item - Agro debate 2 ========================================================================== */ /* ========================================================================== Material item - Special ========================================================================== */ .material_item-special .material_item__inner { padding: 0; } .material_item-special .material_item__link { padding-top: 66.86%; position: relative; width: 100%; float: left; } .material_item-special .material_item__image:after { opacity: 0.2; } .material_item-special .material_item__link:active .material_item__image:after, .no-touch .material_item-special .material_item__link:hover .material_item__image:after { opacity: 0.1; } .material_item-special .material_item__link:active .material_item__image, .no-touch .material_item-special .material_item__link:hover .material_item__image { -webkit-transform: scale(1.2) translate3d(0px, 0px, 0px); -moz-transform: scale(1.2) translate3d(0px, 0px, 0px); transform: scale(1.2) translate3d(0px, 0px, 0px); } .material_item-special .material_item__content { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 0; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .material_item-special .material_item__content_inner { text-align: center; } .material_item-special .material_item__title { width: 100%; float: left; clear: both; padding: 0 15px; color: #ffffff; top: 0; position: relative; font-size: 26px; line-height: 32px; } .material_item-special .material_item__link:active .material_item__title span, .no-touch .material_item-special .material_item__link:hover .material_item__title span { border-color: #ffffff; } .material_item-special .material_item__materialamount { width: 100%; float: left; position: relative; z-index: 100; color: #ffffff; font-size: 14px; line-height: 20px; margin-top: 5px; } @media only screen and (min-width: 768px) { .materials_block-sm-4 .material_item-special .material_item__title, .materials_block-sm-3 .material_item-special .material_item__title { font-size: 16px; line-height: 22px; } } @media only screen and (min-width: 992px) { .materials_block .material_item-special .material_item__title { font-size: 24px; line-height: 34px; } .materials_block-md-4 .material_item-special .material_item__title { font-size: 16px; line-height: 22px; } .materials_block-md-3 .material_item-special .material_item__title { font-size: 17px; line-height: 24px; } } @media only screen and (min-width: 1500px) { .materials_block .material_item-special .material_item__title { font-size: 26px; line-height: 32px; } .materials_block-lg-4 .material_item-special .material_item__title { font-size: 17px; line-height: 24px; } .materials_block-lg-3 .material_item-special .material_item__title { font-size: 18px; line-height: 26px; } } /* ========================================================================== END Material item - Agro debate ========================================================================== */ /* ========================================================================== Material item - Company ========================================================================== */ .material_item-company .material_item__inner { padding-top: 56.25%; } .material_item-company .material_item__link { padding: 0; } .material_item-company .material_item__image_container { padding-bottom: 56.25%; } .material_item-company .material_item__image { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .material_item-company .material_item__image img { display: block; width: auto; height: auto; max-width: 80%; max-height: 80%; } .material_item-company .material_item__link:active .material_item__image, .no-touch .material_item-company .material_item__link:hover .material_item__image { -webkit-transform: scale(1.1) translate3d(0px, 0px, 0px); -moz-transform: scale(1.1) translate3d(0px, 0px, 0px); transform: scale(1.1) translate3d(0px, 0px, 0px); } .material_item-company .material_item__image:after { display: none; } .material_item-company .material_item__title { font-size: 20px; top: 0; margin-top: 10px; line-height: 26px; } @media only screen and (min-width: 768px) { .materials_block-sm-4 .material_item-company .material_item__title, .materials_block-sm-3 .material_item-company .material_item__title { font-size: 16px; line-height: 23px; } } @media only screen and (min-width: 992px) { .materials_block-md-4 .material_item-company .material_item__title, .materials_block-md-3 .material_item-company .material_item__title { font-size: 16px; line-height: 23px; } } @media only screen and (min-width: 1500px) { .materials_block-lg-4 .material_item-company .material_item__title, .materials_block-lg-3 .material_item-company .material_item__title { font-size: 18px; line-height: 24px; } } /* ========================================================================== END Material item - Company ========================================================================== */ /* ========================================================================== Material item - Bloger ========================================================================== */ .material_item-bloger .material_item__inner { padding: 0; height: auto; margin: 0; width: 100%; float: left; position: relative; } .material_item-bloger .material_item__link { display: table; margin: 0; padding: 0; height: auto; position: relative; float: left; width: 100%; } .material_item-bloger .material_item__image_container { display: table-cell; vertical-align: top; height: auto; margin: 0; padding: 0; width: auto; float: none; width: 70px; overflow: visible; position: relative; } .material_item-bloger .material_item__image { border-radius: 100%; display: block; position: relative; width: 60px; height: 60px; padding: 0; } .material_item-bloger .material_item__image:after { display: none; } .material_item-bloger .material_item__content { display: table-cell; vertical-align: middle; position: relative; } .material_item-bloger .material_item__title { font-size: 14px; line-height: 21px; margin: 0; } .material_item-bloger .material_item__desc { font-size: 12px; line-height: 17px; color: #838383; margin: 0; } /* ========================================================================== END Material item - Bloger ========================================================================== */ /* ========================================================================== Material item - Person ========================================================================== */ .material_item-person .material_item__inner { padding-top: 100%; } .material_item-person .material_item__image_container { padding-bottom: 100%; } .material_item-person .material_item__title { font-size: 18px; line-height: 24px; margin-top: 5px; } .material_item-person .material_item__desc { font-size: 12px; line-height: 18px; } @media only screen and (min-width: 768px) { .materials_block-sm-4 .material_item-person .material_item__title, .materials_block-sm-3 .material_item-person .material_item__title { font-size: 15px; line-height: 20px; } } @media only screen and (min-width: 992px) { .material_item-person .material_item__title { font-size: 16px; line-height: 22px; } .materials_block-md-4 .material_item-person .material_item__title, .materials_block-md-3 .material_item-person .material_item__title { font-size: 16px; line-height: 22px; } } @media only screen and (min-width: 1500px) { .materials_block-lg-4 .material_item-person .material_item__title, .materials_block-lg-3 .material_item-person .material_item__title { font-size: 18px; line-height: 24px; } } /* ========================================================================== END Material item - Person ========================================================================== */ /* ========================================================================== Material item - Person Team ========================================================================== */ .material_item-personteam .material_item__inner { padding-top: 0; } .material_item-personteam .material_item__image_container { display: none; } .material_item-personteam .material_item__title { font-size: 14px; line-height: 18px; margin-top: 0; } .material_item-personteam .material_item__desc { font-size: 12px; line-height: 18px; } @media only screen and (min-width: 768px) { .materials_block-sm-4 .material_item-personteam .material_item__title, .materials_block-sm-3 .material_item-personteam .material_item__title { font-size: 14px; line-height: 18px; } } @media only screen and (min-width: 992px) { .materials_block-md-4 .material_item-personteam .material_item__title, .materials_block-md-3 .material_item-personteam .material_item__title { font-size: 14px; line-height: 18px; } } @media only screen and (min-width: 1500px) { .materials_block-lg-4 .material_item-personteam .material_item__title, .materials_block-lg-3 .material_item-personteam .material_item__title { font-size: 14px; line-height: 18px; } } /* ========================================================================== END Material item - Person ========================================================================== */ /* ========================================================================== END Material item - Event ========================================================================== */ .material_item-event .material_item__inner { padding-top: 0; } .material_item-event .material_item__image_container { display: none; } .materials_block .material_item-event .material_item__title { font-size: 18px; line-height: 26px; margin: 0; padding: 0; } .material_item-event .material_item__content { width: 100%; float: left; margin-bottom: 10px; } .material_item-event .material_item__event_date, .material_item-event .material_item__event_address { width: 100%; float: left; margin-top: 10px; } .materials_block .material_item-event .material_item__event_date i, .materials_block .material_item-event .material_item__event_address i { width: 24px; font-size: 20px; line-height: 18px; display: block; float: left; color: #00c338; text-align: center; } .materials_block .material_item-event .material_item__event_date span, .materials_block .material_item-event .material_item__event_address span { margin-left: 30px; display: block; float: none; font-size: 14px; line-height: 18px; font-weight: 500; } @media only screen and (min-width: 768px) { .materials_block .material_item-event .material_item__title { font-size: 18px; line-height: 26px; } .materials_block-sm-4 .material_item-event .material_item__event_address i, .materials_block-sm-3 .material_item-event .material_item__event_address i, .materials_block-sm-4 .material_item-event .material_item__event_date i, .materials_block-sm-3 .material_item-event .material_item__event_date i { font-size: 16px; line-height: 16px; } .materials_block-sm-4 .material_item-event .material_item__event_address span, .materials_block-sm-3 .material_item-event .material_item__event_address span, .materials_block-sm-4 .material_item-event .material_item__event_date span, .materials_block-sm-3 .material_item-event .material_item__event_date span { font-size: 12px; line-height: 16px; } .materials_block-sm-4 .material_item-event .material_item__title, .materials_block-sm-3 .material_item-event .material_item__title { font-size: 15px; line-height: 22px; } } @media only screen and (min-width: 992px) { .materials_block .material_item-event .material_item__title { font-size: 18px; line-height: 26px; } .materials_block-md-4 .material_item-event .material_item__event_address i, .materials_block-md-3 .material_item-event .material_item__event_address i, .materials_block-md-4 .material_item-event .material_item__event_date i, .materials_block-md-3 .material_item-event .material_item__event_date i { font-size: 16px; line-height: 16px; } .materials_block-md-4 .material_item-event .material_item__event_address span, .materials_block-md-3 .material_item-event .material_item__event_address span, .materials_block-md-4 .material_item-event .material_item__event_date span, .materials_block-md-3 .material_item-event .material_item__event_date span { font-size: 12px; line-height: 16px; } .materials_block-md-4 .material_item-event .material_item__title, .materials_block-md-3 .material_item-event .material_item__title { font-size: 15px; line-height: 22px; } } @media only screen and (min-width: 1500px) { .materials_block .material_item-event .material_item__title { font-size: 18px; line-height: 26px; } .materials_block-lg-4 .material_item-event .material_item__event_address i, .materials_block-lg-3 .material_item-event .material_item__event_address i, .materials_block-lg-4 .material_item-event .material_item__event_date i, .materials_block-lg-3 .material_item-event .material_item__event_date i { font-size: 16px; line-height: 16px; } .materials_block-lg-4 .material_item-event .material_item__event_address span, .materials_block-lg-3 .material_item-event .material_item__event_address span, .materials_block-lg-4 .material_item-event .material_item__event_date span, .materials_block-lg-3 .material_item-event .material_item__event_date span { font-size: 12px; line-height: 16px; } .materials_block-lg-4 .material_item-event .material_item__title, .materials_block-lg-3 .material_item-event .material_item__title { font-size: 15px; line-height: 22px; } } /* ========================================================================== END Material item - Event ========================================================================== */ /* ========================================================================== Material item - Project ========================================================================== */ .material_item-project { padding-top: 0; overflow: visible; } .material_item-project .material_item__inner { padding: 0; overflow: visible; } .material_item-project .material_item__link { display: block; width: 100%; float: left; background: #ffffff; padding: 20px 70px; } .material_item-project .material_item__link:active, .no-touch .material_item-project .material_item__link:hover { box-shadow: 0 5px 10px rgba(0,0,0,.1); } .material_item-project .material_item__link:after { height: 4px; display: block; content: ''; width: 100%; position: absolute; bottom: 0; left: 0; background: #00AFCA; opacity: 0; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .material_item-project .material_item__link:active:after, .no-touch .material_item-project .material_item__link:hover:after { opacity: 1; } .material_item-project .material_item__image_container { display: block; padding: 0; position: relative; top: 0; left: 0; width: 100%; float: left; } .material_item-project .material_item__image { width: 100%; height: 120px; float: none; margin: auto; padding: 0; position: relative; } .material_item-project .material_item__image:after { display: none; } .materials_block .material_item-project .material_item__title { font-size: 18px; line-height: 26px; margin: 0; padding: 0; text-align: center; margin-top: 10px; width: 100%; float: left; } .materials_block .material_item-project .material_item__desc { font-size: 14px; line-height: 22px; color: #000000; width: 100%; float: left; text-align: center; margin-top: 10px; } /* ========================================================================== END Material item - Project ========================================================================== */ /* ========================================================================== Materials block ========================================================================== */ .materials_block { width: 100%; float: left; } .materials_block-mb-1 .material_item { width: 100%; margin-top: 30px; } .materials_block-mb-1 .material_item:first-child { margin-top: 0; } @media only screen and (min-width: 768px) and (max-width: 991px) { .materials_block-sm-4 .material_item:nth-child(4), .materials_block-sm-4 .material_item:nth-child(3), .materials_block-sm-4 .material_item:nth-child(2), .materials_block-sm-4 .material_item:first-child, .materials_block-sm-3 .material_item:nth-child(3), .materials_block-sm-3 .material_item:nth-child(2), .materials_block-sm-3 .material_item:first-child, .materials_block-sm-2 .material_item:nth-child(2), .materials_block-sm-2 .material_item:first-child, .materials_block-sm-1 .material_item:first-child { margin-top: 0; } .materials_block-sm-4 .material_item:nth-child(4n), .materials_block-sm-4 .material_item:nth-child(3n), .materials_block-sm-4 .material_item:nth-child(2n), .materials_block-sm-4 .material_item:first-child, .materials_block-sm-4 .material_item { width: calc( 25% - 3px ); } .materials_block-sm-4 .material_item:nth-child(4n+3), .materials_block-sm-4 .material_item:nth-child(3n) { padding-left: 7px; padding-right: 3px; } .materials_block-sm-4 .material_item:nth-child(4n+2), .materials_block-sm-4 .material_item:nth-child(2n) { padding-right: 7px; padding-left: 3px; } .materials_block-sm-4 .material_item:nth-child(4n+1), .materials_block-sm-4 .material_item:first-child { padding-left: 0; padding-right: 10px; } .materials_block-sm-4 .material_item:nth-child(4n) { padding-right: 0; padding-left: 10px; } .materials_block-sm-3 .material_item { width: calc( 33.333333% - 3px ); } .materials_block-sm-3 .material_item:nth-child(1n), .materials_block-sm-3 .material_item:nth-child(2n) { padding-right: 4px; padding-left: 4px; } .materials_block-sm-3 .material_item:nth-child(3n+1), .materials_block-sm-3 .material_item:first-child { padding-left: 0; padding-right: 8px; } .materials_block-sm-3 .material_item:nth-child(3n) { padding-right: 0; padding-left: 8px; } .materials_block-sm-2 .material_item { width: calc( 50% - 2px ); } .materials_block-sm-2 .material_item:nth-child(2n) { padding-right: 0; padding-left: 10px; } .materials_block-sm-2 .material_item:first-child, .materials_block-sm-2 .material_item:nth-child(2n+1) { padding-right: 10px; } .materials_block-sm-1 .material_item:nth-child(4n), .materials_block-sm-1 .material_item:nth-child(3n), .materials_block-sm-1 .material_item:nth-child(2n), .materials_block-sm-1 .material_item { width: 100%; margin-right: 0; margin-left: 0; padding-right: 0; padding-left: 0; margin-top: 30px; } .materials_block-sm-1 .material_item:first-child { margin-top: 0; } } @media only screen and (min-width: 992px) and (max-width: 1499px) { .materials_block-md-4 .material_item:nth-child(4), .materials_block-md-4 .material_item:nth-child(3), .materials_block-md-4 .material_item:nth-child(2), .materials_block-md-4 .material_item:first-child, .materials_block-md-3 .material_item:nth-child(3), .materials_block-md-3 .material_item:nth-child(2), .materials_block-md-3 .material_item:first-child, .materials_block-md-2 .material_item:nth-child(2), .materials_block-md-2 .material_item:first-child, .materials_block-md-1 .material_item:first-child { margin-top: 0; } .materials_block-md-4 .material_item:nth-child(4n), .materials_block-md-4 .material_item:nth-child(3n), .materials_block-md-4 .material_item:nth-child(2n), .materials_block-md-4 .material_item:first-child, .materials_block-md-4 .material_item { width: calc( 25% - 3px ); } .materials_block-md-4 .material_item:nth-child(4n+3), .materials_block-md-4 .material_item:nth-child(3n) { padding-left: 7px; padding-right: 3px; } .materials_block-md-4 .material_item:nth-child(4n+2), .materials_block-md-4 .material_item:nth-child(2n) { padding-right: 7px; padding-left: 3px; } .materials_block-md-4 .material_item:nth-child(4n+1), .materials_block-md-4 .material_item:first-child { padding-left: 0; padding-right: 10px; } .materials_block-md-4 .material_item:nth-child(4n) { padding-right: 0; padding-left: 10px; } .materials_block-md-3 .material_item { width: calc( 33.333333% - 3px ); } .materials_block-md-3 .material_item:nth-child(1n), .materials_block-md-3 .material_item:nth-child(2n) { padding-right: 4px; padding-left: 4px; } .materials_block-md-3 .material_item:nth-child(3n+1), .materials_block-md-3 .material_item:first-child { padding-left: 0; padding-right: 8px; } .materials_block-md-3 .material_item:nth-child(3n) { padding-right: 0; padding-left: 8px; } .materials_block-md-2 .material_item { width: calc( 50% - 2px ); } .materials_block-md-2 .material_item:nth-child(2n) { padding-right: 0; padding-left: 10px; } .materials_block-md-2 .material_item:first-child, .materials_block-md-2 .material_item:nth-child(2n+1) { padding-right: 10px; } .materials_block-md-1 .material_item:nth-child(5n), .materials_block-md-1 .material_item:nth-child(4n), .materials_block-md-1 .material_item:nth-child(3n), .materials_block-md-1 .material_item:nth-child(2n), .materials_block-md-1 .material_item { width: 100%; margin-right: 0; margin-left: 0; padding-right: 0; padding-left: 0; margin-top: 30px; } .materials_block-md-1 .material_item:first-child { margin-top: 0; } } @media only screen and (min-width: 1500px) { .materials_block-lg-4 .material_item:nth-child(4), .materials_block-lg-4 .material_item:nth-child(3), .materials_block-lg-4 .material_item:nth-child(2), .materials_block-lg-4 .material_item:first-child, .materials_block-lg-3 .material_item:nth-child(3), .materials_block-lg-3 .material_item:nth-child(2), .materials_block-lg-3 .material_item:first-child, .materials_block-lg-2 .material_item:nth-child(2), .materials_block-lg-2 .material_item:first-child, .materials_block-lg-1 .material_item:first-child { margin-top: 0; } .materials_block-lg-4 .material_item:nth-child(4n), .materials_block-lg-4 .material_item:nth-child(3n), .materials_block-lg-4 .material_item:nth-child(2n), .materials_block-lg-4 .material_item { width: calc( 25% - 3px ); } .materials_block-lg-4 .material_item:nth-child(4n+3), .materials_block-lg-4 .material_item:nth-child(3n) { padding-left: 7px; padding-right: 3px; } .materials_block-lg-4 .material_item:nth-child(4n+2), .materials_block-lg-4 .material_item:nth-child(2n) { padding-right: 7px; padding-left: 3px; } .materials_block-lg-4 .material_item:nth-child(4n+1), .materials_block-lg-4 .material_item:first-child { padding-left: 0; padding-right: 10px; } .materials_block-lg-4 .material_item:nth-child(4n) { padding-right: 0; padding-left: 10px; } .materials_block-lg-3 .material_item { width: calc( 33.333333% - 3px ); } .materials_block-lg-3 .material_item:nth-child(1n), .materials_block-lg-3 .material_item:nth-child(2n) { padding-right: 4px; padding-left: 4px; } .materials_block-lg-3 .material_item:nth-child(3n+1), .materials_block-lg-3 .material_item:first-child { padding-left: 0; padding-right: 8px; } .materials_block-lg-3 .material_item:nth-child(3n) { padding-right: 0; padding-left: 8px; } .materials_block-lg-2 .material_item:nth-child(4n), .materials_block-lg-2 .material_item:nth-child(3n), .materials_block-lg-2 .material_item:nth-child(2n), .materials_block-lg-2 .material_item:first-child, .materials_block-lg-2 .material_item { width: calc( 50% - 2px ); margin-left: 0; margin-right: 0; padding-left: 0; padding-right: 0; } .materials_block-lg-2 .material_item:first-child, .materials_block-lg-2 .material_item:nth-child(2n) { padding-right: 0; padding-left: 8px; } .materials_block-lg-2 .material_item:first-child, .materials_block-lg-2 .material_item:nth-child(2n+1) { padding-left: 0; padding-right: 8px; } .materials_block-lg-1 .material_item:nth-child(4n), .materials_block-lg-1 .material_item:nth-child(3n), .materials_block-lg-1 .material_item:nth-child(2n), .materials_block-lg-1 .material_item { width: 100%; margin-right: 0; margin-left: 0; padding-right: 0; padding-left: 0; margin-top: 30px; } .materials_block-lg-1 .material_item:first-child { margin-top: 0; } } /* ========================================================================== END Materials block ========================================================================== */ /* ========================================================================== News block ========================================================================== */ /*.news_block .container { background: #ffffff; } .news_block { margin-top: 20px; } .news_block__banner { margin-bottom: 20px; } .news_block__bottom__left { margin-bottom: 20px; width: 100%; float: left; } .news_block__list, #news_block__list__more { width: 100%; float: left; } .news_block__list { margin-top: 10px; } #news_block__list__more .material_item, #news_block__list .material_item { padding: 0; margin: 0; } #news_block__list__more .material_item { } #news_block__list .material_item:first-child { border: none; } #news_block__list__more .material_item.important .material_item__title, .news_block__list .material_item.important .material_item__title { font-weight: 700; } .news_block__main__carousel .material_item-readin .material_item__link:active .material_item__image, .no-touch .news_block__main__carousel .material_item-readin .material_item__link:hover .material_item__image { -webkit-transform: scale(1) translate3d(0px, 0px, 0px); -moz-transform: scale(1) translate3d(0px, 0px, 0px); transform: scale(1) translate3d(0px, 0px, 0px); } @media only screen and (min-width: 768px) { .news_block__banner { margin-top: 20px; } #news_block__list__more.materials_block .material_item, .news_block__list .materials_block .material_item { padding-top: 0; margin: 0; padding: 0; padding-top: 3px; margin-top: 3px; } #news_block__list__more.materials_block .material_item, .news_block__list .materials_block .material_item { } .news_block__list .materials_block .material_item:nth-child(1) { border-top: none; padding-top: 0; margin-top: 0; } } @media only screen and (min-width: 992px) { .news_block__bottom__left { width: 580px; float: left; } .news_block__bottom__right { margin-left: 620px; width: auto; float: none; } #news_block__list__more.materials_block .material_item:nth-child(1), #news_block__list__more.materials_block .material_item:nth-child(2), #news_block__list__more.materials_block .material_item:nth-child(3), #news_block__list__more.materials_block .material_item:nth-child(4) { border-top: none; padding-top: 7px; border-top: 1px solid #dfdfdf; } } @media only screen and (min-width: 1500px) { .news_block__banner { margin-top: 0; } .news_block__bottom__left { width: 720px; } .news_block__bottom__right { margin-left: 760px; } }*/ /* ========================================================================== END News block ========================================================================== */ /* ========================================================================== News block ========================================================================== */ .news_block { /*margin-top: 20px;*/ margin-top: 0px;/*захотели убрать, так как нижний елемент не влазит в єкран*/ } .news_block .container { background: #ffffff; } .news_block__main { float: left; width: 100%; } .news_block__main .owl-prev, .news_block__main .owl-next { color: #ffffff; height: auto; padding-top: 66.86%; } .news_block__list, #news_block__list__more { width: 100%; float: left; } .news_block__list { margin-top: 10px; } #news_block__list__more .material_item, .news_block__list .material_item { padding: 0; margin: 0; padding-top: 3px; margin-top: 3px; } #news_block__list__more .material_item { } .news_block__list .material_item:first-child { border: none; } #news_block__list__more .material_item.important .material_item__title, .news_block__list .material_item.important .material_item__title { font-weight: 700; } .news_block__main__carousel .material_item-readin .material_item__link:active .material_item__image, .no-touch .news_block__main__carousel .material_item-readin .material_item__link:hover .material_item__image { -webkit-transform: scale(1) translate3d(0px, 0px, 0px); -moz-transform: scale(1) translate3d(0px, 0px, 0px); transform: scale(1) translate3d(0px, 0px, 0px); } @media only screen and (min-width: 768px) { #news_block__list__more.materials_block .material_item, .news_block__list .materials_block .material_item { padding-top: 0; margin: 0; padding: 0; padding-top: 3px; margin-top: 3px; } #news_block__list__more.materials_block .material_item, .news_block__list .materials_block .material_item { } .news_block__list .materials_block .material_item:nth-child(1) { border-top: none; padding-top: 0; margin-top: 0; } } @media only screen and (min-width: 992px) { .news_block__main { width: calc( 50% - 15px ); } .news_block__list { float: none; width: auto; vertical-align: top; margin-top: 0; margin-left: 50%; padding-left: 8px; } #news_block__list__more.materials_block .material_item:nth-child(1), #news_block__list__more.materials_block .material_item:nth-child(2), #news_block__list__more.materials_block .material_item:nth-child(3), #news_block__list__more.materials_block .material_item:nth-child(4) { border-top: none; padding-top: 7px; border-top: 1px solid #dfdfdf; } } @media only screen and (min-width: 1500px) { } /* ========================================================================== END News block ========================================================================== */ /* ========================================================================== Read block ========================================================================== */ .read_block__top { width: 100%; float: left; } .read_block__bottom { width: 100%; float: left; margin-top: 20px; } @media only screen and (max-width: 767px), only screen and (min-width: 992px) { .read_block__main .material_item-insert { padding: 0; } .read_block__main .material_item-insert .material_item__top { width: 100%; float: left; margin: 0 0 5px 0; padding: 0; left: 0; bottom: auto; top: 0; z-index: 20; position: relative; } .read_block__main .material_item-insert.material_item-image .material_item__top { margin-top: 8px; } .read_block__main .material_item-insert .material_item__date { font-size: 13px; color: #5f5f5f; margin-right: 8px; display: inline-block; } .read_block__main .material_item-insert .material_item__category { display: inline-block; font-size: 13px; color: #00AFCA; text-decoration: none; } .read_block__main .material_item-insert .material_item__category:active, .no-touch .read_block__main .material_item-insert .material_item__category:hover { color: #00AFCA; text-decoration: underline; } .read_block__main .material_item-insert .material_item__views { font-size: 13px; color: #5f5f5f; display: inline-block; } .read_block__main .material_item-insert .material_item__comments { font-size: 13px; color: #5f5f5f; margin-left: 8px; display: inline-block; } .read_block__main .material_item-insert .material_item__link { color: #000000; text-decoration: none; } .read_block__main .material_item-insert .material_item__link:active, .no-touch .read_block__main .material_item-insert .material_item__link:hover { color: #000000; text-decoration: none; } .read_block__main .material_item-insert .material_item__title { position: relative; display: block; width: 100%; float: left; padding: 0 0 2px 0; bottom: auto; top: 0; left: 0; font-size: 20px; font-weight: 500; line-height: 24px; z-index: 20; } .read_block__main .material_item-insert .material_item__title span { display: inline; padding-bottom: 3px; border-bottom: 1px solid transparent; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .read_block__main .material_item-insert .material_item__link:active .material_item__title span, .no-touch .read_block__main .material_item-insert .material_item__link:hover .material_item__title span { border-color: #666666; } .read_block__main .material_item-insert .material_item__image { z-index: 10; position: absolute; top: 0; left: 0; width: 100%; padding-bottom: 66.86% !important; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .read_block__main .material_item-insert .material_item__image:before { content: ''; position: absolute; display: block; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,.20); opacity: 1; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .read_block__main .material_item-insert .material_item__link:active .material_item__image:before, .no-touch .read_block__main .material_item-insert .material_item__link:hover .material_item__image:before { opacity: 0; } .read_block__main .material_item-insert .material_item__link:active .material_item__image, .no-touch .read_block__main .material_item-insert .material_item__link:hover .material_item__image { -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1); } } @media only screen and (min-width: 992px) { } @media only screen and (min-width: 1500px) { .read_block__main .material_item-insert .material_item__title { font-size: 24px; line-height: 30px; } } /* ========================================================================== END Read block ========================================================================== */ /* ========================================================================== Games block ========================================================================== */ @media only screen and (max-width: 767px) { .games_block .container { padding-left: 0; padding-right: 0; } .games_block .blocktitle { padding-left: 15px; padding-right: 15px; } .games_block .material_item__content { padding-left: 15px; padding-right: 15px; } } /* ========================================================================== END Games block ========================================================================== */ /* ========================================================================== Materials list block ========================================================================== */ .materials_list { margin-top: 20px; } .materials_list .container { border: 1px solid #dfdfdf; background: #ffffff; box-shadow: 0 1px 2px rgba(0,0,0,.1); padding-top: 20px; padding-bottom: 20px; } .materials_list-news .materials_block__item { border-top: 1px solid #dfdfdf; } .materials_list-news .materials_block__item:first-child { border-top: none; padding-top: 0; } .materials_list .materials_block__item-image { padding-top: 20px; padding-bottom: 20px; border-bottom: none; } .materials_list .materials_block__item-image:first-child { padding-top: 0; } @media only screen and (min-width: 768px) { .materials_list-news .materials_block__item { width: 50%; } .materials_list-news .materials_block__item:nth-child(2) { border-top: none; padding-top: 0; } .materials_list-news .materials_block__item:first-child, .materials_list-news .materials_block__item:nth-child(2n+1) { padding-right: 10px; } .materials_list-news .materials_block__item:nth-child(2n) { padding-left: 10px; } .materials_list .materials_block__item-image { width: 216px; display: inline-block; float: none; margin-right: 30px; vertical-align: top; } .materials_list .materials_block__item-image:nth-child(3n) { margin-right: 0; } .materials_list .materials_block__item-image:nth-child(1), .materials_list .materials_block__item-image:nth-child(2), .materials_list .materials_block__item-image:nth-child(3) { padding-top: 0; } } @media only screen and (min-width: 992px) { .materials_list-news .materials_block__item { width: 25%; } .materials_list-news .materials_block__item:nth-child(3), .materials_list-news .materials_block__item:nth-child(4) { border-top: none; padding-top: 0; } .materials_list-news .materials_block__item:nth-child(2n+1), .materials_list-news .materials_block__item:nth-child(2n) { padding-right: 5px; padding-left: 5px; } .materials_list-news .materials_block__item:nth-child(4n) { padding-right: 0; padding-left: 5px; } .materials_list-news .materials_block__item:nth-child(4n+1), .materials_list-news .materials_block__item:first-child { padding-right: 5px; padding-left: 0; } .materials_list .materials_block__item-image { width: 296px; margin-right: 10px; } .materials_list .materials_block__item-image:nth-child(3n) { margin-right: 0; } } @media only screen and (min-width: 1500px) { .materials_list .materials_block__item-image { width: 346px; margin-right: 30px; } .materials_list .materials_block__item-image:nth-child(3n) { margin-right: 0; } } /* ========================================================================== END Materials list block ========================================================================== */ /* ========================================================================== Article block ========================================================================== */ .articles_block__item { width: 100%; float: left; position: relative; margin-top: 20px; } .articles_block__item__inner { padding: 10px 20px; width: 100%; float: left; border: 1px solid #dfdfdf; background: #ffffff; box-shadow: 0 1px 2px rgba(0,0,0,.1); position: relative; overflow: hidden; } .articles_block__item-4 .articles_block__item__inner, .articles_block__item-3 .articles_block__item__inner, .articles_block__item-2 .articles_block__item__inner { border: none; padding: 0; height: 180px; } .articles_block__item__link { text-decoration: none; color: #000000; } .articles_block__item__link:active, .no-touch .articles_block__item__link:hover { color: #00AFCA; text-decoration: none; } .articles_block__item__image { position: relative; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; -webkit-transform: scale(1) translate3d(0px, 0px, 0px); -moz-transform: scale(1) translate3d(0px, 0px, 0px); transform: scale(1) translate3d(0px, 0px, 0px); } .articles_block__item-4 .articles_block__item__image, .articles_block__item-3 .articles_block__item__image, .articles_block__item-2 .articles_block__item__image { position: absolute; left: 0; top: 0; width: 100%; height: 180px; z-index: 10; } .articles_block__item__image:after { content: ''; position: absolute; display: block; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,.15); opacity: 1; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .articles_block__item__link:active .articles_block__item__image, .no-touch .articles_block__item__link:hover .articles_block__item__image { -webkit-transform: scale(1.1); -moz-transform: scale(1.1); transform: scale(1.1); } .articles_block__item-1 .articles_block__item__link:active .articles_block__item__image, .no-touch .articles_block__item-1 .articles_block__item__link:hover .articles_block__item__image { -webkit-transform: scale(1); -moz-transform: scale(1); transform: scale(1); } .articles_block__item-1 .articles_block__item__link:active .articles_block__item__image:after, .no-touch .articles_block__item-1 .articles_block__item__link:hover .articles_block__item__image:after { opacity: 0; } .articles_block__item__title { width: 100%; float: left; font-size: 16px; line-height: 20px; font-weight: 500; } .articles_block__item-4 .articles_block__item__title, .articles_block__item-3 .articles_block__item__title, .articles_block__item-2 .articles_block__item__title { position: absolute; bottom: 35px; left: 0; padding: 0 20px; z-index: 10; color: #ffffff; max-height: 120px; overflow: hidden; } .articles_block__item__info { width: 100%; float: left; margin-top: 6px; } .articles_block__item-4 .articles_block__item__info, .articles_block__item-3 .articles_block__item__info, .articles_block__item-2 .articles_block__item__info { position: absolute; bottom: 10px; left: 20px; z-index: 10; } .articles_block__item__date { display: inline-block; font-size: 13px; color: #5f5f5f; margin-right: 8px; line-height: 16px; } .articles_block__item-4 .articles_block__item__date, .articles_block__item-3 .articles_block__item__date, .articles_block__item-2 .articles_block__item__date { color: #ffffff; } .articles_block__item__category { display: inline-block; font-size: 11px; color: #fefefe; text-decoration: none; background: #00AFCA; height: 16px; line-height: 18px; padding: 0 5px; border-radius: 5px; } .articles_block__item__category:active, .no-touch .articles_block__item__category:hover { color: #ffffff; text-decoration: none; background: #00AFCA; } @media only screen and (max-width: 767px) { .articles_block .container { padding: 0; } } @media only screen and (min-width: 768px) { .articles_block__item-4 .articles_block__item__title, .articles_block__item-3 .articles_block__item__title, .articles_block__item-2 .articles_block__item__title { font-size: 20px; line-height: 24px; } } @media only screen and (min-width: 992px) { .articles_block__item { width: 25%; padding-left: 10px; } .articles_block__item:first-child { padding-left: 0; } .articles_block__item-3 { width: 50%; } .articles_block__item-4 { width: 100%; } .articles_block__item-3 .articles_block__item__inner, .articles_block__item-2 .articles_block__item__inner, .articles_block__item__inner { height: 310px; } .articles_block__item-1 .articles_block__item__inner { padding-top: 140px; } .articles_block__item__image { position: absolute; top: 0; left: 0; width: 100%; } .articles_block__item-1 .articles_block__item__image { height: 130px; } .articles_block__item-4 .articles_block__item__image, .articles_block__item-3 .articles_block__item__image, .articles_block__item-2 .articles_block__item__image { height: 100%; } .articles_block__item__title { overflow: hidden; } .articles_block__item-1 .articles_block__item__title { max-height: 120px; } .articles_block__item-2 .articles_block__item__title { max-height: 264px; } .articles_block__item-3 .articles_block__item__title { max-height: 290px; } .articles_block__item .articles_block__item__info { position: absolute; bottom: 10px; left: 20px; z-index: 10; } } @media only screen and (min-width: 1500px) { .articles_block__item { padding-left: 20px; } .articles_block__item:first-child { padding-left: 0; } .articles_block__item-3 .articles_block__item__inner, .articles_block__item-2 .articles_block__item__inner, .articles_block__item__inner { height: 350px; } .articles_block__item-4 .articles_block__item__inner { height: 190px; } .articles_block__item-1 .articles_block__item__title { max-height: 160px; } .articles_block__item-2 .articles_block__item__title { max-height: 290px; } } /* ========================================================================== END Article block ========================================================================== */ /* ========================================================================== Special block ========================================================================== */ .special_carousel, .special_block__category__main, .special_block__category__list, .special__category { width: 100%; float: left; position: relative; } .special__category .blockmore { width: 100%; float: left; } .special_thumbs_block { width: 100%; float: left; position: relative; padding: 0 36px; margin-bottom: 20px; } .special_carousel_thumbs { padding: 0 !important; } .special_carousel_thumbs__item { background: #ffffff; height: 42px; padding: 0 20px; font-size: 14px; line-height: 20px; color: #000000; white-space: nowrap; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; border-bottom: 3px solid transparent; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .special_carousel_thumbs .owl-item.synced:active .special_carousel_thumbs__item, .no-touch .special_carousel_thumbs .owl-item.synced:hover .special_carousel_thumbs__item, .special_carousel_thumbs .owl-item.synced .special_carousel_thumbs__item { border-color: #00AFCA; color: #000000; font-weight: 700; } .special_carousel_thumbs .owl-item { cursor: pointer; } .special_carousel_thumbs .owl-item:active .special_carousel_thumbs__item, .no-touch .special_carousel_thumbs .owl-item:hover .special_carousel_thumbs__item { border-color: #a7e5ef; } .special_block__category__list { margin-top: 10px; } .special_block__category__list .material_item { border-top: 1px solid #dfdfdf; padding-top: 10px; margin-top: 10px; } .special_block__category__list .material_item:first-child { border: none; margin-top: 0; } @media only screen and (min-width: 768px) { .special_block__category__list .materials_block .material_item { border-top: none; padding-top: 0; margin-top: 10px; } } @media only screen and (min-width: 992px) { .special_block__category__main { width: calc( 50% - 15px ); } .special_block__category__list { float: none; width: auto; vertical-align: top; margin-top: 0; margin-left: 50%; padding-left: 8px; overflow: auto; } } /* ========================================================================== END Special block ========================================================================== */ /* ========================================================================== Subscribe block ========================================================================== */ .subscribe_block { margin-top: 20px; } .subscribe_block .container { padding-top: 20px; padding-bottom: 20px; box-shadow: 0 1px 2px rgba(0,0,0,.1); border-bottom: 4px solid #00AFCA; background: rgba(51,51,51,1); background: -moz-linear-gradient(top, rgba(51,51,51,1) 0%, rgba(68,68,68,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(51,51,51,1)), color-stop(100%, rgba(68,68,68,1))); background: -webkit-linear-gradient(top, rgba(51,51,51,1) 0%, rgba(68,68,68,1) 100%); background: -o-linear-gradient(top, rgba(51,51,51,1) 0%, rgba(68,68,68,1) 100%); background: -ms-linear-gradient(top, rgba(51,51,51,1) 0%, rgba(68,68,68,1) 100%); background: linear-gradient(to bottom, rgba(51,51,51,1) 0%, rgba(68,68,68,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#333333', endColorstr='#444444', GradientType=0 ); } .subscribe_block__info { width: 100%; float: left; } .subscribe_block__info__title { width: 100%; float: left; font-size: 20px; font-weight: 500; line-height: 20px; color: #ffffff; text-align: center; margin-bottom: 15px; } .subscribe_block__info__subtitle { width: 100%; float: left; font-size: 14px; font-weight: 400; line-height: 18px; color: #ffffff; text-align: center; } .subscribe_block__action { margin-top: 15px; width: 100%; float: left; } .subscribe_block__form { background: #ffffff; width: 100%; padding: 10px; text-align: center; margin-top: 10px; float: left; } .subscribe_block__form__inputbox { width: 100%; float: left; font-size: 18px; line-height: 20px; height: 20px; color: #000000; border: none; background: none; text-align: center; margin: 10px 0; } .subscribe_block__form__inputbox:focus { outline: none; } .subscribe_block__form__inputbox::-webkit-input-placeholder { color: #ababab; } .subscribe_block__form__inputbox::-moz-placeholder { color: #ababab; } .subscribe_block__form__inputbox:-moz-placeholder { color: #ababab; } .subscribe_block__form__inputbox:-ms-input-placeholder { color: #ababab; } .subscribe_block__form__inputbox:disabled::-webkit-input-placeholder { color: #cccccc; } .subscribe_block__form__inputbox:disabled::-moz-placeholder { color: #cccccc; } .subscribe_block__form__inputbox:disabled:-moz-placeholder { color: #cccccc; } .subscribe_block__form__inputbox:disabled:-ms-input-placeholder { color: #cccccc; } .subscribe_block__form__btn { border-radius: 5px; border: 2px solid #ababab; display: inline-block; height: 30px; padding: 0 40px; font-size: 14; text-transform: uppercase; font-weight: 500; line-height: 28px; color: #000000; text-decoration: none; background: #ffffff; margin-top: 10px; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .subscribe_block__form__btn:active, .no-touch .subscribe_block__form__btn:hover { border-color: #00AFCA; color: #000000; text-decoration: none; } @media only screen and (min-width: 768px) { .subscribe_block__info__title { font-size: 27px; line-height: 28px; } .subscribe_block__info__subtitle { font-size: 18px; line-height: 20px; } .subscribe_block__action { text-align: center; } .subscribe_block__form { display: inline-block; text-align: center; width: auto; float: none; } .subscribe_block__form__inputbox { float: left; width: 270px; height: 30px; line-height: 30px; text-align: left; margin: 0; margin-right: 15px; } .subscribe_block__form__btn { float: right; width: 120px; padding: 0; margin: 0; } } @media only screen and (min-width: 992px) { .subscribe_block__info { float: left; width: 50%; text-align: center; } .subscribe_block__info__subtitle, .subscribe_block__info__title { display: inline-block; max-width: 340px; float: none; } .subscribe_block__action { float: left; width: 50%; } .subscribe_block__form__inputbox { width: 270px; } } @media only screen and (min-width: 1500px) { .subscribe_block__form__inputbox { width: 300px; } } /* ========================================================================== END Subscribe block ========================================================================== */ /* ========================================================================== Adaprive banner ========================================================================== */ .adaptive_banner { padding: 0; width: 100%; float: left; margin: 20px auto; text-align: center; } .adaptive_banner .container { padding: 0; margin: 0; display: block; width: 100%; float: left; } .adaptive_banner__item { display: none; text-align: center; margin: auto; overflow: hidden; padding: 0; } .adaptive_banner__item-1 { display: block; } .adaptive_banner__item img { display: block; max-width: 100%; margin: auto; border: 1px solid #dfdfdf; } @media only screen and (min-width: 768px) { .adaptive_banner__item { display: none; } .adaptive_banner__item-2 { display: table; } } @media only screen and (min-width: 992px) { .adaptive_banner__item { display: none; } .adaptive_banner__item-3 { display: table; } } @media only screen and (min-width: 1500px) { .adaptive_banner { margin: 40px 0 20px 0; } .adaptive_banner__item { display: none; } .adaptive_banner__item-4 { display: table; } } /* ========================================================================== END Adaprive banner ========================================================================== */ /* ========================================================================== Branding ========================================================================== */ .branding { display: none; } @media only screen and (min-width: 768px) { .branding { position: fixed; z-index: 100; top: 0; left: 0; width: 100%; height: 100%; display: block; } .branding_link { position: absolute; left: 0; top: 0; height: 100%; width: 100%; display: block; background-repeat: no-repeat; background-position: -99999px; } .branding img { display: none !important; } .branding_link:before, .branding_link:after { content: ''; display: block; position: absolute; left: 0; margin-left: -375px; top: 0; width: 100%; height: 100%; background-image: inherit; background-repeat: no-repeat; background-position: 50% bottom; z-index: 10; } .branding_link:after { left: auto; right: 0; margin-right: -375px; } } @media only screen and (min-width: 992px) { .branding_link:before { margin-left: -480px; } .branding_link:after { margin-right: -480px; } } @media only screen and (min-width: 1500px) { .branding_link:before { margin-left: -585px; } .branding_link:after { margin-right: -585px; } } /* ========================================================================== END Branding ========================================================================== */ /* ========================================================================== Main content ========================================================================== */ .page { position: relative; width: 100%; float: left; padding-bottom: 40px; } .pagebody { width: 100%; float: left; position: relative; margin-top: 20px; } .pagecontent { font-size: 15px; line-height: 25px; } .sidebar { display: none; position: relative; width: 100%; float: left; height: auto; top: auto; bottom: auto; left: auto; right: auto; padding: 0 15px; } .sidebar_slide_block { width: 100%; float: left; margin: 0; position: relative; z-index: 2000; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; transition: all 0.2s linear; top: 0; } .sidebar.active .sidebar_slide_block { margin-top: 70px; } .sidebar .sidebar_slide_block.is_stuck { /*margin-bottom: 40px;*/ } .sectionhead { width: 100%; float: left; } .sectionhead a { text-decoration: none; color: #9f9f9f; font-size: 12px; font-weight: 500; line-height: 20px; text-transform: uppercase; } .sectionhead a:active, .no-touch .sectionhead a:hover { text-decoration: none; } .page_banner_block { width: 100%; float: left; margin: 20px 0; text-align: center; display: block; } .page_map { width: auto; margin: 0 -15px; } .page_map .googlemap { margin: 20px 0; } .page_image { float: left; clear: both; margin: 20px -15px; } .page_image__link { width: 100%; float: left; display: block; text-decoration: none; } .page_image img, .page_image__link img { width: 100%; display: block; } .page_image__info { padding: 0 15px; width: 100%; float: left; margin-top: 5px; } .page_image__info__desc { font-size: 13px; line-height: 18px; color: #000000; font-style: italic; } .page_image__info__link { font-size: 12px; line-height: 18px; color: #7d7d7d; text-decoration: none; } .page_comments { padding-top: 40px; width: 100%; float: left; display: none; } .widget_image-left { float: left; width: 300px; margin-right: 40px; margin-top: 40px; margin-bottom: 40px; } .widget_image-left img{ max-width: 100%; } .widget_image__link img:first-child { width: 100%; } .widget_image__link { position: relative; } .widget_image__fav { position: absolute; right: 10px; bottom: 10px; } .widget_image__info { background: #FFFFFF; box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.05); border-radius: 5px; padding: 15px; } .widget_image__info__desc { font-weight: 800; line-height: normal; font-size: 20px; color: #F59921; margin: 0; } .eldala_widget .widget_image__info__desc { color: #00AFCA; } a.widget_wrap:hover p, a.widget_wrap:hover span{ text-decoration: underline; } .widget_image__info__link { font-weight: 600; line-height: normal; font-size: 16px; color: #000000; padding: 7px 0; display: inline-block; width: 100%; margin: 0; } .widget_image-left span { font-style: normal; font-weight: normal; line-height: normal; clear: both; font-size: 12px; color: #888888; display: inline-block; width: 80%; } .widget_image-left .widget_image-btn { float: right; } .widget_image-vertical { position: relative; box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.05); border-radius: 5px; display: inline-block; width: 97%; } .widget_image-vertical span { font-style: normal; font-weight: normal; line-height: normal; clear: both; font-size: 12px; color: #888888; display: inline-block; width: 80%; } .widget_image-vertical .widget_image__link { width: 42%; display: inline-block; float: left; } .widget_image-vertical .widget_image__info { width: 57%; display: inline-block; float: left; box-shadow: none; padding: 7px 15px; } .widget_image-vertical .widget_image-btn { display: inline-block; position: absolute; top: 31%; right: -13px; border: 9px solid #fff; border-radius: 50px; box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.1); } @media only screen and (max-width: 992px) { .header__search__options__list { bottom: -94px; } } @media only screen and (max-width: 767px) { .widget_image-left { width: 100%; } .widget_image-vertical .widget_image__info { width: 100%; } .widget_image-vertical .widget_image__link { width: 100%; } .widget_image-vertical .widget_image-btn { bottom: 30px; top: auto; } .page_image img, .page_image__link img { width: 100% !important; max-width: 100%; max-height: 100%; height: auto; } .form-group { display: inline-block; margin-left: 12px; clear: both; width: 100%; margin-top: 10px; } .header__search__options__list { position: relative; clear: both; bottom: 6px; border-bottom: 1px solid #eee; } } @media only screen and (min-width: 768px) { .sectionhead a { font-size: 14px; line-height: 20px; } .page_map { margin-left: 0; margin-right: 0; width: 100%; float: left; } .page_banner_block { width: 300px; margin: 5px 0 5px 20px; float: right; } .page_image { width: 100%; float: left; margin-left: 0; margin-right: 0; } .page_image__info { padding: 0; } .page_image-left { float: left; width: 350px; margin-right: 20px; margin-top: 5px; margin-bottom: 5px; } .page_image-right { float: right; width: 350px; margin-left: 20px; margin-top: 5px; margin-bottom: 5px; } } @media only screen and (min-width: 992px) { .pagebody-sidebar { width: 640px; float: left; } .page_banner_block { display: none; } .sidebar { padding-left: 0; padding-right: 0; position: absolute; right: 20px; top: 0; margin-top: 20px; width: 300px; display: block; } .sidebar_slide_block { width: 300px; } } @media only screen and (min-width: 1500px) { .pagebody-sidebar { width: 840px; } .sidebar { right: 30px; } .widget_image-vertical .widget_image__info { padding: 28px; } } /* ========================================================================== END Main content ========================================================================== */ /* ========================================================================== Sidebar slide block ========================================================================== */ /* ========================================================================== END Sidebar slide block ========================================================================== */ /* ========================================================================== Sidebar banner ========================================================================== */ .sidebar_banner { position: relative; width: 100%; float: left; overflow: hidden; display: none; } .sidebar_banner img { display: block; float: right; } .sidebar_banner__link { display: block; width: auto; float: right; margin-top: 20px; } .sidebar_banner__link:first-child { margin-top: 0; } @media only screen and (min-width: 992px) { .sidebar_banner { display: block; } } /* ========================================================================== END Sidebar banner ========================================================================== */ /* ========================================================================== Blogers block ========================================================================== */ .blogers_block { position: relative; width: 100%; float: left; } .sidebar .blogers_block .material_item { border-top: 1px solid #dfdfdf; padding-top: 10px; margin-top: 10px; } .sidebar .blogers_block .material_item:first-child { padding-top: 0; margin-top: 0; border: none; } @media only screen and (min-width: 768px) and (max-width: 991px) { .sidebar .blogers_block .material_item { padding-top: 20px; margin-top: 20px; } .sidebar .blogers_block .material_item:nth-child(3), .sidebar .blogers_block .material_item:nth-child(2), .sidebar .blogers_block .material_item:nth-child(1) { padding-top: 0; margin-top: 0; border: none; } } /* ========================================================================== END Blogers block ========================================================================== */ /* ========================================================================== Main content - Article ========================================================================== */ .article__info { width: 100%; float: left; margin: 10px 0; } .article__info__left { width: 100%; float: left; } .article__author { width: 100%; float: left; margin: 10px 0 10px 0; display: table; color: #333333; top: -9px; position: relative; } .article__author__image { border-radius: 100%; width: 50px; height: 50px; overflow: hidden; display: table-cell; } .article__author__name { display: table-cell; vertical-align: middle; padding-left: 10px; font-size: 14px; line-height: 20px; font-weight: 500; } .article__date { float: left; font-size: 13px; line-height: 19px; color: #5f5f5f; padding: 3px 0; } .article__sectiontitle { float: left; margin-right: 10px; font-size: 14px; font-weight: 500; } .article__options { float: left; width: 100%; } .article__options__views { font-size: 14px; line-height: 16px; display: inline-block; padding: 3px 5px; color: #333333; } a.article__options__comments { font-size: 14px; line-height: 16px; display: inline-block; padding: 3px 5px; border-radius: 5px; margin-left: 4px; color: #333333 !important; } a.article__options__print { font-size: 20px; line-height: 16px; display: inline-block; padding: 3px 5px; border-radius: 5px; margin-left: 4px; color: #333333 !important; } .article__options__views i, .article__options__comments i { margin-right: 5px; } .article__options__comments:active, .no-touch .article__options__comments:hover, .article__options__print:active, .no-touch .article__options__print:hover { color: #00AFCA !important; text-decoration: none; } .article__social { width: 100%; float: left; } .article__social__desc { font-size: 14px; color: #5f5f5f; display: inline-block; vertical-align: middle; display: none; } .article__info_bottom__tags { width: 100%; float: left; } .article__tags { width: 100%; float: left; } .article__tags__item { font-size: 14px; color: #5f5f5f; text-decoration: none; } .article__tags__item:active, .no-touch .article__tags__item:hover { color: #00AFCA; text-decoration: underline; } .article__tags__separator { display: inline-block; padding: 0 5px; color: #5f5f5f; } .article__info_bottom { width: 100%; float: left; margin-top: 20px; } .article__info_bottom__author { width: 100%; float: left; margin-bottom: 10px; } .article__info_bottom__social { width: 100%; float: left; margin-bottom: 15px; } .article__social { float: left; width: auto; margin-right: 15px; } .article__coments_btn { margin-top: 10px; float: left; height: 28px; border: 1px solid #dfdfdf; padding: 0 10px; line-height: 26px; font-size: 14px; color: #5f5f5f; border-radius: 5px; cursor: pointer; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .article__coments_btn:active, .no-touch .article__coments_btn:hover { color: #00AFCA; } .article__coments_btn span { display: inline-block; color: #00AFCA; } @media only screen and (min-width: 768px) { .article__info { display: table; width: 100%; } .article__info__left { display: table-cell; vertical-align: middle; float: none; width: auto; } .article__options, .article__date, .article__author { display: inline-block; width: auto; float: left; } .article__author { margin: 0 15px 0 0; } .article__sectiontitle { line-height: 32px; height: 30px; padding: 0; } .article__date { /*margin-right: 15px;*/ line-height: 32px; height: 30px; padding: 0; } .article__options { margin-right: 15px; line-height: 32px; padding: 0; height: 30px; display: table-cell; vertical-align: middle; float: none; width: auto; text-align: right; } .article__coments_btn { margin-top: 0; } } /* ========================================================================== END Main content - Article ========================================================================== */ /* ========================================================================== Main content - Event page ========================================================================== */ .page_event__info { margin: 10px 0; width: 100%; float: left; } .page_event__info__row { width: 100%; float: left; } .page_event__info__row:first-child { margin-top: 0; } .page_event__info__block { display: inline-block; margin-right: 40px; margin-top: 15px; } .page_event__info__block:last-child { margin-right: 0; } .page_event__info__block__title { font-size: 14px; line-height: 18px; color: #5f5f5f; } .page_event__info__block__value { margin-top: 3px; font-size: 16px; line-height: 20px; font-weight: 500; color: #000000; } .page_event__info_top { width: 100%; float: left; } @media only screen and (min-width: 768px) { .page_event__info_top { margin-bottom: 20px; } .page_event__info { width: 400px; float: left; } .page_event__image { float: none; width: auto; margin: 0; margin-left: 420px; clear: none; } } @media only screen and (min-width: 992px) { .page_event__info { width: 300px; float: left; } .page_event__image { margin-left: 320px; } } @media only screen and (min-width: 1500px) { .page_event__info { width: 500px; float: left; } .page_event__image { margin-left: 520px; } } /* ========================================================================== END Main content - Event page ========================================================================== */ /* ========================================================================== Main content - News ========================================================================== */ .page_news__top { width: 100%; float: left; margin-bottom: 40px; } .page_news__bottom .material_item { border-top: 1px solid #dfdfdf; padding-top: 10px; margin-top: 10px; } .page_news__bottom .material_item:first-child { padding-top: 0; border: none; margin-top: 0; } @media only screen and (min-width: 768px) { .page_news__bottom .material_item:nth-child(2), .page_news__bottom .material_item:nth-child(1) { padding-top: 0; border: none; margin-top: 0; } } @media only screen and (min-width: 992px) { .page_news__bottom .material_item:nth-child(4), .page_news__bottom .material_item:nth-child(3), .page_news__bottom .material_item:nth-child(2), .page_news__bottom .material_item:nth-child(1) { padding-top: 0; border: none; margin-top: 0; } } /* ========================================================================== END Main content - News ========================================================================== */ /* ========================================================================== Main content - Company ========================================================================== */ .page_company__head { width: 100%; float: left; padding: 0 0 20px 0; } .page_company__head__logo { width: 100%; float: left; margin-bottom: 20px; } .page_company__head__img { margin: auto; width: 100%; max-width: 350px; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .page_company__head__img img { display: block; max-width: 100%; } .page_company__head__info { padding-top: 10px; width: 100%; float: left; } .page_company__head__title { margin: 0 0 10px 0; font-size: 16px; line-height: 24px; font-weight: 500; } .page_company__head__desc { font-size: 14px; line-height: 20px; } .page_company__body { width: 100%; float: left; margin-top: 10px; } .page_company__tabs { width: 100%; float: left; } .page_company__tabs__menu { display: table; } .page_company__tabs__menu__item { float: none; width: auto; display: table-cell; } .page_company__tabs__menu__item i { font-size: 25px; vertical-align: middle; display: inline-block; } .page_company__tabs__menu__item span { vertical-align: middle; display: inline-block; display: none; padding-left: 10px; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .page_company__tabs__menu__item.ui-state-active span { display: inline-block; } .page_company__tab_content { width: 100%; float: left; } .page_company__team_block, .page_company__management_block { width: 100%; float: left; margin-top: 20px; } .page_company__team_block h4, .page_company__management_block h4 { margin-bottom: 20px; } .page_company__team_block h4 small, .page_company__management_block h4 small { font-size: 12px; color: #606060; font-weight: 400; } .page_company__management_block .material_item__title { font-size: 16px; line-height: 20px; } .page_company__management_block .material_item__post { font-size: 12px; line-height: 16px; } .page_company__team_block .material_item__content { padding-top: 0; } .page_company__team_block .material_item__title { font-size: 14px; line-height: 18px; } .page_company__team_block .material_item__title span { padding-bottom: 1px; } .page_company__team_block .material_item__post { font-size: 12px; line-height: 16px; margin-top: 5px; } .page_company__contacts { width: 100%; float: left; margin-top: 20px; } .page_company__contacts__item { width: 100%; float: left; margin: 10px 0; } .page_company__contacts__item i { width: 30px; float: left; font-size: 20px; display: block; } .page_company__contacts__item span { display: block; margin-left: 30px; font-size: 14px; line-height: 22px; } .page_company__social { width: 100%; float: left; margin-top: 20px; } .page_company__map { width: 100%; float: left; margin-top: 20px; } .page_company__tags { width: 100%; float: left; margin-top: 20px; } .page_company__tags__item { margin-right: 8px; display: inline-block; border-radius: 5px; line-height: 16px; font-size: 12px; border: 1px solid #ababab; background: #ffffff; color: #5f5f5f; padding: 1px 10px; margin-bottom: 8px; } .page_company__tags__item:active, .no-touch .page_company__tags__item:hover { color: #ffffff; background: #00AFCA; text-decoration: none; border-color: #00AFCA; } .page_company__structure { width: 100%; float: left; } .page_company__structure__list { width: 100%; float: left; } .page_company__structure__item { margin-top: 30px; width: 100%; float: left; } .page_company__structure__item:first-child { margin-top: 0; } .page_company__structure__item__link { text-decoration: none; color: #000000; } .page_company__structure__item__link:active, .no-touch .page_company__structure__item__link:hover { text-decoration: none; } .page_company__structure__item__img { width: 100%; float: left; margin-bottom: 10px; text-align: center; } .page_company__structure__item__img img { max-width: 200px; display: block; margin: auto; } .page_company__structure__item__title { font-size: 14px; font-weight: 700; } .page_company__structure__item__desc { width: 100%; float: left; margin-top: 5px; } .page_company__banner { width: 100%; float: left; margin-bottom: 10px; text-align: center; } .page_company__btn { display: flex; align-items: center; justify-content: center; margin-top: 20px; border-radius: 5px; border: 2px solid #ababab; min-height: 40px; padding: 0 40px; font-size: 14px; font-weight: 500; text-transform: uppercase; color: #000; text-decoration: none; background: #fff; outline: none; text-align: center; } .btn-animated { border-radius: 4px; text-transform: uppercase; position: relative; text-decoration: none; display: flex; align-items: center; justify-content: center; border: 1.5px solid #ababab; padding: .5rem 2rem; font-size: 14px; font-weight: 500; background-size: 300%; color: #000; background-image: linear-gradient(120deg, white 50%, #00AFCA 50%); transition: background-position 1s ease, color 1s ease; } .btn-animated:hover { color: #fff !important; text-decoration: none !important; background-position: 100%; } .btn-animated:active { box-shadow: 0px 10px 20px -15px rgba(0, 0, 0, 0.75); } .page_company__head__info .page_company__btn:hover, .page_company__head__info .page_company__btn:active { border-color: #00AFCA; color: #000; text-decoration: none; } @media only screen and (min-width: 768px) { .page_company__head { float: left; width: 400px; } .page_company__head__logo { } .page_company__head__info { padding-top: 0; } .page_company__head__title { font-size: 24px; line-height: 32px; } .page_company__banner { width: 300px; float: right; margin-top: 0; text-align: right; } .page_company__body { margin-top: 20px; } .page_company__tabs__menu__item span { display: inline-block; } .page_company__structure__item { margin-top: 20px; } .page_company__structure__item:first-child { margin-top: 0; } .page_company__structure__item__img { width: 280px; float: left; margin-bottom: 10px; text-align: center; } .page_company__structure__item__title { margin-left: 300px; } .page_company__structure__item__desc { float: none; width: auto; margin-left: 300px; } } @media only screen and (min-width: 992px) { .page_company__head { width: 100%; } .page_company__head__logo { width: 300px; } .page_company__head__info { padding-top: 0; float: none; width: auto; margin-left: 310px; } .page_company__banner { display: none; } } /* ========================================================================== END Main content - Company ========================================================================== */ /* ========================================================================== Main content - Companies ========================================================================== */ .page_companies__search { width: 100%; float: left; /*margin-bottom: 20px;*/ } .page_companies__search__form { background: #ffffff; width: 100%; float: left; height: 40px; border: 1px solid #dfdfdf; box-shadow: 0 1px 3px rgba(0,0,0,.1); } .page_companies__search__inputbox { font-size: 16px; line-height: 40px; border: none; background: none; padding: 0 10px; float: left; display: block; width: calc( 100% - 60px ); } .page_companies__search__inputbox:focus { outline: none; } .page_companies__search__btn { display: block; float: left; background: none; border: none; cursor: pointer; width: 40px; height: 40px; line-height: 40px; margin: 0; padding: 0; font-size: 20px; text-align: center; color: #333333; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .page_companies__search__btn:active, .no-touch .page_companies__search__btn:hover { color: #00AFCA; } .page_companies__filter_open { margin-top: 15px; width: 100%; } .page_companies__filter_open.opened { background: #00AFCA; border-color: #00AFCA; color: #ffffff; } .page_companies__filter_open.opened:active, .no-touch .page_companies__filter_open.opened:hover { background: #67cc4a; border-color: #67cc4a; color: #ffffff; } .page_companies__filter { display: none; width: 100%; float: left; padding: 20px 0 10px 0; } .page_companies__filter__top { width: 100%; float: left; } .page_companies__filter__block { width: 100%; float: left; margin-top: 10px; } .page_companies__filter__block:first-child { margin-top: 0; } .page_companies__filter__block__title { font-size: 16px; color: #606060; font-weight: 500; cursor: pointer; padding-right: 30px; position: relative; } .page_companies__filter__block__title:focus { outline: none; } .page_companies__filter__block__title:after { position: absolute; right: 0; top: 0; font-family: Font Awesome\ 5 Free; content: '\f107'; display: block; font-size: 24px; font-weight: 900; width: 30px; } .page_companies__filter__block__title.ui-state-active:after { content: '\f106'; } .page_companies__filter__block__content { display: none; width: 100%; float: left; padding: 0 0 10px 0; } .page_companies__filter__item { width: 100%; float: left; font-size: 12px; line-height: 16px; margin-top: 8px; } .page_companies__filter__item i { top: 2px; border: 2px solid #ababab; height: 14px; width: 14px; line-height: 16px; } .page_companies__filter__item.active i { border-color: #00AFCA; background: #00AFCA; color: #ffffff; } .page_companies__filter__item i:after { font-size: 10px; line-height: 10px; width: 10px; height: 10px; color: #ffffff; } .page_companies__filter__item span { top: 2px; position: relative; } .page_companies__filter__bottom { width: 100%; float: left; margin-top: 20px; text-align: center; } .page_companies__filter__btn-submit { width: 100%; } .page_companies__filter__btn-reset { height: 24px; line-height: 20px; background: #ffffff; color: #606060; border: 1px solid #ababab; border-radius: 12px; width: 140px; font-size: 12px; margin-top: 10px; display: inline-block; vertical-align: middle; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .page_companies__filter__btn-reset:active, .no-touch .page_companies__filter__btn-reset:hover { color: #000000; border-color: #000000; } @media only screen and (min-width: 768px) { .page_companies__search { /*margin-bottom: 30px;*/ } .page_companies__search__form { width: calc( 100% - 180px ); } .page_companies__filter_open { width: 160px; float: right; margin-top: 5px; } .page_companies__filter { padding-top: 10px; padding-bottom: 10px; } .page_companies__filter__block { width: auto; display: inline-block; vertical-align: top; float: none; margin-top: 0; margin-bottom: 20px; } .page_companies__filter__block__title { width: 180px; padding-right: 0; } .page_companies__filter__block__title:after { display: none; } .page_companies__filter__block__content { display: block; width: 180px; float: left; padding-right: 10px; } .page_companies__filter__btn-submit { display: inline-block; float: none; width: 160px; vertical-align: middle; } .page_companies__filter__btn-reset { margin: 0; width: auto; padding: 0 15px; margin-left: 10px; } } /* ========================================================================== END Main content - Companies ========================================================================== */ /* ========================================================================== Main content - Day number ========================================================================== */ .page_daynumber__content { width: 100%; float: left; margin: 20px 0; } .page_daynumber__number { width: 100%; float: left; text-align: center; font-size: 200px; line-height: 180px; color: #5f5f5f; font-family: 'Bitter'; font-weight: 700; } .page_daynumber__subnumber { width: 100%; float: left; text-align: center; font-size: 40px; line-height: 40px; color: #5f5f5f; margin-bottom: 20px; } .page_daynumber__subtitle { width: 100%; float: left; text-align: center; font-size: 14px; line-height: 18px; font-weight: 500; } .page_daynumber__nav { width: 100%; float: left; text-align: center; margin-bottom: 20px; } .page_daynumber__nav__link { vertical-align: middle; display: inline-block; color: #5f5f5f; font-size: 20px; line-height: 20px; margin: 0 10px; } .page_daynumber__nav__title { vertical-align: middle; display: inline-block; font-size: 16px; line-height: 20px; } .page_daynumber__desc { font-size: 14px; line-height: 20px; font-weight: 500; } /* ========================================================================== END Main content - Day number ========================================================================== */ /* ========================================================================== Main content - Profiles list ========================================================================== */ .page_profiles__filter__alphabet { width: 100%; float: left; text-align: center; } .page_profiles__filter__alphabet__item { font-size: 20px; line-height: 22px; display: inline-block; color: #606060; text-decoration: none; margin: 2px 0; text-decoration: none; width: 28px; height: 32px; line-height: 32px; border-bottom: 1px solid transparent; } .page_profiles__filter__alphabet__item:active, .no-touch .page_profiles__filter__alphabet__item:hover { color: #000000; text-decoration: none; border-color: #808080; } .page_profiles__filter__alphabet__item.active, .page_profiles__filter__alphabet__item.active:active, .no-touch .page_profiles__filter__alphabet__item.active:hover { color: #00AFCA; text-decoration: none; border-color: #00AFCA; } .page_profiles__filter__alphabet__item.disabled, .page_profiles__filter__alphabet__item.disabled:active, .no-touch .page_profiles__filter__alphabet__item.disabled:hover { cursor: default; color: #bfbfbf; text-decoration: none; border-color: transparent; } .page_profiles__search { margin: 20px 0; width: 100%; float: left; } .page_profiles__search__form { width: 100%; float: left; border: 1px solid #dfdfdf; box-shadow: 0 1px 3px rgba(0,0,0,.1); } .page_profiles__search__inputbox { width: calc( 100% - 32px ); float: left; display: block; border: none; background: none; height: 40px; padding: 0 15px; } .page_profiles__search__icon { width: 32px; height: 40px; font-size: 18px; line-height: 38px; color: #000000; text-align: center; float: left; } .page_profiles__showall { display: none; width: 100%; float: left; text-align: center; } .page_profiles__showall_btn { font-size: 16px; line-height: 22px; color: #000000; display: inline-block; border-bottom: 1px solid transparent; } .page_profiles__showall_btn:active, .no-touch .page_profiles__showall_btn:hover { color: #00AFCA; text-decoration: none; border-color: #00AFCA; } .page_profiles__body { width: 100%; float: left; margin-top: 10px; } .page_profiles__category { width: 100%; float: left; margin-bottom: 20px; } .page_profiles__category__title { width: 100%; float: left; font-size: 20px; line-height: 24px; color: #606060; font-weight: 500; border-bottom: 1px solid #dfdfdf; } .page_profiles__category__result { width: 100%; float: left; padding-top: 10px; } .page_profiles__category__item { display: inline-block; width: 100%; float: left; position: relative; margin: 7px 0; } .page_profiles__category__item__name { font-size: 16px; line-height: 22px; position: relative; margin: 10px 0; text-decoration: none; color: #000000; } .page_profiles__category__item__name:active, .no-touch .page_profiles__category__item__name:hover { text-decoration: underline; color: #000000; } .page_profiles__category__item__person { display: none; position: absolute; top: 100%; left: 0; border: 1px solid #dfdfdf; padding: 15px; background: #ffffff; z-index: 100; width: 180px; box-shadow: 0 1px 6px rgba(0,0,0,.15); } .page_profiles__category__item.active .page_profiles__category__item__person { display: block; } .page_profiles__category__item__person__image { width: 100%; float: left; padding-top: 100%; } .page_profiles__category__item__person__name { font-size: 14px; line-height: 18px; color: #000000; margin: 5px 0; width: 100%; float: left; } .page_profiles__category__item__person__post { font-size: 11px; line-height: 15px; color: #5f5f5f; } .page_profiles__empty { display: none; width: 100%; float: left; font-size: 16px; } @media only screen and (min-width: 768px) { .page_profiles__category__item:visible { width: 33.333333%; padding-right: 20px; } .page_profiles__category__item { width: 33.333333%; } .page_profiles__category__item:visible:nth-child(1n), .page_profiles__category__item:visible:nth-child(2n) { padding-right: 5px; padding-left: 5px; } .page_profiles__category__item:visible:nth-child(3n+1), .page_profiles__category__item:visible:first-child { padding-left: 0; padding-right: 10px; } .page_profiles__category__item:visible:nth-child(3n) { padding-right: 0; padding-left: 10px; } } /* ========================================================================== END Main content - Profiles list ========================================================================== */ /* ========================================================================== Main content - Profile ========================================================================== */ .page_profile__head { width: 100%; max-width: 290px; margin: auto; padding: 0 0 0 0; } .page_profile__head__image { width: 290px; height: 290px; float: left; clear: both; } .page_profile__head__info { padding-top: 10px; width: 100%; float: left; } .page_profile__head__info__age, .page_profile__head__info__post { font-size: 14px; line-height: 20px; margin-bottom: 15px; width: 100%; float: left; } .page_profile__head__info__gallery { width: 100%; float: left; } .page_profile__head__info__gallery__btn { color: #00AFCA; font-size: 14px; line-height: 20px; text-decoration: none; } .page_profile__head__info__gallery__btn i { font-size: 18px; margin-right: 10px; display: inline-block; } .page_profile__head__info__gallery__btn span { border-bottom: 1px solid #b4dfa8; display: inline-block; } .page_profile__head__info__gallery__list { display: none; } .page_profile__body { width: 100%; float: left; margin-top: 10px; } .page_profile__tabs { width: 100%; float: left; } .page_profile__tabs__menu { display: table; } .page_profile__tabs__menu__item { float: none; width: auto; display: table-cell; } .page_profile__tabs__menu__item i { font-size: 25px; vertical-align: middle; display: inline-block; } .page_profile__tabs__menu__item span { vertical-align: middle; display: inline-block; display: none; padding-left: 10px; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .page_profile__tabs__menu__item.ui-state-active span { display: inline-block; } .page_profile__tab_content { width: 100%; float: left; } .page_profile__tip { width: 100%; float: left; margin: 10px 0 0 0; padding: 10px 0 0 0; border-top: 1px dashed #cacaca; } .page_profile__tip__desc { width: 100%; float: left; font-style: italic; font-size: 13px; } .page_profile__tip__updtime { width: 100%; float: left; font-size: 13px; } @media only screen and (min-width: 768px) { .page_profile__head { float: left; margin: 0; width: 400px; max-width: 100%; } .page_profile__head__image { width: 160px; height: 160px; float: left; } .page_profile__head__info { width: 100%; max-width: 100%; padding-top: 10px; } .page_profile .page_banner_block { width: 300px; float: right; margin-top: 0; text-align: right; } .page_profile__tip__desc { width: 50%; float: left; } .page_profile__tip__updtime { width: 50%; float: right; text-align: right; } .page_profile__body { margin-top: 20px; } .page_profile__tabs__menu__item span { display: inline-block; } .page_profile__tabs__menu__item, .page_company__tabs__menu__item { width: 33.333333%; margin-top: 20px; } .page_profile__tabs__menu__item:first-child { margin-top: 0; } } @media only screen and (min-width: 992px) { .page_profile__head { width: 100%; } .page_profile__head__image { width: 200px; height: 200px; } .page_profile__head__info { padding-top: 0; margin-top: 0; width: auto; float: none; margin-left: 220px; } } /* ========================================================================== END Main content - Profile ========================================================================== */ /* ========================================================================== Main content - Calendar ========================================================================== */ .page_calendar__filter { width: 100%; float: left; margin: 0 0 20px 0; } .page_calendar__filter__item { display: block; width: 100%; float: left; margin-top: 10px; } .page_calendar__filter__item:first-child { margin-top: 0; } .page_calendar__nav { width: 100%; float: left; display: table; } .page_calendar__nav__block { display: table-cell; text-align: center; width: auto; vertical-align: middle; } .page_calendar__nav__btn { display: block; float: left; background-repeat: no-repeat; background-position: center; color: #aaaaaa; font-size: 18px; line-height: 24px; font-weight: 700; width: 30px; } .page_calendar__nav__btn-prev { text-align: left; float: left; } .page_calendar__nav__btn-next { float: right; text-align: right; } .page_calendar__nav__btn i { width: 20px; height: 20px; line-height: 20px; font-size: 30px; display: inline-block; vertical-align: middle; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .page_calendar__nav__btn:active i, .no-touch .page_calendar__nav__btn:hover i { color: #00AFCA; } .page_calendar__nav__btn span { display: none; vertical-align: middle; } .page_calendar__nav__btn-prev span { margin-left: 10px; } .page_calendar__nav__btn-next span { margin-right: 10px; } .page_calendar__nav__curent { display: inline-block; vertical-align: middle; font-size: 20px; line-height: 20px; font-weight: 700; color: #303030; } .page_calendar__table { width: 100%; float: left; margin: 20px 0; } .page_calendar__table__head { display: none; } .page_calendar__table__head:last-child { border-bottom: 0; border-top: 1px solid #cbcbcb; } .page_calendar__table__row { width: 100%; float: left; } .page_calendar__table__row-head { display: none; } .page_calendar__table__day { width: 100%; float: left; border-top: 1px solid #cbcbcb; padding: 10px 0; } .page_calendar__table__day:first-child { } .page_calendar__table__day.disabled { display: none; } .page_calendar__table__day__head { width: 34px; display: table-cell; vertical-align: top; } .page_calendar__table__day__number { width: 24px; height: 24px; text-align: center; font-size: 13px; font-weight: 500; line-height: 24px; color: #00AFCA; } .page_calendar__table__day.current .page_calendar__table__day__number { background: #00AFCA; color: #ffffff; } .page_calendar__table__day__events { line-height: 24px; display: table-cell; vertical-align: middle; padding: 4px 0 } .page_calendar__table__day__event, .page_calendar__table__day__events>div { color: #606060; font-size: 13px; line-height: 18px; width: 100%; float: left; text-decoration: none; display: block; margin: 0 0 10px 0; position: relative; border-top: 1px solid #cbcbcb; padding-top: 10px; word-break: break-word; } .page_calendar__table__day__event:first-child, .page_calendar__table__day__events>div:first-child { margin-top: 0; border: none; padding-top: 0; } .page_calendar__table__day__event:last-child, .page_calendar__table__day__events>div:last-child { margin-bottom: 0; } .page_calendar__table__day__event:active, .no-touch .page_calendar__table__day__event:hover, .page_calendar__table__day__events>div:active, .no-touch .page_calendar__table__day__events>div:hover { text-decoration: none; color: #606060; } .page_calendar__table__day__event.active:active, .no-touch .page_calendar__table__day__event.active:hover, .page_calendar__table__day__event.active, .page_calendar__table__day__events>div.active:active, .no-touch .page_calendar__table__day__events>div.active:hover, .page_calendar__table__day__events>div.active { text-decoration: underline; color: #00AFCA; } .page_calendar__table__day__event.latifund, .page_calendar__table__day__events>div.latifund { font-weight: 700; color: #00AFCA; } .page_calendar__table__day__event i, .page_calendar__table__day__events>div i { display: inline-block; margin-right: 5px; } .page_calendar__table__day__event__info { display: none; width: 230px; padding: 15px; position: absolute; margin-top: 12px; top: 100%; left: 110px; margin-left: -115px; background: #ffffff; border: 1px solid #dfdfdf; z-index: 100; box-shadow: 0 1px 6px rgba(0,0,0,.15); z-index: 200; } .page_calendar__table__day__event__info:before, .page_calendar__table__day__event__info:after { position: absolute; content: ''; display: block; left: 50%; margin-left: -10px; top: -10px; width: 0; height: 0; border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid #ffffff; } .page_calendar__table__day__event__info:before { top: -12px; border-bottom-color: #ebebeb; } .page_calendar__table__day__event.top .page_calendar__table__day__event__info { top: auto; bottom: 100%; } .page_calendar__table__day__event.top .page_calendar__table__day__event__info:before, .page_calendar__table__day__event.top .page_calendar__table__day__event__info:after { top: auto; bottom: -10px; border-bottom: none; border-top: 10px solid #ffffff; } .page_calendar__table__day__event.top .page_calendar__table__day__event__info:before { bottom: -12px; border-top-color: #ebebeb; } .page_calendar__table__day__event.active .page_calendar__table__day__event__info { z-index: 200; } .page_calendar__table__day__event__info__image { width: 100%; padding-top: 66.86%; float: left; } .page_calendar__table__day__event__info__block { font-size: 12px; line-height: 18px; font-weight: 500; color: #000000; width: 100%; float: left; margin-top: 10px; } .page_calendar__table__day__event__info__block i { display: block; float: left; color: #00AFCA; width: 20px; text-align: center; font-size: 16px; height: 16px; line-height: 16px; } .page_calendar__table__day__event__info__block span { display: block; margin-left: 25px; } @media only screen and (min-width: 768px) { .page_calendar__filter { text-align: center; } .page_calendar__filter__item { display: inline-block; width: 210px; float: none; margin: 0 10px; } .page_calendar__nav__btn { width: 120px; } .page_calendar__nav__btn span { display: inline-block; } } @media only screen and (min-width: 992px) { .page_calendar__filter__item { display: inline-block; width: 240px; } .page_calendar__table { display: table; width: 100%; float: left; border-top: none; } .page_calendar__table__row { display: table-row; float: none; width: auto; } .page_calendar__table__cell { font-size: 13px; font-weight: 500; line-height: 18px; color: #5e5e5e; text-align: center; display: table-cell; vertical-align: top; width: 14.285714%; padding: 10px 0; border: none; } .page_calendar__table__cell:first-child { border-left: none; } .page_calendar__table__row:first-child .page_calendar__table__cell { border-top: none; } .page_calendar__table__row:last-child .page_calendar__table__cell { border-top: 1px solid #cdcdcd; } .page_calendar__table__day:first-child, .page_calendar__table__day { position: relative; display: table-cell; vertical-align: top; width: 14.285714%; float: none; padding: 25px 10px 5px 10px; border-right: 1px solid #cdcdcd; border-bottom: none; border-top: 1px solid #cdcdcd; max-width: 127px; } .page_calendar__table__day:first-child { border-left: 1px solid #cdcdcd; } .page_calendar__table__day.disabled { display: table-cell; } .page_calendar__table__day.disabled .page_calendar__table__day__number { background: none; color: #cdcdcd; } .page_calendar__table__day__head { float: left; margin: 0; position: absolute; left: 0; top: 0; } .page_calendar__table__day__events { width: 100%; float: left; margin: 0; min-height: 120px; } .page_calendar__table__day__event__info { left: 50%; } } /* ========================================================================== END Main content - Calendar ========================================================================== */ /* ========================================================================== Main content - Special ========================================================================== */ .page_special__head { width: 100%; float: left; } .page_special__last { width: 100%; float: left; margin-top: 20px; } .page_special__sidebar_menu { width: 100%; float: left; } .page_special__sidebar_menu__list { width: 100%; float: left; } .page_special__sidebar_menu__item { width: 100%; float: left; border-top: 1px solid #cacaca; padding: 15px 0; } .page_special__sidebar_menu__item:first-child { border-top: none; padding-top: 5px; } .page_special__sidebar_menu__link { font-size: 18px; line-height: 24px; color: #000000; text-decoration: none; font-weight: 500; } .page_special__sidebar_menu__link:active, .no-touch .page_special__sidebar_menu__link:hover { color: #000000; } /* ========================================================================== END Main content - Special ========================================================================== */ /* ========================================================================== Main content - Rating page ========================================================================== */ .page_rating__table { width: 100%; float: left; margin: 20px 0; border-bottom: 1px solid #cbcbcb; } .page_rating__table__head { display: none; } .page_rating__table__head { display: table; width: 100%; float: left; border-top: 1px solid #cbcbcb; } .page_rating__table__head .page_rating__table__cell { font-size: 11px; line-height: 14px; font-weight: 500; color: #606060; padding-top: 3px; padding-bottom: 3px; vertical-align: middle; } .page_rating__table__body { width: 100%; float: left; } .page_rating__table__item { width: 100%; float: left; border-top: 1px solid #cbcbcb; } .page_rating__table__item__head { width: 100%; float: left; display: table; padding: 10px 0; cursor: pointer; } .page_rating__table__item__head:focus { outline: none; } .page_rating__table__cell-number { width: 20px; text-align: center; font-size: 15px; line-height: 18px; font-weight: 700; color: #000000; display: table-cell; vertical-align: middle; } .page_rating__table__cell-body { color: #000000; display: table-cell; vertical-align: middle; padding: 0 5px 0 10px; } .page_rating__table__head .page_rating__table__cell-body { text-align: center; } .page_rating__table__item__head__image { width: 30px; overflow: hidden; float: left; display: none; } .page_rating__table__item__head__image img { max-width: 30px; display: block; } .page_rating__table__item__head__title { font-size: 13px; font-weight: 500; line-height: 18px; color: #000000; margin-left: 0; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .page_rating__table__item__head__more { font-size: 11px; line-height: 16px; margin-top: 5px; text-transform: uppercase; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .page_rating__table__item__head.ui-state-active .page_rating__table__item__head__more, .page_rating__table__item__head:active .page_rating__table__item__head__more, .no-touch .page_rating__table__item__head:hover .page_rating__table__item__head__more { color: #00AFCA; text-decoration: none; } .page_rating__table__cell-rating { color: #000000; display: table-cell; vertical-align: middle; width: 50px; font-size: 15px; line-height: 18px; font-weight: 700; text-align: right; } .page_rating__table__item__content { display: none; width: 100%; float: left; padding: 10px 0 20px 0; font-size: 13px; line-height: 18px; } .rating_toggle .rating_toggle_content { display: none; width: 100%; float: left; } .rating_toggle.opened .rating_toggle_content { display: block; } .rating_toggle_link { margin: 20px 0; display: table; font-weight: 700; cursor: pointer; } .page_rating .table_container { width: 100%; float: left; display: block; } .page_rating .table_container .fa-caret-up { color: #00AFCA; } .page_rating .table_container .fa-caret-down { color: #f65b5b; } .page_rating__table__item__plus { color: #00AFCA; font-size: 40px; } .page_rating__table__item__minus { color: #f65b5b; font-size: 40px; } .page_rating__years { width: 100%; float: left; display: table; margin-bottom: 10px; } .page_rating__years__prev { width: 80px; display: table-cell; color: #a0a0a0; font-size: 20px; line-height: 24px; font-weight: 700; } .page_rating__years__current { display: table-cell; text-align: center; color: #303030; font-size: 20px; line-height: 24px; font-weight: 700; } .page_rating__years__next { width: 80px; display: table-cell; text-align: right; color: #a0a0a0; font-size: 20px; line-height: 24px; font-weight: 700; } .page_rating__years__prev span, .page_rating__years__next span { display: inline-block; vertical-align: middle; margin: 0 10px; } .page_rating__years__prev i, .page_rating__years__next i { color: 18px; display: inline-block; vertical-align: middle; } @media only screen and (min-width: 768px) { .page_rating__table__cell { display: table-cell; vertical-align: middle; } .page_rating__table__head { display: table; width: 100%; float: left; border-top: 1px solid #cbcbcb; } .page_rating__table__item__head__more { font-size: 13px; line-height: 18px; margin-top: 5px; text-transform: uppercase; } .page_rating__table__head .page_rating__table__cell { font-size: 13px; line-height: 20px; font-weight: 500; color: #606060; padding-top: 5px; padding-bottom: 5px; } .page_rating__table__item__head { padding: 20px 0; width: 100%; display: table; } .page_rating__table__cell-number { width: 60px; padding-left: 10px; font-size: 24px; } .page_rating__table__cell-rating { width: 130px; padding-right: 10px; font-size: 24px; } .page_rating__table__item__head__image { width: 200px; float: none; padding: 0; display: table-cell; vertical-align: middle; } .page_rating__table__item__head__image img { max-width: 200px; } .page_rating__table__item__head__title { font-size: 18px; line-height: 24px; padding-left: 10px; margin-left: 0; padding-left: 0; display: table-cell; vertical-align: middle; } .page_rating__table__item__content { padding-left: 60px; padding-right: 130px; padding-top: 0; padding-bottom: 30px; } } @media only screen and (min-width: 992px) { .page_rating__table__item__head__image { width: 160px; } .page_rating__table__item__head__image img { max-width: 160px; } .page_rating__table__item__head__title { font-size: 16px; line-height: 22px; } } @media only screen and (min-width: 1500px) { .page_rating__table__item__head__image { width: 200px; } .page_rating__table__item__head__image img { max-width: 200px; } .page_rating__table__item__head__title { font-size: 18px; line-height: 24px; } } /* ========================================================================== END Main content - Rating page ========================================================================== */ /* ========================================================================== Main content - Cards page ========================================================================== */ @media only screen and (min-width: 768px) and (max-width: 991px) { .page_cards .pagecontent { padding: 0 130px; } } /* ========================================================================== END Main content - Cards page ========================================================================== */ /* ========================================================================== Main content - Card page ========================================================================== */ .page_card__head { text-align: center; width: 100%; flex: left; } .page_card__head_inner { margin-left: -15px; margin-right: -15px; padding: 20px 15px; background: #27363b; color: #ffffff; } .page_card__head__image { width: 100%; height: 100px; float: left; margin: 0 0 10px 0; } .page_card__head__cardscount { font-size: 13px; line-height: 20px; } .page_card__head__title { font-size: 16px; line-height: 24px; color: #ffffff; margin: 5px 0; font-weight: 500; } .page_card__head__info { width: 100%; } .page_card__head__comments, .page_card__head__views, .page_card__head__date { display: inline-block; font-size: 13px; line-height: 20px; } .page_card__head__comments { margin-left: 10px; } .page_card__head__views { margin-left: 10px; } .page_card__head__comments i, .page_card__head__views i { margin-right: 5px; } .page_card__block { width: 100%; float: left; padding: 15px 15px; border: 1px solid #dfdfdf; background: #ffffff; box-shadow: 0 1px 3px rgba(0,0,0,.1); margin-top: 20px; } .page_card__block:first-child { margin-top: 0; } .page_card__block__number { text-align: center; width: 100%; float: left; color: #6bc053; font-size: 24px; line-height: 32px; margin-bottom: 5px; font-weight: 500; } .page_card__block__title { text-align: center; width: 100%; float: left; color: #000000; font-size: 16px; line-height: 22px; margin-bottom: 15px; font-weight: 500; } .page_card__block__content { font-size: 15px; line-height: 25px; } .page_card__block .page_image img { width: calc( 100% + 30px ); margin-left: -15px; } .page_card__block .page_image__info { padding: 0 15px; width: 100%; float: left; margin-top: 5px; } .page_card__sidebar_menu { width: 100%; display: block; float: left; padding: 20px 10px 20px 30px; border: 1px solid #dfdfdf; margin: 30px 0 0 0; top: 0; } .page_card__sidebar_menu li:after, .page_card__sidebar_menu li:before { display: none; } .page_card__sidebar_menu li { color: #00AFCA; width: 100%; float: left; display: list-item; padding: 0 0 0 5px; font-weight: 500; } .page_card__sidebar_menu__item { font-size: 14px; line-height: 20px; display: block; color: #000000; text-decoration: none; } .page_card__sidebar_menu__item:active, .no-touch .page_card__sidebar_menu__item:hover { text-decoration: none; } @media only screen and (min-width: 768px) { .page_card .page_banner_block { width: 100%; margin: 20px 0; } .page_card__head_inner { margin-left: 0; margin-right: 0; padding: 40px 60px; } .page_card__head__image { height: 150px; margin-bottom: 20px; } .page_card__head__cardscount { font-size: 15px; line-height: 24px; } .page_card__head__title { font-size: 24px; line-height: 32px; } .page_card__head__comments, .page_card__head__views, .page_card__head__date { font-size: 15px; line-height: 24px; } .page_card__body{ margin: 0; } } @media only screen and (min-width: 992px) { .page_card__head_inner { padding: 60px 80px 40px 80px; } .page_card__head__image { height: 150px; margin-bottom: 30px; } .page_card__head__title { font-size: 28px; line-height: 34px; } .page_card__block{ margin-top: 30px; } .page_card__body { margin-top: 30px; } } /* ========================================================================== END Main content - Card page ========================================================================== */ /* ========================================================================== Main content - Search page ========================================================================== */ .page_search__desc { width: 100%; float: left; font-size: 14px; line-height: 20px; color: #5f5f5f; margin-bottom: 20px; } .page_search__result { width: 100%; float: left; } .page_search__result .blocktitle { display: block; /*margin-top: 50px;*/ float: left; width: 100%; margin-bottom: 10px; } .page_search__result .blocktitle:first-child { margin-top: 0; } .page_search__result .blockmore { margin-top: 30px; width: 100%; float: left; } .page_search__search { width: 100%; float: left; margin-bottom: 20px; } .page_search__result__form { background: #ffffff; width: 100%; float: left; height: 40px; border: 1px solid #dfdfdf; box-shadow: 0 1px 3px rgba(0,0,0,.1); } .page_search__search .header__search__options__block label{ font-size: 13px; } .page_search__search .form-group { margin-right: 10px; margin-top: 10px; margin-left: 0; } .page_search__search .iradio>i { margin-top: 2px; } .page_search__search .icheckbox>i { margin-top: 2px; } .page_search__result__inputbox { font-size: 16px; line-height: 40px; border: none; background: none; padding: 0 10px; float: left; display: block; width: calc( 100% - 60px ); } .page_search__result__inputbox:focus { outline: none; } .page_search__result__btn { display: block; float: left; background: none; border: none; cursor: pointer; width: 40px; height: 40px; line-height: 40px; margin: 0; padding: 0; font-size: 20px; text-align: center; color: #333333; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .page_companies__search__btn:active, .no-touch .page_search__result__btn:hover { color: #00AFCA; } /* ========================================================================== END Main content - Search page ========================================================================== */ /* ========================================================================== Main content - Agrodebate page ========================================================================== */ .page_agrodebate__comments_main { width: 100%; float: left; margin-top: 20px; } .page_agrodebate__comment_main { position: relative; width: 100%; float: left; margin-top: 30px; } .page_agrodebate__comment_main-like { padding-left: 20px; } .page_agrodebate__comment_main-dislike { padding-right: 20px; } .page_agrodebate__comment_main:first-child { margin-top: 0; } .page_agrodebate__comment_main_inner { width: 100%; float: left; background: #ffffff; box-shadow: 0 2px 15px rgba(0,0,0,.2); padding: 20px 15px; border-top: 5px solid transparent; position: relative; } .page_agrodebate__comment_main_inner:after, .page_agrodebate__comment_main_inner:before { content: ''; display: block; position: absolute; bottom: 30px; width: 0; height: 0; } .page_agrodebate__comment_main-like .page_agrodebate__comment_main_inner:after, .page_agrodebate__comment_main-like .page_agrodebate__comment_main_inner:before { left: -20px; border-top: 20px solid transparent; border-right: 20px solid #ffffff; border-bottom: 20px solid transparent; } .page_agrodebate__comment_main-like .page_agrodebate__comment_main_inner:before { left: -22px; border-right-color: #ebebeb; } .page_agrodebate__comment_main-dislike .page_agrodebate__comment_main_inner:after, .page_agrodebate__comment_main-dislike .page_agrodebate__comment_main_inner:before { right: -20px; border-top: 20px solid transparent; border-left: 20px solid #ffffff; border-bottom: 20px solid transparent; } .page_agrodebate__comment_main-dislike .page_agrodebate__comment_main_inner:before { right: -22px; border-left-color: #ebebeb; } .page_agrodebate__comment_main-like .page_agrodebate__comment_main_inner { border-color: #00AFCA; } .page_agrodebate__comment_main-dislike .page_agrodebate__comment_main_inner { border-color: #ff5151; } .page_agrodebate__comment_main__author { width: 100%; float: left; margin-bottom: 20px; display: table; } .page_agrodebate__comment_main__author__image_cell { display: table-cell; vertical-align: top; } .page_agrodebate__comment_main__author__image { border-radius: 100%; width: 50px; height: 50px; overflow: hidden; } .page_agrodebate__comment_main__author__content_cell { display: table-cell; vertical-align: middle; padding-left: 15px; } .page_agrodebate__comment_main__author__name { font-size: 16px; line-height: 20px; color: #333333; } .page_agrodebate__comment_main__author__post { font-size: 14px; line-height: 18px; color: #5f5f5f; margin-top: 4px; } .page_agrodebate__forms { width: 100%; float: left; margin-top: 30px; } .page_agrodebate__buttons { width: 100%; float: left; text-align: center; } .page_agrodebate__buttons__title { font-size: 15px; text-align: center; margin-bottom: 20px; } .page_agrodebate__btn { display: inline-block; width: 130px; border-radius: 5px; height: 38px; border: 2px solid #cacaca; color: #333333; line-height: 34px; font-size: 18px; font-weight: 500; text-align: center; position: relative; margin: 0 5px; cursor: pointer; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .page_agrodebate__btn-like { border-color: #00AFCA; } .page_agrodebate__btn-like:active, .no-touch .page_agrodebate__btn-like:hover { color: #00AFCA; } .page_agrodebate__btn-like.active, .page_agrodebate__btn-like.active:active, .no-touch .page_agrodebate__btn-like.active:hover { background: #00AFCA; color: #ffffff; } .page_agrodebate__btn-dislike { border-color: #ff5151; } .page_agrodebate__btn-dislike:active, .no-touch .page_agrodebate__btn-dislike:hover { color: #ff5151; } .page_agrodebate__btn-dislike.active, .page_agrodebate__btn-dislike.active:active, .no-touch .page_agrodebate__btn-dislike.active:hover { background: #ff5151; color: #ffffff; } .page_agrodebate__btn i { position: absolute; left: 10px; top: 0; line-height: 34px; } .page_agrodebate__btn__submit { display: none; } .page_agrodebate__buttons__bottom { margin-top: 10px; } .page_agrodebate__btn-comment { font-size: 14px; width: 274px; margin: 0; } .page_agrodebate__form { padding: 0; width: 100%; float: left; margin: 20px 0; padding: 20px 0 0 0; border-top: 1px solid #cacaca; border-bottom: 1px solid #cacaca; display: none; } .page_agrodebate__form_inner { margin: auto; width: 100%; max-width: 600px; } .page_agrodebate__form__top { text-align: center; width: 100%; float: left; margin-bottom: 20px; } .page_agrodebate__form__comment_type { display: inline-block; width: 130px; margin: 0 5px; background: none; color: #333333; line-height: 38px; border-radius: 5px; height: 38px; font-size: 14px; font-weight: 500; text-align: center; cursor: pointer; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .page_agrodebate__form__comment_type input { position: absolute; left: -99999px; } .page_agrodebate__form__comment_type i { margin-right: 5px; font-size: 20px; } .page_agrodebate__form__comment_type-like { color: #00AFCA; } .page_agrodebate__form__comment_type-like.active { color: #ffffff; background: #00AFCA; } .page_agrodebate__form__comment_type-dislike { color: #ff5151; } .page_agrodebate__form__comment_type-dislike.active { color: #ffffff; background: #ff5151; } .page_agrodebate__form__block { width: 100%; float: left; margin-bottom: 20px; } .page_agrodebate__form__inputbox { width: 100%; float: left; border-radius: 5px; border: 2px solid #cfcfcf; font-size: 14px; height: 38px; line-height: 38px; } .page_agrodebate__form__textbox { border: 2px solid #cfcfcf; border-radius: 5px; font-size: 14px; line-height: 20px; width: 100%; height: 100px; float: left; } .page_agrodebate__form__textbox::-webkit-input-placeholder, .page_agrodebate__form__inputbox::-webkit-input-placeholder { color: #ababab; font-style: normal } .page_agrodebate__form__textbox::-moz-placeholder, .page_agrodebate__form__inputbox::-moz-placeholder { color: #ababab; font-style: normal } .page_agrodebate__form__textbox:-moz-placeholder, .page_agrodebate__form__inputbox:-moz-placeholder { color: #ababab; font-style: normal } .page_agrodebate__form__textbox:-ms-input-placeholder, .page_agrodebate__form__inputbox:-ms-input-placeholder { color: #ababab; font-style: normal } .page_agrodebate__form__inputbox.error, .page_agrodebate__form__textbox.error { border-color: #ff5151; } .page_agrodebate__form__inputbox:focus, .page_agrodebate__form__textbox:focus { outline: none; border-color: #cfcfcf; } .page_agrodebate__form__block__validate_text { display: none; font-size: 12px; color: #ff5151; width: 100%; float: left; } .page_agrodebate__form__bottom { width: 100%; float: left; padding-bottom: 20px; text-align: center; } .page_agrodebate__form__captcha { display: block; margin: auto; } .page_agrodebate__form__btn { display: inline-block; width: 140px; margin: 20px 10px 0 10px; border-radius: 5px; height: 38px; border: 2px solid #cacaca; background: none; color: #333333; line-height: 34px; font-size: 14px; font-weight: 500; text-align: center; } .page_agrodebate__form__btn-reset:active, .no-touch .page_agrodebate__form__btn-reset:hover { border-color: #ff5151; } .page_agrodebate__form__btn-submit:focus, .page_agrodebate__form__btn-reset:focus { outline: none; } .page_agrodebate__comments { width: 100%; float: left; margin-bottom: 20px; } .page_agrodebate__comment { width: 100%; float: left; margin-top: 20px; padding-top: 30px; border-top: 1px solid #cacaca; } .page_agrodebate__comment:first-child { margin-top: 0; border: none; } .page_agrodebate__comment__head { width: 100%; float: left; } .page_agrodebate__comment__head__evaluation { width: 34px; height: 34px; float: left; text-align: center; line-height: 34px; color: #ffffff; border-radius: 5px; font-size: 18px; } .page_agrodebate__comment__head__evaluation-like { background: #00AFCA; } .page_agrodebate__comment__head__evaluation-dislike { background: #ff5151; } .page_agrodebate__comment__head__info { margin-left: 45px; } .page_agrodebate__comment__head__author { font-size: 15px; line-height: 18px; color: #333333; } .page_agrodebate__comment__head__date { font-size: 11px; line-height: 16px; color: #5f5f5f; } .page_agrodebate__comment__content { padding: 20px 0; width: 100%; float: left; } .page_agrodebate__comment__bottom { width: 100%; float: left; } .page_agrodebate__comment__btn { font-size: 15px; color: #9f9f9f; text-decoration: none; margin-right: 15px; font-weight: 500; } .page_agrodebate__comment__btn i { margin-right: 6px; font-size: 18px; } .page_agrodebate__comment__btn-like.active, .page_agrodebate__comment__btn-like:active, .no-touch .page_agrodebate__comment__btn-like:hover { text-decoration: none; color: #00AFCA; } .page_agrodebate__comment__btn-dislike.active, .page_agrodebate__comment__btn-dislike:active, .no-touch .page_agrodebate__comment__btn-dislike:hover { text-decoration: none; color: #ff5151; } @media only screen and (min-width: 768px) { .page_agrodebate__comment_main-like { padding-right: 40px; } .page_agrodebate__comment_main-dislike { padding-left: 40px; } .page_agrodebate__form__bottom { text-align: right; } .page_agrodebate__form__captcha { float: left; width: 300px; } .page_agrodebate__form__btn { margin: 18px 0 0 0; } .page_agrodebate__form__btn-submit { margin-right: 5px; } } @media only screen and (min-width: 992px) { .page_agrodebate__comment_main-like { padding-right: 0; } .page_agrodebate__comment_main-dislike { padding-left: 0; } } @media only screen and (min-width: 1500px) { .page_agrodebate__comment_main-like { padding-right: 70px; } .page_agrodebate__comment_main-dislike { padding-left: 70px; } } /* ========================================================================== END Main content - Agrodebate page ========================================================================== */ /* ========================================================================== Main content - Media ========================================================================== */ #page_media__last { margin-top: 20px; } /* ========================================================================== END Main content - Media ========================================================================== */ /* ========================================================================== Main content - Article ========================================================================== */ .page_article .sidebar_infobook { margin-top: 30px; } .page_article .pagecontent article a { /*color: #00AFCA;*/ } /* ========================================================================== END Main content - Article ========================================================================== */ /* ========================================================================== Article sides block ========================================================================== */ .sides_article { width: 100%; float: left; border-top: 2px solid #ebebeb; border-bottom: 2px solid #ebebeb; margin-top: 20px; } .sides_article__item { color: #606060; text-decoration: none; font-weight: 500; width: 100%; float: left; display: block; padding: 10px 15px; } .sides_article__item:first-child { margin-top: 0; } .sides_article__nav { float: left; width: 100%; color: #606060; margin-bottom: 5px; font-weight: 400; } .sides_article__item-next .sides_article__nav { text-align: right; } .sides_article__item-prev { border-bottom: 2px solid #ebebeb; } .sides_article__item-prev .sides_article__nav i { margin-right: 10px; } .sides_article__item-next .sides_article__nav i { margin-left: 10px; } .sides_article__title { font-size: 15px; line-height: 18px; color: #000000; font-weight: 500; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .sides_article__item-next .sides_article__title { text-align: right; } .sides_article__item:active .sides_article__title, .no-touch .sides_article__item:hover .sides_article__title { color: #00AFCA; text-decoration: underline; } @media only screen and (min-width: 768px) { .sides_article { display: table; padding: 10px 0; } .sides_article__item { display: table-cell; float: none; width: 50%; padding: 0 15px; border: none; vertical-align: top; } .sides_article__item-prev { padding-right: 5px; border-right: 1px solid #ebebeb; } .sides_article__item-next { padding-left: 5px; } } @media only screen and (min-width: 992px) { .sides_article__item-prev { padding-left: 20px; } .sides_article__item-next { padding-right: 20px; } } @media only screen and (min-width: 1500px) { .sides_article__item-prev { padding-left: 30px; } .sides_article__item-next { padding-right: 30px; } } /* ========================================================================== END Article sides block ========================================================================== */ /* ========================================================================== Main content - Media Interactive ========================================================================== */ .page_interactives .material_item-single { margin-top: 20px !important; } /* ========================================================================== END Main content - Media ========================================================================== */ /* ========================================================================== Category menu block ========================================================================== */ .category_menu { margin-top: 0; margin-bottom: 0; padding: 0; width: 100%; float: left; background: #ebebeb; overflow: hidden; position: relative; } .category_menu__title { text-align: center; width: 100%; float: left; margin: 10px 0 5px 0; font-weight: 500; font-size: 16px; line-height: 24px; white-space: nowrap; text-transform: uppercase; } .category_menu_carousel { padding: 0 40px; width: 100%; float: left; height: 30px; } .category_menu_carousel.disabled .owl-item:last-child { margin-right: 0 !important; } .category_menu_carousel.disabled .owl-stage-outer { padding: 0; float: none; display: table; overflow: hidden; /*width: auto;*/ margin: auto; } .category_menu_carousel.disabled .owl-stage { width: auto !important; } .category_menu_carousel.disabled .owl-nav { display: none !important; } .category_menu__item { font-size: 14px; line-height: 30px; height: 30px; white-space: nowrap; display: block; float: left; padding: 0 10px; color: #606060; position: relative; text-decoration: none; } .category_menu__item:active, .no-touch .category_menu__item:hover { text-decoration: none; color: #606060; background: #e1e1e1; } .category_menu__item.current, .category_menu__item.current:active, .no-touch .category_menu__item.current:hover { background: #00AFCA; color: #ffffff; } @media only screen and (min-width: 768px) { .category_menu { padding: 0; } .category_menu_carousel { width: 100%; float: left; } .category_menu.disabled { text-align: center; } .category_menu.disabled .category_menu_carousel { display: table; margin: auto; width: auto; float: none; } .category_menu__title { float: left; text-align: left; width: auto; padding-left: 20px; padding-right: 10px; height: 30px; line-height: 30px; margin: 0; } } /* ========================================================================== END Category menu block ========================================================================== */ /* ========================================================================== Category menu big block ========================================================================== */ .category_menu_big { width: 100%; float: left; padding: 20px 15px; } .category_menu_big__list { width: 100%; float: left; } .category_menu_big__item { margin-right: 10px; width: calc( 50% - 5px ); display: block; float: left; border: 1px solid #dfdfdf; height: 60px; margin-top: 10px; box-shadow: 0 1px 2px rgba(0,0,0,.1); text-decoration: none; color: #000000; position: relative; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .category_menu_big__item:active, .no-touch .category_menu_big__item:hover { text-decoration: none; } .category_menu_big__item:nth-child(2n) { margin-right: 0; } .category_menu_big__item:nth-child(1), .category_menu_big__item:nth-child(2) { margin-top: 0; } .category_menu_big__item__image { height: 60px; width: 60px; float: left; display: none; } .category_menu_big__item__title { margin-left: 50px; padding: 0 10px 0 0px; line-height: 18px; font-size: 14px; font-weight: 700; } .category_menu_big__item__icon { position: absolute; left: 0; top: 5px; height: 50px; width: 50px; line-height: 50px; text-align: center; font-size: 22px; color: #00AFCA; } @media only screen and (min-width: 768px) { .category_menu_big__item { width: calc( 25% - 10px ); margin-right: 13px; } .category_menu_big__item:nth-child(1), .category_menu_big__item:nth-child(2), .category_menu_big__item:nth-child(3), .category_menu_big__item:nth-child(4) { margin-top: 0; } .category_menu_big__item:nth-child(2n) { margin-right: 13px; } .category_menu_big__item:nth-child(4n) { margin-right: 0; } .category_menu_big__item__title { padding: 0; font-size: 15px; margin-left: 60px; } .category_menu_big__item__icon { width: 60px; height: 60px; line-height: 60px; font-size: 26px; top: 0; } } @media only screen and (min-width: 992px) { .category_menu_big__item { height: 62px; line-height: 62px; } .category_menu_big__item__image { display: block; position: absolute; left: 0; top: 0; } .category_menu_big__item__title { padding: 0 50px 0 10px; font-size: 16px; line-height: 19px; } .category_menu_big__item__icon { left: auto; right: 0; width: 50px; } } @media only screen and (min-width: 1500px) { .category_menu_big__item { width: calc( 25% - 15px ); margin-right: 20px; height: 72px; line-height: 72px; } .category_menu_big__item:nth-child(2n) { margin-right: 20px; } .category_menu_big__item:nth-child(4n) { margin-right: 0; } .category_menu_big__item__image { display: block; width: 70px; height: 70px; } .category_menu_big__item__title { padding-left: 20px; margin-left: 70px; font-size: 20px; line-height: 22px; } .category_menu_big__item__icon { left: auto; right: 0; width: 70px; line-height: 70px; } } /* ========================================================================== END Category menu big block ========================================================================== */ /* ========================================================================== MINIGALLERY ========================================================================== */ .article_page__triple_gallery { width: 100%; float: left; margin: 20px 0; position: relative; z-index: 10; } .article_page__triple_gallery__item { display: block; float: left; width: 100%; margin-top: 10px; } .article_page__triple_gallery__item:first-child { margin-top: 0; } .article_page__triple_gallery__item a { display: block; float: left; width: 100%; padding-bottom: 56.25%; overflow: hidden; } @media only screen and (min-width: 768px) { .article_page__triple_gallery__item { width: 33.333333%; padding-left: 10px; padding-right: 10px; } .article_page__triple_gallery__item:nth-child(4n), .article_page__triple_gallery__item:first-child { padding-left: 0; } .article_page__triple_gallery__item:nth-child(3), .article_page__triple_gallery__item:nth-child(2), .article_page__triple_gallery__item:nth-child(1) { margin-top: 0; } .article_page__triple_gallery__item:nth-child(3n) { padding-right: 0; } .article_page__triple_gallery__item:nth-child(2), .article_page__triple_gallery__item:nth-child(5n) { padding-left: 5px; padding-right: 5px; } } /* ========================================================================== END MINIGALLERY ========================================================================== */ /* ========================================================================== Map block ========================================================================== */ .googlemap { float: left; display: block; padding-top: 66.86%; width: 100%; display: block; position: relative; margin: 0; } .googlemap>div { top: 0; left: 0; } @media only screen and (min-width: 768px) { .googlemap { margin: 0; } } /* ========================================================================== END Map block ========================================================================== */ /* ========================================================================== Slide up button ========================================================================== */ .slide_up { z-index: 500; position: fixed; bottom: -50px; right: 15px; width: 42px; height: 42px; background: #00AFCA; color: #ffffff; opacity: 0.7; line-height: 42px; text-align: center; font-stretch: 24px; text-decoration: none; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } .slide_up:active, .no-touch .slide_up:hover { color: #ffffff; background: #00AFCA; opacity: 1; text-decoration: none; } .slide_up.active { bottom: 15px; } @media only screen and (min-width: 768px) { .slide_up { left: 50%; right: auto; margin-left: 315px; } } @media only screen and (min-width: 992px) { .slide_up { margin-left: 420px; } } @media only screen and (min-width: 1500px) { .slide_up { margin-left: 510px; } } /* ========================================================================== END Slide up button ========================================================================== */ /* ========================================================================== Footer ========================================================================== */ .footer_stick { width: 100%; float: left; position: relative; z-index: -1; } .footer .container { position: relative; z-index: 100; background: #333333; padding-top: 20px; padding-bottom: 40px; color: #fefefe; } .footer { position: relative; } .footer a { color: #fefefe; text-decoration: underline; } .footer a:active, .no-touch .footer a:hover { color: #00AFCA; text-decoration: none; } .footer h3 { color: #b3b3b3; font-size: 18px; font-weight: 500; line-height: 22px; margin: 20px 0 10px 0; } .footer__top__left { width: 100%; float: left; } .footer__top__right { width: 100%; float: left; } .footer .footer__menu__item { display: table; font-size: 15px; line-height: 20px; color: #fefefe; text-decoration: none; margin-top: 10px; } .footer .footer__menu__item:active, .no-touch .footer .footer__menu__item:hover { text-decoration: none; color: #00AFCA; } .footer__title { color: #b3b3b3; font-size: 16px; font-weight: 500; line-height: 22px; margin: 20px 0 10px; text-transform: uppercase; } .footer__social { width: 100%; float: left; } .footer__social__list { float: left; width: 100%; margin-top: 10px; } .footer__social__item { display: inline-block; width: 32px; height: 32px; background-size: contain; background-position: center; background-repeat: no-repeat; margin-right: 6px; } .footer__social__item-fb { background-image: url('../img/social-fb.svg'); } .footer__social__item-fb:active, .no-touch .footer__social__item-fb:hover { background-image: url('../img/social-fb-hover.svg'); } .footer__social__item-tw { background-image: url('../img/social-tw.svg'); } .footer__social__item-tw:active, .no-touch .footer__social__item-tw:hover { background-image: url('../img/social-tw-hover.svg'); } .footer__social__item-rss { background-image: url('../img/social-rss.svg'); } .footer__social__item-rss:active, .no-touch .footer__social__item-rss:hover { background-image: url('../img/social-rss-hover.svg'); } .footer__social__item-yt { background-image: url('../img/social-yt.svg'); } .footer__social__item-yt:active, .no-touch .footer__social__item-yt:hover { background-image: url('../img/social-yt-hover.svg'); } .footer__social__item-pin { background-image: url('../img/social-pin.svg'); } .footer__social__item-pin:active, .no-touch .footer__social__item-pin:hover { background-image: url('../img/social-pin-hover.svg'); } .footer__social__item-in { background-image: url('../img/social-in.svg'); } .footer__social__item-in:active, .no-touch .footer__social__item-in:hover { background-image: url('../img/social-in-hover.svg'); } .footer__social__item-tg { background-image: url('../img/social-tg.svg'); } .footer__social__item-tg:active, .no-touch .footer__social__item-tg:hover { background-image: url('../img/social-tg-hover.svg'); } .footer__subscribe { float: left; width: 100%; } .footer__subscribe__form { background: #ffffff; width: 100%; padding: 10px; text-align: center; margin-top: 10px; float: left; } .footer__subscribe__form__inputbox { width: 100%; float: left; font-size: 18px; line-height: 20px; height: 20px; color: #000000; border: none; background: none; text-align: center; } .footer__subscribe__form__inputbox:focus { outline: none; } .footer__subscribe__form__inputbox::-webkit-input-placeholder { color: #ababab; } .footer__subscribe__form__inputbox::-moz-placeholder { color: #ababab; } .footer__subscribe__form__inputbox:-moz-placeholder { color: #ababab; } .footer__subscribe__form__inputbox:-ms-input-placeholder { color: #ababab; } .footer__subscribe__form__inputbox:disabled::-webkit-input-placeholder { color: #cccccc; } .footer__subscribe__form__inputbox:disabled::-moz-placeholder { color: #cccccc; } .footer__subscribe__form__inputbox:disabled:-moz-placeholder { color: #cccccc; } .footer__subscribe__form__inputbox:disabled:-ms-input-placeholder { color: #cccccc; } a.footer__subscribe__btn { border-radius: 5px; border: 2px solid #ababab; display: inline-block; height: 40px; padding: 0 10px; width: auto; font-size: 13px; text-transform: uppercase; font-weight: 500; line-height: 38px; color: #000000; text-decoration: none; background: #ffffff; margin-top: 20px; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; transition: all 0.1s linear; } a.footer__subscribe__btn:active, .no-touch a.footer__subscribe__btn:hover { border-color: #00AFCA; color: #000000; text-decoration: none; } .footer__bottom { font-size: 14px; line-height: 20px; color: #fefefe; } .footer__copyright { margin-top: 20px; } .footer__developer { padding-right: 60px; margin-top: 10px; } @media only screen and (min-width: 768px) { .footer__menu__block { width: 50%; padding-right: 20px; float: left; } .footer__social { width: 50%; padding-right: 20px; } .footer__subscribe { width: 50%; float: none; margin-left: 50%; } .footer__subscribe__form__inputbox { float: left; width: 200px; height: 30px; line-height: 30px; text-align: left; } .footer__subscribe__form__btn { float: right; width: 120px; padding: 0; margin: 0; } .footer__bottom { margin-top: 20px; width: 100%; float: left; } .footer__copyright { margin: 0; float: left; width: 50%; } .footer__developer { margin: 0 0 0 50%; width: 50%; float: none; text-align: right; } } @media only screen and (min-width: 992px) { /* .footer { width: 960px; }*/ .footer__top__left { width: 560px; float: left; } .footer__top__right { width: 340px; float: right; } .footer__social { width: 100%; } .footer__subscribe { width: 100%; float: left; margin: 0; } .footer__subscribe h3 { font-size: 14px; margin: 10px 0 0 0; } .footer__subscribe__form__inputbox { width: 170px; } .footer__bottom { margin-top: 30px; } } @media only screen and (min-width: 1500px) { /* .footer { width: 1170px; }*/ .footer__top__left { width: 700px; } .footer__top__right { width: 340px; } .footer__subscribe__form__inputbox { width: 250px; } } /* ========================================================================== END Footer ========================================================================== */ /* ========================================================================== Page 404 ========================================================================== */ body.page404 #wrapper_inner { background: url('../img/page404.jpg') center no-repeat; background-size: cover; } body.page404 .pagecontent { height: 360px; position: relative; } .page_404__head { position: absolute; left: 20px; top: 80px; width: 150px; height: 120px; background: url('../img/page404_head.png') center no-repeat; background-size: contain; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } .page_404__desc { position: absolute; top: 240px; left: 20px; color: #ffffff; font-size: 12px; font-weight: 700; text-shadow: 1px 1px 5px rgba(0,0,0,.2); -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } a.page_404__btn { display: block; position: absolute; top: 300px; left: 20px; border-radius: 5px; height: 40px; width: 270px; color: #ffffff; font-size: 27px; line-height: 40px; font-weight: 700; text-decoration: none; text-align: center; background: rgba(105,190,81,1); background: -moz-linear-gradient(top, rgba(105,190,81,1) 0%, rgba(85,155,66,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(105,190,81,1)), color-stop(100%, rgba(85,155,66,1))); background: -webkit-linear-gradient(top, rgba(105,190,81,1) 0%, rgba(85,155,66,1) 100%); background: -o-linear-gradient(top, rgba(105,190,81,1) 0%, rgba(85,155,66,1) 100%); background: -ms-linear-gradient(top, rgba(105,190,81,1) 0%, rgba(85,155,66,1) 100%); background: linear-gradient(to bottom, rgba(105,190,81,1) 0%, rgba(85,155,66,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#69be51', endColorstr='#559b42', GradientType=0 ); box-shadow: 0 10px 10px rgba(0,0,0,.3); text-transform: uppercase; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; } a.page_404__btn:active, a.page_404__btn:hover { text-decoration: none; color: #ffffff; border: none; } a.page_404__btn i { margin-left: 10px; } @media only screen and (min-width: 768px) { body.page404 .pagecontent { height: 660px; } .page_404__head { left: 30px; width: 310px; height: 260px; top: 110px; } a.page_404__btn { top: 400px; left: 30px; width: 310px; height: 60px; font-size: 33px; line-height: 60px; } .page_404__desc { top: 580px; left: 420px; font-size: 18px; } } @media only screen and (min-width: 992px) { .page_404__head { left: 70px; } a.page_404__btn { left: 70px; } .page_404__desc { left: 550px; } } @media only screen and (min-width: 1500px) { body.page404 .pagecontent { height: 830px; } .page_404__head { left: 120px; top: 200px; width: 360px; height: 300px; } a.page_404__btn { left: 120px; top: 510px; width: 350px; } .page_404__desc { left: 670px; top: 730px; } } /* ========================================================================== END Page 404 ========================================================================== */ /* ========================================================================== Day number block ========================================================================== */ .daynumber_block { margin: 20px 0; } .daynumber_block__carousel { padding: 20px 0; width: 100%; float: left; border-top: 1px solid #b1b1b1; border-bottom: 1px solid #b1b1b1; } .daynumber_block__carousel .owl-nav { display: none; } .daynumber_block__item { width: 100%; float: left; } .daynumber_block__item__title { color: #838383; font-weight: 500; font-size: 18px; margin-bottom: 20px; width: 100%; float: left; } .daynumber_block__item__title span { color: #00AFCA; } .daynumber_block__item__content { width: 100%; float: left; font-size: 16px; } .daynumber_block__item__value { text-align: center; float: left; width: 100%; } .daynumber_block__item__value__number { font-size: 50px; line-height: 54px; font-weight: 700; } .daynumber_block__item__value__number__desc { font-size: 36px; line-height: 40px; font-weight: 700; } .daynumber_block__item__value__desc { width: 100%; float: left; margin: 10px 0; } .daynumber_block__item__desc__text { display: none; } .daynumber_block__item__desc { width: 100%; float: left; } @media only screen and (min-width: 768px) { .daynumber_block__carousel .owl-nav { display: block; } .daynumber_block__carousel .owl-prev { left: -20px; } .daynumber_block__carousel .owl-next { right: -20px; } .daynumber_block__item__content { display: table; } .daynumber_block__item__value { float: none; width: 50%; display: table-cell; vertical-align: middle; padding-right: 10px; } .daynumber_block__item__desc { float: none; width: 50%; display: table-cell; vertical-align: middle; padding-left: 10px; } .daynumber_block__item__desc__text { display: block; width: 100%; float: left; margin-bottom: 10px; } .daynumber_block__item__value__desc { width: 200px; display: table; float: none; margin: 10px auto 0 auto; } .daynumber_block__item__value__number { font-size: 60px; line-height: 64px; } .daynumber_block__item__value__number__desc { font-size: 32px; line-height: 36px; } } @media only screen and (min-width: 992px) { .daynumber_block__carousel .owl-prev { left: -25px; } .daynumber_block__carousel .owl-next { right: -25px; } .daynumber_block__item__value__number { float: none; display: table-cell; width: auto; padding-right: 10px; vertical-align: top; font-size: 65px; line-height: 70px; } .daynumber_block__item__value__content { display: table-cell; width: auto; vertical-align: top; text-align: left; } } @media only screen and (min-width: 1500px) { .daynumber_block__carousel .owl-prev { left: -30px; } .daynumber_block__carousel .owl-next { right: -30px; } } /* ========================================================================== END Day number block ========================================================================== */ /* ========================================================================== Sidebar infobook ========================================================================== */ .sidebar_infobook { border: 1px solid #dfdfdf; width: 100%; float: left; } .sidebar_infobook__head { width: 100%; float: left; height: 74px; background: url('../img/sidebar_infobook.jpg') 0 0 no-repeat; margin-bottom: 30px; background-size: 100% auto; box-shadow: 0 3px 10px rgba(0,0,0,.2); } .sidebar_infobook__form { width: 100%; float: left; } .sidebar_infobook__form__label { position: relative; width: 100%; float: left; padding-bottom: 20px; padding: 0 15px 20px 15px; } .sidebar_infobook__form__label .inputbox { border-radius: 5px; border-width: 2px; width: 100%; } .sidebar_infobook__form__label .inputbox.error { border-color: #ff5151; } .sidebar_infobook__form__label .required_mark { position: absolute; right: 2px; top: 0; color: #9f9f9f; } .sidebar_infobook__form__label .required_tip { width: 100%; float: left; font-size: 12px; color: #ff5151; padding: 2px 0 0 10px; font-weight: 400; } .sidebar_infobook__form__bottom { position: relative; width: 100%; float: left; margin-bottom: 40px; padding: 0 15px; } .sidebar_infobook__form__bottom button { width: 100%; height: 40px; } .sidebar_infobook__form__bottom button i { margin-left: 10px; } /* ========================================================================== END Sidebar infobook ========================================================================== */ /* ========================================================================== Infobook block ========================================================================== */ .infobook_block { width: 100%; float: left; border-top: 1px solid #dfdfdf; border-bottom: 1px solid #dfdfdf; margin: 20px 0; } .infobook_block__head { padding: 15px 0; text-align: center; font-size: 16px; line-height: 22px; } .infobook_block__form { width: 100%; float: left; } .infobook_block__form__label { position: relative; width: 100%; float: left; padding-bottom: 20px; padding: 0 15px 20px 15px; } .infobook_block__form__label .inputbox { border-radius: 5px; border-width: 2px; width: 100%; } .infobook_block__form__label.error .inputbox { border-color: #ff5151; } .infobook_block__form__label .required_mark { position: absolute; right: 2px; top: 0; color: #9f9f9f; } .infobook_block__form__label .required_tip { width: 100%; float: left; font-size: 12px; color: #ff5151; padding: 2px 0 0 10px; font-weight: 400; display: none; } .infobook_block__form__label.error .required_tip { display: block; } .infobook_block__form__bottom { position: relative; width: 100%; float: left; margin-bottom: 40px; padding: 0 15px; } .infobook_block__form__bottom button { width: 100%; height: 40px; } .infobook_block__form__bottom button i { margin-left: 10px; } @media only screen and (min-width: 768px) { .infobook_block__head { font-size: 18px; } .infobook_block__form { width: 580px; margin: auto; float: none; display: table; } .infobook_block__form__label { width: 49%; float: none; display: inline-block; } .infobook_block__form__bottom { text-align: center; margin-bottom: 20px; } .infobook_block__form__bottom button { width: 260px; } } @media only screen and (min-width: 992px) { .infobook_block { display: none; } } /* ========================================================================== END Infobook block ========================================================================== */ /* ========================================================================== Projects page ========================================================================== */ .page-projects { padding-top: 40px; } .page-projects #wrapper { width: 100%; float: left; } .page-projects .header { background: #00AFCA; height: 40px; width: 100%; margin: 0; float: left; left: 0; top: 0; margin: 0; } .page-projects .header__logo { float: right; height: 40px; width: 160px; position: relative; top: 0; left: 0; margin: 0; padding: 0; margin-right: 20px; } .page-projects .header__logo img { width: 100%; display: block; } .page-projects .header__backtosite { display: block; float: left; line-height: 40px; color: #ffffff; text-decoration: none; font-size: 14px; font-weight: 700; padding: 0 20px; } .page-projects .header__backtosite:active, .no-touch .page-projects .header__backtosite:hover { text-decoration: none; color: #ffffff; text-decoration: none; background: rgba(0,0,0,.2); } .page-projects .header__backtosite i { margin-right: 7px; } .page-projects .footer { background: #333333; } .projects { width: 100%; float: left; } .projects__item { position: relative; width: 100%; float: left; margin-bottom: 30px; padding: 10px 10px 30px 10px; color: #ffffff; display: block; text-decoration: none; } .projects__item:active, .no-touch .projects__item:hover { text-decoration: none; color: #ffffff; } .projects__item__bg_container { position: absolute; left: 0; top: 0; width: 100%; height: 100%; z-index: 1; overflow: hidden; } .projects__item__bg:after, .projects__item__bg:before, .projects__item__bg { display: none !important; position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .projects__item__bg:first-child:after, .projects__item__bg:first-child:before, .projects__item__bg:first-child { display: block !important; } .projects-3 .projects__item__bg { -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .projects-3 .projects__item:active .projects__item__bg, .no-touch .projects-3 .projects__item:hover .projects__item__bg { -webkit-transform: scale(1.1); transform: scale(1.1); } .projects__item__content { position: relative; z-index: 10; height: 100%; text-align: center; margin: auto; max-width: 500px; } .projects__item__logo { border-radius: 100%; width: 120px; height: 120px; box-shadow: 0px 10px 25px rgba(0, 0, 0, 0.25); margin: 0 auto 20px auto; } .projects__item__title { font-size: 24px; line-height: 26px; font-weight: 700; margin-bottom: 10px; width: 100%; } .projects__item__subtitle { font-weight: 700; font-size: 15px; line-height: 18px; } .projects__item__desc { font-size: 15px; line-height: 20px; margin-bottom: 20px; } .projects__item__btn { display: inline-block; width: 100%; max-width: 290px; line-height: 52px; height: 50px; font-weight: 700; font-size: 18px; text-transform: uppercase; border-radius: 5px; background: #ffffff; text-decoration: none; color: #666666; margin-bottom: 20px; box-shadow: 0px 10px 25px rgba(0, 0, 0, 0.25); text-align: center; } .projects__item__btn:active, .no-touch .projects__item__btn:hover { text-decoration: none; color: #000000; box-shadow: 0px 12px 35px rgba(0, 0, 0, 0.55); } .projects__item__btn-green { color: #00AFCA; } .projects__item__btn-green:active, .no-touch .projects__item__btn-green:hover { color: #3DB43F; } .projects__item__btn-darkblue { color: #08294B; } .projects__item__btn-darkblue:active, .no-touch .projects__item__btn-darkblue:hover { color: #184B7E; } .projects__item__btn-red { color: #B61820; } .projects__item__btn-red:active, .no-touch .projects__item__btn-red:hover { color: #DB252E; } .projects__item__bg.gradient:before, .projects__item__bg.gradient:after { position: absolute; height: 100%; width: 100%; top: 0; left: 0; display: block; content: ''; z-index: 10; } .projects__item__bg.gradient-pink:before, .projects__item__bg.gradient:before { background: rgba(0,0,0,.2); } .projects-1 .projects__item__bg.gradient:before, .projects__item__bg.gradient-left:before, .projects__item__bg.gradient-right:before { background: none; } .projects__item__bg.gradient-right:after { width: 50%; left: auto; right: 0; } .projects__item__bg.gradient-left:after { width: 50%; left: 0; } .projects__item__bg.gradient-black:after { background: rgba(255,255,255,0); background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,0)), color-stop(100%, rgba(0,0,0,1))); background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%); background: -o-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%); background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%); background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(0,0,0,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#000000', GradientType=0 ); } .projects__item__bg.gradient-black.gradient-right:after { background: rgba(255,255,255,0); background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(0,0,0,0.8) 100%); background: -webkit-gradient(left top, right top, color-stop(0%, rgba(255,255,255,0)), color-stop(100%, rgba(0,0,0,0.8))); background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(0,0,0,0.8) 100%); background: -o-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(0,0,0,0.8) 100%); background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(0,0,0,0.8) 100%); background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(0,0,0,0.8) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#000000', GradientType=1 ); } .projects__item__bg.gradient-green:after { background: rgba(255,255,255,0); background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(21,87,22,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,0)), color-stop(100%, rgba(21,87,22,1))); background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(21,87,22,1) 100%); background: -o-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(21,87,22,1) 100%); background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(21,87,22,1) 100%); background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(21,87,22,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#155716', GradientType=0 ); } .projects__item__bg.gradient-green.gradient-left:after { background: rgba(21,87,22,0.8); background: -moz-linear-gradient(left, rgba(21,87,22,0.8) 0%, rgba(255,255,255,0) 100%); background: -webkit-gradient(left top, right top, color-stop(0%, rgba(21,87,22,0.8)), color-stop(100%, rgba(255,255,255,0))); background: -webkit-linear-gradient(left, rgba(21,87,22,0.8) 0%, rgba(255,255,255,0) 100%); background: -o-linear-gradient(left, rgba(21,87,22,0.8) 0%, rgba(255,255,255,0) 100%); background: -ms-linear-gradient(left, rgba(21,87,22,0.8) 0%, rgba(255,255,255,0) 100%); background: linear-gradient(to right, rgba(21,87,22,0.8) 0%, rgba(255,255,255,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#155716', endColorstr='#ffffff', GradientType=1 ); } .projects__item__bg.gradient-pink:after { background: rgba(255,255,255,0); background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(204,101,115,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,0)), color-stop(100%, rgba(204,101,115,1))); background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(204,101,115,1) 100%); background: -o-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(204,101,115,1) 100%); background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(204,101,115,1) 100%); background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(204,101,115,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#cc6573', GradientType=0 ); } .projects__item__bg.gradient-red:after { background: rgba(255,255,255,0); background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(223,43,58,1) 100%); background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,0)), color-stop(100%, rgba(223,43,58,1))); background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(223,43,58,1) 100%); background: -o-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(223,43,58,1) 100%); background: -ms-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(223,43,58,1) 100%); background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(223,43,58,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#df2b3a', GradientType=0 ); } @media only screen and (min-width: 992px) { .projects__item { height: 320px; text-align: left; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-justify-content: flex-start; -ms-flex-pack: flex-start; justify-content: flex-start; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .projects__item-center { -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } .projects__item-right { -webkit-justify-content: flex-end; -ms-flex-pack: flex-end; justify-content: flex-end; } .projects-2 .projects__item { width: calc(50% - 15px); margin-right: 30px; } .projects-2 .projects__item:nth-child(2n) { margin-right: 0; } .projects-3 .projects__item { width: calc(33.333333% - 20px); margin-right: 30px; } .projects-3 .projects__item:nth-child(3n) { margin-right: 0; } .projects__item__bg:first-child:after, .projects__item__bg:first-child:before, .projects__item__bg:first-child, .projects__item__bg:after, .projects__item__bg:before, .projects__item__bg { display: none !important; } .projects__item__bg:last-child:after, .projects__item__bg:last-child:before, .projects__item__bg:last-child { display: block !important; } .projects__item-left .projects__item__bg { background-position: right center; } .projects__item-right .projects__item__bg { background-position: left center; } .projects__item__content { max-width: 600px; margin: 0 auto; padding: 30px 30px; text-align: left; } .projects__item__subtitle { font-weight: 700; font-size: 16px; line-height: 19px; } .projects-1 .projects__item .projects__item__content { height: auto; margin: 0; } .projects-2 .projects__item__content { max-width: 100%; padding: 40px 30px; padding-left: 180px; } .projects-3 .projects__item__content { padding-left: 20px; padding-right: 20px; padding-top: 0; } .projects__item-center .projects__item__content { text-align: center; } .projects__item-right .projects__item__content { text-align: right; padding-right: 30px; } .projects__item__logo { width: 100px; height: 100px; } .projects-1 .projects__item-left .projects__item__logo { margin-left: 0; } .projects-1 .projects__item-right .projects__item__logo { margin-left: auto; margin-right: 0; } .projects-2 .projects__item__logo { float: left; margin: 0; position: absolute; left: 40px; top: 40px; } .projects-2 .projects__item-center .projects__item__logo { margin-left: auto; } .projects-2 .projects__item-right .projects__item__logo { margin-left: auto; margin-right: 0; float: left; } .projects-2 .projects__item-right .projects__item__btn { position: absolute; right: 30px; bottom: 0; } .projects-3 .projects__item-center .projects__item__logo { margin-left: auto; } } @media only screen and (min-width: 1170px) { .page-projects { padding-top: 60px; } .page-projects .header { height: 60px; padding: 0; } .page-projects .header__logo { height: 60px; width: 210px; margin-right: 40px; } .page-projects .header__logo img { width: 100%; display: block; } .page-projects .header__backtosite { line-height: 60px; font-size: 18px; } .page-projects .header__backtosite i { margin-right: 12px; } .projects__item { height: 400px; } .projects-2 .projects__item__content { width: 100%; } .projects-3 .projects__item__content { width: 100%; padding-top: 20px; } .projects__item__title { font-size: 36px; line-height: 36px; } .projects__item__subtitle { font-weight: 700; font-size: 20px; line-height: 24px; } .projects__item__logo { width: 120px; height: 120px; } .projects-2 .projects__item-left .projects__item__desc { float: left; } .projects-2 .projects__item-right .projects__item__desc { float: right; } } @media only screen and (min-width: 1500px) { .projects__item { height: 480px; } .projects-1 .projects__item { height: 600px; } .projects__item__content { padding: 40px 60px; max-width: 700px; } .projects-1 .projects__item__content { max-width: 100%; padding: 10px 60px; } .projects-2 .projects__item__content { max-width: 100%; padding: 60px 60px; padding-left: 200px; } .projects-2 .projects__item-left .projects__item__content { float: left; padding-left: 60px; } .projects-2 .projects__item-right .projects__item__content { float: right; padding-right: 60px; } .projects__item__logo { width: 120px; height: 120px; } .projects__item__title { font-size: 54px; line-height: 54px; margin-bottom: 30px; } .projects__item__desc { margin-bottom: 30px; font-size: 18px; line-height: 24px; } .projects-2 .projects__item-right .projects__item__btn { right: 60px; bottom: 40px; } } /* ========================================================================== END Projects page ========================================================================== */ /* ========================================================================== comics gallery block ========================================================================== */ .comics_gallery { width: 100%; float: left; margin: 20px 0; position: relative; z-index: 10; } .comics_gallery__item { display: block; float: left; width: 100%; margin-top: 10px; } .comics_gallery__item:nth-child(2), .comics_gallery__item:nth-child(1) { margin-top: 0; } .comics_gallery__item:nth-child(2n) { padding-right: 0; } .comics_gallery__item a { display: block; float: left; width: 100%; padding-bottom: 150%; overflow: hidden; } @media only screen and (min-width: 768px) { .comics_gallery__item { width: 50%; padding-left: 10px; padding-right: 10px; } .comics_gallery__item:nth-child(odd), .comics_gallery__item:first-child { padding-left: 0; } } /* ========================================================================== END comics gallery block ========================================================================== */ /* ========================================================================== Mobile banner ========================================================================== */ .banner_mobile { width: 100%; display: block; margin: 0 0 20px 0; } .banner_mobile .container { text-align: center; } .container .banner_mobile .container { padding: 0; } .banner_mobile img { display: block; margin: auto; border: none; outline: none; max-width: 100%; min-width: 100%; } @media only screen and (min-width: 992px) { .banner_mobile { display: none; height: 0; } } /* ========================================================================== END Mobile banner ========================================================================== */ /* ========================================================================== banner video ========================================================================== */ .block-video { clear: both; display: inline-block; margin-top: 20px; margin-bottom: 50px; } .block-video__left { width: 50%; display: inline-block; float: left; } .block-video__right { width: 49%; display: inline-block; float: left; padding-left: 20px; } @media (max-width: 768px) { .block-video__left, .block-video__right { width: 100%; padding-left: 0px; } .block-video__left iframe { height: auto; width: auto; min-height: 209px; } } /* ========================================================================== END banner video ========================================================================== */ /* ========================================================================== Start Vacancies block ========================================================================== */ .vacancies .container { background: #fff; } .vacancies__slider { margin-bottom: 50px; overflow: hidden; } .vacancies__list { display: flex; align-items: center; justify-content: space-between; position: relative; } .vacancies__link { display: block; max-width: 90%; height: 178px; background: #fff; border: 1px solid #ccc; border-radius: 10px; } .vacancies__item { padding: 1rem; width: 100%; height: 100%; } .vacancies__logo { width: 100%; height: 100%; object-fit: contain; } .vacancies__prev, .vacancies__next { position: absolute; top: 0; left: 0; width: 36px; height: 100%; color: #9f9f9f; background-repeat: no-repeat; background-position: center; background-size: 14px auto; transition: all 0.1s linear; cursor: pointer; z-index: 10; } .vacancies__next { left: auto; right: 0; top: 0; } .vacancies__prev { top: 0; left: 0; } .vacancies__prev::after, .vacancies__next::after { display: block; position: absolute; width: 36px; height: 36px; top: 50%; left: 0; margin-top: -18px; font-family: Font Awesome\ 5 Free; line-height: 36px; font-size: 36px; font-weight: 900; text-align: center; } .vacancies__prev::after { content: '\f104'; } .vacancies__next::after { content: '\f105'; right: 0; left: auto; } .vacancies__prev.disabled, .vacancies__next.disabled { cursor: default; opacity: 0.6; } /* ========================================================================== End Vacancies block ========================================================================== */ /* ========================================================================== Start social icons ========================================================================== */ .social-btns, .social-btns li { margin: 0; padding: 0; list-style: none; } .footer .social-btns { display: flex; justify-content: space-between; width: 100%; } .social-btns a, .social-btns a:before, .social-btns a .fab { transition: all 0.35s; transition-timing-function: cubic-bezier(0.31, -0.105, 0.43, 1.59); } .social-btns a:before { top: 90%; left: -110%; } .social-btns a .fab { transform: scale(0.8); } .social-btns a.facebook:before { background-color: #3b5998; } .social-btns a.facebook .fab { color: #3b5998; } .social-btns a.twitter:before { background-color: #3cf; } .social-btns a.twitter .fab { color: #3cf; } .social-btns a.vk:before { background-color: #5081b8; } .social-btns a.vk .fab { color: #5081b8; } .social-btns a.whatsapp:before { background-color: #43d854; } .social-btns a.whatsapp .fab { color: #43d854; } .social-btns a.yandex:before { background-color: #f60000; } .social-btns a.yandex .fab { color: #f60000; } .social-btns a.telegram:before { background-color: #36aee2; } .social-btns a.telegram .fab { color: #36aee2; } .social-btns a.tiktok:before { background-color: #000; } .social-btns a.tiktok .fab { color: #000; } .social-btns a.youtube:before { background-color: #ff0000; } .social-btns a.youtube .fab { color: #ff0000; } .social-btns a.instagram:before { background-color: #d02f96; } .social-btns a.instagram .fab { color: #d02f96; } .social-btns a:focus:before, .social-btns a:hover:before { top: -20%; left: -20%; } .social-btns a:focus .fab, .social-btns a:hover .fab { color: #fff; transform: scale(1); } .social-btns a { display: inline-block; background-color: #fff; width: 40px; height: 40px; line-height: 35px; margin: 0 10px; text-align: center; position: relative; overflow: hidden; border-radius: 5px; box-shadow: 0 5px 15px -5px rgba(0, 0, 0, 0.1); opacity: 0.99; } .social-btns a:first-child { margin-left: 0; } .social-btns a:before { content: ''; width: 140%; height: 140%; position: absolute; transform: rotate(45deg); } .social-btns a .fab { font-size: 20px; vertical-align: middle; } /* ========================================================================== End social icons ========================================================================== */ .section-news .news_block__inner { display: flex; flex-direction: column; } @media (min-width: 768px) { .section-news .news_block__inner { flex-direction: row; justify-content: space-between; } } .section-news .news_block__col { width: 100%; } @media (min-width: 768px) { .section-news .news_block__col { width: 48%; } .section-news .news_block__col:nth-child(1) { margin-right: 30px; } } .section-news .news_block__col:nth-child(1) .material_item.material_item-read:last-child { margin-bottom: 20px; } @media (min-width: 768px) { .section-news .news_block__col:nth-child(1) .material_item.material_item-read:last-child { margin-bottom: 0; } } .section-news .news_block__main__carousel { margin-bottom: 40px; } @media (min-width: 768px) { .section-news .news_block__main__carousel { margin-bottom: 20px; } .section-news .news_block__main__carousel { height: 250px; overflow: hidden; } .section-news .news_block__main__carousel .owl-stage, .section-news .news_block__main__carousel .owl-item, .section-news .news_block__main__carousel .material_item-readin .material_item__link, .section-news .news_block__main__carousel .material_item__image_container, .section-news .news_block__main__carousel .material_item, .section-news .news_block__main__carousel .material_item__inner { height: 100%; } .section-news .news_block__main__carousel .material_item-readin .material_item__link { padding-top: 0; } .section-news .news_block__main__carousel .material_item__image_container { padding-bottom: 0; } .section-news .news_block__main__carousel .owl-stage-outer { height: 100% !important; } } @media (min-width: 992px) { .section-news .news_block__main__carousel { height: 255px; } } @media (min-width: 1500px) { .section-news .news_block__main__carousel { height: 350px; } } .section-news .news_block__main__carousel .owl-prev, .section-news .news_block__main__carousel .owl-next { color: #ffffff; } .section-news .material_item-readin .material_item__title { padding: 0 10px; font-weight: 600; } @media (min-width: 768px) { .section-news .material_item-readin .material_item__title { font-size: 15px; line-height: 21px; } } @media (min-width: 992px) { .section-news .material_item-readin .material_item__title { bottom: 45px !important; padding: 0 15px; font-size: 18px; line-height: 24px; } } .section-news .material_item-read .material_item__title { padding-bottom: 0; line-height: 21px; color: #000000; transition: all .5s ease; } .section-news .material_item.material_item-readin .material_item__info { display: flex; align-items: baseline; padding: 0 10px 10px; } @media (min-width: 992px) { .section-news .material_item.material_item-readin .material_item__info { padding: 0 15px 15px; } } .section-news .material_item__time { margin-right: 15px; font-weight: 500; font-size: 13px; line-height: 24px; color: #FFFFFF; } .section-news .material_item__category { margin-right: 15px; font-weight: 500; } .section-news .material_item.material_item-read { margin-top: 0; margin-bottom: 20px; padding: 0; cursor: pointer; overflow: hidden; transition: all .5s ease; outline: none; } .section-news .material_item.material_item-read:hover .material_item__title span { border-color: #000000; } .section-news .material_item.material_item-read:hover .material_item__col:nth-child(2)::before { opacity: 0; } .section-news .material_item.material_item-read:last-child { margin-bottom: 0; } .section-news .material_item__inner { display: flex; justify-content: space-between; align-items: flex-start; padding: 0; } .section-news .material_item__col:nth-child(1) { margin-right: 15px; width: calc(100% - 102px); } @media (min-width: 992px) { .section-news .material_item__col:nth-child(1) { margin-right: 20px; width: calc(100% - 107px); } } @media (min-width: 1500px) { .section-news .material_item__col:nth-child(1) { margin-right: 20px; width: calc(100% - 180px); } } .section-news .material_item__col:nth-child(2) { position: relative; width: 87px; height: 65px; } .section-news .material_item__col:nth-child(2)::before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; background: #000000; opacity: .2; transition: opacity .5s ease; } @media (min-width: 1500px) { .section-news .material_item__col:nth-child(2) { width: 160px; height: 103px; } } .section-news .news_block__list { margin-top: 0; } @media (min-width: 992px) { .section-news .news_block__list { margin-left: 0; } } .section-news .material_item__img { width: 100%; height: 100%; object-fit: cover; object-position: center; } .section-news .material_item__title span { padding: 0; } .section-news .material_item-read .material_item__info { display: flex; align-items: baseline; margin-top: 5px; } .section-news .material_item__date { margin-right: 15px; } .section-news .material_item-read .material_item__info__left { margin-right: 0; } .section-news .material_item__views { display: flex; align-items: baseline; }