/* /* 00 - RESET */ /* 01 - HEADER */ /* 02 - HEADER BACKGROUND */ /* 03 - MAIN */ /* 04 - POPUP */ /* 05 - DROPDOWN */ /* 06 - POST */ /* 07 - FOOTER */ /* 08 - LOADER */ /* 09 - COLORPICKER */ /* ========================================================= */ .video-container { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; } .video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .spinner { width: 60px; height: 60px; } .container1 > div, .container2 > div, .container3 > div { width: 10px; height: 10px; background-color: #333; border-radius: 100%; position: absolute; -webkit-animation: bouncedelay 1.2s infinite ease-in-out; animation: bouncedelay 1.2s infinite ease-in-out; /* Prevent first frame from flickering when animation starts */ -webkit-animation-fill-mode: both; animation-fill-mode: both; } .spinner .spinner-container { position: absolute; width: 100%; height: 100%; } .container2 { -webkit-transform: rotateZ(45deg); transform: rotateZ(45deg); } .container3 { -webkit-transform: rotateZ(90deg); transform: rotateZ(90deg); } .circle1 { top: 0; left: 0; } .circle2 { top: 0; right: 0; } .circle3 { right: 0; bottom: 0; } .circle4 { left: 0; bottom: 0; } .container2 .circle1 { -webkit-animation-delay: -1.1s; animation-delay: -1.1s; } .container3 .circle1 { -webkit-animation-delay: -1.0s; animation-delay: -1.0s; } .container1 .circle2 { -webkit-animation-delay: -0.9s; animation-delay: -0.9s; } .container2 .circle2 { -webkit-animation-delay: -0.8s; animation-delay: -0.8s; } .container3 .circle2 { -webkit-animation-delay: -0.7s; animation-delay: -0.7s; } .container1 .circle3 { -webkit-animation-delay: -0.6s; animation-delay: -0.6s; } .container2 .circle3 { -webkit-animation-delay: -0.5s; animation-delay: -0.5s; } .container3 .circle3 { -webkit-animation-delay: -0.4s; animation-delay: -0.4s; } .container1 .circle4 { -webkit-animation-delay: -0.3s; animation-delay: -0.3s; } .container2 .circle4 { -webkit-animation-delay: -0.2s; animation-delay: -0.2s; } .container3 .circle4 { -webkit-animation-delay: -0.1s; animation-delay: -0.1s; } @-webkit-keyframes bouncedelay { 0%, 80%, 100% { -webkit-transform: scale(0.0) } 40% { -webkit-transform: scale(1.0) } } @keyframes bouncedelay { 0%, 80%, 100% { transform: scale(0.0); -webkit-transform: scale(0.0); } 40% { transform: scale(1.0); -webkit-transform: scale(1.0); } } /* ============================================================================= DEMO STUFF ============================================================================= */ .items { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-bottom: 24px; } .item { margin: 0; } /* ============================================================================= MENU TOGGLE SWITCHES ============================================================================= */ /** * Toggle Switch Globals * * All switches should take on the class `cmn-toggle-switch` as well as their * variant that will give them unique properties. This class is an overview * class that acts as a reset for all versions of the icon. */ .cmn-toggle-switch { display: block; float: right; position: relative; overflow: hidden; margin: 0; padding: 0; width: 35px; height: 35px; font-size: 0; text-indent: -9999px; -webkit-appearance: none; -moz-appearance: none; appearance: none; box-shadow: none; border-radius: none; border: none; cursor: pointer; -webkit-transition: background 0.3s; transition: background 0.3s; } .cmn-toggle-switch:focus { outline: none; } .cmn-toggle-switch span { display: block; position: absolute; top: 18px; left: 0; right: 0; height: 1px; background: #000000; } .cmn-toggle-switch span::before, .cmn-toggle-switch span::after { position: absolute; display: block; left: 0; width: 100%; height: 1px; background: #000000; content: ""; } .cmn-toggle-switch span::before { top: -12px; } .cmn-toggle-switch span::after { bottom: -12px; } /** * Style 2 * * Hamburger to "x" (htx). Takes on a hamburger shape, bars slide * down to center and transform into an "x". */ .cmn-toggle-switch__htx { background-color: transparent; } .cmn-toggle-switch__htx span { -webkit-transition: background 0s 0.3s; transition: background 0s 0.3s; } .cmn-toggle-switch__htx span::before, .cmn-toggle-switch__htx span::after { -webkit-transition-duration: 0.3s, 0.3s; transition-duration: 0.3s, 0.3s; -webkit-transition-delay: 0.3s, 0s; transition-delay: 0.3s, 0s; } .cmn-toggle-switch__htx span::before { -webkit-transition-property: top, -webkit-transform; transition-property: top, transform; } .cmn-toggle-switch__htx span::after { -webkit-transition-property: bottom, -webkit-transform; transition-property: bottom, transform; } /* active state, i.e. menu open */ .cmn-toggle-switch__htx.active { background-color: transparent; } .cmn-toggle-switch__htx.active span { background: none; } .cmn-toggle-switch__htx.active span::before { top: 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .cmn-toggle-switch__htx.active span::after { bottom: 0; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .cmn-toggle-switch__htx.active span::before, .cmn-toggle-switch__htx.active span::after { -webkit-transition-delay: 0s, 0.3s; transition-delay: 0s, 0.3s; } .ui-slider { position: relative; text-align: left; } .ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 1.2em; height: 1.2em; cursor: default; -ms-touch-action: none; touch-action: none; } .ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; background-position: 0 0; } /* support: IE8 - See #6727 */ .ui-slider.ui-state-disabled .ui-slider-handle, .ui-slider.ui-state-disabled .ui-slider-range { filter: inherit; } .ui-slider-horizontal { height: .8em; } .ui-slider-horizontal .ui-slider-handle { top: -.3em; margin-left: -.6em; } .ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; } .ui-slider-horizontal .ui-slider-range-min { left: 0; } .ui-slider-horizontal .ui-slider-range-max { right: 0; } .ui-slider-vertical { width: .8em; height: 100px; } .ui-slider-vertical .ui-slider-handle { left: -.3em; margin-left: 0; margin-bottom: -.6em; } .ui-slider-vertical .ui-slider-range { left: 0; width: 100%; } .ui-slider-vertical .ui-slider-range-min { bottom: 0; } .ui-slider-vertical .ui-slider-range-max { top: 0; } /* Interaction states ----------------------------------*/ .ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid #cccccc; background: #f6f6f6; font-weight: bold; color: #1c94c4; } .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: #1c94c4; text-decoration: none; } .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: 1px solid #ccc; background: #fdf5ce; font-weight: bold; } .ui-state-hover a, .ui-state-hover a:hover, .ui-state-hover a:link, .ui-state-hover a:visited, .ui-state-focus a, .ui-state-focus a:hover, .ui-state-focus a:link, .ui-state-focus a:visited { text-decoration: none; } .ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { background: #ffffff; font-weight: bold; } .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { text-decoration: none; } /* Interaction Cues ----------------------------------*/ .ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight { color: #363636; } .ui-state-highlight a, .ui-widget-content .ui-state-highlight a, .ui-widget-header .ui-state-highlight a { color: #363636; } .ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error { border: 1px solid #cd0a0a; background: #b81900; color: #ffffff; } .ui-state-error a, .ui-widget-content .ui-state-error a, .ui-widget-header .ui-state-error a { color: #ffffff; } .ui-state-error-text, .ui-widget-content .ui-state-error-text, .ui-widget-header .ui-state-error-text { color: #ffffff; } .ui-priority-primary, .ui-widget-content .ui-priority-primary, .ui-widget-header .ui-priority-primary { font-weight: bold; } .ui-priority-secondary, .ui-widget-content .ui-priority-secondary, .ui-widget-header .ui-priority-secondary { opacity: .7; filter:Alpha(Opacity=70); /* support: IE8 */ font-weight: normal; } .ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { opacity: .35; filter:Alpha(Opacity=35); /* support: IE8 */ background-image: none; } .ui-state-disabled .ui-icon { filter:Alpha(Opacity=35); /* support: IE8 - See #6059 */ } /* Misc visuals ----------------------------------*/ /* Corner radius */ .ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { border-top-left-radius: 4px; } .ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { border-top-right-radius: 4px; } .ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { border-bottom-left-radius: 4px; } .ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { border-bottom-right-radius: 4px; } ::-webkit-input-placeholder { /* WebKit browsers */ color: inherit !important; } :-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: inherit !important; opacity: 1; } ::-moz-placeholder { /* Mozilla Firefox 19+ */ color: inherit !important; opacity: 1; } :-ms-input-placeholder { /* Internet Explorer 10+ */ color: inherit !important; } #content-block *:last-child { margin-bottom: 0; } body { margin: 0; padding: 0; } /* h1, h2, h3, h4, h5, p { margin: 0; padding: 0; } */ ul, li, ol { list-style: none; margin: 0; padding: 0; } .no_row { margin: 0; } textarea{resize: none;} a, a:hover, a:focus { text-decoration: inherit; } input, input:focus { outline: none !important; } .custom-container { max-width: 1800px; } .custom-column-5 { width: 20%; padding: 0 15px; float: left; } .custom-column-5:nth-child(5n+1) { clear: both; } @media screen and (max-width: 1500px) { .custom-column-5 { width: 25%; } .custom-column-5:nth-child(5n+1) { clear: none; } .custom-column-5:nth-child(4n+1) { clear: both; } } @media screen and (max-width: 1200px) { .custom-column-5 { width: 33.333%; } .custom-column-5:nth-child(4n+1) { clear: none; } .custom-column-5:nth-child(3n+1) { clear: both; } } @media screen and (max-width: 767px) { .custom-column-5 { width: 50%; } .custom-column-5:nth-child(3n+1) { clear: none; } .custom-column-5:nth-child(2n+1) { clear: both; } } @media screen and (max-width: 600px) { .custom-column-5 { width: 100%; } .custom-column-5 { clear: both; } } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 01 - GLOBAL SETTINGS */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .content-title { font-size: 32px; line-height: 32px; font-family: 'Conv_helveticaneuecyr-bold'; margin-bottom: 30px; color: #383b43; text-align: center; } .img-full { width: 100%; } .row.no-padding { margin-right: 0px; margin-left: 0px; } .row.no-padding > div[class^="col-"] { padding-right: 0px; padding-left: 0px; } a:focus { outline: none; outline-offset: 0px; color: inherit; } .table-block { display: table; } .table-row { display: table-row; } .table-cell { display: table-cell; vertical-align: middle; float: none; } /* ================================== 01 - HEADER ================================== */ header * { -webkit-backface-visibility: hidden; } header { height: 70px; width: 100%; color: #fff; font-size: 14px; background: #fff; position: fixed; top: 0; line-height: 0; z-index: 1000; border-bottom: 0.5px solid #cccccc;} header .custom-container { position: relative; } header .row-header .brand-be { margin-top: 16.5px; float: left; } header .row-header .header-menu-block { position: absolute; top: 0px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } @media screen and (min-width: 1200px) { header .row-header .header-menu-block { max-width: 720px; width: 100%; } } img.be_logo { text-align: left; } .header-menu ul { list-style: none; padding: 0;} .header-menu > li { display: inline-block; padding: 0 16px; position: relative; } .header-menu > li:hover > a, .header-menu > li.active-header > a { color: #0d58c8; } .header-menu { text-align: center; } /* Sub navigation arrow */ .header-menu .children .page_item_has_children > a:after { content: "\f105"; font-family: 'FontAwesome'; right: 15px; top: 10px; position: absolute; } .fa-angle-down { display: none; } /*login-block*/ .login-header-block { margin-top: 17.5px; float: right; } .login_block { text-align: right; } .login_block .btn-login { margin-right: 0px; margin-bottom: 0px; } .login_block a:hover { color: #262626; } /*login user page*/ .page-login .login-header-block { margin-top: 15px; } .page-login .login_block .be-drop-down { margin-top: 1.5px; float: right; } .page-login .login_block .login-user-down { margin-top: 0px; } .messages-popup, .notofications-popup { position: relative; display: block; color: #545a69; float: right; margin-top: 13px; } a.messages-popup:hover, a.notofications-popup:hover { color: #fff; } .messages-popup { margin-right: 30px; } .notofications-popup { margin-right: 10px; } .noto-count { position: absolute; top: -12px; right: -13px; display: block; width: 20px; height: 20px; font-size: 10px; line-height: 20px; font-family: 'Conv_helveticaneuecyr-bold'; color: #fff; background: #0d58c8; text-align: center; border-radius: 20px; } .messages-popup .noto-count { right: -16px; } .login_block .be-drop-down { display: inline-block; margin-right: 30px; margin-bottom: 0px; } .login_block .be-drop-down .drop-down-list { text-align: center; } .noto-popup { display: none; position: absolute; top: 82px; right: 15px; border: 1px solid #edeff2; background: #fff; width: 500px; text-align: left; border-radius: 3px; } .noto-popup .messages-block { right: 52px; } .noto-popup:before { content: ''; position: absolute; top: -12px; right: 7px; display: block; width: 23px; height: 12px; background: url(../img/noto.png) no-repeat; } .noto-popup.messages-block:before { right: 50px; } .noto-popup .noto-label { font-size: 14px; line-height: 20px; padding: 14px 30px; color: #383b43; background: #f6f6f7; } .noto-popup .noto-message { background: #222835; color: #6b7180; } a.noto-message:hover{color: #fff;} a.settings>i{font-size: 16px !important;} .noto-label-links { float: right; } .noto-label-links a { font-size: 10px; line-height: 20px; font-family: 'Conv_helveticaneuecyr-bold'; color: #0d58c8; text-transform: uppercase; margin-left: 30px; } .noto-label-links a:hover { color: #383B43; } .noto-body { position: relative; overflow-y: auto; } .noto-body:after { content: ''; position: absolute; bottom: 0px; left: 64px; display: block; width: 2px; height: 20px; background: #f6f6f7; } .noto-entry { position: relative; margin-right: 30px; } .noto-entry:before { content: ''; position: absolute; top: 0px; left: 29px; display: block; width: 2px; height: 100%; background: #f6f6f7; } .noto-entry:after { content: ''; position: absolute; top: 43px; left: 24px; display: block; width: 12px; height: 12px; background: #d1d3d7; border: 2px solid #fff; border-radius: 12px; } .noto-entry:last-child { margin-bottom: 20px; } .noto-icon { position: absolute; top: 42px; left: 3px; } .noto-content { padding: 20px 0px; margin-left: 54px; border-bottom: 1px solid #edeff2; } .noto-img { width: 60px; height: 60px; float: left; } .noto-text { margin-left: 80px; } .noto-text-top { margin-top: 5px; margin-bottom: 15px; } .noto-name { display: inline-block; margin-right: 20px; } .noto-name a { font-size: 12px; line-height: 18px; font-weight: 400; margin-top: 15px; color: #383b43; } .noto-name a:hover { color: #0D58C8; } .noto-date { display: inline-block; font-size: 11px; line-height: 18px; font-weight: 400; color: #b4b7c1; } .noto-date .fa { font-size: 18px; position: relative; top: 2px; } .noto-message { display: inline-block; font-size: 12px; line-height: 18px; font-weight: 400; color: #7a8192; background: #f6f6f7; border: 1px solid #edeff2; padding: 5px 9px; border-radius: 3px; } .noto-message a { color: #0d58c8; } .noto-message a:hover { color: #7a8192; } .noto-left { float: left; margin-right: 15px; } .noto-header { padding: 20px 0px; border-top: 1px solid #edeff2; border-bottom: 1px solid #edeff2; } .noto-header .form-checkbox { float: left; height: 36px; line-height: 36px; margin-bottom: 0px; } .noto-header .form-checkbox > input + .check { position: relative; top: 5px; } .noto-header .stat-sort { float: right; margin-top: 0px; } .noto-header .form-checkbox > input { top: 3px; } .noto-header label { font-size: 10px; line-height: 30px; font-weight: 400; color: #7a8192; text-transform: uppercase; margin-left: 7px; } .noto-entry.style-2 { margin-left: 0px; margin-right: 0px; } .noto-entry.style-2 .noto-content { margin-left: 0px; padding-left: 30px; padding-right: 30px; } .noto-entry.style-2 .noto-message { background: transparent; border: none; padding: 0px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%; } .noto-entry.style-2:before, .noto-entry.style-2:after { display: none; } .noto-entry.style-3 { margin-left: 0px; margin-right: 0px; } .noto-entry.style-3 .form-checkbox { position: absolute; top: 34px; left: 10px; z-index: 100; } .noto-entry.style-3 .form-checkbox > input + .check { background: #fff; } .noto-entry.style-3 .noto-content { position: relative; margin-left: 0px; padding-left: 40px; padding-right: 30px; } /*.noto-entry:last-child .noto-content{margin-left: 29px;padding-left: 25px;}*/ .noto-entry.style-3 .noto-message { background: transparent; border: none; padding: 0px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; width: 100%; } .noto-entry.style-3:before, .noto-entry.style-3:after { display: none; } .noto-entry.style-3:hover { background: #f6f6f7; } .messages-block .noto-body:after { display: none; } .be-drop-down.login-user-down { background: transparent; border: none; padding: 0px 40px 0px 0px; } .be-drop-down.login-user-down:hover { background: transparent; border: none; } .be-drop-down.login-user-down:after { right: 15px; } .be-drop-down.login-user-down ul { font-size: 10px; } .be-drop-down .login-user { border-radius: 40px; } @media screen and (min-width: 992px) and (max-width: 1400px) { .login_block .be-drop-down { margin-right: 5px; } } @media screen and (min-width: 1200px) { header .header-menu { display: block !important; } .header-menu > li { border-top: 5px solid transparent; } .header-menu > li > ul a { display: block; line-height: 18px; font-size: 14px; } .header-menu > li { padding-top: 31px !important; padding-bottom: 34px; } .header-menu > li li a { cursor: pointer; padding: 10px 20px; padding-right: 30px; } .header-menu > .active-header, .header-menu > li:hover { color: #0d58c8; border-top: 5px solid #0d58c8; } .header-menu { color: #fff; } .header-menu > li:hover > ul { -webkit-transition: all ease-out 0.5s; transition: all 0.5s; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); visibility:visible; opacity: 1; } .header-menu > li > ul li:hover { background: #0d58c8; } .header-menu > li > ul li:hover > a { color: #FFF; } .header-menu > li > ul { position: absolute; top: 100%; left: 0; color: #262626; text-align: left; background: #FFF; width: 100%; min-width: 150px; padding-top: 0px; font-size: 16px; opacity: 0; -webkit-transition: all ease-out 0.5s; transition: all ease-out 0.5s; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); visibility:hidden; } .header-menu > li > ul li { position: relative; } .header-menu > li > ul li i { position: absolute; top: 50%; right: 10px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .header-menu > li > ul li > ul { position: absolute; top: 0px; left: 100%; padding-top: 0px; width: 150px !important; text-align: left; background: #FFF; color: #262626; width: auto; font-size: 16px; opacity: 0; -webkit-transform-origin: 0 50%; -webkit-transition: all ease-out 0.5s; transition: all ease-out 0.5s; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); } .header-menu > li > ul li:hover > ul { -webkit-transition: all ease-out 0.5s; transition: all 0.5s; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); opacity: 1; } .cmn-toggle-switch { display: none; } } @media screen and (max-width: 1199px) { .brand-be { position: absolute; left: 50%; text-align: center; -webkit-transform: translateX(-50%) !important; -ms-transform: translateX(-50%) !important; transform: translateX(-50%) !important; } .fa-angle-right { display: none; } .fa-angle-down, .fa-angle-up { display: block; position: absolute; right: 15px; top: 10px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } header { z-index: 550; } .header-menu { height: auto; display: none; width: 100%; background: #1B212C; text-align: center; font-size: 26px; position: absolute; top: 70px; left: -1px; overflow: auto; padding-bottom: 15px; } .header-menu ul { display: none; width: 100%; background: #FFF; text-align: center; font-size: 26px; } .page-login .header-menu { padding-top: 60px; } .header-menu > li > a { font-size: 20px; } .header-menu > li > ul > li > a { font-size: 18px; } .header-menu > li > ul > li > ul a { font-size: 16px; } .header-menu > li > ul > li > ul { box-shadow: inset 0 0 12px 0px rgba(0, 0, 0, 0.3); } .header-menu > li a { display: block; line-height: 42px; padding: 0 32px; } .header-menu i { top: 24px; width: 32px; height: 32px; cursor: pointer; } .header-menu > li > ul > li > ul { background: #E6E6E6 !important; } .header-menu.header-menu li { position: relative; text-align: center; text-align: center; display: block; padding: 0; } .cmn-toggle-switch { position: absolute; left: 12px; top: 14px; } .header-menu-block { z-index: 250; position: absolute; top: 100%; width: 100%; margin: 0; margin: 0 !important; left: 0; } .login_block { float: right; } .login_block .be-drop-down { display: none; position: absolute; left: 15px; top: 86px; z-index: 300; } .login_block .be-drop-down.login-user-down { display: none; position: absolute; top: 86px; right: 12px; left: auto; z-index: 300; margin-right: 0px; } .messages-popup, .notofications-popup { margin-top: 10px; } body.menu-open .login_block .be-drop-down { display: inline-block; } header .col-xs-3:last-child { float: right; } .header-menu > li ul { background: #F6F6F6; margin: 0; padding: 0; } .login-header-block { padding-right: 0; float: right; } } @media screen and (max-width: 600px) { .noto-popup { left: 15px; width: auto; } } @media screen and (max-width: 450px) { .login_block .btn-login .fa { display: none; } .noto-label-links { float: none; display: block; } .noto-label-links a { margin-left: 0px; margin-right: 15px; } .noto-entry { margin-left: 15px; margin-right: 15px; } } /* ================================== 02 - HEADER BACKGROUND ================================== */ .head-bg { background: #000; position: relative; padding: 10px; } .head-bg-img { position: absolute; left: 0; top: 0; background: url(../img/bg.jpg); height: 100%; width: 100%; background-size: cover; opacity: 0.2; z-index: 1; background-position: center center; } .head-bg-content { height: 400px; text-align: center; position: relative; z-index: 200; display: table-cell; vertical-align: middle; width: 5000px; } #content-block .head-bg-content .btn { margin-bottom: 10px; } .head-bg-content h1 { font-size: 32px; line-height: 40px; color: #FFF; font-family: 'Conv_helveticaneuecyr-bold'; margin-bottom: 17px; } .head-bg-content p, .head-bg-content .desc { color: #a1a4af; margin-bottom: 25px; } .head-bg.style-2 { padding-top: 120px; padding-bottom: 120px; margin-bottom: 0px; } .head-bg.style-2 .head-bg-img { opacity: 0.5; } .head-bg.style-2 .head-bg-content { height: 310px; } .head-bg.style-3 { padding-top: 120px; padding-bottom: 120px; margin-bottom: 0px; background: #181d27; } .head-bg.style-3 .head-bg-img { opacity: 0.2; } .head-bg.style-3 .head-bg-content { height: 310px; } @media screen and (max-width: 1199px) { .head-bg { margin-bottom: 30px; } } @media screen and (max-width: 480px) { .head-bg-content .btn { display: block; margin-right: 0px; } } /* ================================== 03 - MAIN ================================== */ #content-block { margin-top: 70px; margin-bottom: 50px; } .for-be-dropdowns .be-drop-down { display: inline-block; margin-bottom: 50px; margin-right: 30px; } form.input-search { position: relative; margin-bottom: 50px; } .input-search input[type="text"] { border-radius: 2px; border: 1px solid #edeff2; width: 100%; padding: 14px 10px; color: #b4b7c1; } .icon-search { position: absolute; border: 2px solid #000; top: 0; overflow: hidden; } .input-search i { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); right: 10px; color: #000; font-size: 14px; opacity: 0.3; } .input-search i:hover { opacity: 1 !important; } .input-search input[type="submit"] { position: absolute; opacity: 0; height: 100%; width: 30px; top: 0; right: 0; } .letf-menu-article { font-size: 14px; color: #262626; font-family: 'Conv_helveticaneuecyr-bold'; margin-bottom: 15px; } .creative_filds_block { margin-bottom: 20px; } .creative_filds_block .ul { width: 100%; background: #F6F6F6; margin-bottom: 20px; } .creative_filds_block .nav { width: 262.5px; } .creative_filds_block a, .creative_filds_block .nav > li > a { display: block; position: relative; font-size: 13px; padding: 11px 15px 11px 20px; color: #bdbfc8 !important; cursor: pointer; border: 1px solid #E6E6E6; } .creative_filds_block a:not(:first-child), .creative_filds_block .nav > li:not(:first-child) > a { border-top: none !important; } .creative_filds_block a:hover, .creative_filds_block .nav > li > a:hover, .creative_filds_block .nav > li.active > a { background: #0d58c8; color: #FFF !important; } .creative_filds_block a:hover:after { content: "\f105"; font-family: FontAwesome; font-style: normal; font-weight: normal; text-decoration: inherit; color: rgba(255, 255, 255, 0.6); font-size: 18px; position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); right: 20px; } .be-vidget { margin-bottom: 45px; } .be-vidget li { -webkit-transition: all ease-out 0.1s; transition: all ease-out 0.1s; } .tags_block { margin: -5px; } .tags_block ul { width: 100%; } .tags_block li { float: left; } .tags_block li a:hover, .tags_block li a.active{ background: #0d58c8; color: #FFF; } .tags_block li a { display: inline-block; font-size: 12px; line-height: 18px; font-weight: 400; color: #B4B7C1; background: #F6F6F6; padding: 5px 11px; margin: 0px 10px 1px 0px; border: 1px solid #E6E6E6; cursor: pointer; border-radius: 5px; } #content-block .tags_block { margin: 0px; margin-bottom: -10px; } #content-block .tags_block li a:last-child { margin-bottom: 10px; } .filter-block li > a, .filter-block li > a:focus { display: block; font-size: 13px; line-height: 13px; font-weight: 400; color: #b4b7c1; padding: 15px 15px 15px 50px; } .filter-block li:hover > a { color: #fff; } .filter-block > ul > li { position: relative; margin-bottom: 10px; background: #F6F6F6; border: 1px solid #E6E6E6; color: #bdbfc8; cursor: pointer; } .filter-block li:hover, .filter-block li:hover i { color: #FFF; } .filter-block > ul > li:hover { background: #0d58c8; } .filter-block li i { position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); left: 20px; color: #bdbfc8; } .filter-block li.be-active { background: #0d58c8; color: #FFF; } .filter-block li.be-active > i { color: #FFF !important; } .s_keywords { background: #f6f6f7; border-top: 1px solid #edeff2; border-bottom: 1px solid #edeff2; padding: 20px 0px 10px 0px; margin-bottom: 97px; } .keyword { font-size: 12px; position: relative; left: 8px; } #content-block .s_keywords .btn { margin-bottom: 10px; margin-right: 20px; } .portfolio-link { display: block; position: relative; text-align: center; } .portfolio-link img { display: block; float: left; width: 33.33333333%; height: auto; } .portfolio-link .color_bg { display: block; position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; background: #0d58c8; opacity: 0; } .portfolio-link .color_bg:hover { opacity: 0.85; } .portfolio-link .color_bg span { display: inline-block; vertical-align: middle; font-size: 12px; line-height: 12px; text-transform: uppercase; color: #fff; margin-right: 0px; } .portfolio-link .color_bg span.child { display: inline-block; vertical-align: middle; height: 100%; width: 0px; } .portfolio-link.type-2 img { width: 20%; } @media screen and (max-width: 1199px) { .creative_filds_block .nav { width: 212.5px; } } @media screen and (max-width: 1199px) { .back-block { margin-bottom: 0px; } } @media screen and (max-width: 767px) { .for-be-dropdowns .be-drop-down { display: block; margin-right: 0px; } } /* ================================== 04 - POPUP ================================== */ .be-fixed-filter { position: fixed; display: none; width: 100%; height: 100%; left: 0; top: 0; } .be-fixed-filter.active-fixed { display: block; } .be-color-picker { width: auto !important; top: -150px !important; } .colors { overflow: hidden; } .be-popup { display: none; padding: 20px; position: absolute; left: 100%; top: -50px; background: #0d58c8; z-index: 25; border-radius: 2px; width: 340px; cursor: default; } .be-popup .for-colors { padding: 10px; background-color: #FFF; } .be-popup form { margin: 0; } .be-popup .fa { position: absolute; top: 25px; left: calc(100% - 32px); font-size: 16px; color: rgba(255, 255, 255, 0.8) !important; cursor: pointer; } .be-popup .fa:hover { color: #FFF !important; } @media screen and (max-width: 991px) { .be-popup { top: calc(100% - 1px) !important; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .be-popup .fa { top: -22px; } } .be-popup h3 { color: #FFF; margin-bottom: 20px; } /* ================================== 05 - DROP DOWN ================================== */ .drop-down-list li a { color: #fff !important; } .be-drop-down .drop-down-list { display: none; position: absolute; top: 100%; left: -1px; z-index: 228; box-sizing: content-box; } .be-drop-down .drop-down-list li { display: block; } .be-drop-down { position: relative; display: block; font-size: 13px; color: #b4b7c1; background: #FFF; padding: 15px 80px 15px 50px; margin-bottom: 10px; border: 1px solid #edeff2; cursor: pointer; border-radius: 3px; } .be-drop-down:hover { border: 1px solid #0d58c8; } .be-drop-down .drop-down-list { border-left: 1px solid #0d58c8; border-right: 1px solid #0d58c8; } .be-drop-down.color-2 { background: #f6f6f7; } .be-drop-down.color-2:hover { background: #fff; color: #b4b7c1; } .be-drop-down.color-2 .drop-down-list { border-left: 1px solid #f6f6f7; border-right: 1px solid #f6f6f7; } .be-drop-down.color-2 .drop-down-list a { background: #f6f6f7; color: #fff; } .be-drop-down.color-2 .drop-down-list a:hover { background: #fff; color: #b4b7c1; } .be-drop-down.color-2.be-drop-down:hover i { color: #b4b7c1; } .be-drop-down.color-2.be-dropdown-active:hover { background: #f6f6f7; } .be-drop-down.color-2.be-dropdown-active i { color: #b4b7c1; } .be-drop-down.color-2.be-dropdown-active:after { color: #b4b7c1; } .be-drop-down.color-3 { background: #383b43; color: #fff; border: 1px solid #383b43; } .be-drop-down.color-3:hover { background: #0d58c8; color: #FFF; border: 1px solid #0d58c8; } .be-drop-down.color-3.be-dropdown-active:hover { background: #383b43; border: 1px solid #383b43; } .be-drop-down.color-3 .drop-down-list { background: #383b43; border-left: 1px solid #383b43; border-right: 1px solid #383b43; } .be-drop-down.color-3 .drop-down-list a { color: #b4b7c1; } .be-drop-down.color-3 .drop-down-list a:hover { color: #fff; } .be-drop-down.color-3 .fa { color: #b4b7c1; } .be-drop-down.color-4 { background: #0d58c8; color: #fff; border: 1px solid #0d58c8; } .be-drop-down.color-4 .fa { color: #869edc; } .be-drop-down.color-4 .drop-down-list { background: #383b43; border-left: 1px solid #383b43; border-right: 1px solid #383b43; } .be-drop-down.color-4 .drop-down-list a { color: #b4b7c1; } .be-drop-down.color-4 .drop-down-list a:hover { color: #fff; } .be-drop-down.size-2 { font-size: 10px; padding: 18px 50px 17px 32px; } .be-drop-down.icon-none { padding: 14px 80px 14px 18px; } .be-drop-down > i { position: absolute; top: 50%; font-size: 18px; left: 20px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .be-drop-down:hover, .be-drop-down.be-dropdown-active { background: #0d58c8; color: #FFF; } .be-drop-down.be-dropdown-active:after { webkit-transform: translateY(-50%) rotate(180deg); -ms-transform: translateY(-50%) rotate(180deg); -webkit-transform: translateY(-50%) rotate(180deg); transform: translateY(-50%) rotate(180deg); } .drop-down-list { background: #0d58c8; color: #FFF; width: 100%; left: 0; } .drop-down-list a { display: block; padding: 11.5px 20px; color: rgba(255, 255, 255, 0.8); } .drop-down-list a { color: #8da4e0; } .drop-down-list a:hover { color: #FFF; background: #0d50b5; } .drop-down-list, .be-drop-down:hover:after, .be-drop-down:hover i, .be-drop-down.be-dropdown-active:after, .be-drop-down.be-dropdown-active i { color: rgba(255, 255, 255, 0.8); } .be-drop-down:after { content: "\f107"; font-family: FontAwesome; font-size: 18px; position: absolute; top: 50%; right: 25px; webkit-transform: translateY(-50%) rotate(0); -ms-transform: translateY(-50%) rotate(0); -webkit-transform: translateY(-50%) rotate(0); transform: translateY(-50%) rotate(0); } @media screen and (max-width: 1200px) { .be-drop-down { margin-right: 0; } } @media screen and (max-width: 991px) { .be-drop-down { display: block; margin-bottom: 30px !important; margin-right: 0px; } .left-feild { margin-bottom: 50px; } .main-feild + .left-feild { margin-top: 50px; } #content-block .left-feild .input-search { margin-bottom: 50px; } } /* ================================== 06 - POST BLOCK ================================== */ .be-post { border: 1px solid #edeff2; border-radius: 2px; width: 100%; margin-bottom: 30px !important; } .be-img-block { overflow: hidden; display: block; } .be-post .be-img-block { margin-bottom: 15px; position: relative; } .be-post .be-img-block img { width: 100%; height: auto; position: relative; -webkit-transition: all ease-out 0.3s; transition: all 0.3s; } .be-post .be-img-block img:hover { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .be-post .be-img-block:after { content: ""; position: absolute; bottom: 0; left: 15px; width: 0; height: 0; border-style: solid; border-width: 0 15px 15px 15px; border-color: transparent transparent #FFF transparent; } .be-post-title { position: relative; display: block; font-size: 13px; font-family: 'Conv_helveticaneuecyr-bold'; color: #262626; border-bottom: 1px solid #edeff2; margin: 0 15px 10px 15px; cursor: pointer; padding-bottom: 11px; overflow: hidden; text-overflow: ellipsis; } a.be-post-title:hover { color: #0D58C8; } .author-post { padding: 0 15px; font-size: 11px; line-height: 15px; color: #b4b7c1; margin-bottom: 20px; } .author-post a { color: #262626; font-family: 'Conv_helveticaneuecyr-bold'; } .author-post img { border-radius: 50%; display: inline; width: 20px; height: 20px; margin-right: 5px; } .author-post a:hover { color: #0D58C8; } .be-post > span { color: #b4b7c1; display: block; font-size: 11px; line-height: 20px; padding: 0 15px; margin-bottom: 15px; } .be-post > span a{ color: #b4b7c1; } .info-block { background: #F6F6F6; padding: 20px 15px; font-size: 12px; } .info-block, .info-block a {color: #b4b7c1 !important;} .info-block-label { font-size: 14px; line-height: 18px; font-family: 'Conv_helveticaneuecyr-bold'; color: #383b43; } .info-block .be-large-post-align { margin: 0px 50px; } .info-block .fa { font-size: 14px; } .close-w{position: absolute;right: 15px;font-size: 15px;color: #111;cursor: pointer;-webkit-transform: translateY(-50%); top:50%; -o-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%);-webkit-transition: all ease-out 0.3s; -o-transition: all ease-out 0.3s; -moz-transition: all ease-out 0.3s; -ms-transition: all ease-out 0.3s; transition: all ease-out 0.3s;} .close-w:hover{color: rgba(0,0,0,0.5);} .info-block-right { float: right; font-size: 10px; line-height: 18px; font-weight: 400; color: #7a8192; text-transform: uppercase; } .be-post-tag a { font-size: 11px; line-height: 16px; font-weight: 400; color: #a1a5b1; } .be-post-tag a:hover { color: #0D58C8; } .info-block i { padding-right: 5px; } .info-block span { cursor: pointer; white-space: nowrap; } .info-block span:not(:last-child), .info-block a:not(:last-child) { margin-right: 25px; } /*.info-block span:hover { color: #262626; }*/ .be-large-post .info-block.style-2 { margin-bottom: 50px; position: relative;} .be-post.style-2 { padding-top: 15px; padding-bottom: 15px; } .be-post.style-2 .be-post-date { font-size: 12px; line-height: 18px; font-weight: 400; color: #b4b7c1; margin: 0 15px 15px 15px; } .be-post.style-2 .be-post-date .fa { font-size: 18px; position: relative; top: 2px; margin-right: 5px; } .be-post.style-2 .be-post-title { padding-bottom: 0px; margin: 0 15px 15px 15px; border-bottom: none; } .be-post.style-2 .be-img-block:after { display: none; } .be-post.style-3 { padding-bottom: 15px; } .be-post.style-3 .be-post-title { padding-bottom: 0px; margin: 0 15px 15px 15px; border-bottom: none; min-height: initial; } .be-post.style-3 .be-img-block:after { display: none; } .be-post.style-4 { padding-bottom: 15px; } .be-post.style-4 .be-post-title { border-bottom: none; } .be-post.style-5 .be-img-block { margin-bottom: 0px; } .be-post.style-5 .be-rowline { margin: 0px 10px; padding: 10px 0px; } .be-post.style-5 .be-rowline + .be-rowline { border-top: 1px solid #edeff2; } .be-post.style-5 .rowline-img { float: left; width: 30px; height: 30px; margin-right: 15px; border-radius: 30px; } .be-post.style-5 .rowline-text { font-size: 11px; line-height: 30px; font-weight: 400; color: #b4b7c1; } .be-post.style-5 .rowline-icon { font-size: 13px; float: right; } .be-post.style-5 .author-post { font-size: 10px; line-height: 20px; font-weight: 400; padding: 10px; background: #f6f6f7; } .be-post.style-5 .author-post .fa { font-size: 14px; position: relative; top: 1px; margin-right: 3px; } .like-counter { float: right; } /* ================================== 07 - FOOTER ================================== */ footer { background: #222835; } .footer_slider .swiper-slide { position: relative; } .footer_slider .swiper-slide img { opacity: 0.2; } .footer_slider .swiper-slide img:hover { opacity: 1.0; } footer p a { color: #0d58c8; text-decoration: underline; } footer p a:hover { color: #fff; text-decoration: none; } .footer-main { padding: 46px 0; border-bottom: 1px solid #2e3542; } .footer-title { color: #FFF; font-size: 14px; font-family: 'Conv_helveticaneuecyr-bold'; margin-bottom: 20px; } footer p { line-height: 20px; color: #5d6372; font-size: 13px; margin-bottom: 20px; } .soc_buttons > li { color: #FFF; background: transparent; font-size: 15px; border-radius: 3px; text-align: center; width: 35px; height: 35px; display: inline-block; cursor: pointer; position: relative; margin-right: 5px; margin-bottom: 5px; border: 1px solid #414856; } .soc_buttons a { position: absolute; width: 100%; height: 100%; left: 0; top: 0; color: #FFF; } .soc_buttons .fa { position: absolute; top: 50%; left: 50%; -webkit-transform: translateY(-50%) translateX(-50%); -ms-transform: translateY(-50%) translateX(-50%); transform: translateY(-50%) translateX(-50%); } ul.soc_buttons > li:hover { background: #0d58c8; border: 1px solid #0d58c8; } .soc_buttons.light > li { background: #f6f6f7; border: 1px solid #edeff2; } .soc_buttons.light > li > a { color: #b4b7c1; } .soc_buttons.light > li:hover { background: #0d58c8; border: 1px solid #0d58c8; } .soc_buttons.light > li > a:hover { color: #fff; } .galerry a { float: left; } .galerry a:nth-child(4n+1) { clear: both; } .galerry img { margin: 8px; border-radius: 4px; width: 50px; opacity: 0.2; -webkit-transition: ease-out 0.1s all; transition: ease-out 0.1s all; } .galerry img:hover { opacity: 1.0; } .subscribe-form { position: relative; margin-bottom: 30px; } .subscribe-form input[type="text"] { font-size: 13px; width: 100%; height: 45px; border: none; background: transparent; color: #5d6372; padding: 15px; padding-right: 46px; border-radius: 4px; border: 1px solid #414856; } .subscribe-form input[type="email"] { font-size: 13px; width: 100%; height: 45px!important; border: none; background: transparent; color: #5d6372; padding: 15px; padding-right: 46px; border-radius: 4px; border: 1px solid #414856; } .subscribe-form input[type="submit"] { height: 100%; width: 100%; opacity: 0; } .submit-block { cursor: pointer; height: 45px; width: 45px; background: #0d58c8; position: absolute; right: 0; top: 0; border-radius: 4px; } .submit-block i { position: absolute; top: 0px; right: 50%; font-size: 22px; line-height: 45px; color: rgba(255, 255, 255, 0.7); -webkit-transform: translateX(50%); -ms-transform: translateX(50%); transform: translateX(50%); } .submit-block:hover i { color: #FFF; } .soc-activity { width: 100%; } .soc-activity .soc_ico_triangle { float: left; position: relative; color: #FFF; background: url(../img/soc-cloud.png); background-size: contain !important; background-repeat: no-repeat; font-size: 15px; text-align: center; width: 38px; height: 38px; vertical-align: top; } .soc-activity .soc_ico_triangle i { position: absolute; top: 50%; left: 45%; -webkit-transform: translateY(-60%) translateX(-55%); -ms-transform: translateY(-60%) translateX(-55%); transform: translateY(-60%) translateX(-55%); } .soc-activity .soc_ico_triangle:after { position: absolute; height: 10px; width: 10px; background: #0b0e14; } .soc-activity .message-soc { font-size: 12px; line-height: 20px; font-weight: 400; padding-left: 56px; padding-top: 8px; color: #5d6372; } .soc-activity .message-soc .date { display: block; margin-bottom: 6px; } a.account, a.heshtag { color: #0d58c8 !important; } a.account:hover, a.heshtag:hover { color: #fff !important; } a.heshtag { text-decoration: underline; } ul.link-list li { background: url(../img/list_marker.png); padding-left: 15px; background-repeat: no-repeat; background-position: 0 50%; margin-bottom: 10px; } ul.link-list li > a { font-size: 12px; line-height: 18px; font-weight: 400; color: #6b7180; } ul.link-list li > a:hover { color: #FFF !important; } span.white a { color: #FFF; font-family: 'Conv_helveticaneuecyr-bold'; } span.white a:hover { color: #337ab7; } span.left { text-align: left; } span.right { float: right; } .footer-end { width: 100%; overflow: hidden; color: #5d6372; font-size: 12px; } .footer-bottom { font-size: 13px; line-height: 18px; font-weight: 400; } .footer-bottom .footer-end { padding: 16.5px 0px; } .footer-bottom .left { float: left; } .footer-bottom .right { float: right; } .footer-bottom .copy { display: inline-block; margin-top: 8px; margin-right: 18px; } .footer-bottom .created { display: inline-block; margin-top: 8px; font-size: 12px; } .footer-bottom .btn { margin-bottom: 0px; } .footer-bottom .right .btn { margin-left: 10px; margin-right: 0px; } @media screen and (max-width: 991px) { .footer-list-footer > div:last-child { margin: 0; } .footer-list-footer li { display: inline-block; } footer .soc_buttons { margin-bottom: 15px; } footer .galerry { margin-bottom: 15px; overflow: hidden; } footer .soc-activity { margin-bottom: 20px; } .footer-block { margin-bottom: 20px; } .footer-main div[class^="col-"]:last-child .footer-block { margin-bottom: 0px; } .footer-bottom .left, .footer-bottom .right { float: none; } .footer-end .left { margin-bottom: 15px; } .footer-end .right .btn { margin-left: 0px; margin-right: 10px; margin-bottom: 10px; } } @media screen and (min-width: 992px) and (max-width: 1200px) { ul.soc_buttons > li { width: 25px; height: 25px; font-size: 12px; } } @media screen and (max-width: 767px) { .footer-list-footer li { display: block; line-height: 19px; } } /*=========================== 08 - LOADER ===========================*/ .be-loader { display: block; position: fixed; width: 100%; height: 100%; background: #FFF; z-index: 500; } .be-loader .spinner { position: absolute; top: 50%; left: 50%; -webkit-transform: translateY(-50%) translateX(-50%); -ms-transform: translateY(-50%) translateX(-50%); transform: translateY(-50%) translateX(-50%); } /*========================================= 09 - LARGE POPUPS ==========================================*/ .large-popup { display: none; position: fixed; top: 70px; width: 100%; height: 100%; left: 0; background: rgba(255, 255, 255, 0.9); z-index: 5000; } .large-popup-container { background: #1b212c; margin: 0; width: 100%; padding-top: 45px; padding-bottom: 45px; } .large-popup-content { position: relative; } .large-popup .input-signtype { width: 100%; line-height: 45px; border-radius: 2px; border: none; color: #b4b7c1; padding-left: 15px; margin-bottom: 20px; } .large-popup span { line-height: 20px; } .large-popup-title { color: #FFF; font-size: 20px; line-height: 18px; padding-left: 35px; margin-bottom: 20px; } .large-popup-text { display: inline; } .close-button, .message-popup .fa.close-button { position: absolute; top: -5px; color: #FFF; display: block; width: 25px; height: 25px; background: #0d58c8; font-size: 14px; text-align: center; padding-top: 5px; cursor: pointer; border-radius: 2px; } .close-button:hover { background: #0040b0; } .check-box { position: relative; display: inline-block; width: 20px; height: 20px; display: inline-block; background: #FFF; border-radius: 2px; border: 1px solid #000; cursor: pointer; transform: translateY(8px); -webkit-transform: translateY(8px); -moz-transform: translateY(8px); -ms-transform: translateY(8px); } .checkbox-input { width: 100%; height: 100%; position: absolute; visibility: hidden; } .check-box-sign { height: 100%; width: 100%; position: absolute; } .check-box > .checkbox-input:checked + .check-box-sign:after { content: "\f00c"; font-family: FontAwesome; color: #0d58c8; position: absolute; top: 50%; left: 50%; -webkit-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); } .link-large-popup { display:block; color:#727785; float:left; margin-right:15px;} .link-large-popup:hover { color: #0D58C8; } .be-checkbox { margin-bottom: 15px; } .be-popup-sign-button { float: right; color: #FFF; padding: 15px 30px; background: #0d58c8; font-size: 14px; border: none; border-radius: 2px; } .be-popup-sign-button:hover { background: #0040b0; } .be-date-block .large-popup-tex { display: block; } .large-popup span { color: #727785; } .be-custom-select { width: 100%; border: none; border-radius: 2px; -moz-appearance: none; -webkit-appearance: none; color: #b4b7c1; line-height: 45px; padding-left: 15px; cursor: pointer; height: 46px; } .be-date-block .large-popup-text { display: block; margin-bottom: 20px; } .be-custom-select-block { position: relative; margin-bottom: 20px; } .be-custom-select-block::after { content: "\f0d7"; font-family: FontAwesome; position: absolute; top: 50%; right: 15px; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); color: #b4b7c1; } .be-custom-select-block:hover::after { color: #0d58c8; } .be-date-block .be-custom-select-block { display: inline-block; } .be-date-block .be-custom-select-block { width: 130px; margin-right: 20px; } .be-custom-select-block .mounth { width: 225px; } .large-popup { overflow: auto; height: auto; bottom: 0; } @media screen and (max-width: 991px) { .be-date-block .be-custom-select-block { width: 100%; } .large-popup.register .be-popup-sign-button { float: left; } } /*========================================= 10 - COLOR PICKER ==========================================*/ .colors { width: 372px; } .color { box-sizing: border-box; width: 32px; height: 24px; border: 1px solid transparent; border-bottom: 1px solid rgba(255, 255, 255, 0.2); border-left: 1px solid rgba(255, 255, 255, 0.2); float: left; margin-right: -1px; } .color:hover { border: 2px solid #fff; border-right: 3px solid #fff; cursor: pointer; } .color.active-color { border: 2px solid #fff; border-right: 3px solid #fff; } .color:focus { outline: none; } @media screen and (max-width: 465px) { .colors { width: 100%; } .color { width: 8.5%; height: 20px; } .be-popup { width: 100% !important; } } .color-0-0 { background-color: #ccf3fc !important; } .color-0-1 { background-color: #cedffc !important; } .color-0-2 { background-color: #c1b9fc !important; } .color-0-3 { background-color: #d7b9fc !important; } .color-0-4 { background-color: #e8c6db !important; } .color-0-5 { background-color: #f0ced1 !important; } .color-0-6 { background-color: #f4d5cc !important; } .color-0-7 { background-color: #f8e3cb !important; } .color-0-8 { background-color: #f9e7cb !important; } .color-0-9 { background-color: #fef6d5 !important; } .color-0-10 { background-color: #f9f7d4 !important; } .color-0-11 { background-color: #e0e9ca !important; } .color-1-0 { background-color: #9fe6f6 !important; } .color-1-1 { background-color: #a1c1f6 !important; } .color-1-2 { background-color: #988cf7 !important; } .color-1-3 { background-color: #bc8cf7 !important; } .color-1-4 { background-color: #daa2c4 !important; } .color-1-5 { background-color: #e4a8ae !important; } .color-1-6 { background-color: #eab4a4 !important; } .color-1-7 { background-color: #f1cba1 !important; } .color-1-8 { background-color: #f2d2a0 !important; } .color-1-9 { background-color: #f9eaa7 !important; } .color-1-10 { background-color: #f1edaa !important; } .color-1-11 { background-color: #cbdba6 !important; } .color-2-0 { background-color: #73dbf3 !important; } .color-2-1 { background-color: #75a4f3 !important; } .color-2-2 { background-color: #7260f4 !important; } .color-2-3 { background-color: #a360f4 !important; } .color-2-4 { background-color: #d07eb0 !important; } .color-2-5 { background-color: #da828a !important; } .color-2-6 { background-color: #e3937c !important; } .color-2-7 { background-color: #ebb577 !important; } .color-2-8 { background-color: #eebf76 !important; } .color-2-9 { background-color: #f4dd7c !important; } .color-2-10 { background-color: #ece680 !important; } .color-2-11 { background-color: #bad083 !important; } .color-3-0 { background-color: #4ad0ef !important; } .color-3-1 { background-color: #4c88ef !important; } .color-3-2 { background-color: #4e38ef !important; } .color-3-3 { background-color: #8a38ef !important; } .color-3-4 { background-color: #c75a9c !important; } .color-3-5 { background-color: #d35c67 !important; } .color-3-6 { background-color: #dd7253 !important; } .color-3-7 { background-color: #e89f4d !important; } .color-3-8 { background-color: #ebac4b !important; } .color-3-9 { background-color: #efd154 !important; } .color-3-10 { background-color: #e8df56 !important; } .color-3-11 { background-color: #a9c75e !important; } .color-4-0 { background-color: #22c4ea !important; } .color-4-1 { background-color: #246dea !important; } .color-4-2 { background-color: #2b11ea !important; } .color-4-3 { background-color: #7211ea !important; } .color-4-4 { background-color: #c0348a !important; } .color-4-5 { background-color: #ce3543 !important; } .color-4-6 { background-color: #da522b !important; } .color-4-7 { background-color: #e68a22 !important; } .color-4-8 { background-color: #e99a20 !important; } .color-4-9 { background-color: #eac52d !important; } .color-4-10 { background-color: #e5db2c !important; } .color-4-11 { background-color: #99c039 !important; } .color-5-0 { background-color: #00b8e2 !important; } .color-5-1 { background-color: #0054e4 !important; } .color-5-2 { background-color: #1900d1 !important; } .color-5-3 { background-color: #5d00d1 !important; } .color-5-4 { background-color: #aa2175 !important; } .color-5-5 { background-color: #c21726 !important; } .color-5-6 { background-color: #cf370b !important; } .color-5-7 { background-color: #de7600 !important; } .color-5-8 { background-color: #df8700 !important; } .color-5-9 { background-color: #e5ba07 !important; } .color-5-10 { background-color: #e5d801 !important; } .color-5-11 { background-color: #85ac23 !important; } .color-6-0 { background-color: #0097b9 !important; } .color-6-1 { background-color: #0045bb !important; } .color-6-2 { background-color: #1400a8 !important; } .color-6-3 { background-color: #4b00a8 !important; } .color-6-4 { background-color: #8c165f !important; } .color-6-5 { background-color: #a10e1c !important; } .color-6-6 { background-color: #ae2b05 !important; } .color-6-7 { background-color: #b56000 !important; } .color-6-8 { background-color: #b66e00 !important; } .color-6-9 { background-color: #c39d00 !important; } .color-6-10 { background-color: #beb400 !important; } .color-6-11 { background-color: #6d8f17 !important; } .color-7-0 { background-color: #007692 !important; } .color-7-1 { background-color: #003793 !important; } .color-7-2 { background-color: #0f0081 !important; } .color-7-3 { background-color: #3a0081 !important; } .color-7-4 { background-color: #6e0d49 !important; } .color-7-5 { background-color: #810812 !important; } .color-7-6 { background-color: #8b1f00 !important; } .color-7-7 { background-color: #8d4b00 !important; } .color-7-8 { background-color: #8e5600 !important; } .color-7-9 { background-color: #9b7d00 !important; } .color-7-10 { background-color: #968e00 !important; } .color-7-11 { background-color: #55710f !important; } .color-8-0 { background-color: #00586d !important; } .color-8-1 { background-color: #00296e !important; } .color-8-2 { background-color: #0a005d !important; } .color-8-3 { background-color: #2a005d !important; } .color-8-4 { background-color: #4f0734 !important; } .color-8-5 { background-color: #60030b !important; } .color-8-6 { background-color: #661600 !important; } .color-8-7 { background-color: #693700 !important; } .color-8-8 { background-color: #693f00 !important; } .color-8-9 { background-color: #765e00 !important; } .color-8-10 { background-color: #716a00 !important; } .color-8-11 { background-color: #3d5208 !important; } .color-9-0 { background-color: white !important; } .color-9-1 { background-color: #e9e9e9 !important; } .color-9-2 { background-color: #d4d4d4 !important; } .color-9-3 { background-color: #bfbfbf !important; } .color-9-4 { background-color: #aaaaaa !important; } .color-9-5 { background-color: #959595 !important; } .color-9-6 { background-color: gray !important; } .color-9-7 { background-color: #6a6a6a !important; } .color-9-8 { background-color: #555555 !important; } .color-9-9 { background-color: #404040 !important; } .color-9-10 { background-color: #2b2b2b !important; } .color-9-11 { background-color: #161616 !important; } /*========================================= 11 - USER BLOCK ==========================================*/ .be-user-block { position: relative; padding: 30px 20px; border: 1px solid #edeff2; border-radius: 2px; margin-bottom: 20px; } .be-user-detail { text-align: center; margin-bottom: 30px; } .be-ava-user { width: 70px; height: 70px; display: inline-block; margin-bottom: 25px; } .be-ava-user > img { width: 70px; height: 70px; } .be-ava-user > img:hover { transform: scale(1.09); -webkit-transform: scale(1.09); -moz-transform: scale(1.09); -ms-transform: scale(1.09); } .be-ava-left { position: absolute; top: 70px; left: 15px; width: 100px; text-align: center; } .be-ava-right { position: absolute; top: 70px; right: 15px; width: 100px; text-align: center; } .be-use-name { color: #262626; font-size: 16px; font-family: 'Conv_helveticaneuecyr-bold'; margin-bottom: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block;} .be-user-info { color: #a1a5b1; font-size: 12px; } .be-user-activity-button { border-radius: 2px; line-height: 15px; display: block; line-height: 30px; font-size: 10px; position: relative; width: 100%; display: block; padding: 5px 5px 5px 30px; margin-bottom: 25px !important; } .be-user-activity-button i { position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); left: 13px; font-size: 12px; } .be-follow-type { color: #FFF !important; background: #0d58c8; } .be-follow-type:hover { color: #FFF !important; } .be-follow-type i { color: #8ba1dd; } .be-follow-type:hover { background: #0032a2; } .be-message-type:hover { background-color: #969696; color: #FFF !important; } .be-message-type { color: #7a8192 !important; background: #F6F6F6; border: 1px solid #edeff2; } .be-detail-header { border-bottom: 1px solid #edeff2; margin-bottom: 50px; } .be-detail-container { padding-top: 50px; } .be-user-counter { position: absolute; top: 15px; left: 15px; width: 57px; height: 57px; background: #0d58c8; border-radius: 57px; padding-top: 8px; } .be-user-counter .c_number { font-size: 14px; line-height: 21px; font-family: 'Conv_helveticaneuecyr-bold'; color: #fff; } .be-user-counter .c_text { font-size: 10px; line-height: 15px; font-weight: 400; color: #8da4e0; } .be-user-social { max-width: 240px; margin: 0 auto; border-bottom: 1px solid #EDEFF2; } .be-user-social { padding-bottom: 20px; margin-bottom: 20px; } .be-user-site { font-size: 13px; line-height: 18px; font-weight: 400; color: #b4b7c1; } .be-user-site:hover { color: #0D58C8; } .social-btn { position: relative; display: inline-block; width: 33px; height: 33px; color: #fff; line-height: 33px; text-align: center; margin: 0px 0px; border-radius: 2px; } .social-btn.color-1 { background: #3c599f; } .social-btn.color-2 { background: #1ab2e8; } .social-btn.color-3 { background: #dc4a38; } .social-btn.color-4 { background: #cc2028; } .social-btn.color-5 { background: #417199; } .social-btn.color-6 { background: #006699; } a.social-btn:hover { opacity: 0.6; color: #fff; } .be-user-statistic { position: relative; margin-left: -15px; margin-right: -15px; } .be-user-statistic:before { content: ''; display: block; position: absolute; top: -11px; left: 50%; margin-left: -11px; width: 0; height: 0; border-style: solid; border-width: 0 11.5px 11px 11.5px; border-color: transparent transparent #222835 transparent; } .be-user-statistic .stat-row { font-size: 13px; line-height: 18px; font-weight: 400; color: #6b7180; padding: 15px 29px 15px 29px; text-align: left; background: #222835; border-bottom: 1px solid #2e3542; } .be-user-statistic .stat-row:last-child { border-bottom: none; } .be-user-statistic .stat-counter { float: right; } .be-user-statistic .stat-icon { margin-right: 11px; } /*custom icons*/ .icon-views { display: inline-block; background: url("../img/icon-views.png") no-repeat; text-indent: -9999px; text-align: left; width: 16px; height: 10px; } .icon-views-b { display: inline-block; background: url("../img/icon-views-b.png") no-repeat; text-indent: -9999px; text-align: left; width: 16px; height: 10px; } .icon-like { display: inline-block; background: url("../img/icon-like.png") no-repeat; text-indent: -9999px; text-align: left; width: 16px; height: 15px; } .icon-like-b { display: inline-block; background: url("../img/icon-like-b.png") no-repeat; text-indent: -9999px; text-align: left; width: 16px; height: 15px; } .icon-followers { display: inline-block; background: url("../img/icon-followers.png") no-repeat; text-indent: -9999px; text-align: left; width: 16px; height: 15px; } .icon-followers-b { display: inline-block; background: url("../img/icon-followers-b.png") no-repeat; text-indent: -9999px; text-align: left; width: 16px; height: 15px; } .icon-following { display: inline-block; background: url("../img/icon-following.png") no-repeat; text-indent: -9999px; text-align: left; width: 16px; height: 15px; } .icon-following-b { display: inline-block; background: url("../img/icon-following-b.png") no-repeat; text-indent: -9999px; text-align: left; width: 16px; height: 15px; } .icon-load { display: inline-block; background: url("../img/icon-load.png") no-repeat; text-indent: -9999px; text-align: left; width: 16px; height: 15px; } .icon-comment { display: inline-block; background: url("../img/icon-comment.png") no-repeat; text-indent: -9999px; text-align: left; width: 16px; height: 15px; } .icon-projects { display: inline-block; background: url("../img/icon-projects.png") no-repeat; text-indent: -9999px; text-align: left; width: 16px; height: 16px; } .icon-creative { display: inline-block; background: url("../img/icon-creative.png") no-repeat; text-indent: -9999px; text-align: left; width: 16px; height: 16px; } .icon-features { display: inline-block; background: url("../img/icon-features.png") no-repeat; text-indent: -9999px; text-align: left; width: 16px; height: 16px; } .icon-worldwide { display: inline-block; background: url("../img/icon-worldwide.png") no-repeat; text-indent: -9999px; text-align: left; width: 16px; height: 16px; } .be-user-block.style-2, .be-user-block.style-3 { padding: 30px 15px 15px 15px; text-align: center; } .be-user-block.style-2 .be-use-name, .be-user-block.style-3 .be-use-name { font-size: 20px; line-height: 26px; font-weight: 400; margin-bottom: 5px; height: 26px; } .be-user-block.style-2 .be-user-info, .be-user-block.style-3 .be-user-info { font-size: 13px; line-height: 18px; font-weight: 400; margin-bottom: 10px; } .be-user-block.style-2 .be-text-tags, .be-user-block.style-3 .be-text-tags { border-bottom: 1px solid #edeff2; border-top: 1px solid #edeff2; padding: 15px 0px; margin-bottom: 20px; height: 50px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .be-user-block.style-2 .be-text-tags a, .be-user-block.style-3 .be-text-tags a { font-size: 13px; line-height: 18px; font-weight: 400; color: #b4b7c1; } .be-user-block.style-2 .be-text-tags a:hover, .be-user-block.style-3 .be-text-tags a:hover { color: #0D58C8; } .be-user-block.style-2 .info-block, .be-user-block.style-3 .info-block { background: transparent; padding: 0px; margin-bottom: 25px; } .be-user-block.style-2 .btn, .be-user-block.style-3 .btn { margin: 0 auto 30px auto; } .be-user-block.style-2 .be-user-detail, .be-user-block.style-3 .be-user-detail { margin-bottom: 60px; } .be-user-block.style-3 { padding: 30px 15px 0px 15px; margin-bottom: 48px; } .be-ava-user.style-2 { width: 115px; height: 115px; } .be-ava-user.style-2 > img { width: 115px; height: 115px; } .share-buttons { display: none; position: absolute; top: -1px; left: 100%; height: 35.5px; background: #f6f6f7; border: 1px solid #edeff2; border-left: none; z-index: 100; -webkit-border-top-right-radius: 2px; -webkit-border-bottom-right-radius: 2px; -moz-border-radius-topright: 2px; -moz-border-radius-bottomright: 2px; border-top-right-radius: 2px; border-bottom-right-radius: 2px; } .share-buttons a { display: inline-block; width: 66px; height: 33px; line-height: 33px; color: #fff; margin-top: 1px; border-radius: 2px; } .share-buttons a:hover { opacity: 0.6; } .btn.color-4 .share-buttons .fa { color: #fff; } .share-buttons a.color-1 { background: #3c599f; } .share-buttons a.color-2 { background: #1ab2e8; } .share-buttons a.color-3 { background: #cc2028; } .share-buttons a.color-4 { background: #006699; } .message-popup { display: none; position: fixed; top: 0px; right: 0px; bottom: 0px; left: 0px; background: rgba(19, 24, 34, 0.9); z-index: 9999; } .message-popup-inner { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .btn.btn-message .message-popup .fa { color: #fff; } .be-text-tags.style-2 { max-width: 240px; margin: 0 auto; } #content-block .be-user-wrapper .be-user-block.style-2 { margin-bottom: 30px; } .be-desc-block { margin-bottom: 20px; } .be-desc-author { position: relative; padding: 20px 30px; border: 1px solid #edeff2; } .be-desc-img { float: left; width: 70px; height: 70px; margin-bottom: 15px; border-radius: 70px; } .be-desc-label { font-size: 16px; line-height: 21px; font-family: 'Conv_helveticaneuecyr-bold'; color: #383b43; margin-bottom: 20px; } .be-desc-text { font-size: 13px; line-height: 22px; font-weight: 400; color: #a1a5b1; } .be-desc-author + .be-desc-author { border-top: none; } .be-desc-author + .be-desc-author:before { content: ''; display: block; position: absolute; top: -12px; left: 30px; width: 24px; height: 12px; background: url(../img/be-desc.jpg) no-repeat; } #content-block .be-change-ava { margin-bottom: 20px; } .be-change-ava .be-ava-user { margin-right: 20px; } @media screen and (max-width: 991px) { .be-detail-container { padding-top: 15px; } .share-buttons { height: auto; top: 100%; left: 17px; width: 35px; } .share-buttons a { display: block; } } .be-title { margin-bottom: 15px; color: #383b43; font-size: 13px; font-family: 'Conv_helveticaneuecyr-bold'; } .be-text-userblock { color: #a1a5b1; } .be-button-vidget { display: block; border-radius: 2px; text-align: center; margin-bottom: 20px; padding: 15px 0; } .be-button-vidget.blue-style { background: #0d58c8; color: #FFF !important; } .be-button-vidget.blue-style .fa { color: #8da4e0 !important; } .be-button-vidget .fa { margin-right: 5px; } .be-button-vidget.blue-style:hover { background: #0032a2; } .be-button-vidget.grey-style:hover { background-color: #969696; color: #FFF !important; } .be-button-vidget.grey-style { background: #F6F6F6; border: 1px solid #edeff2; color: #7a8192 !important; margin-bottom: 50px; } /*========================================= 11 - BE LARGE POST ==========================================*/ .be-large-post .info-block { margin-bottom: 25px; } .be-large-post .be-post-title:hover { text-decoration: none; cursor: pointer; } .be-text-tags { color: #b4b7c1; display: block; font-size: 12px; padding: 0px; margin-bottom: 35px; } .be-large-post .be-post-title { font-size: 24px; margin-bottom: 20px; padding-bottom: 20px; margin-left: 0; margin-right: 0; } .be-large-post-img { width: 100%; } .be-large-post-align { margin: 0 65px; } .be-large-post > img { padding-left: 0; } .be-large-post > img { margin-bottom: 50px; } .be-large-post .letf-menu-article { font-size: 16px; } .be-large-post { border: 1px solid #edeff2; border-radius: 2px; padding-bottom: 50px; margin-bottom: 50px; } .be-largepost-iframe { margin-bottom: 50px !important; padding-left: 0; } .be-comment-block { margin-bottom: 50px !important; border: 1px solid #edeff2; border-radius: 2px; padding: 50px 70px; } .image-block { position: relative; } .image-block .image-text { position: absolute; bottom: 45px; left: 50px; right: 50px; color: #fff; opacity: 0.8; } @media screen and (max-width: 767px) { .be-comment-block { padding: 15px; padding-bottom: 30px; } } .be-img-comment { width: 60px; height: 60px; float: left; margin-bottom: 15px; } .be-comment-content { margin-left: 80px; } .comments-title { font-size: 16px; color: #262626; margin-bottom: 15px; font-family: 'Conv_helveticaneuecyr-bold'; } .about-comment-block { font-size: 12px; color: #b4b7c1; margin-bottom: 50px; } .be-signup-link { color: #0d58c8 !important; margin: 0 2px; font-family: 'Conv_helveticaneuecyr-bold'; font-size: 10px; } .be-signup-link:hover { color: #0d58c8 !important; } .be-comment-name { font-size: 13px; font-family: 'Conv_helveticaneuecyr-bold'; } .be-comment-time { font-size: 11px; color: #b4b7c1; } .be-comment-text { font-size: 13px; line-height: 18px; color: #7a8192; display: block; background: #f6f6f7; border: 1px solid #edeff2; padding: 20px; } .be-comment-content span { display: inline-block; width: 49%; margin-bottom: 15px; } .be-comment-content a { color: #383b43; } .be-comment-content a:hover { color: #0D58C8; } .be-comment-time { text-align: right; } .be-comment-info { margin-bottom: 15px; } .be-ava-comment { width: 60px; height: 60px; border-radius: 50%; } .be-comment-block .children { list-style: none;} .be-comment-block .children .children { margin-left: 40px;} @media screen and (max-width: 767px) { .be-comment-content { margin: 0; } .be-comment-content span { width: 100%; text-align: center; display: block; } .be-img-comment { width: 100%; text-align: center; } } .be-comment-time .fa { font-size: 18px; transform: translateY(2px); -webkit-transform: translateY(2px); -moz-transform: translateY(2px); -ms-transform: translateY(2px); margin-right: 8px; } .be-comment:not(:last-child) { margin-bottom: 30px; } .be-hh { text-align: center; } .be-button-showing:hover { color: #FFF !important; background: #0032a2; text-align: center; } .be-button-showing { background: #0d58c8; color: #FFF !important; padding: 15px 35px; border-radius: 2px; font-size: 10px; } .pagination { text-align: center; width: 100%; } .swiper-pagination-switch { display: inline-block; width: 7px; height: 7px; background: #F6F6F6; cursor: pointer; border-radius: 50%; margin: 0 10px; } .swiper-active-switch { background: #0d58c8; } .hidden { display: none; } .thumbnails-preview .swiper-slide { position: relative; background-size: cover; background-position: center; } .slider-text { position: absolute; left: 70px; right: 70px; bottom: 25px; font-size: 13px; line-height: 22px; font-weight: 400; color: #fff; opacity: 0.8; } .blog-content .thumbnails-preview img { margin-bottom: 0px; } .blog-content .thumbnails img { margin-top: 0px; cursor: pointer; } .thumbnails .swiper-slide { position: relative; opacity: 1; } .thumbnails .swiper-slide:before { content: ''; position: absolute; top: 0px; left: 0px; right: 0px; bottom: 0px; background: rgba(34, 40, 53, 0.8); -webkit-transition: ease-out 0.2s all; transition: ease-out 0.2s all; cursor: pointer; } .thumbnails .swiper-slide.current:before, .thumbnails .swiper-slide:hover:before { background: transparent; } .swiper-container.thumbnails .swiper-slide img { width: 100%; cursor: pointer; } @media screen and (min-width: 992px) { .swiper-container.thumbnails .swiper-slide:hover { opacity: 1; } } .be-large-post-slider { margin-bottom: 50px !important; padding: 0; } @media screen and (min-width: 992px){ .be-large-post-slider.type-wide{margin: 0 -65px;} } /*================= NEW CSS =================*/ /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 04 - SHORTCODES */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .subblock { margin-bottom: 55px; } .subblock-title { font-size: 20px; line-height: 30px; font-family: 'Conv_helveticaneuecyr-bold'; margin-bottom: 25px; } .subblock .swiper-arrow-left, .subblock .swiper-arrow-right{position: relative; top:0;left:0;right:0;bottom:0;-webkit-transform: none;-o-transform: none;-moz-transform: none;-ms-transform: none;transform: none; display: inline-block; float: none; margin: 0 10px;} .subblock .type-1{background: #86abe3 !important; color: #fff !important;} .subblock .type-1:after{color: #fff;} .subblock .type-1:hover{background: #0d58c8 !important;} .subblock .type-2{background: #9b9da1 !important; color: #fff !important;} .subblock .type-2:hover{background: #111111 !important;} .subblock .type-2:after{color:#fff !important;} .subblock .pagination{text-align: left; margin: 0;} /*buttons*/ .btn { display: inline-block; font-size: 12px; line-height: 12px; font-weight: 400; color: #fff; text-transform: uppercase; margin-bottom: 10px; margin-right: 27px; border-radius: 3px; } .btn.color-1 { background: #0d58c8; border: 1px solid #0d58c8; } .btn.color-1 .fa { color: #8ba1dd; } .btn.color-2 { background: #383b43; color: #fff; } .btn.color-2 .fa { color: #7a8192; } .btn.color-3 { background: #fff; color: #7a8192; border: 1px solid #7a8192; } .btn.color-3 .fa { color: #7a8192; } .btn.color-4 { background: #f6f6f7; color: #7a8192; border: 1px solid #edeff2; } .btn.color-4 .fa { color: #7a8192; } .btn.color-5 { background: transparent; border: 1px solid #edeff2; color: #b4b7c1; } .btn.color-6 { background: #7a8192; color: #fff; } .btn.color-7 { background: transparent; color: #9fa5b5; border: 1px solid #414856; } .btn.size-1 { padding: 15px 28px; } .btn.size-2 { font-size: 10px; line-height: 10px; padding: 12px 19px 10px 19px; } .btn.size-3 { font-size: 9px; line-height: 9px; padding: 9px 10px; } .btn.size-4 { font-size: 10px; line-height: 10px; padding: 19px; } .site-map{padding-top: 50px;} .site-map h1{margin-bottom: 25px;} .site-map li li{margin-left: 15px;} .site-map li ul{margin-top: 15px;} .btn.active { box-shadow: none; } .btn.hover-1:hover, .btn.hover-1.active { background: transparent; border: 1px solid #0d58c8; color: #0d58c8; } .btn.hover-1:hover .fa, .btn.hover-1.active .fa { color: #0d58c8; } .btn.hover-2:hover, .btn.hover-2.active { background: transparent; border: 1px solid #0d58c8; color: #fff; } .btn.hover-3:hover, .btn.hover-3.active { background: transparent; border: 1px solid #383b43; color: #383b43; } .btn.hover-4:hover, .btn.hover-4.active { background: transparent; border: 1px solid #383b43; color: #fff; } .btn.hover-5:hover, .btn.hover-5.active { background: #7a8192; border: 1px solid #7a8192; color: #fff; } .btn.hover-6:hover, .btn.hover-6.active { background: transparent; border: 1px solid #7a8192; color: #fff; } .btn.hover-7:hover, .btn.hover-7.active { background: transparent; border: 1px solid #edeff2; color: #7a8192; } .btn.hover-8:hover, .btn.hover-8.active { background: transparent; border: 1px solid #edeff2; color: #fff; } .btn.hover-9:hover, .btn.hover-9.active { background: #0d58c8; border: 1px solid #0d58c8; color: #fff; } .btn.hover-9:hover .fa, .btn.hover-9.active .fa { color: #fff; } .btn.hover-10:hover, .btn.hover-10.active { background: transparent; border: 1px solid #7A8192; color: #7A8192; } .btn.hover-10:hover .fa, .btn.hover-10.active .fa { color: #7A8192; } .btn.full { width: 100%; margin-right: 0px; } .btn.btn-right { float: right; margin-right: 0px; margin-left: 20px; } .btn.btn-input { margin-top: 33px; } .btn .fa { margin-right: 10px; } /*inputs*/ .form-group { position: relative; margin-bottom: 30px; } .form-group .form-input { font-size: 13px; line-height: 1.5em; font-weight: 400; color: #b4b7c1; width: 100%; height: 50px; padding-left: 20px; padding-right: 20px; border: 1px solid #edeff2; border-radius: 3px; } .form-group textarea.form-input { height: 150px; } .form-group .form-group-icon { position: absolute; top: 50%; right: 20px; color: #b4b7c1; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .form-group.fg_icon .form-input { padding-right: 40px; } .form-group.fl_icon .form-input { padding-left: 70px; } .form-group.fl_icon .icon { position: absolute; top: 1px; left: 1px; width: 48px; height: 48px; background: #f6f6f7; color: #b5b8c2; text-align: center; line-height: 50px; -webkit-border-top-left-radius: 2px; -webkit-border-bottom-left-radius: 2px; -moz-border-radius-topleft: 2px; -moz-border-radius-bottomleft: 2px; border-top-left-radius: 2px; border-bottom-left-radius: 2px; } .form-group.fl_icon img{ display: inline-block; position: relative;bottom: 4px; } .form-group.color-2 .form-input { background: #f6f6f7; } .form-group.color-3 .form-input { background: #383b43; color: #fff; } .form-group.color-4 .form-input { background: #0d58c8; color: #fff; } .form-group.focus-2 .form-input:focus { background: #f6f6f7; } #content-block .input-col .form-group { margin-bottom: 30px; } #content-block .input-col:last-child .form-group { margin-bottom: 0px; } .form-label { font-size: 13px; line-height: 18px; font-weight: 400; color: #383b43; margin-bottom: 15px; } #content-block .form-block .form-input { margin-bottom: 20px; } /*ckeckbox*/ .form-checkbox { position: relative; margin-bottom: 15px; } .form-checkbox > input { position: absolute; width: 20px; height: 20px; z-index: 2; opacity: 0; } .form-checkbox > input + .check { position: relative; top: 5px; display: inline-block; width: 20px; height: 20px; border: 1px solid #edeff2; color: #0d58c8; cursor: pointer; z-index: -1; } .form-checkbox > input + .check .fa { position: absolute; top: 2px; left: 2px; display: none; opacity: 0; } .form-checkbox > input:checked + span .fa { display: block; opacity: 1; } .form-checkbox.style-2 > input + .check { border-radius: 20px; } .form-checkbox.style-2 > input + .check .fa { display: none; } .form-checkbox.style-2 > input:checked + .check:before { content: ''; display: block; width: 8px; height: 8px; position: absolute; top: 50%; left: 50%; margin-top: -4px; margin-left: -4px; background: #4a82d6; border-radius: 8px; } /*alerts*/ .alert { position: relative; font-size: 13px; line-height: 22px; color: #7a8192; padding: 21px 21px 21px 60px; background: #f6f6f7; border: 1px solid #edeff2; margin-bottom: 20px; border-radius: 3px; } .alert .close { position: absolute; top: 21px; left: 21px; width: 24px; height: 24px; font-size: 11px; background: #0d58c8; color: #fff; opacity: 1; border-radius: 3px; } .alert .alert-title { font-size: 14px; line-height: 18px; font-family: 'Conv_helveticaneuecyr-bold'; color: #383b43; margin-bottom: 10px; } .alert.style-2 { background: #0d58c8; color: #8ba1dd; } .alert.style-2 .close { background: #fff; color: #5b5e64; } .alert.style-2 .alert-title { color: #fff; } .alert.style-3 { background: #383b43; color: #b4b7c1; } .alert.style-3 .alert-title { color: #fff; } /*accordion*/ .accordion.style-1 { border: 1px solid #edeff2; border-radius: 2px; } .accordion.style-1 .acc-title { position: relative; font-size: 13px; line-height: 18px; color: #b4b7c1; background: #f6f6f7; padding: 11px 45px 11px 15px; cursor: pointer; border-bottom: 1px solid #edeff2; } .accordion.style-1 .acc-panel:last-child .acc-title { border-bottom: 0px; } .accordion.style-1 .acc-title.active { background: #0d58c8; color: #fff; } .accordion.style-1 .acc-title:after { content: "\f078"; display: inline-block; position: absolute; top: 0px; right: 15px; font: normal normal normal 14px/1 FontAwesome; font-size: 14px; line-height: 37px; color: transparent; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } .accordion.style-1 .acc-title.active:after { color: #8da4e0; } .accordion.style-1 .acc-body { display: none; font-size: 13px; line-height: 18px; padding: 27px 40px 25px 40px; } .accordion.style-1 .acc-body.active { display: block; } .accordion.style-1 .acc-body p { margin-bottom: 15px; } .accordion.style-1 .acc-body a { color: #b4b7c1; } .accordion.style-1 .acc-body a:hover { color: #0d58c8; } .accordion.style-2 .acc-panel { margin-bottom: 10px; border: 1px solid #edeff2; } .accordion.style-2 .acc-panel:last-child .acc-title { border-bottom: 0px; } .accordion.style-2 .acc-title { position: relative; font-size: 14px; line-height: 21px; color: #383b43; background: #fff; padding: 14px 45px 14px 70px; cursor: pointer; } .accordion.style-2 .acc-icon { position: absolute; top: 0px; left: 0px; bottom: 0px; width: 50px; background: #f6f6f7; } .accordion.style-2 .acc-icon:before { content: "\f067"; position: absolute; top: 50%; left: 50%; display: block; width: 14px; height: 14px; margin-top: -7px; margin-left: -7px; color: #b4b7c1; text-align: center; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); } .accordion.style-2 .acc-title.active { background: #f6f6f7; border-bottom: 1px solid #edeff2; } .accordion.style-2 .acc-title.active .acc-icon { background: #0d58c8; } .accordion.style-2 .acc-title.active .acc-icon:before { content: "\f068"; color: #8da4e0; } .accordion.style-2 .acc-body { display: none; background: #f6f6f7; color: #7a8192; font-size: 13px; line-height: 22px; padding: 25px 30px 25px 30px; } .accordion.style-2 .acc-body.active { display: block; } .accordion.style-2 .acc-body p { margin-bottom: 20px; } .archive-link { display: block; } .archive-link .count { float: right; } #content-block .gal-vidget img { margin-bottom: 20px; } /*custom rows*/ .row20 { margin-right: -10px; margin-left: -10px; } .row20 div[class^="col-"] { padding-right: 10px; padding-left: 10px; } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 04 - COLLECTIONS */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .collection { font-size: 10px; line-height: 15px; font-weight: 400; color: #b4b7c1; margin-bottom: 45px; } .collection-header { margin-bottom: 18px; } .edit-collection { float: right; cursor: pointer; position: relative; } .edit-collection .c_edit { display: none; position: absolute; bottom: 100%; right: 0px; } .collection span { margin-right: 25px; } .collection .fa { position: relative; top: 1px; font-size: 14px; margin-right: 5px; } .collection a { color: #383b43; } .collection a:hover { color: #0D58C8; } .menu-article { font-size: 16px; line-height: 20px; font-family: 'Conv_helveticaneuecyr-bold'; color: #383b43; margin-bottom: 15px; } .collection-entry { padding: 10px; border: 1px solid #edeff2; border-radius: 3px; } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 04 - BLOG */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .blog-filter { text-align: center; margin-bottom: 40px; } .blog-filter .btn { margin-right: 10px; } .blog-filter .btn:last-child { margin-right: 0px; } #content-block .blog-filter .btn:last-child { margin-bottom: 10px; } .blog-post { border: 1px solid #edeff2; border-radius: 5px; overflow: hidden; margin-bottom: 50px; } .blog-post .post-desc { margin-top: 24px; margin-right: 40px; } .blog-post .post-category {border-bottom: 1px solid #edeff2;} .blog-post .post-category, .blog-post .post-category a { font-size: 11px; line-height: 16px; font-weight: 400; color: #b4b7c1; padding-bottom: 24px; margin-bottom: 24px; } .blog-post .post-label { display: block; font-size: 24px; line-height: 26px; font-weight: 400; color: #383b43; margin-bottom: 20px; } .blog-post a.post-label:hover { color: #0d58c8; } .blog-post .post-text { font-size: 12px; line-height: 22px; color: #b4b7c1; padding-bottom: 27px; margin-bottom: 23px; border-bottom: 1px solid #edeff2; } .blog-post .author-post { padding-left: 0px; } .blog-post .post-image { display: block; overflow: hidden; } .blog-post .post-image img { -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; } .blog-post .post-image:hover img { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .blog-post .post-image.play { position: relative; } .blog-post .post-image.play:before { content: ''; display: block; position: absolute; top: 50%; left: 50%; width: 60px; height: 60px; margin-left: -30px; margin-top: -30px; background: url(../img/play.png) no-repeat; z-index: 100; } .blog-post.be-large-post .post-preview { margin-bottom: 50px; } .blog-post.be-large-post .post-text { margin-bottom: 20px; padding-bottom: 0px; border-bottom: none; } .blog-post.be-large-post .info-block .be-text-tags { float: right; } .blog-post.be-large-post .post-date { float: left; } .blog-post.be-large-post .author-post { float: right; } .blog-post.be-large-post .post-date .fa { font-size: 16px; position: relative; top: 1px; } .blog-list .info-block { padding-left: 30px; margin-left: -30px; margin-right: -40px !important; } .blog-grid .post-header { padding: 14px 18px; } .blog-grid .post-header .post-date { float: left; font-size: 12px; font-weight: 400; color: #b4b7c1; } .blog-grid .post-header .post-date .fa { font-size: 16px; position: relative; top: 1px; } .blog-grid .post-header .author-post { float: right; } .blog-grid .post-desc { padding: 25px 20px 0px 20px; margin: 0px; } .blog-grid .post-category,.blog-grid .post-category a { font-size: 10px; line-height: 15px; } .blog-grid .post-text { border-bottom: none; padding-bottom: 0px; margin-bottom: 15px; } .blog-grid .blog-post .btn { margin-bottom: 30px; } .blog-grid .grid-item:nth-child(3n+1) { clear: both; } .blog-grid .info-block { padding-left: 30px; margin-left: -30px; margin-right: -40px; } #content-block .blog-grid .blog-post { margin-bottom: 50px; } .pagination { text-align: center; } .pagination .page-left { float: left; display: block; height: 35px; line-height: 35px; text-transform: lowercase; padding: 0px 20px; } .pagination .page-right { float: right; display: block; height: 35px; line-height: 35px; text-transform: lowercase; padding: 0px 20px; } .pagination .pages .btn { width: 35px; padding: 10.5px 0px; margin-right: 8px; } #content-block .pagination .pages .btn:last-child { margin-bottom: 10px; } .simple-slider .pagination { position: absolute; bottom: 0px; left: 0px; margin-bottom: 11px !important; } .simple-slider .pagination .swiper-pagination-switch { margin: 0 5px; } blockquote { position: relative; font-size: 24px; line-height: 34px; font-family: 'Conv_helveticaneuecyr-bold'; color: #383b43; text-transform: uppercase; padding: 40px 130px 50px 130px; background: #f6f6f7; border: none; } blockquote p { margin-bottom: 10px; } blockquote footer { font-size: 12px; line-height: 16px; font-weight: 400; color: #383b43; text-align: right; text-transform: none; background: transparent; margin-right: -60px; } blockquote:before { content: ''; position: absolute; top: 30px; left: 70px; display: block; width: 32px; height: 28px; background: url(../img/blockquote-l.png) no-repeat; } blockquote:after { content: ''; position: absolute; bottom: 40px; right: 70px; display: block; width: 32px; height: 28px; background: url(../img/blockquote-r.png) no-repeat; } .blog-content { margin-bottom: 45px; } .blog-content .post-text { font-size: 13px; line-height: 22px; font-weight: 400; color: #a1a5b1; } .blog-content p { margin-bottom: 25px; } .blog-content img { max-width: 100%; margin-top: 20px; margin-bottom: 45px; } .blog-content .author-post img { margin-top: 0px; margin-bottom: 0px; } .blog-content img[align="left"] { margin-right: 30px; } .blog-content img[align="right"] { margin-left: 30px; } .blog-content .img-fullblog { max-width: 1920px; margin-left: -65px; margin-right: -65px; } .blog-content .img-leftblog { margin-left: -65px; } .blog-content .img-rightblog { max-width: 1920px; margin-right: -65px; } .blog-content blockquote { margin-left: -65px; margin-right: -65px; margin-bottom: 25px; } .blog-content .embed-responsive { margin-bottom: 50px; } .blog-content .image-block { margin-top: 45px; margin-bottom: 45px; } .blog-content .image-block img { margin-top: 0px; margin-bottom: 0px; } .blog-content .image-block + img { margin-top: 0px; } /*list*/ /* set default ul ol styles */ .blog-content ul, .blog-content ol, .be-comment-content ul, .be-comment-content ol { margin-left: 40px;} .blog-content ol > li, .be-comment-content ol > li { list-style-type: decimal;} .blog-content li, .be-comment-content li { margin-bottom: 0 !important; line-height: 3em; } .blog-content ul, ul.styled { margin-bottom: 25px; } .blog-content ul li, ul.styled li { position: relative; font-size: 13px; font-weight: 400; color: #7a8192; } .blog-content ul>li:before, ul.styled > li:before,.be-comment-content ul>li:before { content: ''; display: inline-block; position: relative; top: -2px; width: 5px; height: 5px; margin-right: 13px; border-radius: 5px; background: #0d58c8; } .blog-content ul.style-2 li, ul.styled.style-2 li { padding-left: 23px; } .blog-content ul.style-2 li:before, ul.styled.style-2 li:before { content: "\f00c"; position: absolute; top: 1px; left: 0px; width: auto; height: auto; background: transparent; display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); transform: translate(0, 0); color: #0d58c8;} .blog-content ul.style-3 li, ul.styled.style-3 li { padding-left: 26px; } .blog-content ul.style-3 li:before, ul.styled.style-3 li:before { display: none; } .blog-content ul.style-3 li .fa, ul.styled.style-3 li .fa { position: absolute; top: 0px; left: 0px; color: #b9bcc5; } ol.styled { list-style: none; margin-bottom: 20px; } ol.styled li { position: relative; counter-increment: section; font-size: 13px; line-height: 18px; font-weight: 400; color: #7a8192; padding-left: 35px; margin-bottom: 15px; } ol.styled li:before { content: counter(section); position: absolute; top: -5px; left: 0px; display: inline-block; width: 25px; height: 25px; border-radius: 25px; background: #0d58c8; color: #fff; text-align: center; padding-top: 4px; padding-right: 1px; } .be-bottom.right { text-align: right; } .be-bottom-title { margin-bottom: 15px; } #content-block .be-bottom .soc_buttons li:last-child { margin-bottom: 5px; } /*tabs*/ .tab-wrapper.style-1 .nav-tab, .tab-wrapper.style-2 .nav-tab, .tab-wrapper.style-3 .nav-tab { border-bottom: 1px solid #edeff2; } .tab-wrapper.style-1 .nav-tab-item, .tab-wrapper.style-2 .nav-tab-item, .tab-wrapper.style-3 .nav-tab-item { display: block; float: left; cursor: pointer; background: #f6f6f7; border: 1px solid #edeff2; } .tab-wrapper.style-1 .nav-tab-item, .tab-wrapper.style-2 .nav-tab-item, .tab-wrapper.style-3 .nav-tab-item { -webkit-border-top-left-radius: 2px; -webkit-border-top-right-radius: 2px; -moz-border-radius-topleft: 2px; -moz-border-radius-topright: 2px; border-top-left-radius: 2px; border-top-right-radius: 2px; } .tab-wrapper.style-1 .nav-tab-item span, .tab-wrapper.style-2 .nav-tab-item span, .tab-wrapper.style-3 .nav-tab-item span { display: block; font-size: 13px; line-height: 13px; padding: 16.5px 30px; } .tab-wrapper.style-1 .nav-tab-item.active, .tab-wrapper.style-2 .nav-tab-item.active, .tab-wrapper.style-3 .nav-tab-item.active { background: #fff; color: #383b43; border-bottom: 1px solid #fff; } .tab-wrapper.style-1 .tab-nav-wrapper, .tab-wrapper.style-2 .tab-nav-wrapper, .tab-wrapper.style-3 .tab-nav-wrapper { margin-bottom: 40px; } .tab-wrapper.style-1 .tab-info, .tab-wrapper.style-2 .tab-info, .tab-wrapper.style-3 .tab-info { display: none; } .tab-wrapper.style-1 .tab-info.active, .tab-wrapper.style-2 .tab-info.active, .tab-wrapper.style-3 .tab-info.active { display: block; } .tab-wrapper.style-2 .nav-tab { border-bottom: none; } .tab-wrapper.style-3 .tab-nav-wrapper { margin-bottom: 0px; } .tab-wrapper.style-3 .tabs-content { border: 1px solid #edeff2; border-top: none; } #content-block .tab-wrapper.style-1 .nav-tab-item, #content-block .tab-wrapper.style-3 .nav-tab-item { margin-bottom: -1px; } .tab-wrapper.color-2 .nav-tab-item { background: #383b43; color: #848891; border: 1px solid #2d3038; } .tab-wrapper.color-2 .nav-tab-item.active { border: 1px solid #edeff2; border-bottom: 1px solid #fff; } @media (max-width: 1199px) { .blog-content .img-fullblog { width: 696px; } .blog-fullwith .blog-content .img-fullblog { width: 778px; } } @media (max-width: 991px) { .blog-post .post-preview { max-width: 600px; margin: 0 auto; } .blog-content img[align="left"] { width: 100%; } .blog-content .img-leftblog { margin-left: 0px; } .blog-content .img-fullblog { width: 531px; } .blog-fullwith .blog-content .img-fullblog { width: 720px; } } @media (min-width: 768px) and (max-width: 991px) { .blog-grid .grid-item:nth-child(3n+1) { clear: none; } .blog-grid .grid-item:nth-child(2n+1) { clear: both; } } @media (max-width: 767px) { .blog-list .post-desc { margin-right: 0px; padding-left: 20px; padding-right: 20px; } #content-block ul.styled { margin-bottom: 25px; } #content-block .be-bottom { margin-bottom: 30px; } #content-block .be-bottom.right { text-align: left; margin-bottom: 0px; } .be-large-post-align, .info-block .be-large-post-align { margin: 0 15px; } .blog-post.be-large-post .info-block .be-text-tags { float: none; } .tab-wrapper.style-1 .nav-tab-item, .tab-wrapper.style-2 .nav-tab-item, .tab-wrapper.style-3 .nav-tab-item { float: none; } #content-block .tab-wrapper.style-1 .nav-tab-item.active:last-child, #content-block .tab-wrapper.style-2 .nav-tab-item.active:last-child, #content-block .tab-wrapper.style-3 .nav-tab-item.active:last-child { margin-bottom: 0px; } .blog-content .img-fullblog { margin-left: 0px; margin-right: 0px; width: 100%; } .blog-fullwith .blog-content .img-fullblog { width: 100%; } } @media (max-width: 600px) { .pagination .pages { clear: both; } } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 04 - CONTACT */ /*-------------------------------------------------------------------------------------------------------------------------------*/ span.num-data{font-size: 11px;} .contact-info { border: 1px solid #edeff2; border-radius: 5px; margin-bottom: 40px; } .contact-header { padding: 25px 30px; } #content-block .contact-entry { margin-bottom: 50px; } .contact-entry img{display: inline-block;margin-right: 5px; max-width: 22px; max-height: 22px; position: relative;bottom: 2px;} .contact-label { position: relative; font-size: 12px; line-height: 18px; font-weight: 400; color: #a1a5b1; padding-bottom: 15px; margin-bottom: 15px; border-bottom: 1px solid #edeff2; } .contact-label .fa { font-size: 22px; color: #0d58c8; margin-right: 5px; } .contact-text, .contact-text a { font-size: 13px; line-height: 18px; font-family: 'Conv_helveticaneuecyr-bold'; color: #383b43; } .contact-text a:hover { color: #0d58c8; } .contact-text p { margin-bottom: 8px; } #map-canvas { height: 660px; background: #485b77; } .contect-form { padding: 50px 70px; border: 1px solid #edeff2; } @media (max-width: 767px) { .contect-form { padding: 15px 20px; } } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 04 - ABOUT US */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .about-description { margin-bottom: 85px; } .about-description .img-responsive { margin-bottom: 10px; } .about-description .about-text { font-size: 12px; line-height: 20px; font-weight: 400; color: #b4b7c1; text-align: center; } .team-entry { border: 1px solid #edeff2; border-radius: 3px; } .team-name { font-size: 14px; line-height: 20px; font-family: 'Conv_helveticaneuecyr-bold'; padding: 15px; text-align: center; border-bottom: 1px solid #edeff2; } .team-position { padding: 14px 15px; text-align: center; color: #B4B7C1; } .team-social { background: #f6f6f7; padding: 0px 15px; text-align: center; } .team-social a { display: inline-block; padding: 18px 17px; font-size: 13px; color: #d2d4d8; } .team-social a:hover { color: #0d58c8; } .testimonals-entry { border: 1px solid #edeff2; padding: 50px; border-radius: 4px; } .testimonals-img { display: block; width: 100px; height: 100px; margin: 0 auto 15px auto; border-radius: 100px; } .testimonals-name { font-size: 20px; line-height: 20px; font-weight: 400; color: #383b43; text-align: center; margin-bottom: 15px; } .testimonals-text { font-size: 12px; line-height: 20px; font-weight: 400; color: #b4b7c1; text-align: center; padding-top: 15px; } .testimonals-text.profes {padding-top:0; font-size: 15px;} .service-entry { text-align: center; } .service-icon { margin-bottom: 40px; } .service-title { font-size: 20px; line-height: 24px; font-weight: 400; color: #383b43; margin-bottom: 15px; } .service-text { font-size: 12px; line-height: 20px; font-weight: 400; color: #b4b7c1; margin-bottom: 35px; } .service-entry .btn { margin-right: 0px; } .counters-block { position: relative; background-size: cover; background-position: center center; padding: 100px 0px; margin-bottom: 85px; } .counters-block:before { content: ""; display: block; position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; background: rgba(24, 29, 39, 0.8); } .counter-entry { text-align: center; } .counter-entry .stat-number { font-size: 50px; line-height: 60px; font-family: 'Conv_helveticaneuecyr-bold'; color: #fff; } .counter-label { display: inline-block; font-size: 14px; line-height: 20px; font-family: 'Conv_helveticaneuecyr-bold'; color: #fff; padding-bottom: 5px; border-bottom: 5px solid #0d58c8; margin-bottom: 25px; } .counter-text { font-size: 13px; line-height: 22px; font-weight: 400; color: #fff; opacity: 0.5; margin-bottom: 25px; } .counter-entry .btn { margin-right: 0px; margin-bottom: 0px; } .info-blocks { background: #fafafa; margin-bottom: 85px !important; } .info-text .block-title { font-size: 32px; line-height: 40px; font-family: 'Conv_helveticaneuecyr-bold'; color: #383b43; margin-bottom: 42px; } .info-text h4 { font-size: 16px; line-height: 21px; font-family: 'Conv_helveticaneuecyr-bold'; color: #383b43; margin-bottom: 20px; } .info-text h4 .fa { font-size: 24px; margin-right: 5px; color: #bfc2ca; } .info-text p { font-size: 13px; line-height: 22px; font-weight: 400; color: #a1a5b1; margin-bottom: 20px; } @media (max-width: 991px) { #content-block .team-entry { margin-bottom: 30px; } #content-block .counter-entry { margin-bottom: 30px; } } @media (max-width: 767px) { #content-block .service-entry { margin-bottom: 30px; } .info-entry.right img { margin-top: 20px; } .info-text { padding-top: 50px; } .info-blocks .table-block, .info-blocks .table-row, .info-blocks .table-cell { display: block; } } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 04 - BLOCK */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .block { margin-bottom: 85px !important; } .block .block-title { font-size: 32px; line-height: 28px; margin-bottom: 10px; text-align: center; font-family: 'Conv_helveticaneuecyr-bold'; } .block .block-subtitle { font-size: 16px; line-height: 20px; font-weight: 400; color: #b4b7c1; text-align: center; margin-bottom: 40px; } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 04 - AUTHOR EDIT*/ /*-------------------------------------------------------------------------------------------------------------------------------*/ .social-input { position: relative; } .social-input .s_icon { position: absolute; top: 0px; left: 0px; } .social-input .social-bars { display: inline-block; font-size: 12px; line-height: 50px; color: #b4b7c1; margin-right: 20px; } .social-input .social-btn { margin-right: 20px; } .head-bg-content .btn i{font-size: 14px; line-height: 12px; font-weight: 700; } .social-input .s_input { margin-left: 93px; } .social-input .form-input { display: block; width: 100%; } .affix-block { margin-bottom: 50px; padding-top: 70px; margin-top: -70px; } #scrollspy.affix { position: fixed !important; top: 125px; } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* 04 - STATISTIC*/ /*-------------------------------------------------------------------------------------------------------------------------------*/ .statistic-block { margin-bottom: 50px; } .stat-wrapper { padding: 50px 83px; } .stat-entry { border-left: 1px solid #edeff2; text-align: center; padding: 20px 0px; } .stat-entry img { margin-bottom: 20px; } .stat-item:last-child .stat-entry { border-right: 1px solid #edeff2; } .stat-number { font-size: 40px; line-height: 40px; font-family: 'Conv_helveticaneuecyr-bold'; margin-bottom: 15px; } .stat-text { font-size: 11px; line-height: 16px; font-weight: 400; color: #b4b7c1; text-transform: uppercase; } .stat-sort { display: inline-block; float: right; font-size: 10px; line-height: 14px; padding: 10px 60px 10px 22px; margin-top: 5px; text-transform: uppercase; } .stat-sort.be-drop-down:after { right: 20px; } /*table*/ .table { overflow: hidden; } .table thead { font-size: 13px; line-height: 18px; } #content-block .table td, #content-block .table th { position: relative; outline: 0; } .table td:hover::after, .table thead th:not(:empty):hover::after, .table td:focus::after, .table thead th:not(:empty):focus::after { content: ''; height: 10000px; left: 0; position: absolute; top: -5000px; width: 100%; z-index: -1; } .table td:hover::after, .table th:hover::after { background-color: #f6f6f7; } .table td:focus::after, .table th:focus::after { background-color: #f6f6f7; } .table td:focus::before, .table tbody th:focus::before { background-color: #f6f6f7; content: ''; height: 100%; top: 0; left: -5000px; position: absolute; width: 10000px; z-index: -1; } .table-responsive { border: 1px solid #edeff2; border-radius: 3px; } .table > thead > tr > th { border-bottom: none; } .table > tbody > tr > td { border-bottom: 1px solid #edeff2; } .table > tbody > tr > td { border-top: none; } .table > tbody > tr:last-child > td { border-bottom: none; } .table > tbody > tr > td, .table > tbody > tr > th, .table > tfoot > tr > td, .table > tfoot > tr > th, .table > thead > tr > td, .table > thead > tr > th { padding: 20px; vertical-align: middle; } .t_project-img { float: left; width: 84px; } .t_project-desc { margin-left: 98px; } .t_project-title { display: block; font-size: 13px; line-height: 16px; font-weight: 400; color: #383b43; margin-bottom: 10px; text-overflow: ellipsis; overflow: hidden; } .t_project-title:hover { color: #0d58c8; } .t_project-date { font-size: 11px; line-height: 15px; font-weight: 400; color: #b4b7c1; } .t_project-date .fa { font-size: 16px; position: relative; top: 2px; } .t_project_icon { display: inline-block; width: 40px; height: 40px; margin-right: 10px; border-radius: 40px; } #content-block .appreciator { margin-bottom: 30px; } .appreciator-img { float: left; width: 60px; height: 60px; } .appreciator-desc { padding-left: 70px; } .appreciator-title { font-size: 14px; line-height: 18px; font-weight: 400; color: #383b43; margin-top: 12px; margin-bottom: 3px; } .appreciator-text { font-size: 12px; line-height: 18px; font-weight: 400; color: #b4b7c1; } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* CSS ANIMATIONS */ /*-------------------------------------------------------------------------------------------------------------------------------*/ a, .soc_buttons.light > li, .color_bg, .be-ava-user > img, .be-drop-down, .footer_slider img { -webkit-transition: all 0.15s ease-out; transition: all 0.15s ease-out; } .be-drop-down { -webkit-transition: all 0.5s ease-out; transition: all 0.5s ease-out; } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* BOOTSTRAP XL */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .visible-xl-block, .visible-xl-inline, .visible-xl-inline-block, .visible-xl { display: none !important; } @media (min-width: 1600px) { .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12 { float: left; } .col-xl-12 { width: 100%; } .col-xl-11 { width: 91.66666667%; } .col-xl-10 { width: 83.33333333%; } .col-xl-9 { width: 75%; } .col-xl-8 { width: 66.66666667%; } .col-xl-7 { width: 58.33333333%; } .col-xl-6 { width: 50%; } .col-xl-5 { width: 41.66666667%; } .col-xl-4 { width: 33.33333333%; } .col-xl-3 { width: 25%; } .col-xl-2 { width: 16.66666667%; } .col-xl-1 { width: 8.33333333%; } .col-xl-pull-12 { right: 100%; } .col-xl-pull-11 { right: 91.66666667%; } .col-xl-pull-10 { right: 83.33333333%; } .col-xl-pull-9 { right: 75%; } .col-xl-pull-8 { right: 66.66666667%; } .col-xl-pull-7 { right: 58.33333333%; } .col-xl-pull-6 { right: 50%; } .col-xl-pull-5 { right: 41.66666667%; } .col-xl-pull-4 { right: 33.33333333%; } .col-xl-pull-3 { right: 25%; } .col-xl-pull-2 { right: 16.66666667%; } .col-xl-pull-1 { right: 8.33333333%; } .col-xl-pull-0 { right: auto; } .col-xl-push-12 { left: 100%; } .col-xl-push-11 { left: 91.66666667%; } .col-xl-push-10 { left: 83.33333333%; } .col-xl-push-9 { left: 75%; } .col-xl-push-8 { left: 66.66666667%; } .col-xl-push-7 { left: 58.33333333%; } .col-xl-push-6 { left: 50%; } .col-xl-push-5 { left: 41.66666667%; } .col-xl-push-4 { left: 33.33333333%; } .col-xl-push-3 { left: 25%; } .col-xl-push-2 { left: 16.66666667%; } .col-xl-push-1 { left: 8.33333333%; } .col-xl-push-0 { left: auto; } .col-xl-offset-12 { margin-left: 100%; } .col-xl-offset-11 { margin-left: 91.66666667%; } .col-xl-offset-10 { margin-left: 83.33333333%; } .col-xl-offset-9 { margin-left: 75%; } .col-xl-offset-8 { margin-left: 66.66666667%; } .col-xl-offset-7 { margin-left: 58.33333333%; } .col-xl-offset-6 { margin-left: 50%; } .col-xl-offset-5 { margin-left: 41.66666667%; } .col-xl-offset-4 { margin-left: 33.33333333%; } .col-xl-offset-3 { margin-left: 25%; } .col-xl-offset-2 { margin-left: 16.66666667%; } .col-xl-offset-1 { margin-left: 8.33333333%; } .col-xl-offset-0 { margin-left: 0; } .visible-xl { display: block !important; } table.visible-xl { display: table; } tr.visible-xl { display: table-row !important; } th.visible-xl, td.visible-xl { display: table-cell !important; } .visible-xl-block { display: block !important; } .visible-xl-inline { display: inline !important; } .visible-xl-inline-block { display: inline-block !important; } .hidden-xl { display: none !important; } } /*-------------------------------------------------------------------------------------------------------------------------------*/ /* BOOTSTRAP ML */ /*-------------------------------------------------------------------------------------------------------------------------------*/ .visible-ml-block, .visible-ml-inline, .visible-ml-inline-block, .visible-ml { display: none !important; } @media (max-width: 450px) { .col-ml-1, .col-ml-2, .col-ml-3, .col-ml-4, .col-ml-5, .col-ml-6, .col-ml-7, .col-ml-8, .col-ml-9, .col-ml-10, .col-ml-11, .col-ml-12 { float: left; } .col-ml-12 { width: 100%; } .col-ml-11 { width: 91.66666667%; } .col-ml-10 { width: 83.33333333%; } .col-ml-9 { width: 75%; } .col-ml-8 { width: 66.66666667%; } .col-ml-7 { width: 58.33333333%; } .col-ml-6 { width: 50%; } .col-ml-5 { width: 41.66666667%; } .col-ml-4 { width: 33.33333333%; } .col-ml-3 { width: 25%; } .col-ml-2 { width: 16.66666667%; } .col-ml-1 { width: 8.33333333%; } .col-ml-pull-12 { right: 100%; } .col-ml-pull-11 { right: 91.66666667%; } .col-ml-pull-10 { right: 83.33333333%; } .col-ml-pull-9 { right: 75%; } .col-ml-pull-8 { right: 66.66666667%; } .col-ml-pull-7 { right: 58.33333333%; } .col-ml-pull-6 { right: 50%; } .col-ml-pull-5 { right: 41.66666667%; } .col-ml-pull-4 { right: 33.33333333%; } .col-ml-pull-3 { right: 25%; } .col-ml-pull-2 { right: 16.66666667%; } .col-ml-pull-1 { right: 8.33333333%; } .col-ml-pull-0 { right: auto; } .col-ml-push-12 { left: 100%; } .col-ml-push-11 { left: 91.66666667%; } .col-ml-push-10 { left: 83.33333333%; } .col-ml-push-9 { left: 75%; } .col-ml-push-8 { left: 66.66666667%; } .col-ml-push-7 { left: 58.33333333%; } .col-ml-push-6 { left: 50%; } .col-ml-push-5 { left: 41.66666667%; } .col-ml-push-4 { left: 33.33333333%; } .col-ml-push-3 { left: 25%; } .col-ml-push-2 { left: 16.66666667%; } .col-ml-push-1 { left: 8.33333333%; } .col-ml-push-0 { left: auto; } .col-ml-offset-12 { margin-left: 100%; } .col-ml-offset-11 { margin-left: 91.66666667%; } .col-ml-offset-10 { margin-left: 83.33333333%; } .col-ml-offset-9 { margin-left: 75%; } .col-ml-offset-8 { margin-left: 66.66666667%; } .col-ml-offset-7 { margin-left: 58.33333333%; } .col-ml-offset-6 { margin-left: 50%; } .col-ml-offset-5 { margin-left: 41.66666667%; } .col-ml-offset-4 { margin-left: 33.33333333%; } .col-ml-offset-3 { margin-left: 25%; } .col-ml-offset-2 { margin-left: 16.66666667%; } .col-ml-offset-1 { margin-left: 8.33333333%; } .col-ml-offset-0 { margin-left: 0; } .visible-ml { display: block !important; } table.visible-ml { display: table; } tr.visible-ml { display: table-row !important; } th.visible-ml, td.visible-ml { display: table-cell !important; } .visible-ml-block { display: block !important; } .visible-ml-inline { display: inline !important; } .visible-ml-inline-block { display: inline-block !important; } .hidden-ml { display: none !important; } } /* FIXES */ .form-block .btn{margin-right: 15px;} .blog-list .info-block{padding-right: 30px;margin-left: -15px;margin-right: -15px;} .be-large-post .author-post{padding-right: 0;} .custom-a-b{margin-bottom: 25px;padding-bottom: 10px; border-bottom: 1px solid #edeff2;} #content-block .blog-post.type-2 .be-post-title{border: none;margin-bottom: 30px !important;padding-bottom: 0 !important; min-height: 0;} #content-block .blog-post.type-2 .embed-responsive{margin-bottom: 50px;} .nav-next{ text-align: right; } .nav-post .be-post-date{ padding-bottom: 20px; border-bottom: 1px solid #edeff2; } .nav-post .be-post-date a{ font-weight: 700; color: #a1a5b1; font-size: 11px; -webkit-transition: all ease-out 0.3s; -o-transition: all ease-out 0.3s; -moz-transition: all ease-out 0.3s; -ms-transition: all ease-out 0.3s; transition: all ease-out 0.3s; } .nav-post .be-post-date a:hover{ color: #0D58C8;} .nav-post .be-post-title{min-height: 0;margin-bottom: 20px !important;} .type-2 .blog-content .ava-author{margin-bottom: 0;margin-top: 0;} .nav-post .be-img-block{position: relative;} .nav-post .be-img-block:before{content: "";position: absolute;top: 0;left: 32px; height: 0;width: 0; border-style: solid; border-width: 15px 15px 0 15px; border-color: #FFF transparent transparent transparent; z-index: 1;} .nav-next .be-img-block:before{right: 32px;left: initial;} @media screen and (min-width: 992px){ .custom-element .col-sm-4{max-width:420px;margin-right: -30px;} .custom-element .col-sm-4:nth-child(2){max-width:347px; } } .be-error-input{ width: 100%; height: 50px; padding: 0 40px 0 20px; color: #f0625f; border: 1px solid #f0625f; border-radius: 3px; } .be-focus-input{ width: 100%; height: 50px; padding: 0 40px 0 20px; color: #b4b7c1; border: 1px solid #0d58c8; border-radius: 3px; } .head-bg-content .btn{margin: 0 15px !important;} .large-popup-content select{ -webkit-appearance: none; -moz-appearance: none; appearance: none; } .be-custom-select-block{position: relative;} .be-custom-select-block:after{ content: "\f107"; font-family: FontAwesome; font-size: 18px; line-height: 45px;height: 45px; position: absolute; right: 14px; cursor: pointer; } .large-popup-text .be-popup-terms{text-decoration: underline;} @media screen and (min-width: 120px){ .be-large-post .be-largepost-iframe{margin: 0 -66px;}} .swiper-arrow-left.type-2, .swiper-arrow-right.type-2{ background: #2e333e; } .swiper-arrow-left.type-2:after, .swiper-arrow-right.type-2:after{ color: #fff; } .swiper-arrow-left.type-2:hover, .swiper-arrow-right.type-2:hover{ background: #fff; } .swiper-arrow-left.type-2:hover:after, .swiper-arrow-right.type-2:hover:after{ color: rgba(38,38,38,0.5); } .about-comment-block .be-signup-link{text-decoration: underline;} .s_keywords a{text-transform: none; font-size: 12px !important; } blockquote{text-transform: none;} blockquote cite{font-style: normal;} .be-post.style-2 a{min-height: 0;} .creative_filds_block .ul span{ float: right; } .creative_filds_block .ul.numbered a:after{display: none;} .blog-filter a{text-transform: none; font-size: 13px !important;} .swiper-arrow-left.type-3, .swiper-arrow-right.type-3{background: rgba(0,0,0,0.3);} .swiper-arrow-left.type-3:after, .swiper-arrow-right.type-3:after{color: #fff !important;} .swiper-arrow-left.type-3:hover, .swiper-arrow-right.type-3:hover{background: rgba(0,0,0,0.6);} .login-user-down.be-drop-down:hover{color: #b4b7c1 !important;} .login-user-down.be-drop-down span span{-webkit-transition: all ease-out 0.3s; -o-transition: all ease-out 0.3s; -moz-transition: all ease-out 0.3s; -ms-transition: all ease-out 0.3s; transition: all ease-out 0.3s;} .login-user-down.be-drop-down:hover span span{color: #fff !important;} .team-name{padding: 15px 0; margin: 0 15px;} .head-bg.ab-us .swiper-container{position: absolute;top:0;left: 0; width: 100%;height: 100% !important;} .head-bg.ab-us .head-bg-img{position: relative;top:initial; left: initial;} @media screen and (max-width: 992px){ .header-menu{overflow: auto;} } @media screen and (min-width: 993px){ .header-menu ul{border-radius: 0 0 5px 5px; box-shadow: 0 0 20px rgba(0,0,0,0.7);} } .m-social i { position: relative; } .m-close { color: #0d58c8; position: absolute; right: 5px; top:5px; cursor: pointer; } .mfp-title { display: none !important; } .a-list li { text-align: left; } .a-list li i{ color: #fff !important; display: block; } .be-loader { background: #222835; z-index: 99999999999999999; top: 0; } /* Inspirated from http://www.alessioatzeni.com/wp-content/tutorials/html-css/CSS3-loading-animation-loop/index.html */ .ouro { position: relative; display:inline-block; height: 46px; width: 46px; margin: 1em; border-radius: 50%; background: none repeat scroll 0 0 #DDDDDD; overflow:hidden; box-shadow: 0 0 10px rgba(0,0,0,.1) inset, 0 0 25px rgba(0,0,255,0.075); } .ouro:after { content: ""; position: absolute; top: 9px; left: 9px; display: block; height: 28px; width: 28px; background: none repeat scroll 0 0 #F2F2F2; border-radius: 50%; box-shadow: 0 0 10px rgba(0,0,0,.1); } .ouro > span { position: absolute; height: 100%; width: 50%; overflow: hidden; } .left { left:0 } .right { left:50% } .anim { position: absolute; left: 100%; top: 0; height: 100%; width: 100%; border-radius: 999px; background: none repeat scroll 0 0 #0d58c8; opacity: 0.8; -webkit-animation: ui-spinner-rotate-left 3s infinite; animation: ui-spinner-rotate-left 3s infinite; -webkit-transform-origin: 0 50% 0; transform-origin: 0 50% 0; } .left .anim { border-bottom-left-radius: 0; border-top-left-radius: 0; } .right .anim { border-bottom-right-radius: 0; border-top-right-radius: 0; left: -100%; -webkit-transform-origin: 100% 50% 0; transform-origin: 100% 50% 0; } /* v2 */ .ouro2 .anim { -webkit-animation-delay:0; animation-delay:0; } .ouro2 .right .anim{ -webkit-animation-delay: 1.5s; animation-delay: 1.5s; } /* v3 */ .ouro3 .anim { -webkit-animation-delay: 0s; -webkit-animation-duration:3s; -webkit-animation-timing-function: linear; animation-delay: 0s; animation-duration:3s; animation-timing-function: linear; } .ouro3 .right .anim{ -webkit-animation-name: ui-spinner-rotate-right; -webkit-animation-delay:0; -webkit-animation-delay: 1.5s; animation-name: ui-spinner-rotate-right; animation-delay:0; animation-delay: 1.5s; } /* round variation */ .round .ouro:after {display:none } /* double variation */ .double .ouro:after { height: 13px; width: 13px; left: 7px; top: 7px; border: 10px solid #ddd; background: transparent; box-shadow: none; } @keyframes ui-spinner-rotate-right{ 0%{transform:rotate(0deg)} 25%{transform:rotate(180deg)} 50%{transform:rotate(180deg)} 75%{transform:rotate(360deg)} 100%{transform:rotate(360deg)} } @keyframes ui-spinner-rotate-left{ 0%{transform:rotate(0deg)} 25%{transform:rotate(0deg)} 50%{transform:rotate(180deg)} 75%{transform:rotate(180deg)} 100%{transform:rotate(360deg)} } @-webkit-keyframes ui-spinner-rotate-right{ 0%{-webkit-transform:rotate(0deg)} 25%{-webkit-transform:rotate(180deg)} 50%{-webkit-transform:rotate(180deg)} 75%{-webkit-transform:rotate(360deg)} 100%{-webkit-transform:rotate(360deg)} } @-webkit-keyframes ui-spinner-rotate-left{ 0%{-webkit-transform:rotate(0deg)} 25%{-webkit-transform:rotate(0deg)} 50%{-webkit-transform:rotate(180deg)} 75%{-webkit-transform:rotate(180deg)} 100%{-webkit-transform:rotate(360deg)} } .spinner { width: auto; height: auto; text-align: center; } .main-color { width: 100%; float: left; margin-bottom: 10px; } .main-bg { width: 100%; float: left; } .entry { width: 30px; float: left; margin-right: 10px; } .color1 { background-color: #0d58c8; } .color3 { background-color: #2ecc71; } .color6 { background-color: #f1c40f; } .color8 { background-color: #e74c3c; } .color10 { background-color: #222835; } .color11 { background-color: #385b39; } .color12 { background-color: #5b4c38; } .color13 { background-color: #6c4242; } .logo-c { display: none; } .logo-c.active { display: block; } .b-work-list a:hover:after { content:none; } .b-work-list a { position: relative; padding-left: 40px !important; } .b-work-list i { margin-right: 10px; position: absolute; left: 20px; top:13px; } .b-work-list-no i { left: auto; right: 10px; } .b-work-list-no a { padding-left: 20px !important; } .upload-zone { background: #F6F6F6; height: 500px; position: relative; border: 1px solid #F6F6F6; transition: border-color 0.3s linear; } .upload-zone:hover { border-color: #000; } .center-i { position: absolute; left: 50%; top: 50%; font-size: 50px; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); } .file { position: absolute; left: 0; top: 0; width: 100%; height: 100%; cursor: pointer; opacity: 0; } .main-textarea { width: 100%; line-height: 1.5em; border-radius: 2px; border: none; color: #b4b7c1; padding-left: 15px; margin-bottom: 20px; height: 200px; } .inner-filter-info { overflow: hidden; } .inner-filter-inner { padding: 10px; text-align: left; float: left; width: 100%; border: 1px solid rgba(230, 230, 230, 0.88); } .inner-filter-inner:first-of-type { border-top: none; } .inner-filter-inner span { float: left !important; font-size: 13px; color: #bdbfc8 !important; padding-left: 10px; display: inline-block; padding-top: 5px; } .inner-filter-inner label { font-size: 13px; cursor: pointer; color: #bdbfc8 !important; font-weight: 400 !important; } .inner-filter-inner label:before { content: ''; width: 12px; height: 12px; border: 3px solid #fff; background: #fff; border-radius: 50%; display: inline-block; margin-right: 5px; } .ch:checked + label:before { border-color: #0d58c8; } .color-i { width: 100px; height: 25px; border-radius: 3px; margin-left: 20px; padding-left: 5px; } .color-i:hover,.color-i:focus { border: none !important; padding-left: 5px; } .up-image { position: relative; width: 100px; height: 25px; border-radius: 3px; text-align: center; line-height: 25px; color: #fff; background: #0d58c8; text-transform: uppercase; float: left; margin-left: 15px; font-size: 13px; cursor: pointer; } .range { position: absolute; left: 0; width: 100%; padding-left: 80px; margin-top: 5px; } .slider-range-max { width: calc(100% - 55px); float: left; } .amount { width: 25px; height: 25px; border-radius: 5px; border: none; text-align: center; line-height: 25px; float: right; margin-right: 20px; margin-top: -7px; font-size: 13px; } .inner-filter-inner-mod span{ padding-top: 2px !important; } .ui-widget-content { background: #0d58c8 !important; } .ui-widget-header { background: #ddd !important; } .i-slider-handle:focus { outline: none; } .label-box { width: 33.333%; float: left; } .label-box:after { content: ' '; display: block; border-top: 1px solid #bdbfc8; width: calc(100% - 33px); float: right; margin-right: 15px; position: relative; top: 10px; } .label-box:nth-of-type(2):after { border-top: 1px dashed #bdbfc8; } .label-box:nth-of-type(3):after { border-top: 1px dotted #bdbfc8; } .ch { display: none; } .inner-d { padding-left: 20px; } .inner-filter-info { display: none; } .editor-nav { float: left; } .editor-menu { padding: 20px 0; box-shadow: 0 1px 2px rgba(0,0,0,0.2); } .en-nav { font-size: 18px; font-weight: 700; float: left; margin-right: 50px; transition: color 0.3s linear; } .en-nav.active,.en-nav:hover { color: #0d58c8; cursor: pointer; } .work-box { margin-bottom: 0 !important; } .cover-popup, .setting-popup{ position: absolute; z-index: 555; width: 100%; height: 100%; background: rgba(0,0,0, .8); display: none; } .cover-box { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); background: #fff; border-radius: 5px; padding: 30px 60px; } .cover-box form { border: 1px solid #ddd; border-radius: 5px; width: 202px; } .cover-box form textarea { height: 100px; width: 200px; font-size: 13px; border: none; padding: 15px; border-top: 1px solid #ddd; } .cover-box form img { display: block; } .cover-box form textarea:focus { outline: none; } .anothel-upload { margin-top: 10px; display: inline-block; position: relative; } .btn-row { text-align: center; padding-top: 10px; display: block; } .btn-row button { display: inline-block; margin: 5px !important; } .cover-popup { display: none; } .setting-form { width: 300px; float: left; } .setting-form form { border: none; width: 300px; } .setting-form form input { width: 300px; border: 1px solid #ccc; border-radius: 5px; } .setting-form form input:focus { outline: none; } .setting-form form textarea { width: 300px; border: 1px solid #ccc; border-radius: 5px; } .setting-block { width: 330px; float: left; height: 100%; position: absolute; right: 0; background: #EEEEEE; top:0; padding-top: 30px; border-radius: 0 5px 5px 0; } .s-cover-box { max-width: 720px; width: 100%; } .setting-block { padding-left: 40px; } .settings-label, .settings-note { } .st-label { margin-top: 15px; } .settings-label { font-weight: 700; } .fake-link { color: #0d58c8; cursor: pointer; } .settings-option { padding-bottom: 20px; } .popup-buttons { float: left; width: 100%; } .s-cover-box { padding-bottom: 90px; } .popup-buttons { position: absolute; left: 0; bottom: 0; background: linear-gradient(#f4f4f4,#dddddd); border-top: 1px solid #ccc; } .popup-buttons { text-align: right; } .popup-buttons button { display: inline-block; margin-top: 10px !important; margin-bottom: 10px !important; float: none; } .work-area { position: relative; } .mini-popup { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%); background: #fff; border-radius: 5px; padding: 20px 30px 15px; z-index: 9999999999999999999999; border: 1px solid #ccc; max-width: 400px; width: 100%; } .mini-popup h3 { border-bottom: 1px solid #ccc; padding-bottom: 10px; font-size: 18px; margin-bottom: 20px; } .mini-popup input { margin-bottom: 15px; border: 1px solid #ccc; width: 100%; height: 35px; border-radius: 5px; line-height: 35px; padding: 0 15px; } .close-mini { position: absolute; right: 10px; top: 10px; color: #0d58c8; cursor: pointer; display: block !important; } .mini-popup-wrapper { position: fixed; left: 0; top: 0; width: 100%; height: 100%; display: none; z-index: 9999999999999999999998; } input:focus { box-shadow: none !important; } .large-area { margin-bottom: 70px !important; } @media screen and (max-width: 992px) { .st-col .nav{ width: 100% !important; } } @media screen and (max-width: 767px) { .upload-zone { height: 400px; } .s-cover-box { max-width: 400px; } .setting-block { position: relative; } .setting-form form input, .setting-form form textarea { width: 100% !important; } .setting-form form, .setting-form { width: 100%; } .setting-block { padding: 30px 0 0 30px; margin-top: 30px; width: 100%; border-radius: 5px; } } @media screen and (max-width: 481px) { .upload-zone { height: 200px; } .s-cover-box { max-width: 280px; padding-left:15px; padding-right: 15px; } } @media screen and (max-width: 481px) { .en-nav { font-size: 16px; margin-right: 30px; } .en-nav:last-of-type { margin-right: 0; } .cover-box { padding: 15px 30px; } .s-cover-box form textarea { height: 50px; } .s-cover-box .form-group { margin-bottom: 15px !important; } .setting-block { margin-top: 0; padding: 15px; } .s-cover-box { padding-bottom: 60px; } } .canvasjs-chart-credit { display: none; } .canvasjs-chart-canvas { width: 100%; height: 300px; } .tab-wrapper.style-2 .chart-info { display: block; } .tab-wrapper.style-2 .chart-info.none { display: none; } .tab-wrapper.style-2 .chart-info.active { display: block; } .gallery-block { background: #F4F4F4; } .gallery-box { padding-left: 282px; position: relative; background: #fff; min-height: 133px; margin-bottom: 50px; box-shadow: 0 1px 0 0 rgba(0,0,0,0.03); border-radius: 4px; } .gallery-a { position: absolute; left: 0; top: 0; width: 282px; height: 133px; } .gallery-a img { border-radius: 4px 0 0 4px; } .gallery-info { padding: 20px 200px 15px 30px; } .gallery-info h3 { font-size: 22px; color: #0d58c8; font-weight: 700; margin-bottom: 10px; } .gallery-btn { width: 100px; position: absolute; right: 30px; top:0; padding-top: 30px; } .gallery-btn a { width: 80px; } .gallery-btn:after { content:''; position: absolute; left: -30px; top: 16px; border-left: 1px solid #ddd; height: 100px; } .gallery-btn a:hover { color: #0d58c8 !important; } @media screen and (max-width:992px) { .gallery-a { height: 100%; } .gallery-a img { position:absolute; height: 100%; width: 282px; } .gallery-btn { width: 100%; position: relative; right: 0; top: 0; padding-bottom: 10px; float: left; padding-left: 30px; padding-top: 0; } .gallery-btn:after { content: none; padding-top: 0; } .gallery-info { padding-right: 30px; } } @media screen and (max-width:600px) { .gallery-box { padding-left: 0; } .gallery-a { position: relative; float: left; width: 100%; height: 180px; } .gallery-a img { width: 100%; border-radius: 4px 4px 0 0; } .gallery-btn { width: 100%; position: relative; right: 0; top: 0; padding-bottom: 10px; float: left; padding-left: 30px; padding-top: 0; } .gallery-btn:after { content: none; padding-top: 0; } .gallery-info { padding-top: 10px; float: left; } } #container-mix .mix { display: none ; } .message-area { height: 150px; width: 100%; line-height: 45px; border-radius: 2px; border: none; color: #b4b7c1; padding: 15px; margin-bottom: 20px; } .ui-menu-item { color: #222 !important; padding-left: 10px !important; } .ui-menu-item:hover { background: #0d58c8 !important; border: none !important; font-weight: 400; color: #fff !important; } .a-list { width: auto; min-width: 150px; background: #fff !important; border: none; } .a-list a { display: block; text-align: left; font-size: 14px; padding-top: 15px !important; padding-bottom: 15px !important;; color: #b4b7c1 !important; border-bottom: 1px solid #b4b7c1 !important; } .a-list a:hover { color: #fff !important; } body .btn.color-1:hover { background: transparent !important; } .body-color5 header, .body-color5 .noto-popup .noto-message, .body-color5 footer, .body-color5 .be-user-statistic .stat-row { background-color: #385b39; } .body-color6 header, .body-color6 .noto-popup .noto-message, .body-color6 footer, .body-color6 .be-user-statistic .stat-row { background-color: #5b4c38; } .body-color7 header, .body-color7 .noto-popup .noto-message, .body-color7 footer, .body-color7 .be-user-statistic .stat-row { background-color: #6c4242; } .header .hover-1 { color: #fff; } .ui-autocomplete { background: #fff !important; } .author-post .pull-right { cursor: pointer; } .be-user-statistic .stat-row { color: #fff !important; } .fa-envelope-o { margin-top: -1px !important; } body .creative_filds_block .edit-ln a:hover ,body .creative_filds_block a:hover { background: #EDEDED !important; color: #bdbfc8 !important; } .creative_filds_block a.active { background: #EDEDED !important; } .buttons-navbar { float: right; } .buttons-navbar .btn { margin: 0 0 0 10px; transition: background 0.3s linear; } .btn-default { color: #222; } @media screen and (max-width:700px) { .editor-nav { width: 100%; text-align: center; margin-bottom: 10px; } .editor-nav li { float: none; margin: 0 15px; display: inline-block; } .buttons-navbar { width: 100%; float: none; text-align: center; } .buttons-navbar .btn { margin: 0 5px 0; float: none; display: inline-block; transition: background 0.3s linear; } } .behance-style .creative_filds_block a { background: #1C1C1C !important; color: #E3E2E2 !important; border-color: #E3E2E2 !important; } body .behance-style .creative_filds_block a:hover { color: #1C1C1C !important; } .behance-style .creative_filds_block { border-radius: 4px !important; } #add-work-btn { color: #fff !important; position: relative; margin-right: 0; margin-bottom: 0; top:-1px } @media screen and (max-width:1200px) { #add-work-btn { border: none; background: none; } } #ad-work-li { border: transparent !important; padding-top: 0 !important; padding-bottom: 0 !important; } #ad-work-li a { padding-top: 10px; padding-bottom: 10px; } .parrent-page { color: #337ab7 !important; cursor: pointer; } .parrent-page ul { display: none; } .parrent-page .fa-angle-down { display: block; } .parrent-page span { display: inline-block; position: relative; padding-right: 15px; } .parrent-page span i { position: absolute; right: 0; top: 3px; } .login-user-down .drop-down-list { border: none !important; } body .login-user-down:hover { background: transparent !important; } /* Default styles -------------------------------------------------- */ img { -ms-interpolation-mode: bicubic; border: 0; height: auto; max-width: 100%; vertical-align: middle; } button,input,select,textarea { max-width: 100%; vertical-align: baseline; padding: 10px; color: #3b3b3b; } table,th,td { border: 1px solid #eaeaea; border: 1px solid rgba(51, 51, 51, 0.1); } table { border-collapse: collapse; border-spacing: 0; border-width: 1px 0 0 1px; margin: 0 0 1.6em; width: 100%; } caption,th,td { font-weight: normal; text-align: left; } th { border-width: 0 1px 1px 0; font-weight: 700; } td { border-width: 0 1px 1px 0; } th,td { padding: 0.4em; }