/*
ATTENTION! Please do not modify this file, it's auto-generated and all your changes will be lost.
The complete list of files it's generated from:
design/themes/avtoopt/css/style.css
design/themes/responsive/css/addons/buy_together/styles.less
design/themes/responsive/css/addons/buy_together/responsive.less
design/themes/responsive/css/addons/social_buttons/styles.less
design/themes/responsive/css/addons/social_buttons/responsive.less
design/themes/responsive/css/addons/tags/styles.less
design/themes/responsive/css/addons/rss_feed/styles.less
design/themes/responsive/css/addons/newsletters/styles.less
design/themes/responsive/css/addons/geo_maps/styles.less
design/themes/responsive/css/addons/gift_certificates/styles.less
design/themes/responsive/css/addons/gift_certificates/responsive.less
design/themes/avtoopt/css/addons/store_locator/styles.less
design/themes/avtoopt/css/addons/store_locator/responsive.less
design/themes/responsive/css/addons/recaptcha/styles.less
design/themes/responsive/css/addons/product_variations/styles.less
design/themes/avtoopt/css/addons/blog/styles.less
design/themes/avtoopt/css/addons/blog/responsive.less
design/themes/responsive/css/addons/reward_points/styles.less
design/themes/avtoopt/css/addons/call_requests/styles.less
design/themes/responsive/css/addons/form_builder/styles.less
design/themes/responsive/css/addons/form_builder/responsive.less
design/themes/responsive/css/addons/banners/styles.less
design/themes/responsive/css/addons/discussion/styles.less
design/themes/responsive/css/addons/discussion/responsive.less
design/themes/avtoopt/css/addons/products_on_order/styles.css
design/themes/avtoopt/css/addons/image_zoom/styles.less
design/themes/responsive/css/addons/hybrid_auth/styles.less
design/themes/avtoopt/css/addons/promo_block/owl.carousel.min.css
design/themes/avtoopt/css/addons/promo_block/owl.theme.default.min.css
design/themes/avtoopt/css/addons/promo_block/style.css
design/themes/avtoopt/css/addons/queue/styles.css
design/themes/avtoopt/css/addons/quick_search/styles.css
design/themes/avtoopt/css/addons/personal_area/fixme.css
design/themes/avtoopt/css/addons/wholesale_clients/styles.less
design/themes/avtoopt/css/addons/personal_area/styles.css
design/themes/avtoopt/css/addons/personal_area/bootstrap.css
design/themes/avtoopt/css/lib/jstree/style.min.css
design/themes/avtoopt/css/lib/load_image/jquery.Jcrop.min.css
/js/addons/fancybox3/jquery.fancybox.css
design/themes/avtoopt/css/addons/search_sphinx/style.css
design/themes/avtoopt/css/addons/feedback/style.less
design/themes/avtoopt/css/addons/animate/animate.css
design/themes/avtoopt/css/addons/simple_mobile/jquery-simple-mobilemenu.css
design/themes/avtoopt/css/addons/my_changes/styles.css
*/
/* Slider */
:root {
--main-color-grafit: #37383a;
--main-color-red: #e8474a;
}
.slick-slider
{
position: relative;
display: block;
box-sizing: border-box;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-touch-callout: none;
-khtml-user-select: none;
-ms-touch-action: pan-y;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
}
.slick-list
{
position: relative;
display: block;
overflow: hidden;
margin: 0;
padding: 0;
}
.slick-list:focus
{
outline: none;
}
.slick-list.dragging
{
cursor: pointer;
cursor: hand;
}
.slick-slider .slick-track,
.slick-slider .slick-list
{
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.slick-track
{
position: relative;
top: 0;
left: 0;
display: block;
}
.slick-track:before,
.slick-track:after
{
display: table;
content: '';
}
.slick-track:after
{
clear: both;
}
.slick-loading .slick-track
{
visibility: hidden;
}
.slick-slide
{
display: none;
float: left;
height: 100%;
min-height: 1px;
}
[dir='rtl'] .slick-slide
{
float: right;
}
.slick-slide img
{
display: block;
}
.slick-slide.slick-loading img
{
display: none;
}
.slick-slide.dragging img
{
pointer-events: none;
}
.slick-initialized .slick-slide
{
display: block;
}
.slick-loading .slick-slide
{
visibility: hidden;
}
.slick-vertical .slick-slide
{
display: block;
height: auto;
border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
display: none;
}
@charset 'UTF-8';
/* Icons */
/* Arrows */
.slick-prev,
.slick-next
{
font-size: 0;
line-height: 0;
position: absolute;
top: 50%;
display: block;
width: 20px;
height: 20px;
padding: 0;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);
cursor: pointer;
color: transparent;
border: none;
outline: none;
background: transparent;
}
.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus
{
color: transparent;
outline: none;
background: transparent;
}
.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before
{
opacity: 1;
}
.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before
{
opacity: .25;
}
.slick-prev:before,
.slick-next:before
{
opacity: .75;
}
.slick-prev
{
}
[dir='rtl'] .slick-prev
{
left: auto;
}
.slick-prev:before
{
}
[dir='rtl'] .slick-prev:before
{
}
.slick-next
{
}
[dir='rtl'] .slick-next
{
right: auto;
}
.slick-next:before
{
}
[dir='rtl'] .slick-next:before
{
}
/* Dots */
.slick-dotted.slick-slider
{
margin-bottom: 30px;
}
.slick-dots
{
position: absolute;
bottom: -25px;
display: block;
width: 100%;
padding: 0;
margin: 0;
list-style: none;
text-align: center;
}
.slick-dots li
{
position: relative;
display: inline-block;
width: 20px;
height: 20px;
margin: 0 5px;
padding: 0;
cursor: pointer;
}
.slick-dots li button
{
font-size: 0;
line-height: 0;
display: block;
width: 20px;
height: 20px;
padding: 5px;
cursor: pointer;
color: transparent;
border: 0;
outline: none;
background: transparent;
}
.slick-dots li button:hover,
.slick-dots li button:focus
{
outline: none;
}
.slick-dots li button:hover:before,
.slick-dots li button:focus:before
{
opacity: 1;
}
.slick-dots li button:before
{
font-family: 'slick';
font-size: 6px;
line-height: 20px;
position: absolute;
top: 0;
left: 0;
width: 20px;
height: 20px;
content: '•';
text-align: center;
opacity: .25;
color: black;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.slick-dots li.slick-active button:before
{
opacity: .75;
color: black;
}
/*
== malihu jquery custom scrollbar plugin ==
Plugin URI: http://manos.malihu.gr/jquery-custom-content-scroller
*/
/*
CONTENTS:
1. BASIC STYLE - Plugin's basic/essential CSS properties (normally, should not be edited).
2. VERTICAL SCROLLBAR - Positioning and dimensions of vertical scrollbar.
3. HORIZONTAL SCROLLBAR - Positioning and dimensions of horizontal scrollbar.
4. VERTICAL AND HORIZONTAL SCROLLBARS - Positioning and dimensions of 2-axis scrollbars.
5. TRANSITIONS - CSS3 transitions for hover events, auto-expanded and auto-hidden scrollbars.
6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS
6.1 THEMES - Scrollbar colors, opacity, dimensions, backgrounds etc. via ready-to-use themes.
*/
/*
------------------------------------------------------------------------------------------------------------------------
1. BASIC STYLE
------------------------------------------------------------------------------------------------------------------------
*/
.mCustomScrollbar{ -ms-touch-action: pinch-zoom; touch-action: pinch-zoom; /* direct pointer events to js */ }
.mCustomScrollbar.mCS_no_scrollbar, .mCustomScrollbar.mCS_touch_action{ -ms-touch-action: auto; touch-action: auto; }
.mCustomScrollBox{ /* contains plugin's markup */
position: relative;
overflow: hidden;
max-height: 280px;
max-width: 100%;
outline: none;
direction: ltr;
}
.mCSB_container{ /* contains the original content */
overflow: hidden;
width: auto;
height: auto;
}
/*
------------------------------------------------------------------------------------------------------------------------
2. VERTICAL SCROLLBAR
y-axis
------------------------------------------------------------------------------------------------------------------------
*/
.mCSB_inside > .mCSB_container{ margin-right: 0px; }
.mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden{ margin-right: 0; } /* non-visible scrollbar */
.mCS-dir-rtl > .mCSB_inside > .mCSB_container{ /* RTL direction/left-side scrollbar */
margin-right: 0;
margin-left: 30px;
}
.mCS-dir-rtl > .mCSB_inside > .mCSB_container.mCS_no_scrollbar_y.mCS_y_hidden{ margin-left: 0; } /* RTL direction/left-side scrollbar */
.mCSB_scrollTools{ /* contains scrollbar markup (draggable element, dragger rail, buttons etc.) */
position: absolute;
width: 16px;
height: auto;
left: auto;
top: 0;
right: 0;
bottom: 0;
}
.mCSB_outside + .mCSB_scrollTools{ right: -26px; } /* scrollbar position: outside */
.mCS-dir-rtl > .mCSB_inside > .mCSB_scrollTools,
.mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools{ /* RTL direction/left-side scrollbar */
right: auto;
left: 0;
}
.mCS-dir-rtl > .mCSB_outside + .mCSB_scrollTools{ left: -26px; } /* RTL direction/left-side scrollbar (scrollbar position: outside) */
.mCSB_scrollTools .mCSB_draggerContainer{ /* contains the draggable element and dragger rail markup */
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
height: auto;
}
.mCSB_scrollTools a + .mCSB_draggerContainer{ margin: 20px 0; }
.mCSB_scrollTools .mCSB_draggerRail{
width: 2px;
height: 100%;
margin: 0 auto;
-webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px;
}
.mCSB_scrollTools .mCSB_dragger{ /* the draggable element */
cursor: pointer;
width: 100%;
height: 30px; /* minimum dragger height */
z-index: 1;
}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ /* the dragger element */
position: relative;
width: 6px;
height: 100%;
margin: 0 auto;
-webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px;
text-align: center;
}
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{ width: 12px; /* auto-expanded scrollbar */ }
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ width: 8px; /* auto-expanded scrollbar */ }
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown{
display: block;
position: absolute;
height: 20px;
width: 100%;
overflow: hidden;
margin: 0 auto;
cursor: pointer;
}
.mCSB_scrollTools .mCSB_buttonDown{ bottom: 0; }
/*
------------------------------------------------------------------------------------------------------------------------
3. HORIZONTAL SCROLLBAR
x-axis
------------------------------------------------------------------------------------------------------------------------
*/
.mCSB_horizontal.mCSB_inside > .mCSB_container{
margin-right: 0;
margin-bottom: 30px;
}
.mCSB_horizontal.mCSB_outside > .mCSB_container{ min-height: 100%; }
.mCSB_horizontal > .mCSB_container.mCS_no_scrollbar_x.mCS_x_hidden{ margin-bottom: 0; } /* non-visible scrollbar */
.mCSB_scrollTools.mCSB_scrollTools_horizontal{
width: auto;
height: 16px;
top: auto;
right: 0;
bottom: 0;
left: 0;
}
.mCustomScrollBox + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal{ bottom: -26px; } /* scrollbar position: outside */
.mCSB_scrollTools.mCSB_scrollTools_horizontal a + .mCSB_draggerContainer{ margin: 0 20px; }
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_draggerRail{
width: 100%;
height: 2px;
margin: 7px 0;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger{
width: 30px; /* minimum dragger width */
height: 100%;
left: 0;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
width: 100%;
height: 4px;
margin: 6px auto;
}
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{
height: 12px; /* auto-expanded scrollbar */
margin: 2px auto;
}
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{
height: 8px; /* auto-expanded scrollbar */
margin: 4px 0;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft,
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight{
display: block;
position: absolute;
width: 20px;
height: 100%;
overflow: hidden;
margin: 0 auto;
cursor: pointer;
}
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonLeft{ left: 0; }
.mCSB_scrollTools.mCSB_scrollTools_horizontal .mCSB_buttonRight{ right: 0; }
/*
------------------------------------------------------------------------------------------------------------------------
4. VERTICAL AND HORIZONTAL SCROLLBARS
yx-axis
------------------------------------------------------------------------------------------------------------------------
*/
.mCSB_container_wrapper{
position: absolute;
height: auto;
width: auto;
overflow: hidden;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin-right: 30px;
margin-bottom: 30px;
}
.mCSB_container_wrapper > .mCSB_container{
padding-right: 30px;
padding-bottom: 30px;
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
}
.mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_vertical{ bottom: 20px; }
.mCSB_vertical_horizontal > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ right: 20px; }
/* non-visible horizontal scrollbar */
.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden + .mCSB_scrollTools.mCSB_scrollTools_vertical{ bottom: 0; }
/* non-visible vertical scrollbar/RTL direction/left-side scrollbar */
.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ right: 0; }
/* RTL direction/left-side scrollbar */
.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_scrollTools.mCSB_scrollTools_horizontal{ left: 20px; }
/* non-visible scrollbar/RTL direction/left-side scrollbar */
.mCS-dir-rtl > .mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden + .mCSB_scrollTools ~ .mCSB_scrollTools.mCSB_scrollTools_horizontal{ left: 0; }
.mCS-dir-rtl > .mCSB_inside > .mCSB_container_wrapper{ /* RTL direction/left-side scrollbar */
margin-right: 0;
margin-left: 30px;
}
.mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden > .mCSB_container{ padding-right: 0; }
.mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden > .mCSB_container{ padding-bottom: 0; }
.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_y.mCS_y_hidden{
margin-right: 0; /* non-visible scrollbar */
margin-left: 0;
}
/* non-visible horizontal scrollbar */
.mCustomScrollBox.mCSB_vertical_horizontal.mCSB_inside > .mCSB_container_wrapper.mCS_no_scrollbar_x.mCS_x_hidden{ margin-bottom: 0; }
/*
------------------------------------------------------------------------------------------------------------------------
5. TRANSITIONS
------------------------------------------------------------------------------------------------------------------------
*/
.mCSB_scrollTools,
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonLeft,
.mCSB_scrollTools .mCSB_buttonRight{
-webkit-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
-moz-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
-o-transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
transition: opacity .2s ease-in-out, background-color .2s ease-in-out;
}
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar, /* auto-expanded scrollbar */
.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger_bar,
.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerRail{
-webkit-transition: width .2s ease-out .2s, height .2s ease-out .2s,
margin-left .2s ease-out .2s, margin-right .2s ease-out .2s,
margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s,
opacity .2s ease-in-out, background-color .2s ease-in-out;
-moz-transition: width .2s ease-out .2s, height .2s ease-out .2s,
margin-left .2s ease-out .2s, margin-right .2s ease-out .2s,
margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s,
opacity .2s ease-in-out, background-color .2s ease-in-out;
-o-transition: width .2s ease-out .2s, height .2s ease-out .2s,
margin-left .2s ease-out .2s, margin-right .2s ease-out .2s,
margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s,
opacity .2s ease-in-out, background-color .2s ease-in-out;
transition: width .2s ease-out .2s, height .2s ease-out .2s,
margin-left .2s ease-out .2s, margin-right .2s ease-out .2s,
margin-top .2s ease-out .2s, margin-bottom .2s ease-out .2s,
opacity .2s ease-in-out, background-color .2s ease-in-out;
}
/*
------------------------------------------------------------------------------------------------------------------------
6. SCROLLBAR COLORS, OPACITY AND BACKGROUNDS
------------------------------------------------------------------------------------------------------------------------
*/
/*
----------------------------------------
6.1 THEMES
----------------------------------------
*/
/* default theme ("light") */
.mCSB_scrollTools{ opacity: 0.75; filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; }
.mCS-autoHide > .mCustomScrollBox > .mCSB_scrollTools,
.mCS-autoHide > .mCustomScrollBox ~ .mCSB_scrollTools{ opacity: 0; filter: "alpha(opacity=0)"; -ms-filter: "alpha(opacity=0)"; }
.mCustomScrollbar > .mCustomScrollBox > .mCSB_scrollTools.mCSB_scrollTools_onDrag,
.mCustomScrollbar > .mCustomScrollBox ~ .mCSB_scrollTools.mCSB_scrollTools_onDrag,
.mCustomScrollBox:hover > .mCSB_scrollTools,
.mCustomScrollBox:hover ~ .mCSB_scrollTools,
.mCS-autoHide:hover > .mCustomScrollBox > .mCSB_scrollTools,
.mCS-autoHide:hover > .mCustomScrollBox ~ .mCSB_scrollTools{ opacity: 1; filter: "alpha(opacity=100)"; -ms-filter: "alpha(opacity=100)"; }
.mCSB_scrollTools .mCSB_draggerRail{
background-color: #f3f3f3;
filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)";
}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
background-color: #b2accb;
filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)";
}
.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{
background-color: #b2accb;
filter: "alpha(opacity=85)"; -ms-filter: "alpha(opacity=85)";
}
.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
background-color: #b2accb;
filter: "alpha(opacity=90)"; -ms-filter: "alpha(opacity=90)";
}
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonLeft,
.mCSB_scrollTools .mCSB_buttonRight{
background-image: url('../../../../../../../../design/themes/avtoopt/media/mCSB_buttons.png?1759911146'); /* css sprites */
background-repeat: no-repeat;
opacity: 0.4; filter: "alpha(opacity=40)"; -ms-filter: "alpha(opacity=40)";
}
.mCSB_scrollTools .mCSB_buttonUp{
background-position: 0 0;
/*
sprites locations
light: 0 0, -16px 0, -32px 0, -48px 0, 0 -72px, -16px -72px, -32px -72px
dark: -80px 0, -96px 0, -112px 0, -128px 0, -80px -72px, -96px -72px, -112px -72px
*/
}
.mCSB_scrollTools .mCSB_buttonDown{
background-position: 0 -20px;
/*
sprites locations
light: 0 -20px, -16px -20px, -32px -20px, -48px -20px, 0 -92px, -16px -92px, -32px -92px
dark: -80px -20px, -96px -20px, -112px -20px, -128px -20px, -80px -92px, -96px -92px, -112 -92px
*/
}
.mCSB_scrollTools .mCSB_buttonLeft{
background-position: 0 -40px;
/*
sprites locations
light: 0 -40px, -20px -40px, -40px -40px, -60px -40px, 0 -112px, -20px -112px, -40px -112px
dark: -80px -40px, -100px -40px, -120px -40px, -140px -40px, -80px -112px, -100px -112px, -120px -112px
*/
}
.mCSB_scrollTools .mCSB_buttonRight{
background-position: 0 -56px;
/*
sprites locations
light: 0 -56px, -20px -56px, -40px -56px, -60px -56px, 0 -128px, -20px -128px, -40px -128px
dark: -80px -56px, -100px -56px, -120px -56px, -140px -56px, -80px -128px, -100px -128px, -120px -128px
*/
}
.mCSB_scrollTools .mCSB_buttonUp:hover,
.mCSB_scrollTools .mCSB_buttonDown:hover,
.mCSB_scrollTools .mCSB_buttonLeft:hover,
.mCSB_scrollTools .mCSB_buttonRight:hover{ opacity: 0.75; filter: "alpha(opacity=75)"; -ms-filter: "alpha(opacity=75)"; }
.mCSB_scrollTools .mCSB_buttonUp:active,
.mCSB_scrollTools .mCSB_buttonDown:active,
.mCSB_scrollTools .mCSB_buttonLeft:active,
.mCSB_scrollTools .mCSB_buttonRight:active{ opacity: 0.9; filter: "alpha(opacity=90)"; -ms-filter: "alpha(opacity=90)"; }
/* theme: "dark" */
.mCS-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #f3f3f3; }
.mCS-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; }
.mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: rgba(0,0,0,0.85); }
.mCS-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: rgba(0,0,0,0.9); }
.mCS-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -80px 0; }
.mCS-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -80px -20px; }
.mCS-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -80px -40px; }
.mCS-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -80px -56px; }
/* ---------------------------------------- */
/* theme: "light-2", "dark-2" */
.mCS-light-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail{
width: 4px;
background-color: #b2accb;
-webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px;
}
.mCS-light-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
width: 4px;
background-color: #b2accb;
-webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px;
}
.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-light-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
width: 100%;
height: 4px;
margin: 6px auto;
}
.mCS-light-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); }
.mCS-light-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-light-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); }
.mCS-light-2.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px 0; }
.mCS-light-2.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -20px; }
.mCS-light-2.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -40px; }
.mCS-light-2.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -56px; }
/* theme: "dark-2" */
.mCS-dark-2.mCSB_scrollTools .mCSB_draggerRail{
background-color: #f3f3f3; background-color: rgba(0,0,0,0.1);
-webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px;
}
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
background-color: #f3f3f3; background-color: rgba(0,0,0,0.75);
-webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px;
}
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #f3f3f3; background-color: rgba(0,0,0,0.85); }
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-2.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #f3f3f3; background-color: rgba(0,0,0,0.9); }
.mCS-dark-2.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px 0; }
.mCS-dark-2.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -20px; }
.mCS-dark-2.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -40px; }
.mCS-dark-2.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -56px; }
/* ---------------------------------------- */
/* theme: "light-thick", "dark-thick" */
.mCS-light-thick.mCSB_scrollTools .mCSB_draggerRail,
.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail{
width: 6px;
background-color: #b2accb;
-webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
}
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
width: 6px;
background-color: #b2accb;
-webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
}
.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_draggerRail{
width: 100%;
height: 4px;
margin: 6px 0;
}
.mCS-light-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
width: 100%;
height: 6px;
margin: 5px auto;
}
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); }
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-light-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); }
.mCS-light-thick.mCSB_scrollTools .mCSB_buttonUp{ background-position: -16px 0; }
.mCS-light-thick.mCSB_scrollTools .mCSB_buttonDown{ background-position: -16px -20px; }
.mCS-light-thick.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -20px -40px; }
.mCS-light-thick.mCSB_scrollTools .mCSB_buttonRight{ background-position: -20px -56px; }
/* theme: "dark-thick" */
.mCS-dark-thick.mCSB_scrollTools .mCSB_draggerRail{
background-color: #f3f3f3; background-color: rgba(0,0,0,0.1);
-webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
background-color: #f3f3f3; background-color: rgba(0,0,0,0.75);
-webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;
}
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #f3f3f3; background-color: rgba(0,0,0,0.85); }
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #f3f3f3; background-color: rgba(0,0,0,0.9); }
.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonUp{ background-position: -96px 0; }
.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonDown{ background-position: -96px -20px; }
.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -100px -40px; }
.mCS-dark-thick.mCSB_scrollTools .mCSB_buttonRight{ background-position: -100px -56px; }
/* ---------------------------------------- */
/* theme: "light-thin", "dark-thin" */
.mCS-light-thin.mCSB_scrollTools .mCSB_draggerRail{ background-color: #fff; background-color: rgba(255,255,255,0.1); }
.mCS-light-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 2px; }
.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_draggerRail{ width: 100%; }
.mCS-light-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
width: 100%;
height: 2px;
margin: 7px auto;
}
/* theme "dark-thin" */
.mCS-dark-thin.mCSB_scrollTools .mCSB_draggerRail{background-color: #f3f3f3; background-color: rgba(0,0,0,0.15); }
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #f3f3f3; background-color: rgba(0,0,0,0.75); }
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #f3f3f3; background-color: rgba(0,0,0,0.85); }
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-thin.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); }
.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonUp{ background-position: -80px 0; }
.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonDown{ background-position: -80px -20px; }
.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -80px -40px; }
.mCS-dark-thin.mCSB_scrollTools .mCSB_buttonRight{ background-position: -80px -56px; }
/* ---------------------------------------- */
/* theme "rounded", "rounded-dark", "rounded-dots", "rounded-dots-dark" */
.mCS-rounded.mCSB_scrollTools .mCSB_draggerRail{ background-color: #fff; background-color: rgba(255,255,255,0.15); }
.mCS-rounded.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger{ height: 14px; }
.mCS-rounded.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
width: 14px;
margin: 0 1px;
}
.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 14px; }
.mCS-rounded.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
height: 14px;
margin: 1px 0;
}
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{
width: 16px; /* auto-expanded scrollbar */
height: 16px;
margin: -1px 0;
}
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{ width: 4px; /* auto-expanded scrollbar */ }
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_dragger .mCSB_dragger_bar{
height: 16px; /* auto-expanded scrollbar */
width: 16px;
margin: 0 -1px;
}
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-rounded.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-rounded-dark.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{
height: 4px; /* auto-expanded scrollbar */
margin: 6px 0;
}
.mCS-rounded.mCSB_scrollTools .mCSB_buttonUp{ background-position: 0 -72px; }
.mCS-rounded.mCSB_scrollTools .mCSB_buttonDown{ background-position: 0 -92px; }
.mCS-rounded.mCSB_scrollTools .mCSB_buttonLeft{ background-position: 0 -112px; }
.mCS-rounded.mCSB_scrollTools .mCSB_buttonRight{ background-position: 0 -128px; }
/* theme "rounded-dark", "rounded-dots-dark" */
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #f3f3f3; background-color: rgba(0,0,0,0.75); }
.mCS-rounded-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #f3f3f3; background-color: rgba(0,0,0,0.15); }
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #f3f3f3; background-color: rgba(0,0,0,0.85); }
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-rounded-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #f3f3f3; background-color: rgba(0,0,0,0.9); }
.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -80px -72px; }
.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -80px -92px; }
.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -80px -112px; }
.mCS-rounded-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -80px -128px; }
/* theme "rounded-dots", "rounded-dots-dark" */
.mCS-rounded-dots.mCSB_scrollTools_vertical .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools_vertical .mCSB_draggerRail{ width: 4px; }
.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{
background-color: transparent;
background-position: center;
}
.mCS-rounded-dots.mCSB_scrollTools .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail{
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAANElEQVQYV2NkIAAYiVbw//9/Y6DiM1ANJoyMjGdBbLgJQAX/kU0DKgDLkaQAvxW4HEvQFwCRcxIJK1XznAAAAABJRU5ErkJggg==");
background-repeat: repeat-y;
opacity: 0.3;
filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)";
}
.mCS-rounded-dots.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-rounded-dots-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{
height: 4px;
margin: 6px 0;
background-repeat: repeat-x;
}
.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonUp{ background-position: -16px -72px; }
.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonDown{ background-position: -16px -92px; }
.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -20px -112px; }
.mCS-rounded-dots.mCSB_scrollTools .mCSB_buttonRight{ background-position: -20px -128px; }
/* theme "rounded-dots-dark" */
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_draggerRail{
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYV2NkIAAYSVFgDFR8BqrBBEifBbGRTfiPZhpYjiQFBK3A6l6CvgAAE9kGCd1mvgEAAAAASUVORK5CYII=");
}
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -96px -72px; }
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -96px -92px; }
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -100px -112px; }
.mCS-rounded-dots-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -100px -128px; }
/* ---------------------------------------- */
/* theme "3d", "3d-dark", "3d-thick", "3d-thick-dark" */
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
background-repeat: repeat-y;
background-image: -moz-linear-gradient(left, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 100%);
background-image: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0.5)), color-stop(100%,rgba(255,255,255,0)));
background-image: -webkit-linear-gradient(left, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
background-image: -o-linear-gradient(left, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
background-image: -ms-linear-gradient(left, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
background-image: linear-gradient(to right, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
}
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
background-repeat: repeat-x;
background-image: -moz-linear-gradient(top, rgba(255,255,255,0.5) 0%, rgba(255,255,255,0) 100%);
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0.5)), color-stop(100%,rgba(255,255,255,0)));
background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
background-image: -o-linear-gradient(top, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
background-image: -ms-linear-gradient(top, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
background-image: linear-gradient(to bottom, rgba(255,255,255,0.5) 0%,rgba(255,255,255,0) 100%);
}
/* theme "3d", "3d-dark" */
.mCS-3d.mCSB_scrollTools_vertical .mCSB_dragger,
.mCS-3d-dark.mCSB_scrollTools_vertical .mCSB_dragger{ height: 70px; }
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 70px; }
.mCS-3d.mCSB_scrollTools,
.mCS-3d-dark.mCSB_scrollTools{
opacity: 1;
filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)";
}
.mCS-3d.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ -webkit-border-radius: 16px; -moz-border-radius: 16px; border-radius: 16px; }
.mCS-3d.mCSB_scrollTools .mCSB_draggerRail,
.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail{
width: 8px;
background-color: #f3f3f3; background-color: rgba(0,0,0,0.2);
box-shadow: inset 1px 0 1px rgba(0,0,0,0.5), inset -1px 0 1px rgba(255,255,255,0.2);
}
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #555; }
.mCS-3d.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 8px; }
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{
width: 100%;
height: 8px;
margin: 4px 0;
box-shadow: inset 0 1px 1px rgba(0,0,0,0.5), inset 0 -1px 1px rgba(255,255,255,0.2);
}
.mCS-3d.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
width: 100%;
height: 8px;
margin: 4px auto;
}
.mCS-3d.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; }
.mCS-3d.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; }
.mCS-3d.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; }
.mCS-3d.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; }
/* theme "3d-dark" */
.mCS-3d-dark.mCSB_scrollTools .mCSB_draggerRail{
background-color: #f3f3f3; background-color: rgba(0,0,0,0.1);
box-shadow: inset 1px 0 1px rgba(0,0,0,0.1);
}
.mCS-3d-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{ box-shadow: inset 0 1px 1px rgba(0,0,0,0.1); }
.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; }
.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; }
.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; }
.mCS-3d-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; }
/* ---------------------------------------- */
/* theme: "3d-thick", "3d-thick-dark" */
.mCS-3d-thick.mCSB_scrollTools,
.mCS-3d-thick-dark.mCSB_scrollTools{
opacity: 1;
filter: "alpha(opacity=30)"; -ms-filter: "alpha(opacity=30)";
}
.mCS-3d-thick.mCSB_scrollTools,
.mCS-3d-thick-dark.mCSB_scrollTools,
.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer{ -webkit-border-radius: 7px; -moz-border-radius: 7px; border-radius: 7px; }
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
.mCSB_inside + .mCS-3d-thick.mCSB_scrollTools_vertical,
.mCSB_inside + .mCS-3d-thick-dark.mCSB_scrollTools_vertical{ right: 1px; }
.mCS-3d-thick.mCSB_scrollTools_vertical,
.mCS-3d-thick-dark.mCSB_scrollTools_vertical{ box-shadow: inset 1px 0 1px rgba(0,0,0,0.1), inset 0 0 14px rgba(0,0,0,0.5); }
.mCS-3d-thick.mCSB_scrollTools_horizontal,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal{
bottom: 1px;
box-shadow: inset 0 1px 1px rgba(0,0,0,0.1), inset 0 0 14px rgba(0,0,0,0.5);
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
box-shadow: inset 1px 0 0 rgba(255,255,255,0.4);
width: 12px;
margin: 2px;
position: absolute;
height: auto;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ box-shadow: inset 0 1px 0 rgba(255,255,255,0.4); }
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-thick.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #555; }
.mCS-3d-thick.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
height: 12px;
width: auto;
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerContainer{
background-color: #f3f3f3; background-color: rgba(0,0,0,0.05);
box-shadow: inset 1px 1px 16px rgba(0,0,0,0.1);
}
.mCS-3d-thick.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; }
.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; }
.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; }
.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; }
.mCS-3d-thick.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; }
/* theme: "3d-thick-dark" */
.mCS-3d-thick-dark.mCSB_scrollTools{ box-shadow: inset 0 0 14px rgba(0,0,0,0.2); }
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal{ box-shadow: inset 0 1px 1px rgba(0,0,0,0.1), inset 0 0 14px rgba(0,0,0,0.2); }
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ box-shadow: inset 1px 0 0 rgba(255,255,255,0.4), inset -1px 0 0 rgba(0,0,0,0.2); }
.mCS-3d-thick-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{ box-shadow: inset 0 1px 0 rgba(255,255,255,0.4), inset 0 -1px 0 rgba(0,0,0,0.2); }
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #777; }
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerContainer{
background-color: #fff; background-color: rgba(0,0,0,0.05);
box-shadow: inset 1px 1px 16px rgba(0,0,0,0.1);
}
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; }
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; }
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; }
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; }
.mCS-3d-thick-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; }
/* ---------------------------------------- */
/* theme: "minimal", "minimal-dark" */
.mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical,
.mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical{
right: 0;
margin: 12px 0;
}
.mCustomScrollBox.mCS-minimal + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools.mCSB_scrollTools_horizontal,
.mCustomScrollBox.mCS-minimal-dark + .mCSB_scrollTools + .mCSB_scrollTools.mCSB_scrollTools_horizontal{
bottom: 0;
margin: 0 12px;
}
/* RTL direction/left-side scrollbar */
.mCS-dir-rtl > .mCSB_outside + .mCS-minimal.mCSB_scrollTools_vertical,
.mCS-dir-rtl > .mCSB_outside + .mCS-minimal-dark.mCSB_scrollTools_vertical{
left: 0;
right: auto;
}
.mCS-minimal.mCSB_scrollTools .mCSB_draggerRail,
.mCS-minimal-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: transparent; }
.mCS-minimal.mCSB_scrollTools_vertical .mCSB_dragger,
.mCS-minimal-dark.mCSB_scrollTools_vertical .mCSB_dragger{ height: 50px; }
.mCS-minimal.mCSB_scrollTools_horizontal .mCSB_dragger,
.mCS-minimal-dark.mCSB_scrollTools_horizontal .mCSB_dragger{ width: 50px; }
.mCS-minimal.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
background-color: #fff; background-color: rgba(255,255,255,0.2);
filter: "alpha(opacity=20)"; -ms-filter: "alpha(opacity=20)";
}
.mCS-minimal.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-minimal.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
background-color: #fff; background-color: rgba(255,255,255,0.5);
filter: "alpha(opacity=50)"; -ms-filter: "alpha(opacity=50)";
}
/* theme: "minimal-dark" */
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
background-color: #f3f3f3; background-color: rgba(0,0,0,0.2);
filter: "alpha(opacity=20)"; -ms-filter: "alpha(opacity=20)";
}
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-minimal-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
background-color: #f3f3f3; background-color: rgba(0,0,0,0.5);
filter: "alpha(opacity=50)"; -ms-filter: "alpha(opacity=50)";
}
/* ---------------------------------------- */
/* theme "light-3", "dark-3" */
.mCS-light-3.mCSB_scrollTools .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail{
width: 6px;
background-color: #f3f3f3; background-color: rgba(0,0,0,0.2);
}
.mCS-light-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ width: 6px; }
.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-light-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_horizontal .mCSB_draggerRail{
width: 100%;
height: 6px;
margin: 5px 0;
}
.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_vertical.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{
width: 12px;
}
.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-light-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_dragger.mCSB_dragger_onDrag_expanded + .mCSB_draggerRail,
.mCS-dark-3.mCSB_scrollTools_horizontal.mCSB_scrollTools_onDrag_expand .mCSB_draggerContainer:hover .mCSB_draggerRail{
height: 12px;
margin: 2px 0;
}
.mCS-light-3.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; }
.mCS-light-3.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; }
.mCS-light-3.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; }
.mCS-light-3.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; }
/* theme "dark-3" */
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #f3f3f3; background-color: rgba(0,0,0,0.75); }
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #f3f3f3; background-color: rgba(0,0,0,0.85); }
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-dark-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #f3f3f3; background-color: rgba(0,0,0,0.9); }
.mCS-dark-3.mCSB_scrollTools .mCSB_draggerRail{background-color: #f3f3f3; background-color: rgba(0,0,0,0.1); }
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; }
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; }
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; }
.mCS-dark-3.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; }
/* ---------------------------------------- */
/* theme "inset", "inset-dark", "inset-2", "inset-2-dark", "inset-3", "inset-3-dark" */
.mCS-inset.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail{
width: 12px;
background-color: #f3f3f3; background-color: rgba(0,0,0,0.2);
}
.mCS-inset.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
width: 6px;
margin: 3px 5px;
position: absolute;
height: auto;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.mCS-inset.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_dragger .mCSB_dragger_bar{
height: 6px;
margin: 5px 3px;
position: absolute;
width: auto;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.mCS-inset.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-2.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-3.mCSB_scrollTools_horizontal .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools_horizontal .mCSB_draggerRail{
width: 100%;
height: 12px;
margin: 2px 0;
}
.mCS-inset.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonUp{ background-position: -32px -72px; }
.mCS-inset.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonDown{ background-position: -32px -92px; }
.mCS-inset.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -40px -112px; }
.mCS-inset.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-2.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-3.mCSB_scrollTools .mCSB_buttonRight{ background-position: -40px -128px; }
/* theme "inset-dark", "inset-2-dark", "inset-3-dark" */
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.75); }
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.85); }
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #000; background-color: rgba(0,0,0,0.9); }
.mCS-inset-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #000; background-color: rgba(0,0,0,0.1); }
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonUp,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonUp{ background-position: -112px -72px; }
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonDown,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonDown{ background-position: -112px -92px; }
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonLeft,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonLeft{ background-position: -120px -112px; }
.mCS-inset-dark.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_buttonRight,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_buttonRight{ background-position: -120px -128px; }
/* theme "inset-2", "inset-2-dark" */
.mCS-inset-2.mCSB_scrollTools .mCSB_draggerRail,
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail{
background-color: transparent;
border-width: 1px;
border-style: solid;
border-color: #fff;
border-color: rgba(255,255,255,0.2);
-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
}
.mCS-inset-2-dark.mCSB_scrollTools .mCSB_draggerRail{ border-color: #000; border-color: rgba(0,0,0,0.2); }
/* theme "inset-3", "inset-3-dark" */
.mCS-inset-3.mCSB_scrollTools .mCSB_draggerRail{ background-color: #fff; background-color: rgba(255,255,255,0.6); }
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_draggerRail{ background-color: #f3f3f3; background-color: rgba(0,0,0,0.6); }
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #f3f3f3; background-color: rgba(0,0,0,0.75); }
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #f3f3f3; background-color: rgba(0,0,0,0.85); }
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-3.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #f3f3f3; background-color: rgba(0,0,0,0.9); }
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.75); }
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.85); }
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCS-inset-3-dark.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{ background-color: #fff; background-color: rgba(255,255,255,0.9); }
/* ---------------------------------------- */
/* General styles for the modal */
/*
Styles for the html/body for special modal where we want 3d effects
Note that we need a container wrapping all content on the page for the
perspective effects (not including the modals and the overlay).
*/
.md-perspective,
.md-perspective body {
height: 100%;
overflow: hidden;
}
.md-perspective body {
background: #222;
-webkit-perspective: 600px;
-moz-perspective: 600px;
perspective: 600px;
}
.container {
background: #e74c3c;
min-height: 100%;
}
.md-modal {
position: absolute;
top: 60px;
left: 50%;
width: 50%;
margin-left: -160px;
/*
position: fixed;
top: 50%;
left: 50%;
width: 50%;
*/
max-width: 320px;
min-width: 320px;
height: auto;
z-index: 2000;
/*display: none;*/
visibility: hidden;
/*
-webkit-transform: translateX(-50%) translateY(-50%);
-moz-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
*/
}
.md-show {
visibility: visible;
/*display: block;*/
}
.md-overlay {
position: fixed;
width: 100%;
height: 100%;
visibility: hidden;
top: 0;
left: 0;
z-index: 100;
opacity: 0;
background: rgba(67, 68, 94, 0.8);
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
vertical-align: middle;
}
.md-show ~ .md-overlay {
opacity: 0.8;
visibility: visible;
}
/* Content styles */
.md-content {
color: #fff;
background: #ffffff;
position: relative;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
margin: 0 auto;
}
.md-content h3 {
margin: 0;
padding: 0.4em;
text-align: center;
font-size: 2.4em;
font-weight: 300;
opacity: 0.8;
background: rgba(0,0,0,0.1);
border-radius: 3px 3px 0 0;
}
.md-content > div {
padding: 15px 40px 30px;
margin: 0;
font-weight: 300;
font-size: 1.15em;
}
.md-content > div p {
margin: 0;
padding: 10px 0;
}
.md-content > div ul {
margin: 0;
padding: 0 0 30px 20px;
}
.md-content > div ul li {
padding: 5px 0;
}
.md-content button {
display: block;
margin: 0 auto;
font-size: 0.8em;
z-index: 100000;
}
/* Individual modal styles with animations/transitions */
/* Effect 1: Fade in and scale up */
.md-effect-1 .md-content {
-webkit-transform: scale(0.7);
-moz-transform: scale(0.7);
-ms-transform: scale(0.7);
transform: scale(0.7);
opacity: 0;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
.md-show.md-effect-1 .md-content {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
opacity: 1;
}
/* Effect 2: Slide from the right */
.md-effect-2 .md-content {
-webkit-transform: translateX(20%);
-moz-transform: translateX(20%);
-ms-transform: translateX(20%);
transform: translateX(20%);
opacity: 0;
-webkit-transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
-moz-transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
}
.md-show.md-effect-2 .md-content {
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
opacity: 1;
}
/* Effect 3: Slide from the bottom */
.md-effect-3 .md-content {
-webkit-transform: translateY(20%);
-moz-transform: translateY(20%);
-ms-transform: translateY(20%);
transform: translateY(20%);
opacity: 0;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
.md-show.md-effect-3 .md-content {
-webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
opacity: 1;
}
/* Effect 4: Newspaper */
.md-effect-4 .md-content {
-webkit-transform: scale(0) rotate(720deg);
-moz-transform: scale(0) rotate(720deg);
-ms-transform: scale(0) rotate(720deg);
transform: scale(0) rotate(720deg);
opacity: 0;
}
.md-show.md-effect-4 ~ .md-overlay,
.md-effect-4 .md-content {
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
transition: all 0.5s;
}
.md-show.md-effect-4 .md-content {
-webkit-transform: scale(1) rotate(0deg);
-moz-transform: scale(1) rotate(0deg);
-ms-transform: scale(1) rotate(0deg);
transform: scale(1) rotate(0deg);
opacity: 1;
}
/* Effect 5: fall */
.md-effect-5.md-modal {
-webkit-perspective: 1300px;
-moz-perspective: 1300px;
perspective: 1300px;
}
.md-effect-5 .md-content {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform: translateZ(600px) rotateX(20deg);
-moz-transform: translateZ(600px) rotateX(20deg);
-ms-transform: translateZ(600px) rotateX(20deg);
transform: translateZ(600px) rotateX(20deg);
opacity: 0;
}
.md-show.md-effect-5 .md-content {
-webkit-transition: all 0.3s ease-in;
-moz-transition: all 0.3s ease-in;
transition: all 0.3s ease-in;
-webkit-transform: translateZ(0px) rotateX(0deg);
-moz-transform: translateZ(0px) rotateX(0deg);
-ms-transform: translateZ(0px) rotateX(0deg);
transform: translateZ(0px) rotateX(0deg);
opacity: 1;
}
/* Effect 6: side fall */
.md-effect-6.md-modal {
-webkit-perspective: 1300px;
-moz-perspective: 1300px;
perspective: 1300px;
}
.md-effect-6 .md-content {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform: translate(30%) translateZ(600px) rotate(10deg);
-moz-transform: translate(30%) translateZ(600px) rotate(10deg);
-ms-transform: translate(30%) translateZ(600px) rotate(10deg);
transform: translate(30%) translateZ(600px) rotate(10deg);
opacity: 0;
}
.md-show.md-effect-6 .md-content {
-webkit-transition: all 0.3s ease-in;
-moz-transition: all 0.3s ease-in;
transition: all 0.3s ease-in;
-webkit-transform: translate(0%) translateZ(0) rotate(0deg);
-moz-transform: translate(0%) translateZ(0) rotate(0deg);
-ms-transform: translate(0%) translateZ(0) rotate(0deg);
transform: translate(0%) translateZ(0) rotate(0deg);
opacity: 1;
}
/* Effect 7: slide and stick to top */
.md-effect-7{
top: 0;
-webkit-transform: translateX(-50%);
-moz-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
.md-effect-7 .md-content {
-webkit-transform: translateY(-200%);
-moz-transform: translateY(-200%);
-ms-transform: translateY(-200%);
transform: translateY(-200%);
-webkit-transition: all .3s;
-moz-transition: all .3s;
transition: all .3s;
opacity: 0;
}
.md-show.md-effect-7 .md-content {
-webkit-transform: translateY(0%);
-moz-transform: translateY(0%);
-ms-transform: translateY(0%);
transform: translateY(0%);
border-radius: 0 0 3px 3px;
opacity: 1;
}
/* Effect 8: 3D flip horizontal */
.md-effect-8.md-modal {
-webkit-perspective: 1300px;
-moz-perspective: 1300px;
perspective: 1300px;
}
.md-effect-8 .md-content {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform: rotateY(-70deg);
-moz-transform: rotateY(-70deg);
-ms-transform: rotateY(-70deg);
transform: rotateY(-70deg);
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
opacity: 0;
}
.md-show.md-effect-8 .md-content {
-webkit-transform: rotateY(0deg);
-moz-transform: rotateY(0deg);
-ms-transform: rotateY(0deg);
transform: rotateY(0deg);
opacity: 1;
}
/* Effect 9: 3D flip vertical */
.md-effect-9.md-modal {
-webkit-perspective: 1300px;
-moz-perspective: 1300px;
perspective: 1300px;
}
.md-effect-9 .md-content {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform: rotateX(-70deg);
-moz-transform: rotateX(-70deg);
-ms-transform: rotateX(-70deg);
transform: rotateX(-70deg);
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
opacity: 0;
}
.md-show.md-effect-9 .md-content {
-webkit-transform: rotateX(0deg);
-moz-transform: rotateX(0deg);
-ms-transform: rotateX(0deg);
transform: rotateX(0deg);
opacity: 1;
}
/* Effect 10: 3D sign */
.md-effect-10.md-modal {
-webkit-perspective: 1300px;
-moz-perspective: 1300px;
perspective: 1300px;
}
.md-effect-10 .md-content {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform: rotateX(-60deg);
-moz-transform: rotateX(-60deg);
-ms-transform: rotateX(-60deg);
transform: rotateX(-60deg);
-webkit-transform-origin: 50% 0;
-moz-transform-origin: 50% 0;
transform-origin: 50% 0;
opacity: 0;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
.md-show.md-effect-10 .md-content {
-webkit-transform: rotateX(0deg);
-moz-transform: rotateX(0deg);
-ms-transform: rotateX(0deg);
transform: rotateX(0deg);
opacity: 1;
}
/* Effect 11: Super scaled */
.md-effect-11 .md-content {
-webkit-transform: scale(2);
-moz-transform: scale(2);
-ms-transform: scale(2);
transform: scale(2);
opacity: 0;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
.md-show.md-effect-11 .md-content {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
opacity: 1;
}
/* Effect 12: Just me */
.md-effect-12 .md-content {
-webkit-transform: scale(0.8);
-moz-transform: scale(0.8);
-ms-transform: scale(0.8);
transform: scale(0.8);
opacity: 0;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
.md-show.md-effect-12 ~ .md-overlay {
background: #e74c3c;
}
.md-effect-12 .md-content h3,
.md-effect-12 .md-content {
background: transparent;
}
.md-show.md-effect-12 .md-content {
-webkit-transform: scale(1);
-moz-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
opacity: 1;
}
/* Effect 13: 3D slit */
.md-effect-13.md-modal {
-webkit-perspective: 1300px;
-moz-perspective: 1300px;
perspective: 1300px;
}
.md-effect-13 .md-content {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform: translateZ(-3000px) rotateY(90deg);
-moz-transform: translateZ(-3000px) rotateY(90deg);
-ms-transform: translateZ(-3000px) rotateY(90deg);
transform: translateZ(-3000px) rotateY(90deg);
opacity: 0;
}
.md-show.md-effect-13 .md-content {
-webkit-animation: slit .7s forwards ease-out;
-moz-animation: slit .7s forwards ease-out;
animation: slit .7s forwards ease-out;
}
@-webkit-keyframes slit {
50% { -webkit-transform: translateZ(-250px) rotateY(89deg); opacity: .5; -webkit-animation-timing-function: ease-out;}
100% { -webkit-transform: translateZ(0) rotateY(0deg); opacity: 1; }
}
@-moz-keyframes slit {
50% { -moz-transform: translateZ(-250px) rotateY(89deg); opacity: .5; -moz-animation-timing-function: ease-out;}
100% { -moz-transform: translateZ(0) rotateY(0deg); opacity: 1; }
}
@keyframes slit {
50% { transform: translateZ(-250px) rotateY(89deg); opacity: 1; animation-timing-function: ease-in;}
100% { transform: translateZ(0) rotateY(0deg); opacity: 1; }
}
/* Effect 14: 3D Rotate from bottom */
.md-effect-14.md-modal {
-webkit-perspective: 1300px;
-moz-perspective: 1300px;
perspective: 1300px;
}
.md-effect-14 .md-content {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform: translateY(100%) rotateX(90deg);
-moz-transform: translateY(100%) rotateX(90deg);
-ms-transform: translateY(100%) rotateX(90deg);
transform: translateY(100%) rotateX(90deg);
-webkit-transform-origin: 0 100%;
-moz-transform-origin: 0 100%;
transform-origin: 0 100%;
opacity: 0;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.md-show.md-effect-14 .md-content {
-webkit-transform: translateY(0%) rotateX(0deg);
-moz-transform: translateY(0%) rotateX(0deg);
-ms-transform: translateY(0%) rotateX(0deg);
transform: translateY(0%) rotateX(0deg);
opacity: 1;
}
/* Effect 15: 3D Rotate in from left */
.md-effect-15.md-modal {
-webkit-perspective: 1300px;
-moz-perspective: 1300px;
perspective: 1300px;
}
.md-effect-15 .md-content {
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transform: translateZ(100px) translateX(-30%) rotateY(90deg);
-moz-transform: translateZ(100px) translateX(-30%) rotateY(90deg);
-ms-transform: translateZ(100px) translateX(-30%) rotateY(90deg);
transform: translateZ(100px) translateX(-30%) rotateY(90deg);
-webkit-transform-origin: 0 100%;
-moz-transform-origin: 0 100%;
transform-origin: 0 100%;
opacity: 0;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
.md-show.md-effect-15 .md-content {
-webkit-transform: translateZ(0px) translateX(0%) rotateY(0deg);
-moz-transform: translateZ(0px) translateX(0%) rotateY(0deg);
-ms-transform: translateZ(0px) translateX(0%) rotateY(0deg);
transform: translateZ(0px) translateX(0%) rotateY(0deg);
opacity: 1;
}
/* Effect 16: Blur */
.md-show.md-effect-16 ~ .md-overlay {
background: rgba(180,46,32,0.5);
}
.md-show.md-effect-16 ~ .container {
-webkit-filter: blur(3px);
-moz-filter: blur(3px);
filter: blur(3px);
}
.md-effect-16 .md-content {
-webkit-transform: translateY(-5%);
-moz-transform: translateY(-5%);
-ms-transform: translateY(-5%);
transform: translateY(-5%);
opacity: 0;
}
.md-show.md-effect-16 ~ .container,
.md-effect-16 .md-content {
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
.md-show.md-effect-16 .md-content {
-webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
opacity: 1;
}
/* Effect 17: Slide in from bottom with perspective on container */
.md-show.md-effect-17 ~ .container {
height: 100%;
overflow: hidden;
-webkit-transition: -webkit-transform 0.3s;
-moz-transition: -moz-transform 0.3s;
transition: transform 0.3s;
}
.md-show.md-effect-17 ~ .container,
.md-show.md-effect-17 ~ .md-overlay {
-webkit-transform: rotateX(-2deg);
-moz-transform: rotateX(-2deg);
-ms-transform: rotateX(-2deg);
transform: rotateX(-2deg);
-webkit-transform-origin: 50% 0%;
-moz-transform-origin: 50% 0%;
transform-origin: 50% 0%;
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
}
.md-effect-17 .md-content {
opacity: 0;
-webkit-transform: translateY(200%);
-moz-transform: translateY(200%);
-ms-transform: translateY(200%);
transform: translateY(200%);
}
.md-show.md-effect-17 .md-content {
-webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
opacity: 1;
-webkit-transition: all 0.3s 0.2s;
-moz-transition: all 0.3s 0.2s;
transition: all 0.3s 0.2s;
}
/* Effect 18: Slide from right with perspective on container */
.md-show.md-effect-18 ~ .container {
height: 100%;
overflow: hidden;
}
.md-show.md-effect-18 ~ .md-overlay {
background: rgba(143,27,15,0.8);
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
transition: all 0.5s;
}
.md-show.md-effect-18 ~ .container,
.md-show.md-effect-18 ~ .md-overlay {
-webkit-transform-style: preserve-3d;
-webkit-transform-origin: 0% 50%;
-webkit-animation: rotateRightSideFirst 0.5s forwards ease-in;
-moz-transform-style: preserve-3d;
-moz-transform-origin: 0% 50%;
-moz-animation: rotateRightSideFirst 0.5s forwards ease-in;
transform-style: preserve-3d;
transform-origin: 0% 50%;
animation: rotateRightSideFirst 0.5s forwards ease-in;
}
@-webkit-keyframes rotateRightSideFirst {
50% { -webkit-transform: translateZ(-50px) rotateY(5deg); -webkit-animation-timing-function: ease-out; }
100% { -webkit-transform: translateZ(-200px); }
}
@-moz-keyframes rotateRightSideFirst {
50% { -moz-transform: translateZ(-50px) rotateY(5deg); -moz-animation-timing-function: ease-out; }
100% { -moz-transform: translateZ(-200px); }
}
@keyframes rotateRightSideFirst {
50% { transform: translateZ(-50px) rotateY(5deg); animation-timing-function: ease-out; }
100% { transform: translateZ(-200px); }
}
.md-effect-18 .md-content {
-webkit-transform: translateX(200%);
-moz-transform: translateX(200%);
-ms-transform: translateX(200%);
transform: translateX(200%);
opacity: 0;
}
.md-show.md-effect-18 .md-content {
-webkit-transform: translateX(0);
-moz-transform: translateX(0);
-ms-transform: translateX(0);
transform: translateX(0);
opacity: 1;
-webkit-transition: all 0.5s 0.1s;
-moz-transition: all 0.5s 0.1s;
transition: all 0.5s 0.1s;
}
/* Effect 19: Slip in from the top with perspective on container */
.md-show.md-effect-19 ~ .container {
height: 100%;
overflow: hidden;
}
.md-show.md-effect-19 ~ .md-overlay {
-webkit-transition: all 0.5s;
-moz-transition: all 0.5s;
transition: all 0.5s;
}
.md-show.md-effect-19 ~ .container,
.md-show.md-effect-19 ~ .md-overlay {
-webkit-transform-style: preserve-3d;
-webkit-transform-origin: 50% 100%;
-webkit-animation: OpenTop 0.5s forwards ease-in;
-moz-transform-style: preserve-3d;
-moz-transform-origin: 50% 100%;
-moz-animation: OpenTop 0.5s forwards ease-in;
transform-style: preserve-3d;
transform-origin: 50% 100%;
animation: OpenTop 0.5s forwards ease-in;
}
@-webkit-keyframes OpenTop {
50% {
-webkit-transform: rotateX(10deg);
-webkit-animation-timing-function: ease-out;
}
}
@-moz-keyframes OpenTop {
50% {
-moz-transform: rotateX(10deg);
-moz-animation-timing-function: ease-out;
}
}
@keyframes OpenTop {
50% {
transform: rotateX(10deg);
animation-timing-function: ease-out;
}
}
.md-effect-19 .md-content {
-webkit-transform: translateY(-200%);
-moz-transform: translateY(-200%);
-ms-transform: translateY(-200%);
transform: translateY(-200%);
opacity: 0;
}
.md-show.md-effect-19 .md-content {
-webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
opacity: 1;
-webkit-transition: all 0.5s 0.1s;
-moz-transition: all 0.5s 0.1s;
transition: all 0.5s 0.1s;
}
@media screen and (max-width: 32em) {
body { font-size: 75%; }
}
/****
* Шрифты
****/
/**
* Fonts
**/
@font-face {
font-family: 'Roboto light';
src: url('../../../../../../../../design/themes/avtoopt/media/fonts/Robotolight.ttf?1759911146') format('truetype');
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: 'Roboto light italic';
src: url('../../../../../../../../design/themes/avtoopt/media/fonts/Robotolightitalic.ttf?1759911146') format('truetype');
font-weight: 300;
font-style: italic;
}
@font-face {
font-family: 'Roboto';
src: url('../../../../../../../../design/themes/avtoopt/media/fonts/Roboto.ttf?1759911146') format('truetype');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'Roboto italic';
src: url('../../../../../../../../design/themes/avtoopt/media/fonts/Robotoitalic.ttf?1759911146') format('truetype');
font-weight: 400;
font-style: italic;
}
@font-face {
font-family: 'Roboto medium';
src: url('../../../../../../../../design/themes/avtoopt/media/fonts/Robotomedium.ttf?1759911146') format('truetype');
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: 'Roboto medium italic';
src: url('../../../../../../../../design/themes/avtoopt/media/fonts/Robotomediumitalic.ttf?1759911146') format('truetype');
font-weight: 500;
font-style: italic;
}
@font-face {
font-family: 'Roboto bold';
src: url('../../../../../../../../design/themes/avtoopt/media/fonts/Robotobold.ttf?1759911146') format('truetype');
font-weight: 700;
font-style: normal;
}
@font-face {
font-family: 'Roboto bold italic';
src: url('../../../../../../../../design/themes/avtoopt/media/fonts/Robotobolditalic.ttf?1759911146') format('truetype');
font-weight: 700;
font-style: italic;
}
/****
* Внешние либы, ресеты
****/
/**
* Переменные
**/
/****
* Миксины, разное
****/
/* =============================================================================
Media queries for different screen sizes
========================================================================== */
/* normalize.css v1.1.2 | MIT License | git.io/normalize */
/* ==========================================================================
HTML5 display definitions
========================================================================== */
/**
* Correct `block` display not defined in IE 6/7/8/9 and Firefox 3.
*/
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
embed,
figure,
figcaption,
footer,
header,
hgroup,
menu,
nav,
output,
ruby,
section,
summary,
time,
mark,
audio,
video {
margin: 0;
padding: 0;
border: 0;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
display: block;
}
body {
line-height: 1;
}
ol,
ul {
list-style: none;
}
.blog-page ol {
list-style: decimal;
margin-left: 10px;
}
.blog-page ol ol {
margin-left: 20px;
}
.blog-page ul {
list-style: disc;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
nav,
section,
summary {
display: block;
}
/**
* Correct `inline-block` display not defined in IE 6/7/8/9 and Firefox 3.
*/
audio,
canvas,
video {
display: inline-block;
}
/**
* Prevent modern browsers from displaying `audio` without controls.
* Remove excess height in iOS 5 devices.
*/
audio:not([controls]) {
display: none;
height: 0;
}
/**
* Address styling not present in IE 7/8/9, Firefox 3, and Safari 4.
* Known issue: no IE 6 support.
*/
[hidden] {
display: none;
}
/* ==========================================================================
Base
========================================================================== */
/**
* Prevent iOS text size adjust after orientation change, without disabling
* user zoom.
*/
html {
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
}
/**
* Address `font-family` inconsistency between `textarea` and other form
* elements.
*/
html,
button,
input,
select,
textarea {
font-family: sans-serif;
}
/**
* Address margins handled incorrectly in IE 6/7.
*/
body {
margin: 0;
}
/* ==========================================================================
Links
========================================================================== */
/**
* Address `outline` inconsistency between Chrome and other browsers.
*/
a:focus {
outline: none;
}
/**
* Improve readability when focused and also mouse hovered in all browsers.
*/
a:active,
a:hover {
outline: none;
}
/* ==========================================================================
Typography
========================================================================== */
/**
* Address font sizes and margins set differently in IE 6/7.
* Address font sizes within `section` and `article` in Firefox 4+, Safari 5,
* and Chrome.
*/
/**
* Address styling not present in IE 7/8/9, Safari 5, and Chrome.
*/
abbr[title] {
border-bottom: 1px dotted;
}
/**
* Address style set to `bolder` in Firefox 3+, Safari 4/5, and Chrome.
*/
b,
strong {
font-weight: bold;
}
blockquote {
margin: 1em 40px;
}
/**
* Address styling not present in Safari 5 and Chrome.
*/
dfn {
font-style: italic;
}
/**
* Address differences between Firefox and other browsers.
* Known issue: no IE 6/7 normalization.
*/
hr {
-moz-box-sizing: content-box;
box-sizing: content-box;
height: 0;
}
/**
* Address styling not present in IE 6/7/8/9.
*/
mark {
background: #ff0;
color: #000;
}
/**
* Address margins set differently in IE 6/7.
*/
p,
pre {
margin: 1em 0;
}
/**
* Correct font family set oddly in IE 6, Safari 4/5, and Chrome.
*/
code,
kbd,
pre,
samp {
font-family: monospace, serif;
font-size: 1em;
}
/**
* Improve readability of pre-formatted text in all browsers.
*/
pre {
white-space: pre;
white-space: pre-wrap;
word-wrap: break-word;
}
/**
* Address CSS quotes not supported in IE 6/7.
*/
q {
quotes: none;
}
/**
* Address `quotes` property not supported in Safari 4.
*/
q:before,
q:after {
content: '';
content: none;
}
/**
* Address inconsistent and variable font size in all browsers.
*/
small {
font-size: 80%;
}
/**
* Prevent `sub` and `sup` affecting `line-height` in all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5em;
}
sub {
bottom: -0.25em;
}
/* ==========================================================================
Lists
========================================================================== */
/**
* Address margins set differently in IE 6/7.
*/
dd {
margin: 0 0 0 40px;
}
/**
* Address paddings set differently in IE 6/7.
*/
/* ==========================================================================
Embedded content
========================================================================== */
/**
* Remove border when inside `a` element in IE 6/7/8/9 and Firefox 3.
*/
img {
border: 0;
/* 1 */
}
/**
* Correct overflow displayed oddly in IE 9.
*/
svg:not(:root) {
overflow: hidden;
}
/* ==========================================================================
Figures
========================================================================== */
/**
* Address margin not present in IE 6/7/8/9, Safari 5, and Opera 11.
*/
figure {
margin: 0;
}
/* ==========================================================================
Forms
========================================================================== */
/**
* Define consistent border, margin, and padding.
*/
fieldset {
border: 1px solid #c0c0c0;
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
}
/**
* 1. Correct color not being inherited in IE 6/7/8/9.
* 2. Correct text not wrapping in Firefox 3.
*/
legend {
border: 0;
/* 1 */
padding: 0;
white-space: normal;
/* 2 */
}
/**
* 1. Correct font size not being inherited in all browsers.
* 2. Address margins set differently in IE 6/7, Firefox 3+, Safari 5,
* and Chrome.
* 3. Improve appearance and consistency in all browsers.
*/
button,
input,
select,
textarea {
font-size: 100%;
/* 1 */
margin: 0;
/* 2 */
vertical-align: baseline;
/* 3 */
}
/**
* Address Firefox 3+ setting `line-height` on `input` using `!important` in
* the UA stylesheet.
*/
button,
input {
line-height: normal;
}
/**
* Address inconsistent `text-transform` inheritance for `button` and `select`.
* All other form control elements do not inherit `text-transform` values.
* Correct `button` style inheritance in Chrome, Safari 5+, and IE 6+.
* Correct `select` style inheritance in Firefox 4+ and Opera.
*/
button,
select {
text-transform: none;
}
/**
* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
* and `video` controls.
* 2. Correct inability to style clickable `input` types in iOS.
* 3. Improve usability and consistency of cursor style between image-type
* `input` and others.
*/
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
-webkit-appearance: button;
/* 2 */
cursor: pointer;
/* 3 */
}
/**
* Re-set default cursor for disabled elements.
*/
button[disabled],
html input[disabled] {
cursor: default;
}
/**
* 1. Address box sizing set to content-box in IE 8/9.
* 2. Remove excess padding in IE 8/9.
*/
input[type="checkbox"],
input[type="radio"] {
box-sizing: border-box;
/* 1 */
padding: 0;
/* 2 */
}
/**
* 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
*/
input[type="search"] {
-webkit-appearance: textfield;
/* 1 */
-moz-box-sizing: content-box;
box-sizing: content-box;
}
/**
* Remove inner padding and search cancel button in Safari 5 and Chrome
* on OS X.
*/
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* Remove inner padding and border in Firefox 3+.
*/
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
}
/**
* 1. Remove default vertical scrollbar in IE 6/7/8/9.
* 2. Improve readability and alignment in all browsers.
*/
textarea {
overflow: auto;
/* 1 */
vertical-align: top;
/* 2 */
}
/* ==========================================================================
Tables
========================================================================== */
/**
* Remove most spacing between table cells.
*/
table {
border-collapse: collapse;
border-spacing: 0;
}
.clear {
clear: both;
}
/****
* Общин стили
****/
/****
* Шаблоны
****/
.header__location {
display: inline-block;
cursor: pointer;
}
.header__location span {
font: 500 12px/21px Roboto medium !important;
color: var(--main-color-grafit) !important;
text-transform: uppercase;
text-decoration: none;
margin: 0 20px;
}
.header__location span i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 78.92747252747253% 69.00898876404496%;
width: 13px;
height: 7px;
display: inline-block;
position: relative;
top: -2px;
left: 5px;
}
.header__sub-menu {
height: 40px;
padding: 0;
border-bottom: 1px solid #dfdfdf;
}
.header__sub-menu-search-buttom {
width: 80px;
height: 40px;
border-right: 1px solid #dfdfdf;
position: absolute;
z-index: 10;
top: 0;
left: 0;
padding: 11px;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: none;
}
.header__sub-menu-search-buttom i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 38.29815805375887% 17.209302325581394%;
width: 21.19px;
height: 22px;
display: block;
margin: 0 auto;
}
.header__sub-menu-wrap {
width: auto;
height: 40px;
max-width: 1240px;
margin: 0 auto;
padding: 12px 0;
-moz-box-sizing: border-box;
box-sizing: border-box;
position: relative;
}
.header__sub-menu-wrap a {
font: 500 12px/21px Roboto light;
color: #949494;
text-transform: uppercase;
text-decoration: none;
margin: 0 20px;
}
.header__sub-menu-wrap a:hover {
color: var(--main-color-grafit);
}
.header__sub-menu-wrap-phone {
font: 500 14px/21px Roboto medium !important;
color: var(--main-color-grafit) !important;
position: absolute;
right: 0;
}
.header__mobile-search {
width: 100%;
height: 0;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: none;
overflow: hidden;
}
.header__common {
height: 94px;
width: auto;
max-width: 1240px;
margin: 0 auto;
padding: 27px 20px;
position: relative;
background: #fff;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.header__common-menu-buttom {
width: 40px;
height: 40px;
border-radius: 50%;
border: 1px solid #dfdfdf;
position: absolute;
cursor: pointer;
left: 15px;
top: 15px;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 11px 10px;
display: none;
}
.header__common-menu-buttom i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 49.67109679151564% 34.18013856812933%;
width: 21.06px;
height: 19px;
display: block;
}
.header__common-logo {
background: url('../../../../../../../../design/themes/avtoopt/media/../../images/new_logo_avtoopt_red.png?1759911146') no-repeat;
width: 222px;
height: 36px;
background-position-x: center;
display: block;
overflow: hidden;
background-size: 100%;
}
.header__common-search {
margin: -40px 180px 0 280px;
}
.header__common-search-form {
position: relative;
width: 100%;
max-width: 620px;
}
.profiles_register_form .header__common-search-form--input, .profiles_register_form_opt .header__common-search-form--input{
max-width: none!important;
}
.header__common-search-form--input {
width: 100%;
height: 40px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
border: 1px solid #dfdfdf;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0 20px;
font: 300 14px/21px Roboto light;
outline: none;
box-shadow: none;
outline: 0;
-webkit-appearance: button;
position: relative;
margin: 5px 0;
}
.oem-search {
position: absolute;
width: 90%;
max-width: 620px;
top: 75px;
right: 5%;
}
.header__common-search-form--submit {
width: 40px;
height: 40px;
border-radius: 50%;
background: var(--main-color-grafit) url('../../../../../../../../design/themes/avtoopt/media/../images/searsh-white.svg?1759911146') no-repeat;
background-position: 10px 10px;
cursor: pointer;
border: 0;
box-shadow: 0;
margin-left: 20px;
font-size: 0;
top: 5px;
right: -60px;
position: absolute;
outline: none;
}
.header__common-phone {
width: 40px;
height: 40px;
border-radius: 50%;
border: 1px solid #dfdfdf;
position: absolute;
cursor: pointer;
right: 80px;
top: 27px;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 11px;
}
.header__common-phone i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 86.66666666666667% 80.64516129032258%;
width: 18px;
height: 18px;
display: block;
}
.header__common-basket {
width: 40px;
height: 40px;
border-radius: 50%;
border: 1px solid #dfdfdf;
position: absolute;
cursor: pointer;
right: 20px;
top: 27px;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 11px;
text-decoration: none;
}
.header__common-basket i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 82.66666666666667% 80.64516129032258%;
width: 18px;
height: 18px;
display: block;
}
.header__common-basket span,
.carousel-products__item_basket span{
width: 20px;
height: 20px;
background-color: var(--main-color-red);
border-radius: 30px;
padding: 4px 1px 1px 1px;
text-align: center;
overflow: hidden;
display: block;
font: 500 12px/12px Roboto;
text-decoration: none;
color: #ffffff;
margin: -32px 0 0 15px;
-moz-box-sizing: border-box;
box-sizing: border-box;
animation-duration: 0.5s;
-webkit-animation-duration: 0.5s;
-webkit-animation-fill-mode: both;
-webkit-animation-name: basket;
animation-name: basket;
position: absolute;
}
.header__menu {
padding: 0;
background: var(--main-color-grafit);
}
.header__menu-wrap {
width: auto;
max-width: 1240px;
margin: 0 auto;
/*display: -webkit-box;*/
/*display: -ms-flexbox;*/
/*display: flex;*/
/*-ms-flex-wrap: wrap;*/
/*flex-wrap: wrap;*/
/*-webkit-box-pack: justify;*/
/*-ms-flex-pack: justify;*/
/*justify-content: space-between;*/
display: block;
padding: 13px 0;
-moz-box-sizing: border-box;
box-sizing: border-box;
position: relative;
}
.header__menu-wrap > ul > li {
display: inline-block;
font-size: 0;
zoom: 1;
}
.header__menu-wrap ul li a {
font: 700 12px/21px Roboto bold;
text-transform: uppercase;
text-decoration: none;
color: #ffffff;
padding: 16px 20px 17px 20px;
}
.header__menu-wrap ul li a i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 81.78461538461538% 69.00898876404496%;
width: 13px;
height: 7px;
display: inline-block;
margin-left: 10px;
vertical-align: middle;
-webkit-transition: all 0.5s ease-in-out 0s;
-moz-transition: all 0.5s ease-in-out 0s;
-o-transition: all 0.5s ease-in-out 0s;
transition: all 0.5s ease-in-out 0s;
}
.header__menu-wrap ul li a:hover {
background: #64666a;
}
.header__menu-wrap-lk {
position: absolute;
right: 0;
top: 13px;
}
.header__menu-wrap-lk a {
font: 700 12px/21px Roboto bold !important;
color: #ffffff !important;
}
.header__menu-catalog-wrap {
width: 100%;
max-width: 1240px;
position: absolute;
z-index: 1000;
margin: 11px 0;
-moz-box-sizing: border-box;
box-sizing: border-box;
background-color: #ffffff;
box-shadow: 0 3px 13px 0 rgba(0, 0, 0, 0.17);
border-radius: 0 0 5px 5px;
min-height: 560px;
overflow: hidden;
display: none;
}
.header__menu-catalog-wrap-popular {
width: auto;
height: 190px;
border-bottom: 1px solid #d8d4e9;
}
.header__menu-catalog-wrap-popular a {
width: 25%;
height: 190px;
float: left;
border-right: 1px solid #d8d4e9;
text-align: center;
vertical-align: middle;
padding: 50px 0 0 0;
-moz-box-sizing: border-box;
box-sizing: border-box;
overflow: hidden;
position: relative;
display: block;
-webkit-transition: all 0.5s ease-in-out 0s;
-moz-transition: all 0.5s ease-in-out 0s;
-o-transition: all 0.5s ease-in-out 0s;
transition: all 0.5s ease-in-out 0s;
font: 700 12px/21px Roboto bold !important;
color: var(--main-color-grafit) !important;
text-decoration: none;
text-transform: uppercase;
}
.header_auto {
position: absolute;
right: 200px;
top: 8px;
text-align: center;
font: 700 12px/16px Roboto bold;
color: #ffffff;
}
@media screen and (max-width: 950px) {
.header_auto {
display: none;
}
}
@media screen and (max-width: 800px) {
.header_auto {
display: block;
right: 125px;
}
}
@media screen and (max-width: 580px) {
.header_auto {
display: none;
}
}
.header__menu-catalog-wrap-popular a:hover {
box-shadow: 0px -4px 0px 0px var(--main-color-grafit) inset;
-webkit-transition: all 0.5s ease-in-out 0s;
-moz-transition: all 0.5s ease-in-out 0s;
-o-transition: all 0.5s ease-in-out 0s;
transition: all 0.5s ease-in-out 0s;
}
.header__menu-catalog-wrap-popular a:nth-child(4) {
border-right: 0;
}
.header__menu-catalog-wrap-popular-accessories i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 72.84788029925187% 0;
width: 67px;
height: 67px;
display: block;
margin: 0px auto 10px auto;
}
.header__menu-catalog-wrap-popular-auto-pars i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 53.86533665835412% 43.63636363636363%;
width: 67px;
height: 67px;
display: block;
margin: 0px auto 10px auto;
}
.header__menu-catalog-wrap-popular-consumables i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 72.84788029925187% 34.8051948051948%;
width: 67px;
height: 67px;
display: block;
margin: 0px auto 10px auto;
}
.header__menu-catalog-wrap-popular-oil--lubricants i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 37.1571072319202% 43.63636363636363%;
width: 67px;
height: 67px;
display: block;
margin: 0px auto 10px auto;
}
.header__menu-catalog-wrap-category {
width: auto;
}
.header__menu-catalog-wrap-category a {
width: 20%;
height: 125px;
float: left;
text-align: center;
padding: 25px 0 0 0;
-moz-box-sizing: border-box;
box-sizing: border-box;
overflow: hidden;
position: relative;
display: block;
font: 700 12px/21px Roboto bold !important;
color: var(--main-color-grafit) !important;
text-decoration: none;
text-transform: uppercase;
-webkit-transition: all 0.5s ease-in-out 0s;
-moz-transition: all 0.5s ease-in-out 0s;
-o-transition: all 0.5s ease-in-out 0s;
transition: all 0.5s ease-in-out 0s;
}
.header__menu-catalog-wrap-category-akb i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 99.81009615384616% 26%;
width: 52px;
height: 52px;
display: block;
margin: 0px auto 10px auto;
}
.header__menu-catalog-wrap-category-car--accessories i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 0 93.25%;
width: 52px;
height: 52px;
display: block;
margin: 0px auto 10px auto;
}
.header__menu-catalog-wrap-category-instruments i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 76.92307692307692% 79.25%;
width: 52px;
height: 52px;
display: block;
margin: 0px auto 10px auto;
}
.header__menu-catalog-wrap-category-letter i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 99.81009615384616% 0;
width: 52px;
height: 52px;
display: block;
margin: 0px auto 10px auto;
}
.header__menu-catalog-wrap-category-car--care i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 99.81009615384616% 78%;
width: 52px;
height: 52px;
display: block;
margin: 0px auto 10px auto;
}
.header__menu-catalog-wrap-category-hardware--fasteners i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 64.42307692307692% 79.25%;
width: 52px;
height: 52px;
display: block;
margin: 0px auto 10px auto;
}
.header__menu-catalog-wrap-category-to--care i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 99.81009615384616% 65%;
width: 52px;
height: 52px;
display: block;
margin: 0px auto 10px auto;
}
.header__menu-catalog-wrap-category-avtosvet i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 99.81009615384616% 39%;
width: 52px;
height: 52px;
display: block;
margin: 0px auto 10px auto;
}
.header__menu-catalog-wrap-category-liquids i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 99.81009615384616% 13%;
width: 52px;
height: 52px;
display: block;
margin: 0px auto 10px auto;
}
.header__menu-catalog-wrap-category-power i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 99.81009615384616% 52%;
width: 52px;
height: 52px;
display: block;
margin: 0px auto 10px auto;
}
.header__menu-catalog-wrap-category-garden i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 51.92307692307692% 79.25%;
width: 52px;
height: 52px;
display: block;
margin: 0px auto 10px auto;
}
.header__menu-catalog-wrap-category-relax i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 26.923076923076923% 79.25%;
width: 52px;
height: 52px;
display: block;
margin: 0px auto 10px auto;
}
.header__menu-catalog-wrap-category-bus i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 12.5% 93.25%;
width: 52px;
height: 52px;
display: block;
margin: 0px auto 10px auto;
}
.header__menu-catalog-wrap-category-electronics i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 39.42307692307692% 79.25%;
width: 52px;
height: 52px;
display: block;
margin: 0px auto 10px auto;
}
footer {
width: 100%;
min-height: 314px;
background: #fff;
border-top: 1px solid #ece8fc;
overflow: hidden;
position: relative;
margin-top: 40px;
}
.footer {
max-width: 1240px;
min-height: 265px;
margin: 0 auto;
padding: 0 20px;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: flex;
}
.footer-line {
width: 100%;
border-top: 1px solid #d5d5d7;
}
.footer-line__copyright {
max-width: 1240px;
margin: 0 auto;
padding: 0 20px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.footer-line__copyright p {
font: 400 12px/25px Roboto light;
color: #434343;
}
.footer-line__copyright a {
font: 400 12px/25px Roboto light;
color: #434343;
text-decoration: none;
right: 0;
float: right;
}
.footer__item {
width: 25%;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: inline-block;
position: relative;
}
.footer__item:nth-child(1) {
border-right: 1px solid #d5d5d7;
}
.footer__item:nth-child(3) {
border-right: 1px solid #d5d5d7;
}
.footer__item_logo {
background: url('../../../../../../../../design/themes/avtoopt/media/../../images/new_logo_avtoopt.png?1759911146') no-repeat;
background-position: 0 10%;
width: 167px;
height: 32px;
display: block;
overflow: hidden;
margin: 30px 0;
background-size: 100%;
}
.footer__item p {
font: 400 14px/21px Roboto light;
color: #434343;
padding: 0px 50px 10px 0;
}
.footer__item_section {
padding: 40px 0 0 40px;
}
.footer__item_section h2 {
font: 700 14px/14px Roboto bold;
color: var(--main-color-grafit);
text-decoration: none;
text-transform: uppercase;
margin-bottom: 30px;
}
.footer__item_section a {
font: 400 14px/31px Roboto light;
color: var(--main-color-grafit);
text-decoration: none;
display: table;
}
.footer__item_form {
margin-top: 25px;
}
.footer__item_submit {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 75.1473168098601% 46.21008345403131%;
width: 23.38px;
height: 17.03px;
display: block;
overflow: hidden;
position: absolute;
border: none;
font-size: 0;
right: 20px;
top: 14px;
}
.footer__item_vk-icon {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 38.30275229357798% 10%;
width: 32px;
height: 32px;
display: inline-block!important;
overflow: hidden;
/*position: absolute;*/
right: 40px;
top: 30px;
}
.footer__item_ok-icon {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 31.422018348623855% 88.80952380952381%;
width: 32px;
height: 32px;
display: inline-block!important;
overflow: hidden;
/*position: absolute;*/
right: 0px;
top: 30px;
}
.footer__item_inst-icon {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/instagram.svg?1759911146') no-repeat;
width: 32px;
height: 32px;
display: inline-block!important;
overflow: hidden;
/*position: absolute;*/
right: 80px;
top: 30px;
}
/**
* Common style
**/
body {
background: #f3f3f3;
overflow-x: hidden;
position: relative;
left: 0;
transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
}
.wrap {
height: 100%;
margin: 0 auto;
width: 100%;
min-width: 320px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
body > .wrap {
height: auto;
min-height: 100%;
}
header {
background: #ffffff;
width: 100%;
min-width: 320px;
min-height: 100px;
box-shadow: 0 0 32px 0 rgba(0, 0, 0, 0.08);
position: relative;
z-index: 1000;
}
/***MENU***/
.cont-nav,
.mobile-menu-nav-left {
background: #f3f3f3;
height: 100%;
position: fixed;
top: 0;
width: 250px;
z-index: 0;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.mobile-menu-nav-left {
left: -250px;
overflow-y: scroll;
overflow-x: hidden;
display: none;
}
.mobile-menu-nav-left::-webkit-scrollbar {
width: 0px;
height: 0px;
}
.push-right {
left: 250px;
overflow: hidden;
}
.no-wrap {
overflow: hidden;
position: fixed;
left: 250px;
box-shadow: 0 0 32px 0 rgba(0, 0, 0, 0.08);
}
.push-left {
left: -250px;
}
.openLeft {
left: 0px;
}
.openRight {
right: 0;
}
/***MENU-mobile-section***/
.mobile-menu-nav-left {
list-style-type: none;
margin: 0;
padding: 0;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.mobile-menu-nav-left ul {
list-style-type: none;
margin: 0;
padding: 0;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.mobile-menu-nav-left li:first-child {
border: none;
}
.mobile-menu-nav-left li {
position: relative;
border-top: 1px solid #e6e6e6;
}
.mobile-menu-nav-left li a {
font: 700 12px/21px Roboto bold;
text-transform: uppercase;
text-decoration: none;
color: var(--main-color-grafit);
display: block;
padding: 10px 30px 10px 20px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.mobile-menu-nav-left li ul {
display: none;
}
.mobile-menu-nav-left li ul li {
text-align: left;
background: #ffffff;
}
.mobile-menu-nav-left li ul li a {
text-transform: none;
}
.mobile-menu-nav-left li ul li:hover {
background: #ffffff;
}
.mobile-menu-nav-left li > span {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 78.92747252747253% 69.00898876404496%;
width: 13px;
height: 7px;
position: absolute;
top: 16px;
right: 20px;
-webkit-transition: all 0.5s ease-in-out 0s;
-moz-transition: all 0.5s ease-in-out 0s;
-o-transition: all 0.5s ease-in-out 0s;
transition: all 0.5s ease-in-out 0s;
}
.mobile-menu-nav-left li.active > span {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 78.92747252747253% 69.00898876404496%;
width: 13px;
height: 7px;
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
-webkit-transition: all 0.5s ease-in-out 0s;
-moz-transition: all 0.5s ease-in-out 0s;
-o-transition: all 0.5s ease-in-out 0s;
transition: all 0.5s ease-in-out 0s;
}
.modal__a {
margin-bottom: 0 !important;
}
.modal__title {
line-height: 0 !important;
width: 100%;
border-bottom: 1px solid #d8d4e9;
padding: 20px !important;
text-align: left;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.modal__title h2 {
font: 400 13px/21px Roboto bold;
text-transform: uppercase;
text-decoration: none;
color: var(--main-color-grafit);
display: block;
}
.modal__content {
padding: 15px 40px 0px 40px !important;
line-height: 0 !important;
}
.modal__content p {
text-align: center;
font: 300 14px/21px Roboto light;
color: var(--main-color-grafit);
padding: 20px 0 20px!important;
}
.modal__footer {
line-height: 0 !important;
border-top: 1px solid #d8d4e9;
padding: 10px 40px !important;
margin-top: 20px !important;
width: 100%;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.modal__footer p {
text-align: center;
font: 300 14px/21px Roboto light;
color: var(--main-color-grafit);
}
.md-close {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 58.013333333333335% 34.10138248847926%;
width: 18px;
height: 18px;
font-size: 0 !important;
border: 0;
box-shadow: 0;
-webkit-appearance: none;
position: absolute;
right: 20px;
top: 22px;
cursor: pointer;
}
.mobile-search {
/*position: absolute;
top: 50px;
max-width: 1000px;*/
overflow: hidden;
}
@media screen and (max-width: 810px) {
.mobile-search{
overflow: visible;
}
}
.mobile-search__input {
border: 0;
border-radius: 0;
}
.mobile-search__submit {
right: 20px;
background: url('../../../../../../../../design/themes/avtoopt/media/../images/mobile--search.svg?1759911146') no-repeat;
background-position: 10px 10px;
border-left: 1px solid #dfdfdf;
border-radius: 0;
}
.js-active__mobile-search {
animation-duration: 0.5s;
-webkit-animation-duration: 0.5s;
-webkit-animation-fill-mode: both;
-webkit-animation-name: js-active__mobile-search;
animation-name: js-active__mobile-search;
border-bottom: 1px solid #dfdfdf;
}
.js-close__menu-catalog {
animation-duration: 0.5s;
-webkit-animation-duration: 0.5s;
-webkit-animation-fill-mode: both;
-webkit-animation-name: js-close__menu-catalog;
animation-name: js-close__menu-catalog;
}
.js-open__menu-catalog {
display: block;
animation-duration: 0.5s;
-webkit-animation-duration: 0.5s;
-webkit-animation-fill-mode: both;
-webkit-animation-name: js-open__menu-catalog;
animation-name: js-open__menu-catalog;
}
.js-active__menu a {
background: #4c3798;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.js-active__menu-rotate i {
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
-webkit-transition: all 0.5s ease-in-out 0s;
-moz-transition: all 0.5s ease-in-out 0s;
-o-transition: all 0.5s ease-in-out 0s;
transition: all 0.5s ease-in-out 0s;
}
.btn-6 span {
position: absolute;
display: block;
width: 0;
height: 0;
border-radius: 50%;
background: #e4e2ee;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
-webkit-transition: width 1.0s, height 1.0s;
transition: width 1.0s, height 1.0s;
z-index: -1;
}
.btn-6:hover {
color: #e5ccf1;
}
.btn-6:hover span {
width: 900px;
height: 900px;
}
.btn-6:active {
background: #e4e2ee;
}
/*! jQuery UI - v1.9.2 - 2017-01-10
* http://jqueryui.com
* Includes: jquery.ui.core.css, jquery.ui.datepicker.css, jquery.ui.theme.css
* To view and modify this theme, visit http://jqueryui.com/themeroller/?ffDefault=Arial%2CHelvetica%2Csans-serif&fsDefault=1em&fwDefault=normal&cornerRadius=3px&bgColorHeader=e9e9e9&bgTextureHeader=flat&borderColorHeader=dddddd&fcHeader=333333&iconColorHeader=444444&bgColorContent=ffffff&bgTextureContent=flat&borderColorContent=dddddd&fcContent=333333&iconColorContent=444444&bgColorDefault=f6f6f6&bgTextureDefault=flat&borderColorDefault=c5c5c5&fcDefault=454545&iconColorDefault=777777&bgColorHover=ededed&bgTextureHover=flat&borderColorHover=cccccc&fcHover=2b2b2b&iconColorHover=555555&bgColorActive=007fff&bgTextureActive=flat&borderColorActive=003eff&fcActive=ffffff&iconColorActive=ffffff&bgColorHighlight=fffa90&bgTextureHighlight=flat&borderColorHighlight=dad55e&fcHighlight=777620&iconColorHighlight=777620&bgColorError=fddfdf&bgTextureError=flat&borderColorError=f1a899&fcError=5f3f3f&iconColorError=cc0000&bgColorOverlay=aaaaaa&bgTextureOverlay=flat&bgImgOpacityOverlay=0&opacityOverlay=30&bgColorShadow=666666&bgTextureShadow=flat&bgImgOpacityShadow=0&opacityShadow=30&thicknessShadow=5px&offsetTopShadow=0px&offsetLeftShadow=0px&cornerRadiusShadow=8px
* Copyright jQuery Foundation and other contributors; Licensed MIT */
/* Layout helpers
----------------------------------*/
.ui-helper-hidden {
display: none;
}
.ui-helper-hidden-accessible {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
.ui-helper-reset {
margin: 0;
padding: 0;
border: 0;
outline: 0;
line-height: 1.3;
text-decoration: none;
font-size: 100%;
list-style: none;
}
.ui-helper-clearfix:before,
.ui-helper-clearfix:after {
content: "";
display: table;
}
.ui-helper-clearfix:after {
clear: both;
}
.ui-helper-clearfix {
zoom: 1;
}
.ui-helper-zfix {
width: 100%;
height: 100%;
top: 0;
left: 0;
position: absolute;
opacity: 0;
filter: alpha(opacity=0);
}
/* Interaction Cues
----------------------------------*/
.ui-state-disabled {
cursor: default !important;
}
/* Icons
----------------------------------*/
/* states and images */
.ui-icon {
display: block;
text-indent: -99999px;
overflow: hidden;
background-repeat: no-repeat;
}
/* Misc visuals
----------------------------------*/
/* Overlays */
.ui-widget-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.ui-datepicker {
width: 100%;
max-width: 447px;
display: none;
margin: 0 auto;
}
.ui-datepicker .ui-datepicker-header {
position: relative;
padding: .2em 0;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
position: absolute;
top: 2px;
height: 1.8em;
/*width: 60px;*/
}
.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover {
top: 1px;
}
.ui-datepicker .ui-datepicker-prev {
left: 0px;
}
.ui-datepicker .ui-datepicker-next {
right: 30px;
}
.ui-datepicker .ui-datepicker-prev-hover {
left: 1px;
}
.ui-datepicker .ui-datepicker-next-hover {
right: 1px;
}
.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
display: block;
position: absolute;
left: 50%;
top: 50%;
margin-top: -8px;
padding: 0;
width: 7px;
}
.ui-datepicker .ui-datepicker-title {
font: 400 14px/50px Roboto bold;
text-transform: uppercase;
color: var(--main-color-grafit);
margin: 0 2.3em;
line-height: 1.8em;
text-align: center;
}
.ui-datepicker .ui-datepicker-title select {
font-size: 1em;
margin: 1px 0;
}
.ui-datepicker select.ui-datepicker-month-year {
width: 100%;
}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
width: 49%;
}
.ui-datepicker table {
width: 100%;
font-size: .9em;
border-collapse: collapse;
margin: 0 0 .4em;
}
.ui-datepicker th {
padding: .7em .3em;
text-align: center;
font-weight: bold;
border: 0;
}
.ui-datepicker td {
padding: 1px;
border-right: 1px solid #ded9f1;
position: relative;
}
.ui-datepicker td:last-child {
padding: 1px;
border-right: 0px solid #ded9f1;
}
.ui-datepicker td span,
.ui-datepicker td a {
display: block;
padding: 20px;
text-align: center;
text-decoration: none;
}
.ui-datepicker-calendar tr {
border-bottom: 1px solid #ded9f1;
}
.ui-datepicker-calendar tr:last-child {
border-bottom: 0px solid #ded9f1;
}
.ui-datepicker .ui-datepicker-buttonpane {
background-image: none;
margin: .7em 0 0 0;
padding: 0 .2em;
border-left: 0;
border-right: 0;
border-bottom: 0;
}
.ui-datepicker .ui-datepicker-buttonpane button {
float: right;
margin: .5em .2em .4em;
cursor: pointer;
padding: .2em .6em .3em .6em;
width: auto;
overflow: visible;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
float: left;
}
/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi {
width: auto;
}
.ui-datepicker-multi .ui-datepicker-group {
float: left;
}
.ui-datepicker-multi .ui-datepicker-group table {
width: 95%;
margin: 0 auto .4em;
}
.ui-datepicker-multi-2 .ui-datepicker-group {
width: 50%;
}
.ui-datepicker-multi-3 .ui-datepicker-group {
width: 33.3%;
}
.ui-datepicker-multi-4 .ui-datepicker-group {
width: 25%;
}
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header {
border-left-width: 0;
}
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
border-left-width: 0;
}
.ui-datepicker-multi .ui-datepicker-buttonpane {
clear: left;
}
.ui-datepicker-row-break {
clear: both;
width: 100%;
font-size: 0em;
}
/* RTL support */
.ui-datepicker-rtl {
direction: rtl;
}
.ui-datepicker-rtl .ui-datepicker-prev {
right: 2px;
left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next {
left: 2px;
right: auto;
}
.ui-datepicker-rtl .ui-datepicker-prev:hover {
right: 1px;
left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next:hover {
left: 1px;
right: auto;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane {
clear: right;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button {
float: left;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current {
float: right;
}
.ui-datepicker-rtl .ui-datepicker-group {
float: right;
}
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header {
border-right-width: 0;
border-left-width: 1px;
}
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
border-right-width: 0;
border-left-width: 1px;
}
/* IE6 IFRAME FIX (taken from datepicker 1.5.3 */
.ui-datepicker-cover {
position: absolute;
/*must have*/
z-index: -1;
/*must have*/
filter: mask();
/*must have*/
top: -4px;
/*must have*/
left: -4px;
/*must have*/
width: 200px;
/*must have*/
height: 200px;
/*must have*/
}
/* Component containers
----------------------------------*/
.ui-widget {
font-family: Arial, Helvetica, sans-serif;
font-size: 1em;
}
.ui-widget .ui-widget {
font-size: 1em;
}
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
font-family: Arial, Helvetica, sans-serif;
font-size: 1em;
}
.ui-widget-content {
color: #333333;
}
.ui-widget-content a {
color: #333333;
}
.ui-widget-header {
color: #333333;
font-weight: bold;
margin-bottom: 40px;
}
.ui-widget-header a {
color: #333333;
}
/* Interaction states
----------------------------------*/
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
border: 0px solid #c5c5c5;
font: 400 18px/18px Roboto bold;
color: var(--main-color-grafit);
}
.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited {
color: #454545;
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 {
background: #ffffff;
color: #d8254c;
border: 0px solid #cccccc;
font-weight: normal;
color: #2b2b2b;
}
.ui-state-hover a,
.ui-state-hover a:hover,
.ui-state-hover a:link,
.ui-state-hover a:visited {
color: #2b2b2b;
text-decoration: none;
}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {
border: 0px solid #003eff;
color: #ffffff;
width: 21px;
background: #ffffff;
position: absolute;
padding: 25px;
color: #d8254c;
z-index: 10;
left: -4px;
top: -5px;
border: 0px solid #cccccc;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.12);
font-weight: normal;
color: #2b2b2b;
}
.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited {
color: #ffffff;
text-decoration: none;
}
/* Interaction Cues
----------------------------------*/
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
font: 400 18px/18px Roboto bold;
color: #d8254c;
}
.ui-state-highlight a,
.ui-widget-content .ui-state-highlight a,
.ui-widget-header .ui-state-highlight a {
color: #777620;
}
.ui-state-error,
.ui-widget-content .ui-state-error,
.ui-widget-header .ui-state-error {
color: #5f3f3f;
}
.ui-state-error a,
.ui-widget-content .ui-state-error a,
.ui-widget-header .ui-state-error a {
color: #5f3f3f;
}
.ui-state-error-text,
.ui-widget-content .ui-state-error-text,
.ui-widget-header .ui-state-error-text {
color: #5f3f3f;
}
.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);
font-weight: normal;
}
.ui-state-disabled,
.ui-widget-content .ui-state-disabled,
.ui-widget-header .ui-state-disabled {
opacity: .35;
filter: alpha(opacity=35);
background-image: none;
}
.ui-state-disabled .ui-icon {
filter: alpha(opacity=35);
}
/* For IE8 - See #6059 */
/* Icons
----------------------------------*/
/* states and images */
.ui-icon-circle-triangle-w {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 88.31236442516268% 63.801822323462424%;
width: 7px;
height: 13px;
cursor: pointer;
border: 10px solid #f3f3f3;
}
.ui-icon-circle-triangle-e {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 46.488069414316705% 16.856492027334852%;
width: 7px;
height: 13px;
cursor: pointer;
border: 10px solid #f3f3f3;
}
/* positioning */
.ui-icon-carat-1-n {
background-position: 0 0;
}
.ui-icon-carat-1-ne {
background-position: -16px 0;
}
.ui-icon-carat-1-e {
background-position: -32px 0;
}
.ui-icon-carat-1-se {
background-position: -48px 0;
}
.ui-icon-carat-1-s {
background-position: -64px 0;
}
.ui-icon-carat-1-sw {
background-position: -80px 0;
}
.ui-icon-carat-1-w {
background-position: -96px 0;
}
.ui-icon-carat-1-nw {
background-position: -112px 0;
}
.ui-icon-carat-2-n-s {
background-position: -128px 0;
}
.ui-icon-carat-2-e-w {
background-position: -144px 0;
}
.ui-icon-triangle-1-n {
background-position: 0 -16px;
}
.ui-icon-triangle-1-ne {
background-position: -16px -16px;
}
.ui-icon-triangle-1-e {
background-position: -32px -16px;
}
.ui-icon-triangle-1-se {
background-position: -48px -16px;
}
.ui-icon-triangle-1-s {
background-position: -64px -16px;
}
.ui-icon-triangle-1-sw {
background-position: -80px -16px;
}
.ui-icon-triangle-1-w {
background-position: -96px -16px;
}
.ui-icon-triangle-1-nw {
background-position: -112px -16px;
}
.ui-icon-triangle-2-n-s {
background-position: -128px -16px;
}
.ui-icon-triangle-2-e-w {
background-position: -144px -16px;
}
.ui-icon-arrow-1-n {
background-position: 0 -32px;
}
.ui-icon-arrow-1-ne {
background-position: -16px -32px;
}
.ui-icon-arrow-1-e {
background-position: -32px -32px;
}
.ui-icon-arrow-1-se {
background-position: -48px -32px;
}
.ui-icon-arrow-1-s {
background-position: -64px -32px;
}
.ui-icon-arrow-1-sw {
background-position: -80px -32px;
}
.ui-icon-arrow-1-w {
background-position: -96px -32px;
}
.ui-icon-arrow-1-nw {
background-position: -112px -32px;
}
.ui-icon-arrow-2-n-s {
background-position: -128px -32px;
}
.ui-icon-arrow-2-ne-sw {
background-position: -144px -32px;
}
.ui-icon-arrow-2-e-w {
background-position: -160px -32px;
}
.ui-icon-arrow-2-se-nw {
background-position: -176px -32px;
}
.ui-icon-arrowstop-1-n {
background-position: -192px -32px;
}
.ui-icon-arrowstop-1-e {
background-position: -208px -32px;
}
.ui-icon-arrowstop-1-s {
background-position: -224px -32px;
}
.ui-icon-arrowstop-1-w {
background-position: -240px -32px;
}
.ui-icon-arrowthick-1-n {
background-position: 0 -48px;
}
.ui-icon-arrowthick-1-ne {
background-position: -16px -48px;
}
.ui-icon-arrowthick-1-e {
background-position: -32px -48px;
}
.ui-icon-arrowthick-1-se {
background-position: -48px -48px;
}
.ui-icon-arrowthick-1-s {
background-position: -64px -48px;
}
.ui-icon-arrowthick-1-sw {
background-position: -80px -48px;
}
.ui-icon-arrowthick-1-w {
background-position: -96px -48px;
}
.ui-icon-arrowthick-1-nw {
background-position: -112px -48px;
}
.ui-icon-arrowthick-2-n-s {
background-position: -128px -48px;
}
.ui-icon-arrowthick-2-ne-sw {
background-position: -144px -48px;
}
.ui-icon-arrowthick-2-e-w {
background-position: -160px -48px;
}
.ui-icon-arrowthick-2-se-nw {
background-position: -176px -48px;
}
.ui-icon-arrowthickstop-1-n {
background-position: -192px -48px;
}
.ui-icon-arrowthickstop-1-e {
background-position: -208px -48px;
}
.ui-icon-arrowthickstop-1-s {
background-position: -224px -48px;
}
.ui-icon-arrowthickstop-1-w {
background-position: -240px -48px;
}
.ui-icon-arrowreturnthick-1-w {
background-position: 0 -64px;
}
.ui-icon-arrowreturnthick-1-n {
background-position: -16px -64px;
}
.ui-icon-arrowreturnthick-1-e {
background-position: -32px -64px;
}
.ui-icon-arrowreturnthick-1-s {
background-position: -48px -64px;
}
.ui-icon-arrowreturn-1-w {
background-position: -64px -64px;
}
.ui-icon-arrowreturn-1-n {
background-position: -80px -64px;
}
.ui-icon-arrowreturn-1-e {
background-position: -96px -64px;
}
.ui-icon-arrowreturn-1-s {
background-position: -112px -64px;
}
.ui-icon-arrowrefresh-1-w {
background-position: -128px -64px;
}
.ui-icon-arrowrefresh-1-n {
background-position: -144px -64px;
}
.ui-icon-arrowrefresh-1-e {
background-position: -160px -64px;
}
.ui-icon-arrowrefresh-1-s {
background-position: -176px -64px;
}
.ui-icon-arrow-4 {
background-position: 0 -80px;
}
.ui-icon-arrow-4-diag {
background-position: -16px -80px;
}
.ui-icon-extlink {
background-position: -32px -80px;
}
.ui-icon-newwin {
background-position: -48px -80px;
}
.ui-icon-refresh {
background-position: -64px -80px;
}
.ui-icon-shuffle {
background-position: -80px -80px;
}
.ui-icon-transfer-e-w {
background-position: -96px -80px;
}
.ui-icon-transferthick-e-w {
background-position: -112px -80px;
}
.ui-icon-folder-collapsed {
background-position: 0 -96px;
}
.ui-icon-folder-open {
background-position: -16px -96px;
}
.ui-icon-document {
background-position: -32px -96px;
}
.ui-icon-document-b {
background-position: -48px -96px;
}
.ui-icon-note {
background-position: -64px -96px;
}
.ui-icon-mail-closed {
background-position: -80px -96px;
}
.ui-icon-mail-open {
background-position: -96px -96px;
}
.ui-icon-suitcase {
background-position: -112px -96px;
}
.ui-icon-comment {
background-position: -128px -96px;
}
.ui-icon-person {
background-position: -144px -96px;
}
.ui-icon-print {
background-position: -160px -96px;
}
.ui-icon-trash {
background-position: -176px -96px;
}
.ui-icon-locked {
background-position: -192px -96px;
}
.ui-icon-unlocked {
background-position: -208px -96px;
}
.ui-icon-bookmark {
background-position: -224px -96px;
}
.ui-icon-tag {
background-position: -240px -96px;
}
.ui-icon-home {
background-position: 0 -112px;
}
.ui-icon-flag {
background-position: -16px -112px;
}
.ui-icon-calendar {
background-position: -32px -112px;
}
.ui-icon-cart {
background-position: -48px -112px;
}
.ui-icon-pencil {
background-position: -64px -112px;
}
.ui-icon-clock {
background-position: -80px -112px;
}
.ui-icon-disk {
background-position: -96px -112px;
}
.ui-icon-calculator {
background-position: -112px -112px;
}
.ui-icon-zoomin {
background-position: -128px -112px;
}
.ui-icon-zoomout {
background-position: -144px -112px;
}
.ui-icon-search {
background-position: -160px -112px;
}
.ui-icon-wrench {
background-position: -176px -112px;
}
.ui-icon-gear {
background-position: -192px -112px;
}
.ui-icon-heart {
background-position: -208px -112px;
}
.ui-icon-star {
background-position: -224px -112px;
}
.ui-icon-link {
background-position: -240px -112px;
}
.ui-icon-cancel {
background-position: 0 -128px;
}
.ui-icon-plus {
background-position: -16px -128px;
}
.ui-icon-plusthick {
background-position: -32px -128px;
}
.ui-icon-minus {
background-position: -48px -128px;
}
.ui-icon-minusthick {
background-position: -64px -128px;
}
.ui-icon-close {
background-position: -80px -128px;
}
.ui-icon-closethick {
background-position: -96px -128px;
}
.ui-icon-key {
background-position: -112px -128px;
}
.ui-icon-lightbulb {
background-position: -128px -128px;
}
.ui-icon-scissors {
background-position: -144px -128px;
}
.ui-icon-clipboard {
background-position: -160px -128px;
}
.ui-icon-copy {
background-position: -176px -128px;
}
.ui-icon-contact {
background-position: -192px -128px;
}
.ui-icon-image {
background-position: -208px -128px;
}
.ui-icon-video {
background-position: -224px -128px;
}
.ui-icon-script {
background-position: -240px -128px;
}
.ui-icon-alert {
background-position: 0 -144px;
}
.ui-icon-info {
background-position: -16px -144px;
}
.ui-icon-notice {
background-position: -32px -144px;
}
.ui-icon-help {
background-position: -48px -144px;
}
.ui-icon-check {
background-position: -64px -144px;
}
.ui-icon-bullet {
background-position: -80px -144px;
}
.ui-icon-radio-on {
background-position: -96px -144px;
}
.ui-icon-radio-off {
background-position: -112px -144px;
}
.ui-icon-pin-w {
background-position: -128px -144px;
}
.ui-icon-pin-s {
background-position: -144px -144px;
}
.ui-icon-play {
background-position: 0 -160px;
}
.ui-icon-pause {
background-position: -16px -160px;
}
.ui-icon-seek-next {
background-position: -32px -160px;
}
.ui-icon-seek-prev {
background-position: -48px -160px;
}
.ui-icon-seek-end {
background-position: -64px -160px;
}
.ui-icon-seek-start {
background-position: -80px -160px;
}
/* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead */
.ui-icon-seek-first {
background-position: -80px -160px;
}
.ui-icon-stop {
background-position: -96px -160px;
}
.ui-icon-eject {
background-position: -112px -160px;
}
.ui-icon-volume-off {
background-position: -128px -160px;
}
.ui-icon-volume-on {
background-position: -144px -160px;
}
.ui-icon-power {
background-position: 0 -176px;
}
.ui-icon-signal-diag {
background-position: -16px -176px;
}
.ui-icon-signal {
background-position: -32px -176px;
}
.ui-icon-battery-0 {
background-position: -48px -176px;
}
.ui-icon-battery-1 {
background-position: -64px -176px;
}
.ui-icon-battery-2 {
background-position: -80px -176px;
}
.ui-icon-battery-3 {
background-position: -96px -176px;
}
.ui-icon-circle-plus {
background-position: 0 -192px;
}
.ui-icon-circle-minus {
background-position: -16px -192px;
}
.ui-icon-circle-close {
background-position: -32px -192px;
}
.ui-icon-circle-triangle-s {
background-position: -64px -192px;
}
.ui-icon-circle-triangle-n {
background-position: -96px -192px;
}
.ui-icon-circle-arrow-e {
background-position: -112px -192px;
}
.ui-icon-circle-arrow-s {
background-position: -128px -192px;
}
.ui-icon-circle-arrow-w {
background-position: -144px -192px;
}
.ui-icon-circle-arrow-n {
background-position: -160px -192px;
}
.ui-icon-circle-zoomin {
background-position: -176px -192px;
}
.ui-icon-circle-zoomout {
background-position: -192px -192px;
}
.ui-icon-circle-check {
background-position: -208px -192px;
}
.ui-icon-circlesmall-plus {
background-position: 0 -208px;
}
.ui-icon-circlesmall-minus {
background-position: -16px -208px;
}
.ui-icon-circlesmall-close {
background-position: -32px -208px;
}
.ui-icon-squaresmall-plus {
background-position: -48px -208px;
}
.ui-icon-squaresmall-minus {
background-position: -64px -208px;
}
.ui-icon-squaresmall-close {
background-position: -80px -208px;
}
.ui-icon-grip-dotted-vertical {
background-position: 0 -224px;
}
.ui-icon-grip-dotted-horizontal {
background-position: -16px -224px;
}
.ui-icon-grip-solid-vertical {
background-position: -32px -224px;
}
.ui-icon-grip-solid-horizontal {
background-position: -48px -224px;
}
.ui-icon-gripsmall-diagonal-se {
background-position: -64px -224px;
}
.ui-icon-grip-diagonal-se {
background-position: -80px -224px;
}
/* Misc visuals
----------------------------------*/
/* Corner radius */
.ui-corner-all,
.ui-corner-top,
.ui-corner-left,
.ui-corner-tl {
-moz-border-radius-topleft: 3px;
-webkit-border-top-left-radius: 3px;
-khtml-border-top-left-radius: 3px;
border-top-left-radius: 3px;
}
.ui-corner-all,
.ui-corner-top,
.ui-corner-right,
.ui-corner-tr {
-moz-border-radius-topright: 3px;
-webkit-border-top-right-radius: 3px;
-khtml-border-top-right-radius: 3px;
border-top-right-radius: 3px;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-left,
.ui-corner-bl {
-moz-border-radius-bottomleft: 3px;
-webkit-border-bottom-left-radius: 3px;
-khtml-border-bottom-left-radius: 3px;
border-bottom-left-radius: 3px;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-right,
.ui-corner-br {
-moz-border-radius-bottomright: 3px;
-webkit-border-bottom-right-radius: 3px;
-khtml-border-bottom-right-radius: 3px;
border-bottom-right-radius: 3px;
}
/* Overlays */
.ui-widget-overlay {
background: #aaaaaa;
opacity: .3;
filter: alpha(opacity=30);
}
.ui-widget-shadow {
margin: 0px 0 0 0px;
padding: 5px;
background: #666666;
opacity: .3;
filter: alpha(opacity=30);
-moz-border-radius: 8px;
-khtml-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px;
}
.detail-product__slider-item_active {
margin:10px 9px 9px 0!important;
-webkit-transition-timing-function:linear;
-moz-transition-timing-function:linear;
-o-transition-timing-function:linear;
-webkit-transition-duration:.23s;
-moz-transition-duration:.23s;
-o-transition-duration:.23s;
transition-timing-function:linear;
transition-duration:.23s
}
.about__block-logos_item:hover {
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.12);
transition: all .3s ease;
}
.catalog__category a:hover {
background-color: #eae9ef;
}
.order__add {
display: none;
}
.order__add_active {
display: block;
}
.js-order__check_no-active {
pointer-events: none;
cursor: not-allowed;
opacity: .5;
}
.svg-svg--3d {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 32.04541292803516% 17.209302325581394%;
}
.svg-svg--3d-dims {
width: 31.12px;
height: 22px;
}
.svg-svg--active-product__basket {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 43.11883408071749% 17.209302325581394%;
}
.svg-svg--active-product__basket-dims {
width: 22px;
height: 22px;
}
.svg-svg--akb {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 99.81009615384616% 26%;
}
.svg-svg--akb-dims {
width: 52px;
height: 52px;
}
.svg-svg--akssesuari {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 72.84788029925187% 0;
}
.svg-svg--akssesuari-dims {
width: 67px;
height: 67px;
}
.svg-svg--arrow_down {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 81.78461538461538% 69.00898876404496%;
}
.svg-svg--arrow_down-dims {
width: 13px;
height: 7px;
}
.svg-svg--arrow_menu {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 78.92747252747253% 69.00898876404496%;
}
.svg-svg--arrow_menu-dims {
width: 13px;
height: 7px;
}
.svg-svg--arrow_prev {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 75.14224671089622% 50.125295997425106%;
}
.svg-svg--arrow_prev-dims {
width: 23.35px;
height: 17.03px;
}
.svg-svg--arrow_right {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 46.488069414316705% 16.856492027334852%;
}
.svg-svg--arrow_right-dims {
width: 7px;
height: 13px;
}
.svg-svg--arrow_rleft {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 88.31236442516268% 63.801822323462424%;
}
.svg-svg--arrow_rleft-dims {
width: 7px;
height: 13px;
}
.svg-svg--auto_pars {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 53.86533665835412% 43.63636363636363%;
}
.svg-svg--auto_pars-dims {
width: 67px;
height: 67px;
}
.svg-svg--avtosvet {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 99.81009615384616% 39%;
}
.svg-svg--avtosvet-dims {
width: 52px;
height: 52px;
}
.svg-svg--basket {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 82.66666666666667% 80.64516129032258%;
}
.svg-svg--basket-dims {
width: 18px;
height: 18px;
}
.svg-svg--basket_delete {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 54.013333333333335% 34.10138248847926%;
}
.svg-svg--basket_delete-dims {
width: 18px;
height: 18px;
}
.svg-svg--basket_delete-min {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 18.021978021978022% 53.53075170842825%;
}
.svg-svg--basket_delete-min-dims {
width: 13px;
height: 13px;
}
.svg-svg--big-filter {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 38.33764348260061% 87.55868544600939%;
}
.svg-svg--big-filter-dims {
width: 27.18px;
height: 26px;
}
.svg-svg--bus {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 12.5% 93.25%;
}
.svg-svg--bus-dims {
width: 52px;
height: 52px;
}
.svg-svg--car--accessories {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 0 93.25%;
}
.svg-svg--car--accessories-dims {
width: 52px;
height: 52px;
}
.svg-svg--car--care {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 99.81009615384616% 78%;
}
.svg-svg--car--care-dims {
width: 52px;
height: 52px;
}
.svg-svg--checkbox {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 49.25393258426966% 86.94638694638695%;
}
.svg-svg--checkbox-dims {
width: 23px;
height: 23px;
}
.svg-svg--checkbox-active {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 44.71910112359551% 9.79020979020979%;
}
.svg-svg--checkbox-active-dims {
width: 23px;
height: 23px;
}
.svg-svg--clock_close {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 23.908045977011493% 89.02147971360382%;
}
.svg-svg--clock_close-dims {
width: 33px;
height: 33px;
}
.svg-svg--clock_open {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 85.51724137931035% 75.6563245823389%;
}
.svg-svg--clock_open-dims {
width: 33px;
height: 33px;
}
.svg-svg--consumables {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 72.84788029925187% 34.8051948051948%;
}
.svg-svg--consumables-dims {
width: 67px;
height: 67px;
}
.svg-svg--delivery-1 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 16.652582393000944% 64.76683937823834%;
}
.svg-svg--delivery-1-dims {
width: 65.66px;
height: 66px;
}
.svg-svg--delivery-2 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 23.694117647058825% 26.16580310880829%;
}
.svg-svg--delivery-2-dims {
width: 85.5px;
height: 66px;
}
.svg-svg--delivery-3 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 33% 64.76683937823834%;
}
.svg-svg--delivery-3-dims {
width: 66px;
height: 66px;
}
.svg-svg--delivery-4 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 55.53470919324578% 21.243523316062177%;
}
.svg-svg--delivery-4-dims {
width: 68.25px;
height: 66px;
}
.svg-svg--electronics {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 39.42307692307692% 79.25%;
}
.svg-svg--electronics-dims {
width: 52px;
height: 52px;
}
.svg-svg--exit-modal {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 58.013333333333335% 34.10138248847926%;
}
.svg-svg--exit-modal-dims {
width: 18px;
height: 18px;
}
.svg-svg--filter-line {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 86.59030837004406% 65.44158878504673%;
}
.svg-svg--filter-line-dims {
width: 14px;
height: 24px;
}
.svg-svg--garden {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 51.92307692307692% 79.25%;
}
.svg-svg--garden-dims {
width: 52px;
height: 52px;
}
.svg-svg--hardware--fasteners {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 64.42307692307692% 79.25%;
}
.svg-svg--hardware--fasteners-dims {
width: 52px;
height: 52px;
}
.svg-svg--inspection {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 0 64.93506493506493%;
}
.svg-svg--inspection-dims {
width: 67px;
height: 67px;
}
.svg-svg--instruments {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 76.92307692307692% 79.25%;
}
.svg-svg--instruments-dims {
width: 52px;
height: 52px;
}
.svg-svg--letter {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 99.81009615384616% 0;
}
.svg-svg--letter-dims {
width: 52px;
height: 52px;
}
.svg-svg--liquids {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 99.81009615384616% 13%;
}
.svg-svg--liquids-dims {
width: 52px;
height: 52px;
}
.svg-svg--lock {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 61.29818780889621% 33.944954128440365%;
}
.svg-svg--lock-dims {
width: 12.75px;
height: 16px;
}
.svg-svg--logo {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 0 0;
}
.svg-svg--logo-dims {
width: 222px;
height: 42px;
}
.svg-svg--logo-min {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 0 17.41176470588235%;
}
.svg-svg--logo-min-dims {
width: 140px;
height: 27px;
}
.svg-svg--logo_footer {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 0 10%;
}
.svg-svg--logo_footer-dims {
width: 167px;
height: 32px;
}
.svg-svg--max {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 53.57964601769911% 85.55045871559633%;
}
.svg-svg--max-dims {
width: 16px;
height: 16px;
}
.svg-svg--min {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 91.86061946902655% 81.25%;
}
.svg-svg--min-dims {
width: 16px;
height: 4px;
}
.svg-svg--mobile--menu {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 49.67109679151564% 34.18013856812933%;
}
.svg-svg--mobile--menu-dims {
width: 21.06px;
height: 19px;
}
.svg-svg--mobile--search {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 38.29815805375887% 17.209302325581394%;
}
.svg-svg--mobile--search-dims {
width: 21.19px;
height: 22px;
}
.svg-svg--oil_lubricants {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 37.1571072319202% 43.63636363636363%;
}
.svg-svg--oil_lubricants-dims {
width: 67px;
height: 67px;
}
.svg-svg--ok-icon {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 31.422018348623855% 88.80952380952381%;
}
.svg-svg--ok-icon-dims {
width: 32px;
height: 32px;
}
.svg-svg--order-facebook {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 41.34507042253521% 24.634146341463413%;
}
.svg-svg--order-facebook-dims {
width: 42px;
height: 42px;
}
.svg-svg--order-twitter {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 68.57276995305165% 49.02439024390244%;
}
.svg-svg--order-twitter-dims {
width: 42px;
height: 42px;
}
.svg-svg--order-vk {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 72.94835680751174% 60.97560975609756%;
}
.svg-svg--order-vk-dims {
width: 42px;
height: 42px;
}
.svg-svg--payment-1 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 0 45.4054054054054%;
}
.svg-svg--payment-1-dims {
width: 82px;
height: 82px;
}
.svg-svg--payment-2 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 0 26.233766233766232%;
}
.svg-svg--payment-2-dims {
width: 90.63px;
height: 67px;
}
.svg-svg--payment-3 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 55.79571730169901% 0;
}
.svg-svg--payment-3-dims {
width: 70.12px;
height: 82px;
}
.svg-svg--phone {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 86.66666666666667% 80.64516129032258%;
}
.svg-svg--phone-dims {
width: 18px;
height: 18px;
}
.svg-svg--pic {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 88.50434782608696% 66.01126126126127%;
}
.svg-svg--pic-dims {
width: 8px;
height: 8px;
}
.svg-svg--power {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 99.81009615384616% 52%;
}
.svg-svg--power-dims {
width: 52px;
height: 52px;
}
.svg-svg--radio {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 39.57977528089888% 33.333333333333336%;
}
.svg-svg--radio-dims {
width: 23px;
height: 23px;
}
.svg-svg--radio-active {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 44.08539325842697% 86.94638694638695%;
}
.svg-svg--radio-active-dims {
width: 23px;
height: 23px;
}
.svg-svg--relax {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 26.923076923076923% 79.25%;
}
.svg-svg--relax-dims {
width: 52px;
height: 52px;
}
.svg-svg--reset-filter {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 44.39020040571569% 33.25272067714631%;
}
.svg-svg--reset-filter-dims {
width: 19.41px;
height: 21.96px;
}
.svg-svg--service {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 72.84788029925187% 17.4025974025974%;
}
.svg-svg--service-dims {
width: 67px;
height: 67px;
}
.svg-svg--subscription_arrow {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 75.1473168098601% 46.21008345403131%;
}
.svg-svg--subscription_arrow-dims {
width: 23.38px;
height: 17.03px;
}
.svg-svg--tab-catalog-1 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 82.74654377880184% 65.90352941176471%;
}
.svg-svg--tab-catalog-1-dims {
width: 34px;
height: 27px;
}
.svg-svg--tab-catalog-2 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 0 100%;
}
.svg-svg--tab-catalog-2-dims {
width: 27px;
height: 27px;
}
.svg-svg--tab-catalog-3 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 6.122448979591836% 100%;
}
.svg-svg--tab-catalog-3-dims {
width: 27px;
height: 27px;
}
.svg-svg--tab-catalog-6 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 0 80.05050505050505%;
}
.svg-svg--tab-catalog-6-dims {
width: 56px;
height: 56px;
}
.svg-svg--tire {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 20.448877805486283% 43.63636363636363%;
}
.svg-svg--tire-dims {
width: 67px;
height: 67px;
}
.svg-svg--tire__icon-0 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 61.83495145631068% 63.13131313131313%;
}
.svg-svg--tire__icon-0-dims {
width: 56px;
height: 56px;
}
.svg-svg--tire__icon-1 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 87.16504854368932% 56.58838383838384%;
}
.svg-svg--tire__icon-1-dims {
width: 56px;
height: 56px;
}
.svg-svg--tire__icon-2 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 87.16504854368932% 42.446969696969695%;
}
.svg-svg--tire__icon-2-dims {
width: 56px;
height: 56px;
}
.svg-svg--tire__icon-3 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 87.18409361268239% 0;
}
.svg-svg--tire__icon-3-dims {
width: 56.09px;
height: 56.09px;
}
.svg-svg--tire__icon-4 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 48.23015294974508% 63.14087993130272%;
}
.svg-svg--tire__icon-4-dims {
width: 56.1px;
height: 56.06px;
}
.svg-svg--tire__icon-5 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 13.592233009708737% 80.05050505050505%;
}
.svg-svg--tire__icon-5-dims {
width: 56px;
height: 56px;
}
.svg-svg--tire__icon-7 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 87.16504854368932% 28.305555555555557%;
}
.svg-svg--tire__icon-7-dims {
width: 56px;
height: 56px;
}
.svg-svg--tire__icon-8 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 87.16504854368932% 14.164141414141413%;
}
.svg-svg--tire__icon-8-dims {
width: 56px;
height: 56px;
}
.svg-svg--to--care {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 99.81009615384616% 65%;
}
.svg-svg--to--care-dims {
width: 52px;
height: 52px;
}
.svg-svg--vk-icon {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 38.30275229357798% 10%;
}
.svg-svg--vk-icon-dims {
width: 32px;
height: 32px;
}
/***svg***/
/*
LESS variables are information about icon's compiled state, stored under its original file name
.icon-home {
width: @icon-home-width;
}
The large array-like variables contain all information about a single icon
@icon-home: x y offset_x offset_y width height total_width total_height image_path name;
At the bottom of this section, we provide information about the spritesheet itself
@spritesheet: width height image @spritesheet-sprites;
*/
/*
The provided classes are intended to be used with the array-like variables
.icon-home {
.sprite-width(@icon-home);
}
.icon-email {
.sprite(@icon-email);
}
*/
/*
The `.sprites` mixin generates identical output to the CSS template
but can be overridden inside of LESS
This must be run when you have at least 2 sprites.
If run with a single sprite, then there will be reference errors.
.sprites(@spritesheet-sprites);
*/
/***png***/
/**
* Animation
**/
@-webkit-keyframes basket {
0% {
transform: scale(0);
-webkit-transform: scale(0);
}
100% {
transform: scale(1);
-webkit-transform: scale(1);
}
}
@keyframes mini-menu-active {
0% {
transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
-moz-transform: rotate(0deg);
}
100% {
transform: rotate(180deg);
-webkit-transform: rotate(180deg);
-o-transform: rotate(180deg);
-moz-transform: rotate(180deg);
}
}
@-webkit-keyframes js-active__mobile-search {
from {
opacity: 0;
height: 0;
}
to {
opacity: 1;
height: 60px;
}
}
@-webkit-keyframes js-open__menu-catalog {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
/****
* Плагины
****/
/****
* Страницы
****/
.home__promo-ya {
width: auto;
max-width: 1240px;
margin: 0 auto;
padding: 40px 20px;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: flex;
overflow: hidden;
}
.home__stock {
/*background: #e0d4be;*/
height: auto;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
margin-right: 20px;
position: relative;
overflow: hidden;
flex: 5 1 350px;
order:1;
}
.home__stock a {
width: 100%;
height: 100%;
overflow: hidden;
position: absolute;
z-index: 100;
}
.home__stock_img {
top: 65px;
left: 50%;
margin-left: -115px;
position: absolute;
}
.home__stock img{
width:100%;
height: auto;
}
.home__stock_after {
position: absolute;
bottom: -80px !important;
right: -80px !important;
}
.home__stock_title {
position: absolute;
bottom: 20px;
width: 70%;
}
.home__stock h3 {
font: 500 14px/21px Roboto medium;
color: #0b0b0b;
text-transform: uppercase;
text-decoration: none;
margin: 20px;
}
.home__stock h1 {
font: 500 24px/24px Roboto medium;
color: #0b0b0b;
text-decoration: none;
margin: 20px 20px;
}
.home__stock p {
font: 500 14px/21px Roboto light;
color: #0b0b0b;
text-decoration: none;
margin: 0 20px;
}
.home__stock span {
font: 500 14px/21px Roboto light;
color: #0b0b0b;
text-decoration: none;
position: absolute;
top: 20px;
right: 20px;
}
.home__blocks-orders {
margin-right: 20px;
flex: 10 1 350px;
order: 2;
}
.home__order-one {
background: #d3e5f0;
width: 100%;
height: 240px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
margin-bottom: 20px;
position: relative;
overflow: hidden;
}
.home__order-one a {
width: 100%;
height: 100%;
overflow: hidden;
position: absolute;
z-index: 100;
}
.home__order-one h2 {
font: 500 24px/26px Roboto medium;
color: #0b0b0b;
text-decoration: none;
position: absolute;
bottom: 20px;
left: 20px;
width: 60%;
}
.home__order-one span {
font: 500 14px/21px Roboto light;
color: #0b0b0b;
text-decoration: none;
position: absolute;
top: 20px;
left: 20px;
}
.home__order-one img {
bottom: 30px;
right: 30px;
position: absolute;
}
.home__order-two {
background: #f0ca45;
width: 100%;
height: 240px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
position: relative;
overflow: hidden;
}
.home__order-two a {
width: 100%;
height: 100%;
overflow: hidden;
position: absolute;
z-index: 100;
}
.home__order-two h2 {
font: 500 24px/24px Roboto medium;
color: #0b0b0b;
text-decoration: none;
position: absolute;
bottom: 20px;
left: 20px;
width: 60%;
}
.home__order-two ul li a > span {
font: 500 14px/21px Roboto light;
color: #0b0b0b;
text-decoration: none;
position: absolute;
top: 20px;
left: 20px;
}
.home__order-two img {
top: 40px;
right: 30px;
position: absolute;
}
.home__banner {
background: #bab4d2;
/*max-width: 390px;*/
/*width: 100%;*/
height: auto;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
position: relative;
overflow: hidden;
flex: 1 1 350px;
order:3;
}
.home__banner a {
width: 100%;
height: 100%;
overflow: hidden;
position: absolute;
z-index: 100;
}
.home__banner img {
top: 50%;
left: 50%;
margin-left: -172px;
margin-top: -87px;
position: absolute;
}
.home__banner h2 {
font: 500 24px/24px Roboto medium;
color: #fff;
text-decoration: none;
position: absolute;
top: 20px;
left: 20px;
}
.home__banner span {
font: 500 14px/21px Roboto light;
color: #fff;
text-decoration: none;
position: absolute;
top: 50px;
left: 20px;
}
.home__banner_button {
font: 500 14px/21px Roboto medium;
color: #fff;
text-decoration: none;
position: absolute;
bottom: 40px;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
border-radius: 50px;
border: 1px solid #fff;
padding: 8px 20px;
left: 50%;
margin-left: -85px;
}
.carousel-products {
max-width: 1240px;
height: 400px;
margin: 0 auto 40px auto;
padding: 0 10px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.carousel-products__item {
height: 370px;
background: #fff;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
overflow: hidden;
position: relative;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
outline: none;
padding: 20px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.carousel-products__item:hover {
box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.12);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.carousel-products__item a {
text-decoration: none;
}
.carousel-products__item h3 {
font: 300 12px/21px Roboto light;
color: #000000;
text-decoration: none;
}
.carousel-products__item h2 {
font: 12px/21px Roboto medium;
color: #000000;
text-decoration: none;
margin-bottom: 20px;
height: 60px;
text-align: left;
}
.carousel-products__item_sale {
font: 12px/21px Roboto bold;
color: #fff;
text-decoration: none;
text-transform: uppercase;
background: var(--main-color-grafit);
padding: 4px 15px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
z-index: 5;
position: absolute;
}
.carousel-products__item h4 {
font: 18px/21px Roboto medium;
color: #000000;
text-decoration: none;
bottom: 65px;
position: absolute;
}
.ty-grid-list__price--akkum {
font: 12px Roboto;
color: var(--main-color-red);
position: absolute;
bottom: 45px;
}
.carousel-products__item_status {
font: 300 12px/14px Roboto light;
color: #000000;
text-decoration: none;
bottom: 24px;
position: absolute;
left: 20px;
}
.carousel-products__item_status_do-16 {
bottom: 14px!important;
}
.carousel-products__item_basket {
/*right: 20px;*/
/*bottom: 30px;*/
/*position: absolute;*/
width: 40px;
height: 40px;
border-radius: 50%;
border: 1px solid #dfdfdf;
cursor: pointer;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 11px;
background: transparent;
outline: none;
float: right;
margin-top: 10px;
}
.breadcrumbs__current {
font: 300 12px/24px Roboto light;
color: #b8b2cb;
margin-right: 5px;
}
.carousel-products__item_basket i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 82.66666666666667% 80.64516129032258%;
width: 18px;
height: 18px;
display: block;
}
.carousel-products__item img {
width: auto;
z-index: 1;
}
.product-title {
font-size: 8px;
color: black;
text-decoration: none;
line-height: 2em;
text-transform: uppercase;
}
.product-title h2 {
height: 50px
}
.owl-wrapper-outer {
overflow: hidden;
}
.ty-simple-list__price {
font: 18px/21px Roboto medium;
color: #000;
text-decoration: none;
margin-top: 15px
}
.ty-simple-list__price span {
font: 18px/21px Roboto medium;
color: #000;
}
.ty-scroller-list__img-block .ty-no-image__icon {
background: url('../../../../../../../../design/themes/avtoopt/media/images/cap.png?1536227482') no-repeat scroll 0 0 / contain;
display: block;
min-height: 200px;
margin: auto;
}
.ty-scroller-list__item {
margin: 10px;
background: white;
border-radius: 5px;
padding: 10px;
}
.title-blocks {
max-width: 1240px;
margin: 0 auto;
padding: 0 20px;
position: relative;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.title-blocks__pages {
padding: 0 !important;
display: flex;
align-items: center;
justify-content: space-between;
}
.title-blocks__pages h1 {
font: 700 14px/14px Roboto bold;
color: var(--main-color-grafit);
text-decoration: none;
text-transform: uppercase;
display: inline-block;
}
.title-blocks h2,
.title-blocks span,
.title-blocks h1 {
font: 700 14px/14px Roboto bold;
color: var(--main-color-grafit);
text-decoration: none;
text-transform: uppercase;
margin-bottom: 5px;
}
.slick-slide {
margin: 40px 10px;
}
.slick-prev:before,
.slick-next:before {
color: black;
}
.slick-next {
right: 20px;
top: -6px;
width: 30px;
height: 30px;
border: 1px solid #d9d9d9;
z-index: 100;
}
.slick-next:before {
content: '';
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 46.488069414316705% 16.856492027334852%;
width: 7px;
height: 13px;
top: 9px;
left: 11px;
position: absolute;
}
.slick-prev {
right: 49px;
top: -6px;
width: 30px;
height: 30px;
border: 1px solid #d9d9d9;
z-index: 100;
}
.slick-prev:before {
content: '';
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 88.31236442516268% 63.801822323462424%;
width: 7px;
height: 13px;
top: 9px;
left: 11px;
position: absolute;
}
.home-about {
max-width: 1240px;
margin: 0 auto;
padding: 0 20px;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: flex;
}
.home-about__item {
width: 25%;
display: inline-block;
margin-bottom: 40px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.home-about__item:nth-child(1) {
border-right: 1px solid #d5d5d7;
}
.home-about__item p {
font: 400 14px/21px Roboto light;
color: #434343;
padding: 20px 50px 0 0;
}
.home-about__item h2 {
font: 300 72px/72px Roboto light;
color: var(--main-color-grafit);
text-align: center;
margin-top: 60px;
}
.home-about__item h3 {
font: 300 24px/24px Roboto light;
color: var(--main-color-grafit);
text-align: center;
}
.threed-tour__item {
border: 2px solid #d8d4e9;
border-radius: 5px;
transition: 1s;
}
.threed-tour__item:hover {
border: 2px solid var(--main-color-grafit);
}
.threed-tour__item img {
width: 90%;
height: 90%;
}
.threed-button {
cursor: pointer;
background: none;
border: none;
outline: none;
display: table;
margin: 0 auto;
}
@media screen and (max-width: 1000px) {
.home-about__item--3dtour {
display: none;
}
}
.detail-product {
max-width: 1240px;
width: 100%;
margin: 0 auto;
padding: 10px 20px;
position: relative;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.detail-product__options {
padding: 20px 0 10px 0;
flex-basis: 100%;
display: flex;
flex-wrap: wrap;
}
.detail-product__options a {
/*margin-right: 14px;*/
font: 300 14px/21px Roboto !important;
display: inline-block;
padding: 5px 10px;
border: 2px solid #dfdfdf;
margin: 5px;
border-radius: 5px;
flex: 110px 1 1;
text-align: center;
}
.detail-product__options a:hover {
border: 2px solid var(--main-color-grafit);
}
.detail-product__bread-crumbs {
padding: 0 0 20px 0;
}
.detail-product__bread-crumbs a {
font: 300 12px/24px Roboto light;
text-decoration: none;
color: #b8b2cb;
margin-right: 5px;
}
.detail-product__bread-crumbs a:last-child:after {
display: none;
}
.detail-product__bread-crumbs a:after {
content:"\e258";
font-family: "Glyphicons Halflings";
font-size: 10px;
/*background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;*/
/*background-position: 46.488069414316705% 16.856492027334852%;*/
/*width: 7px;*/
/*height: 11px;*/
display: inline-block;
margin-left: 5px;
/*opacity: .3;*/
}
.detail-product__content {
width: 100%;
/*height: 660px;*/
min-height: 800px;
background: #fff;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
display: table;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
@media screen and (max-width: 760px) {
.profile-page .detail-product__content {
display: block!important;
}
.ty-form-builder #elm_9 {
margin-top: 10px!important;
}
.ty-form-builder #elm_9 label {
white-space:normal!important;
position: relative;
padding: 10px 10px 10px 35px!important;
}
.ty-form-builder #elm_9 label input {
position: absolute;
top: 50%;
margin-top: -11.5px;
left: 5px;
}
#elm_9 .ty-form-builder__checkbox-label {
margin: 5px!important;
}
}
.detail-product__content_title-940 {
display: none;
}
.detail-product__content_cover {
float: left;
width: 50%;
max-width: 600px;
position: relative;
padding: 50px 0;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.detail-product_image_bottling {
position: absolute;
right: 15px;
z-index: 1;
}
.detail-product__content_cover-img {
max-width: 400px;
width: 100%;
margin: 0 auto;
position: relative;
}
.detail-product__content_info,
.detail-product__content_title-940 {
float: left;
width: 50%;
position: relative;
padding: 30px 50px;
-moz-box-sizing: border-box;
box-sizing: border-box;
margin-top: 20px;
}
@media screen and (max-width: 940px) {
.detail-product__content_info {
margin-top: 65px;
}
}
.detail-product__content_info h1,
.detail-product__content_title-940 h1 {
font: 500 21px/28px Roboto medium;
text-decoration: none;
color: #000;
padding: 20px 0 30px 0;
word-break:break-all;
}
.detail-product__content_info span,
.detail-product__content_title-940 span {
font: 300 12px/21px Roboto;
text-decoration: none;
/*color: #ababab;*/
}
.detail-product__content_info a,
.detail-product__content_title-940 a {
font: 500 14px/21px Roboto medium;
text-decoration: none;
color: var(--main-color-grafit);
}
.detail-product__status_yes {
font: 500 14px/21px Roboto medium !important;
color: #6fa13e !important;
right: 0;
float: right;
}
.detail-product__status_no {
font: 500 14px/21px Roboto medium !important;
color: #d8254c !important;
right: 0;
float: right;
}
.detail-product__status_order {
font: 500 14px/21px Roboto medium !important;
color: orange !important;
right: 0;
float: right;
}
.detail-product__shops {
font: 300 12px/16px Roboto light !important;
color: var(--main-color-grafit) !important;
float: right;
text-align: right;
right: 0;
}
.detail-product__price {
position: relative;
width: 100%;
border-top: 1px solid #e8e8e8;
border-bottom: 1px solid #e8e8e8;
margin: 20px 0 5px 0;
padding: 30px 0;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.detail-product__body {
width: 100%;
display: flex;
flex-direction: row;
padding-bottom: 20px;
}
.detail-product__guarantee {
position: absolute;
left: 50%;
transform: translate(-50%, -50%);
font: 300 12px Roboto;
color: var(--main-color-grafit);
top: 44px;
}
.detail-product__1, .detail-product__2 {
width: 100%;
}
.detail-product__2 {
text-align: right;
}
.detail-product__price_order_button {
display: inline-flex;
flex-direction: row;
flex-wrap: wrap;
padding-top: 25px;
}
.detail-product__price div.detail-product__body_price {
font: 500 30px/30px Roboto bold;
text-decoration: none;
color: var(--main-color-grafit);
position: relative;
}
#price_discount {
font-weight: bold;
}
.detail-product__price div.detail-product__body_price > span {
font: 700 14px/14px Roboto medium;
color: var(--main-color-grafit);
}
.detail-product__price_old {
text-decoration: line-through;
font: 400 14px/14px Roboto medium !important;
color: #ababab !important;
margin-right: 20px;
}
.detail-product__price_order {
width: 100%;
min-width: 134px;
padding: 25px 0 0 0;
-moz-box-sizing: border-box;
box-sizing: border-box;
margin-bottom: 25px;
}
.detail-product__price_number {
position: relative;
}
.detail-product__price_buy {
font: 400 14px/16px Roboto medium !important;
text-decoration: none;
color: #fff !important;
background: var(--main-color-grafit);
padding: 11px 34px;
-webkit-border-radius: 25px;
-moz-border-radius: 25px;
border-radius: 25px;
display: inline-block;
min-width: 111px;
}
.detail-product__price_buy-one {
font: 400 14px/16px Roboto medium !important;
border: 1px solid #dfdfdf;
text-decoration: none;
color: #ababab !important;
padding: 11px 34px;
-webkit-border-radius: 25px;
-moz-border-radius: 25px;
border-radius: 25px;
display: inline-block;
}
.detail-product__price--akkum {
position: relative;
height: 100%;
width: 100%;
z-index: 1;
padding-bottom: 0;
}
#price_discount {
padding: 0;
color: var(--main-color-grafit);
font: 300 26px Roboto;
margin-right: 0;
line-height: 1.5em;
}
#price_discount span:nth-child(1) {
display: block;
font: 300 12px Roboto;
width: 100%;
color: var(--main-color-grafit);
padding-top: 6px;
}
#price_new {
color: #cc504f;
}
#price_discount span:nth-child(3) {
font: 700 14px/14px Roboto medium;
color: #cc504f;
width: 16px;
display: inline-block;
margin-left: 7px;
margin-right: 11px;
}
.detail-product__price--akkum span {
display: block;
color: var(--main-color-grafit);
font-size: 14px;
padding: 3px 0;
text-align: right;
}
.detail-product__price--akkum span:nth-child(2) {
top: 10px;
color: var(--main-color-grafit);
font-size: 13px;
right: 0;
padding: 0;
margin-bottom: 10px;
}
.detail-product__price--akkum select {
position: relative;
width: auto;
padding: 8px 4px;
background-color: white;
border: 2px solid lightgrey;
font: 15px Roboto;
border-radius: 25px;
color: var(--main-color-grafit);
margin-top: 3px;
}
.detail-product__price--akkum select option {
background-color: white;
border: 2px solid darkslategrey;
font: 16px Roboto;
color: var(--main-color-grafit);
}
.detail-product__price--akkum select:active, .detail-product__price--akkum select:hover, .detail-product__price--akkum select:focus{
border-color: var(--main-color-grafit);
}
@media screen and (min-width: 1193px) {
.detail-product__1 {
width: 65%;
}
.detail-product__2 {
width: 35%;
}
}
@media screen and (max-width: 940px) {
.detail-product__1, .detail-product__2 {
text-align: center;
}
.detail-product__price--akkum span:nth-child(2), #price_discount span:nth-child(1) {
text-align: center;
}
#price_discount {
text-align: center;
}
}
@media screen and (max-width: 760px) {
.detail-product__price h2 {
width: 100%;
text-align: center;
}
.detail-product__options {
display: flex;
flex-direction: row;
width: 100%;
flex-wrap: wrap;
padding: 0 0 25px 0;
}
.detail-product__options a {
white-space: nowrap;
}
.detail-product__price--akkum {
text-align: center;
width: 100%;
}
}
.list-product_image_bottling {
position: absolute;
height: 45px!important;
right: 15px;
top: 73px;
z-index: 2!important;
}
@media screen and (max-width: 470px) {
.detail-product__guarantee {
top: auto;
}
.detail-product__body {
flex-direction: column-reverse;
padding-bottom: 0;
}
.detail-product__1 {
margin-top: 10px;
}
.detail-product__2 {
margin-top: 25px;
}
.detail-product__price {
margin: 0;
padding: 0;
}
.detail-product__price h2 {
margin-top: 1px;
}
.detail-product__price span {
display: inline-block;
}
.detail-product__price--akkum {
position: relative;
top: 0;
left: 0;
margin: 0 auto;
padding-bottom: 20px;
}
.detail-product__price--akkum span {
display: block;
}
.detail-product_image_bottling {
top: -16px;
}
}
.price {
position: relative;
}
#price s {
position: absolute;
right: -5px;
top: -23px;
font-size: 17px;
color: black;
opacity: 0.7;
}
.detail-product__dop-products {
position: relative;
padding: 0 0 10px 0;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.detail-product__slider-item {
width: 70px;
padding: 15px;
height: 70px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
overflow: hidden;
background-color: #ffffff;
box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.16);
margin: 10px;
outline: 0;
cursor: pointer;
position: relative;
}
.detail-product__slider-3d:after {
content: '';
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 32.04541292803516% 17.209302325581394%;
width: 31.12px;
height: 22px;
display: inline-block;
bottom: 10px;
right: 10px;
position: absolute;
}
.slider-n {
max-width: 120px;
position: absolute;
top: 50px;
left: -20px;
outline: 0;
}
.input-number {
width: 40px;
height: 40px;
text-align: center;
border: 1px solid #dfdfdf;
font: 400 14px/14px Roboto light;
color: #ababab;
box-shadow: none;
float: left;
-moz-box-sizing: border-box;
box-sizing: border-box;
outline: 0;
-webkit-appearance: button;
border-radius: 0;
}
.input-number-decrement {
width: 40px;
height: 40px;
text-align: center;
border-left: 1px solid #dfdfdf;
border-top: 1px solid #dfdfdf;
border-bottom: 1px solid #dfdfdf;
-webkit-border-radius: 25px 0 0 25px;
-moz-border-radius: 25px 0 0 25px;
border-radius: 25px 0 0 25px;
cursor: pointer;
font: 400 14px/14px Roboto light;
color: #ababab;
box-shadow: none;
float: left;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.input-number-decrement i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 91.86061946902655% 81.25%;
width: 16px;
height: 4px;
display: inline-block;
margin-top: 18px;
}
.input-number-increment {
width: 40px;
height: 40px;
text-align: center;
border-right: 1px solid #dfdfdf;
border-top: 1px solid #dfdfdf;
border-bottom: 1px solid #dfdfdf;
-webkit-border-radius: 0 25px 25px 0;
-moz-border-radius: 0 25px 25px 0;
border-radius: 0 25px 25px 0;
cursor: pointer;
font: 400 14px/14px Roboto light;
color: #ababab;
box-shadow: none;
float: left;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.input-number-increment i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 53.57964601769911% 85.55045871559633%;
width: 16px;
height: 16px;
display: inline-block;
margin-top: 12px;
}
.tabs__caption {
margin-bottom: 30px;
}
.tabs__caption li.active {
font: 500 14px/14px Roboto medium;
text-decoration: none;
text-transform: uppercase;
}
.tabs__caption li.active a {
color: var(--main-color-grafit);
}
.tabs__caption li {
font: 500 14px/14px Roboto medium;
text-decoration: none;
text-transform: uppercase;
display: inline-block;
margin-right: 30px;
cursor: pointer;
}
.tabs__caption li a {
color: #ababab;
}
.tabs__caption li:last-child {
margin-right: 0;
}
.tabs__content {
display: none;
/* по умолчанию прячем все блоки */
}
.tabs__content p {
font: 300 14px/21px Roboto light;
color: #656565;
}
.tabs__content.active {
display: block;
/* по умолчанию показываем нужный блок */
}
.catalog {
overflow: hidden;
width: 100%;
display: table;
padding-bottom: 10px;
}
.catalog__item {
width: 31%;
margin: 0 0 20px 2.1%;
float: left;
}
.catalog__filter {
width: 264px;
display: table-cell;
vertical-align: top;
}
.catalog__filter h3 {
font: 700 12px/18px Roboto bold;
color: var(--main-color-grafit);
text-transform: uppercase;
padding: 20px 0;
cursor: pointer;
}
.catalog__filter h3 span {
text-transform: none;
}
.catalog__filter-line {
text-align: right;
/*margin-top: -30px;*/
z-index: 10;
position: relative;
}
.catalog__filter-line_select {
display: none;
-webkit-appearance: none;
box-shadow: none;
border: none;
background: inherit;
width: 100%;
font: 300 14px/21px Roboto light;
color: var(--main-color-grafit);
position: relative;
background-image: url('../../../../../../../../design/themes/avtoopt/media/svg/arrow_menu.svg?1759911146');
background-position: right center;
background-repeat: no-repeat;
outline: none;
margin-top: -20px;
padding-left: 100px;
}
.catalog__filter-line_title {
font: 400 14px/21px Roboto bold;
color: var(--main-color-grafit);
display: inline-block;
}
.catalog__filter-line_title-active {
background: #b2accb;
padding: 10px 60px 10px 20px;
color: #fff !important;
-webkit-border-radius: 35px;
-moz-border-radius: 35px;
border-radius: 35px;
border: none !important;
position: relative;
}
.catalog__filter-line_title-active:after {
width: 40px;
height: 41px;
content: '';
border-left: 1px solid #f3f3f3;
position: absolute;
top: 0;
right: 0;
}
.catalog__filter-line_title-active:before {
content: '';
position: absolute;
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 86.59030837004406% 65.44158878504673%;
width: 14px;
height: 24px;
right: 16px;
}
.catalog__filter-line_item {
font: 300 14px/21px Roboto light;
color: var(--main-color-grafit);
display: inline-block;
margin-left: 20px;
cursor: pointer;
}
.catalog__filter_input {
border: 1px solid #b2accb;
margin: 0 0 30px 0;
}
.catalog__filter_input-price {
border: 1px solid #b2accb;
width: 45%;
margin: 0 8% 30px 0;
position: relative;
overflow: hidden;
display: inline-block;
}
.catalog__filter_input-price:nth-child(2) {
margin-right: 0;
}
.cm-product-filters-checkbox,.catalog__filter_checkbox {
margin: -3px 10px 0 0;
display: inline-block;
}
.cm-product-filters-checkbox_car,.catalog__filter_checkbox,.cm-product-filters-checkbox_guarantee,.cm-product-filters-checkbox_shop{
margin: -3px 10px 0 0;
display: inline-block;
}
.cm-product-filters-checkbox-container > label{
font: 300 14px/14px Roboto light;
color: var(--main-color-grafit);
vertical-align: middle;
cursor: pointer;
}
.mCSB_container > .ty-product-filters__group > label{
font-weight:bold;
}
.catalog__filter_checkbox-input {
margin-right: 10px;
}
.catalog__filter_li {
padding: 1px 0;
position: relative;
}
.catalog__filter_li-scroll {
max-height: 280px;
margin-bottom: 30px;
overflow:hidden;
}
.about__block-logos_info-text.catalog__filter_li-scroll {
max-height: none!important;
}
.catalog__filter_li:last-child {
border: none;
}
/*.catalog__filter_li ul {*/
/*display: none;*/
/*}*/
/*.catalog__filter_li i {*/
/*background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;*/
/*background-position: 78.92747252747253% 69.00898876404496%;*/
/*width: 13px;*/
/*height: 7px;*/
/*position: absolute;*/
/*right: 0;*/
/*top: 28px;*/
/*z-index: -1;*/
/*-webkit-transition: all 0.5s ease-in-out 0s;*/
/*-moz-transition: all 0.5s ease-in-out 0s;*/
/*-o-transition: all 0.5s ease-in-out 0s;*/
/*transition: all 0.5s ease-in-out 0s;*/
/*}*/
.catalog__filter_reset {
padding: 10px 27%;
position: relative;
overflow: hidden;
text-align: center;
}
.catalog__filter_reset a {
font: 300 14px/14px Roboto light;
color: var(--main-color-grafit);
text-decoration: none;
}
.catalog__filter_reset i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 44.39020040571569% 33.25272067714631%;
width: 19.41px;
height: 21.96px;
display: inline-block;
margin-right: 10px;
vertical-align: bottom;
}
.catalog__category {
position: relative;
border-top: 1px solid #ded9f1;
border-bottom: 1px solid #ded9f1;
margin: 20px 0 10px 0;
/*max-height: 85px;*/
max-height: 150px;
overflow: hidden;
padding: 10px 120px 25px 0;
-moz-box-sizing: border-box;
box-sizing: border-box;
/*transition: all 0.4s ease;*/
}
.catalog__category--custom {
padding: 0;
max-height: initial;
display: flex;
align-items: flex-start;
overflow: visible;
}
.catalog__category_block > a{
background: #fff;
text-align: center;
}
.catalog__category_block--custom {
display: flex;
flex-wrap: wrap;
width: 100%;
}
.catalog__category .catalog__category_block--custom a,
.category_back {
font: 300 14px/14px Roboto light;
color: var(--main-color-grafit);
text-decoration: none;
padding: 10px 20px;
border-radius: 0px;
box-shadow: inset 0 -1px 0 0 rgba(0,0,0,0.1);
border: 1px solid #ded9f1;
margin: 10px;
/*width: 175px;*/
height: 222px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
text-overflow: ellipsis;
overflow: hidden;
flex: 0 1 175px;
}
.catalog__category .catalog__category_block--custom a img {
width: auto;
max-width: 150px;
max-height: 125px;
display: block;
margin: auto;
align-self: center;
}
.catalog__category .catalog__category_block--custom a .ty-no-image__icon {
margin: auto;
}
.catalog__category .catalog__category_block--custom a .ty-no-image__icon {
background: url(../../../../../../../../design/themes/avtoopt/media/images/cap.png?1548150251) no-repeat scroll 0 0 / contain;
display: block;
height: 150px;
width: 175px;
}
.catalog__category .catalog__category_block--custom a span {
align-self: flex-end;
display: block;
min-height: 30px;
width: 100%;
font-size: 16px;
line-height: 1.2em;
}
.catalog__category .catalog__category_block--custom a:hover {
background-color: #fff;
}
.catalog__category_block > a sup{
color: #7b7b7b;
}
.catalog__category_select {
display: none;
-webkit-appearance: none;
box-shadow: none;
border: none;
background: inherit;
width: 100%;
font: 300 14px/21px Roboto light;
color: var(--main-color-grafit);
position: relative;
background-image: url('../../../../../../../../design/themes/avtoopt/media/svg/arrow_menu.svg?1759911146');
background-position: right center;
background-repeat: no-repeat;
outline: none;
}
.catalog__category a {
font: 300 14px/14px Roboto light;
color: var(--main-color-grafit);
text-decoration: none;
padding: 10px 20px;
-webkit-border-radius: 35px;
-moz-border-radius: 35px;
border-radius: 35px;
border: 1px solid #ded9f1;
display: inline-block;
margin: 16px 20px 10px 0;
}
.catalog__category_block .catalog__category_active {
background: #b2accb;
padding: 10px 20px;
-webkit-border-radius: 35px;
-moz-border-radius: 35px;
border-radius: 35px;
color: white;
}
.catalog__category_block .catalog__category_active sup {
color: white;
}
.catalog__category_block .catalog__category_active:hover sup {
color: #7b7b7b;
}
.catalog__category_block .catalog__category_active:hover {
color: var(--main-color-grafit);
}
.catalog__category_click {
/*position: absolute;*/
right: 0;
top: 20px;
font: 300 14px/50px Roboto light;
color: var(--main-color-grafit);
cursor: pointer;
text-align: center;
font-weight: bold;
}
.catalog__category_click i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 78.92747252747253% 69.00898876404496%;
width: 13px;
height: 7px;
display: inline-block;
margin-left: 10px;
-webkit-transition: all 0.5s ease-in-out 0s;
-moz-transition: all 0.5s ease-in-out 0s;
-o-transition: all 0.5s ease-in-out 0s;
transition: all 0.5s ease-in-out 0s;
}
.catalog__content {
display: inline-block;
vertical-align: top;
/*padding: 0 0 0 20px;*/
-moz-box-sizing: border-box;
box-sizing: border-box;
transition: left .2s ease-in-out;
white-space: normal;
}
.catalog__content_open-filter {
display: none;
float: left;
font: 300 14px/50px Roboto light;
color: var(--main-color-grafit);
cursor: pointer;
text-decoration: none;
margin-top: -12px;
}
.catalog__content_open-filter i {
display: inline-block;
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 38.33764348260061% 87.55868544600939%;
width: 27.18px;
height: 26px;
vertical-align: middle;
margin-right: 20px;
}
.catalog__content_view-cards {
width: 100%;
padding: 20px 5px 25px 5px;
text-align: right;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.catalog__content_view-cards-tab1 {
display: inline-block;
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 82.74654377880184% 65.90352941176471%;
width: 34px;
height: 27px;
opacity: .3;
}
.catalog__content_view-cards-tab2 {
display: inline-block;
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 0 100%;
width: 27px;
height: 27px;
margin-left: 20px;
opacity: .3;
}
.catalog__content_view-cards-tab3 {
display: inline-block;
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 6.122448979591836% 100%;
width: 27px;
height: 27px;
margin-left: 20px;
opacity: .3;
}
.catalog__paging {
width: 100%;
text-align: right;
display: inline-block;
margin-top: 20px;
-moz-box-sizing: border-box;
box-sizing: border-box;
line-height: 2.5em;
}
.catalog__paging a {
font: 300 14px/14px Roboto light;
color: var(--main-color-grafit);
text-decoration: none;
padding: 4px 8px;
margin: 0 4px;
}
.catalog__paging a:hover {
background: #fff;
color: var(--main-color-grafit) !important;
-webkit-border-radius: 35px;
-moz-border-radius: 35px;
border-radius: 35px;
}
.catalog__paging_active {
background: var(--main-color-grafit);
color: #fff !important;
-webkit-border-radius: 35px;
-moz-border-radius: 35px;
border-radius: 35px;
}
.js-catalog__category {
max-height: 100% !important;
}
.js-category_click-anime i {
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
-moz-transition: all 0.5s ease-in-out 0s;
transition: all 0.5s ease-in-out 0s;
}
.js-reflect:before {
-moz-transform: scale(-1, 1);
-webkit-transform: scale(-1, 1);
-o-transform: scale(-1, 1);
transform: scale(-1, 1);
}
input[type="checkbox"]:focus {
outline: none;
}
input[type="checkbox"] {
display: none;
-webkit-appearance: none;
-moz-appearance: none;
}
input[type="checkbox"] {
display: inline-block;
vertical-align: middle;
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 49.25393258426966% 86.94638694638695%;
width: 23px;
height: 23px;
cursor: pointer;
border: none;
box-shadow: none;
}
input[type="checkbox"]:checked {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 44.71910112359551% 9.79020979020979%;
width: 23px;
height: 23px;
}
.active ul {
display: block;
}
.js-active__view-card {
opacity: 1;
}
.accordion .link {
cursor: pointer;
display: block;
position: relative;
-webkit-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
transition: all 0.4s ease;
}
.accordion li:last-child .link {
border-bottom: 0;
}
.accordion-border {
border-bottom: 1px solid #ded9f1;
}
.cm-save-state i.fa {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 78.92747252747253% 69.00898876404496%;
width: 13px;
height: 7px;
position: absolute;
right: 0;
top: 28px;
-moz-transition: all 0.5s ease-in-out 0s;
transition: all 0.5s ease-in-out 0s;
}
.ty-product-filters__block i.fa {
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
-moz-transition: all 0.5s ease-in-out 0s;
transition: all 0.5s ease-in-out 0s;
}
.ty-product-filters__block.open i.fa {
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(180deg);
-moz-transition: all 0.5s ease-in-out 0s;
transition: all 0.5s ease-in-out 0s;
}
.submenu {
display:none;
}
.open > .submenu
{
display:block!important;
}
.js-filter-nav-left {
display: table-cell !important;
position: relative!important;
float:left;
}
.js-catalog__content {
min-width: 60px;
overflow: hidden;
}
.carousel-products {
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.carousel-products__item_line {
min-height: 150px;
width: 97%;
margin-left: 2%;
margin-bottom: 20px;
background: #fff;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
overflow: hidden;
position: relative;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
outline: none;
padding: 20px 20px 20px 170px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.carousel-products__item_line_shops {
font: 300 12px/16px Roboto light !important;
color: var(--main-color-grafit)!important;
left: 170px;
bottom: 20px;
position: absolute;
}
.carousel-products__item_line-cover {
width: 150px;
height: 150px;
border-right: 1px solid #ebeaf0;
position: absolute;
top: 0;
left: 0;
padding-top: 16px;
}
.carousel-products__item_line:hover {
box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.12);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.carousel-products__item_line a {
text-decoration: none;
}
.carousel-products__item_line h3 {
font: 300 12px/21px Roboto light;
color: #000000;
text-decoration: none;
}
.carousel-products__item_line h2 {
font: 14px/21px Roboto medium;
color: #000000;
text-decoration: none;
text-transform: uppercase;
margin-bottom: 20px;
}
.carousel-products__item_line_sale {
font: 12px/21px Roboto bold;
color: #fff;
text-decoration: none;
text-transform: uppercase;
background: var(--main-color-grafit);
padding: 2px 8px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
z-index: 5;
right: 10px;
top: 10px;
position: absolute;
}
.carousel-products__item_line h4 {
font: 18px/21px Roboto medium;
color: #000000;
text-decoration: none;
top: 20px;
right: 20px;
position: absolute;
}
.carousel-products__item_line_status {
font: 300 12px/21px Roboto light;
color: #000000;
text-decoration: none;
right: 20px;
position: absolute;
top: 40px;
}
.carousel-products__item_line_basket {
right: 20px;
bottom: 20px;
width: 40px;
height: 40px;
border-radius: 50%;
border: 1px solid #dfdfdf;
position: absolute;
cursor: pointer;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 11px;
}
.carousel-products__item_line_basket i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 82.66666666666667% 80.64516129032258%;
width: 18px;
height: 18px;
display: block;
}
.carousel-products__item_line img {
width: auto;
z-index: 1;
max-height: 85%;
margin: 0 auto;
display: block;
max-width: 100%;
}
.carousel-products {
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.carousel-products__item_line-min {
height: 80px;
width: 97%;
margin-left: 2%;
margin-bottom: 20px;
background: #fff;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
overflow: hidden;
position: relative;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
outline: none;
padding: 10px 20px 10px 100px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.carousel-products__item_line-min_number {
top: 20px;
right: 200px;
position: absolute;
}
.carousel-products__item_line-min_shops {
font: 300 12px/16px Roboto light !important;
color: #6b6b6b!important;
left: 100px;
bottom: 10px;
position: absolute;
}
.carousel-products__item_line-min-cover {
width: 80px;
height: 80px;
border-right: 1px solid #ebeaf0;
position: absolute;
top: 0;
left: 0;
padding-top: 8px;
}
.carousel-products__item_line-min:hover {
box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.12);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.carousel-products__item_line-min a {
text-decoration: none;
}
.carousel-products__item_line-min h3 {
font: 300 12px/12px Roboto light;
color: #000000;
text-decoration: none;
}
.carousel-products__item_line-min h2 {
font: 14px/21px Roboto medium;
color: #000000;
text-decoration: none;
text-transform: uppercase;
margin-bottom: 20px;
}
.carousel-products__item_line-min_sale {
font: 12px/21px Roboto bold;
color: #fff;
text-decoration: none;
text-transform: uppercase;
background: var(--main-color-grafit);
padding: 2px 8px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
z-index: 5;
right: 10px;
top: 10px;
position: absolute;
}
.carousel-products__item_line-min h4 {
font: 18px/21px Roboto medium;
color: #000000;
text-decoration: none;
top: 22px;
right: 80px;
position: absolute;
}
.carousel-products__item_line-min_status {
font: 300 12px/21px Roboto light;
color: #000000;
text-decoration: none;
right: 80px;
position: absolute;
top: 42px;
}
.carousel-products__item_line-min_basket {
right: 20px;
bottom: 20px;
width: 40px;
height: 40px;
border-radius: 50%;
border: 1px solid #dfdfdf;
position: absolute;
cursor: pointer;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 11px;
}
.carousel-products__item_line-min_basket i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 82.66666666666667% 80.64516129032258%;
width: 18px;
height: 18px;
display: block;
}
.carousel-products__item_line-min img {
width: 100%;
z-index: 1;
}
.carousel-products__basket {
height: 80px;
width: 100%;
margin-left: 0;
margin-bottom: 20px;
background: #fff;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
overflow: hidden;
position: relative;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
outline: none;
padding: 10px 20px 10px 100px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.carousel-products__basket_number {
top: 20px;
right: 180px;
position: absolute;
}
.carousel-products__basket_shops {
font: 300 12px/16px Roboto light !important;
color: #6b6b6b!important;
left: 100px;
bottom: 10px;
position: absolute;
}
.carousel-products__basket-cover {
width: 80px;
height: 100vw;
border-right: 1px solid #ebeaf0;
position: absolute;
top: 0;
left: 0;
padding-top: 8px;
}
.carousel-products__basket:hover {
box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.12);
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.carousel-products__basket a {
text-decoration: none;
}
.carousel-products__basket h3 {
font: 300 12px/12px Roboto light;
color: #000000;
text-decoration: none;
}
.carousel-products__basket h2 {
font: 14px/21px Roboto medium;
color: #000000;
text-decoration: none;
text-transform: uppercase;
/*margin-bottom: 20px;*/
}
.carousel-products__basket span.in_shops_on_order {
/*color: grey;*/
font: 300 12px/21px Roboto light !important
}
.carousel-products__basket_sale {
font: 12px/21px Roboto bold;
color: #fff;
text-decoration: none;
text-transform: uppercase;
background: var(--main-color-grafit);
padding: 2px 8px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
z-index: 5;
right: 10px;
top: 10px;
position: absolute;
}
.carousel-products__basket h4 {
font: 18px/21px Roboto medium;
color: #000000;
text-decoration: none;
top: 22px;
right: 80px;
position: absolute;
}
.carousel-products__basket_status {
font: 300 12px/21px Roboto light;
color: #000000;
text-decoration: none;
right: 80px;
position: absolute;
top: 42px;
}
.carousel-products__basket_basket {
right: 20px;
bottom: 20px;
width: 40px;
height: 40px;
border-radius: 50%;
border: 1px solid #dfdfdf;
position: absolute;
cursor: pointer;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 11px;
}
.carousel-products__basket_basket i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 82.66666666666667% 80.64516129032258%;
width: 18px;
height: 18px;
display: block;
}
.carousel-products__basket img {
max-width: 100%;
width: auto;
max-height: 100%;
height: auto;
z-index: 1;
}
.js-active-product__basket:after {
content: '';
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 43.11883408071749% 17.209302325581394%;
width: 22px;
height: 22px;
display: block;
position: absolute;
top: -4px;
right: -12px;
animation-duration: .5s;
-webkit-animation-duration: .5s;
-webkit-animation-fill-mode: both;
-webkit-animation-name: basket;
animation-name: basket;
}
.basket {
border-top: 1px solid #ded9f1;
margin: 40px 0 0 0;
padding: 40px 0 20px 0;
}
.basket__card {
width: 100% !important;
margin-left: 0 !important;
padding-top: 10px !important;
}
.basket__card .carousel-products__basket-cover {
padding-top: 0!important;
display: flex;
justify-content: center;
align-items: center;
height: 100%!important;
}
.basket__card h2 {
width: 50%;
}
.basket__card h3 {
font: 300 12px/21px Roboto light !important;
}
.basket__card h4 {
right: 60px !important;
}
.basket__card_name-price {
right: 60px !important;
}
.basket__card_delete {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 54.013333333333335% 34.10138248847926%;
width: 18px;
height: 18px;
position: absolute;
top: 32px;
right: 20px;
opacity: .3;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
animation-duration: .5s;
-webkit-animation-duration: .5s;
-webkit-animation-fill-mode: both;
-webkit-animation-name: basket;
animation-name: basket;
}
.basket__card_delete:hover {
opacity: 1;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
}
/*.basket__button {*/
/*position: absolute;*/
/*top: -10px;*/
/*right: 0;*/
/*margin: 0;*/
/*}*/
.basket__itog {
/*right: 200px;*/
/*position: absolute;*/
/*top: 2px;*/
/*color: #434343 !important;*/
/*text-transform: none !important;*/
text-align: center;
display: block;
}
.contacts {
border-top: 1px solid #ded9f1;
margin: 40px 0 0 0;
padding: 40px 0 0 0;
}
.contacts__map {
width: 100%;
height: 400px;
}
.contacts__phones {
width: 24%;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: inline-block;
}
.contacts__phones p {
font: 14px/21px Roboto light;
color: var(--main-color-grafit);
margin: 0;
}
.contacts__phones p span {
font: 400 14px/21px Roboto medium;
color: var(--main-color-grafit);
}
.contacts__info {
border-bottom: 1px solid #ded9f1;
padding: 0 0 20px 0;
}
.contacts__info p {
font: 14px/21px Roboto light;
color: var(--main-color-grafit);
margin: 0;
display: inline-block;
}
.contacts__info p span {
font: 400 14px/21px Roboto medium;
color: var(--main-color-grafit);
}
.contacts__info_name {
width: 49%;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: inline-block;
}
.contacts__info_time {
width: 24%;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: inline-block;
}
.contacts__info_time i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 85.51724137931035% 75.6563245823389%;
width: 33px;
height: 33px;
display: inline-block;
margin-right: 20px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
animation-duration: .5s;
-webkit-animation-duration: .5s;
-webkit-animation-fill-mode: both;
-webkit-animation-name: basket;
animation-name: basket;
}
.contacts__info_time-open {
color: #639021 !important;
}
.contacts__info_time-close {
color: #d8254c !important;
}
.contacts__info_message {
width: 24%;
-moz-box-sizing: border-box;
box-sizing: border-box;
display: inline-block;
vertical-align: middle;
text-align: right;
}
.contacts__blocks {
width: 50%;
float: left;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 40px 0 80px 0;
}
.contacts__blocks h2 {
font: 400 12px/21px Roboto bold;
color: var(--main-color-grafit);
text-decoration: none;
text-transform: uppercase;
}
.contacts__blocks_requisites {
width: 49%;
display: inline-block;
-moz-box-sizing: border-box;
box-sizing: border-box;
vertical-align: top;
padding-right: 10%;
}
.contacts__blocks_requisites p {
font: 14px/21px Roboto light;
color: #656565;
margin: 30px 0 0 0;
}
.contacts__blocks_requisites p span {
font: 400 14px/21px Roboto medium;
color: #656565;
}
.shops__st {
border-bottom: 1px solid #ded9f1;
padding: 20px 0;
}
.shops__st:last-child {
border: none;
}
.shops__st h2 {
font: 500 12px/12px Roboto bold;
color: var(--main-color-grafit);
text-transform: uppercase;
margin: 0;
padding: 20px 0;
}
.shops__st p {
font: 14px/24px Roboto light;
color: #000;
margin: 0;
display: inline-block;
}
.shops__st p span {
font: 400 14px/24px Roboto medium;
color: var(--main-color-grafit);
}
.shops__st_block-name {
width: 40%;
display: inline-block;
vertical-align: top;
}
.shops__st_block {
width: 19%;
display: inline-block;
vertical-align: top;
}
.shops__time_open i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 85.51724137931035% 75.6563245823389%;
width: 33px;
height: 33px;
display: inline-block;
margin-right: 20px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
animation-duration: .5s;
-webkit-animation-duration: .5s;
-webkit-animation-fill-mode: both;
-webkit-animation-name: basket;
animation-name: basket;
}
.shops__time_close i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 23.908045977011493% 89.02147971360382%;
width: 33px;
height: 33px;
display: inline-block;
margin-right: 20px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
animation-duration: .5s;
-webkit-animation-duration: .5s;
-webkit-animation-fill-mode: both;
-webkit-animation-name: basket;
animation-name: basket;
}
.actions__carousel {
max-width: 1240px;
margin: -45px auto 40px;
padding: 0 10px;
}
.actions__home-stock {
width: 100% !important;
max-width: 700px !important;
min-width: 150px !important;
}
.actions__sale-blocks {
margin-top: -80px;
}
.actions__sale {
width: 32%;
margin-right: 1.4%;
margin-bottom: 20px;
height: 300px;
overflow: hidden;
background: #fff;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
display: inline-block;
padding: 30px 20px;
position: relative;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.actions__sale:nth-child(3n+3) {
margin-right: 0;
}
.actions__sale h2 {
font: 400 14px/21px Roboto bold;
color: var(--main-color-grafit);
text-decoration: none;
text-transform: uppercase;
}
.actions__sale p {
font: 12px/21px Roboto light;
color: #000;
margin: 0;
display: inline-block;
text-decoration: none;
padding: 20px 0;
}
.actions__sale>div>span {
font: 400 14px/21px Roboto medium;
color: #000;
position: absolute;
bottom: 30px;
left: 20px;
}
.actions__sale_href {
font: 400 14px/21px Roboto medium;
color: var(--main-color-grafit);
text-decoration: none;
position: absolute;
bottom: 30px;
right: 20px;
}
.actions__sale a {
text-decoration: none;
}
.about__cover-no-parallax {
width: 100%;
max-width: 1080px;
height: auto;
margin: 50px 0 80px 0;
display: none;
}
.about__cover-no-parallax img {
width: 100%;
}
.about__parallax {
width: 100%;
max-width: 1000px;
margin: 40px auto 80px auto;
height: 340px;
-moz-box-sizing: border-box;
box-sizing: border-box;
position: relative;
padding: 40px 0;
}
.about__parallax_title-name-1 {
position: absolute;
top: 125px;
left: 63px;
z-index: 10;
}
.about__parallax_title-name-2 {
position: absolute;
top: 124px;
left: 463px;
z-index: 15;
}
.about__block-text {
padding: 0 0 50px 0;
border-bottom: 1px solid #ded9f1;
}
.about__block-text_text {
width: 64%;
display: inline-block;
vertical-align: top;
}
.about__block-text_text h2 {
font: 400 13px/21px Roboto bold;
color: var(--main-color-grafit);
text-transform: uppercase;
margin-bottom: 20px;
}
.about__block-text_text p {
font: 14px/21px Roboto light;
color: var(--main-color-grafit);
margin: 0;
display: inline-block;
width: 40%;
vertical-align: top;
margin-right: 10%;
}
.about__block-text_text p:nth-child(3) {
margin-right: 0;
}
.about__block-text_li {
width: 34%;
display: inline-block;
vertical-align: top;
padding: 0 0 0 50px;
border-left: 1px solid #ded9f1;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.about__block-text_li h2 {
font: 400 13px/21px Roboto bold;
color: var(--main-color-grafit);
text-transform: uppercase;
margin-bottom: 20px;
}
.about__block-text_li p {
font: 14px/21px Roboto light;
color: var(--main-color-grafit);
margin: 0;
margin-bottom: 20px;
}
.about__block-text_li ul li {
font: 14px/21px Roboto light;
color: var(--main-color-grafit);
list-style-type: disc;
margin-bottom: 20px;
}
.about__block-logos {
padding: 50px 0 0 0;
}
.about__block-logos_info {
width: 30%;
display: inline-block;
vertical-align: top;
}
.about__block-logos_info-text {
height: 620px;
}
.about__block-logos_info h2 {
font: 400 13px/21px Roboto bold;
color: var(--main-color-grafit);
text-transform: uppercase;
margin-bottom: 20px;
}
.about__block-logos_info p {
font: 14px/21px Roboto light;
color: var(--main-color-grafit);
margin: 0 20px 20px 0;
}
.about__block-logos_wrap {
width: 69%;
display: inline-block;
vertical-align: top;
padding: 0 0 0 40px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.about__block-logos_wrap h2 {
font: 400 13px/21px Roboto bold;
color: var(--main-color-grafit);
text-transform: uppercase;
margin-bottom: 20px;
}
.about__block-logos_wrap p {
font: 14px/21px Roboto light;
color: var(--main-color-grafit);
margin: 0;
margin-bottom: 20px;
}
.about__block-logos_item {
width: 23%;
max-width: 180px;
height: auto;
background: #fff;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
overflow: hidden;
display: inline-block;
margin: 0 1.6% 20px 0;
}
.about__block-logos_item:nth-child(4n+6) {
margin: 0 0 20px 0;
}
.about__block-logos_item img {
width: 100%;
vertical-align: middle;
}
.el-1 {
position: absolute;
top: 145px;
z-index: 1;
}
.el-2 {
position: absolute;
top: 0;
left: 120px;
z-index: 1;
}
.el-3 {
position: absolute;
top: 202px;
left: 263px;
z-index: 11;
}
.el-4 {
position: absolute;
top: 0px;
left: 327px;
z-index: 1;
}
.el-5 {
position: absolute;
top: 157px;
left: 338px;
z-index: 11;
}
.el-6 {
position: absolute;
top: 298px;
left: 332px;
z-index: 1;
}
.el-7 {
position: absolute;
top: 12px;
left: 549px;
z-index: 16;
}
.el-8 {
position: absolute;
top: 194px;
left: 577px;
z-index: 1;
}
.el-9 {
position: absolute;
top: 217px;
left: 685px;
z-index: 16;
}
.el-10 {
position: absolute;
top: 77px;
left: 835px;
z-index: 16;
}
.el-11 {
position: absolute;
top: 174px;
left: 864px;
z-index: 16;
}
.vacancies {
height: 400px;
min-height: 400px;
margin-top: 40px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.vacancies__block-car {
width: 59%;
display: inline-block;
-moz-box-sizing: border-box;
box-sizing: border-box;
overflow: hidden;
vertical-align: top;
}
.vacancies__block-car img {
max-height: 400px;
height: 100%;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.vacancies__block-text {
width: 40%;
display: inline-block;
padding: 50px 100px 50px 30px;
-moz-box-sizing: border-box;
box-sizing: border-box;
vertical-align: top;
}
.vacancies__block-text h2 {
font: 700 14px/24px Roboto bold;
color: var(--main-color-grafit);
text-decoration: none;
text-transform: uppercase;
}
.vacancies__block-text p {
font: 14px/21px Roboto light;
color: var(--main-color-grafit);
margin: 30px 0;
}
.vacancies__block-text a {
margin: 0 !important;
}
.vacancies__block-text_mob {
display: none;
}
.vacancies__text {
border-top: 1px solid #ded9f1;
border-bottom: 1px solid #ded9f1;
margin: 50px 0;
padding: 40px 22%;
-moz-box-sizing: border-box;
box-sizing: border-box;
text-align: center;
}
.vacancies__text p {
font: 14px/21px Roboto light;
color: #434343;
margin: 0;
}
.vacancies__click {
text-align: center;
}
.vacancies__click a {
margin: 0;
}
.trade-marks__carousel {
max-width: 1240px;
width: 100%;
margin: -40px auto 0 auto;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0 10px 0 10px;
}
.trade-marks__block-logos_item {
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
overflow: hidden;
}
.trade-marks__block-logos_item img {
width: 100%;
}
.trade-marks__block-logos_item:hover {
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.12);
-webkit-transition: all .3s ease;
-moz-transition: all .3s ease;
transition: all .3s ease;
}
.trade-marks__active {
background: #ffffff;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
color: #d8254c !important;
border: 1px solid #fff !important;
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.12);
-webkit-transition: all .3s ease;
-moz-transition: all .3s ease;
transition: all .3s ease;
}
.trade-marks__en {
max-width: 1240px;
width: 100%;
margin: 0 auto;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0 0 0 20px;
position: relative;
}
.trade-marks__en a {
width: 60px;
height: 60px;
border: 1px solid #d8d4e9;
font: 400 18px/62px Roboto bold;
color: var(--main-color-grafit);
text-decoration: none;
text-transform: uppercase;
margin: 0 15px 16px 0;
display: inline-block;
text-align: center;
overflow: hidden;
}
.trade-marks__en a:hover {
background: #ffffff;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
color: #d8254c;
border: 1px solid #fff;
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.12);
-webkit-transition: all .3s ease;
-moz-transition: all .3s ease;
transition: all .3s ease;
}
.trade-marks__ru {
max-width: 1240px;
width: 100%;
margin: 0 auto;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0 0 0 20px;
margin-top: 40px;
}
.trade-marks__ru a {
width: 60px;
height: 60px;
border: 1px solid #d8d4e9;
font: 400 18px/62px Roboto bold;
color: var(--main-color-grafit);
text-decoration: none;
text-transform: uppercase;
margin: 0 15px 16px 0;
display: inline-block;
text-align: center;
overflow: hidden;
}
.trade-marks__ru a:hover {
background: #ffffff;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
color: #d8254c;
border: 1px solid #fff;
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.12);
-webkit-transition: all .3s ease;
-moz-transition: all .3s ease;
transition: all .3s ease;
}
.trade-marks__num {
max-width: 1240px;
width: 100%;
margin: 40px auto;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0 0 0 20px;
}
.trade-marks__num a {
width: 60px;
height: 60px;
border: 1px solid #d8d4e9;
font: 400 18px/62px Roboto bold;
color: var(--main-color-grafit);
text-decoration: none;
text-transform: uppercase;
margin: 0 15px 16px 0;
display: inline-block;
text-align: center;
overflow: hidden;
}
.trade-marks__num a:hover {
background: #ffffff;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
color: #d8254c;
border: 1px solid #fff;
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.12);
-webkit-transition: all .3s ease;
-moz-transition: all .3s ease;
transition: all .3s ease;
}
.trade-marks__mobile {
max-width: 1240px;
width: 100%;
margin: 0 auto;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0 0 0 20px;
display: none;
}
.trade-marks__mobile a {
width: 60px;
height: 60px;
border: 1px solid #d8d4e9;
font: 400 18px/62px Roboto bold;
color: var(--main-color-grafit);
text-decoration: none;
text-transform: uppercase;
margin: 0 15px 16px 0;
display: inline-block;
text-align: center;
overflow: hidden;
}
.trade-marks__mobile a:hover {
background: #ffffff;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
color: #d8254c;
border: 1px solid #fff;
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.12);
-webkit-transition: all .3s ease;
-moz-transition: all .3s ease;
transition: all .3s ease;
}
.trade-marks__content {
max-width: 1200px;
width: 100%;
margin: 0 auto;
border-top: 1px solid #ded9f1;
padding: 40px 0 40px 0;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.trade-marks__content_letter {
width: 20%;
display: inline-block;
vertical-align: top;
font: 400 48px/48px Roboto bold;
color: var(--main-color-grafit);
text-decoration: none;
text-transform: uppercase;
padding: 0 20px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.trade-marks__content_result {
width: 79%;
display: inline-block;
vertical-align: top;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-column-width: 200px;
-moz-column-width: 200px;
column-width: 200px;
-webkit-column-count: 3;
-moz-column-count: 3;
column-count: 3;
-webkit-column-gap: 30px;
-moz-column-gap: 30px;
column-gap: 30px;
}
.trade-marks__content_result a {
font: 300 14px/43px Roboto medium;
color: var(--main-color-grafit);
text-decoration: none;
text-transform: uppercase;
display: block;
}
.tire {
/*width: 100%;*/
/*position: relative;*/
margin-bottom: 20px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.tire__content {
/*width: 100%;*/
max-width: 1200px;
margin: 0 auto;
/*position: relative;*/
/*overflow: hidden;*/
-moz-box-sizing: border-box;
box-sizing: border-box;
display: flex;
justify-content: center;
/*flex-wrap: wrap;*/
}
/* .tire__content_active:after {
content: '';
width: 100%;
height: 4px;
background: var(--main-color-grafit);
position: absolute;
bottom: 0;
} */
.tire__content h2 {
font: 400 12px/21px Roboto bold!important;
color: var(--main-color-grafit);
text-transform: uppercase;
text-align: center;
}
.tire__content_tire {
min-width: 150px;
height: 110px;
border-right: 1px solid #d8d4e9;
position: relative;
float: left;
overflow: hidden;
-moz-box-sizing: border-box;
box-sizing: border-box;
cursor: pointer;
flex: 1 1 300px;
border-bottom: 1px solid #d8d4e9;
text-decoration: none;
}
@media screen and (max-width: 620px) {
.tire__content_tire {
border-right: none;
}
.tire > .tire__content {
/*display: none;*/
}
}
.tire__content_tire i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 20.448877805486283% 43.63636363636363%;
width: 43px;
height: 43px;
display: block;
margin: 0px auto 15px auto;
background-size: 300px;
}
.tire__content_inspection {
min-width: 250px;
height: 180px;
border-right: 1px solid #d8d4e9;
position: relative;
float: left;
overflow: hidden;
-moz-box-sizing: border-box;
box-sizing: border-box;
cursor: pointer;
border-bottom: 1px solid #d8d4e9;
text-decoration: none;
}
.tire__content_inspection i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 0 64.93506493506493%;
width: 67px;
height: 67px;
display: block;
margin: 40px auto 20px auto;
}
.tire__content_service {
min-width: 125px;
height: 110px;
position: relative;
float: left;
overflow: hidden;
-moz-box-sizing: border-box;
box-sizing: border-box;
cursor: pointer;
flex: 1 1 300px;
border-bottom: 1px solid #d8d4e9;
text-decoration: none;
}
.tire__content_service i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 72.84788029925187% 17.4025974025974%;
width: 43px;
height: 43px;
display: block;
margin: 0px auto 15px auto;
background-size: 300px;
}
.tire__wrap {
position: relative;
padding-bottom: 20px;
}
.tire__wrap h2 {
font: 400 12px/18px Roboto bold;
color: var(--main-color-grafit);
text-transform: uppercase;
text-align: center;
}
.tire__wrap_step {
width: 64px;
/*position: absolute;*/
/*top: 370px;*/
/*left: 20px;*/
text-align: center;
float: left;
}
.tire__wrap_step h2 {
font: 400 48px/48px Roboto medium;
color: var(--main-color-grafit);
text-transform: uppercase;
padding: 13px 0px;
border: 4px solid var(--main-color-grafit);
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.tire__wrap_step span {
font: 400 12px/48px Roboto bold;
color: var(--main-color-grafit);
text-transform: uppercase;
}
.tire__wrap_description {
text-align: center;
width: 100%;
padding: 20px 0;
}
.tire__wrap_description i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 61.29818780889621% 33.944954128440365%;
width: 12.75px;
height: 16px;
display: inline-block;
vertical-align: middle;
}
.tire__wrap_description p {
font: 300 14px/21px Roboto light;
color: var(--main-color-grafit);
display: inline-block;
}
.tire__about {
width: 50%;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 40px 5% 10px 5%;
}
.tire__about_wrap {
min-height: 620px;
display: flex;
height: auto!important;
}
.tire__about h1 {
font: 400 14px/21px Roboto bold;
color: var(--main-color-grafit);
text-transform: uppercase;
}
.tire__about h2 {
font: 400 14px/21px Roboto bold;
color: var(--main-color-grafit);
text-transform: uppercase;
}
.tire__about p {
font: 14px/21px Roboto light;
color: var(--main-color-grafit);
margin: 20px 0;
}
.tire__about_icons {
width: 32%;
display: inline-block;
text-align: center;
vertical-align: top;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 40px 0 20px 0;
}
.tire__about_icons p {
font: 300 14px/21px Roboto light;
color: var(--main-color-grafit);
}
.tire__about_icons:nth-child(2) i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 61.83495145631068% 63.13131313131313%;
width: 56px;
height: 56px;
display: block;
margin: 0 auto 20px auto;
}
.tire__about_icons:nth-child(3) i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 87.16504854368932% 56.58838383838384%;
width: 56px;
height: 56px;
display: block;
margin: 0 auto 20px auto;
}
.tire__about_icons:nth-child(4) i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 87.16504854368932% 42.446969696969695%;
width: 56px;
height: 56px;
display: block;
margin: 0 auto 20px auto;
}
.tire__about_icons:nth-child(5) i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 87.18409361268239% 0;
width: 56.09px;
height: 56.09px;
display: block;
margin: 0 auto 20px auto;
}
.tire__about_icons:nth-child(6) i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 48.23015294974508% 63.14087993130272%;
width: 56.1px;
height: 56.06px;
display: block;
margin: 0 auto 20px auto;
}
.tire__about_icons:nth-child(7) i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 13.592233009708737% 80.05050505050505%;
width: 56px;
height: 56px;
display: block;
margin: 0 auto 20px auto;
}
.tire__about_icons:nth-child(8) i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 0 80.05050505050505%;
width: 56px;
height: 56px;
display: block;
margin: 0 auto 20px auto;
}
.tire__about_icons:nth-child(9) i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 87.16504854368932% 28.305555555555557%;
width: 56px;
height: 56px;
display: block;
margin: 0 auto 20px auto;
}
.tire__about_icons:nth-child(10) i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 87.16504854368932% 14.164141414141413%;
width: 56px;
height: 56px;
display: block;
margin: 0 auto 20px auto;
}
.tire__about_text {
border-bottom: 1px solid #d8d4e9;
padding: 0 0 20px 0;
margin-bottom: 40px;
}
.tire__percent_block {
width: 32%;
display: inline-block;
text-align: center;
vertical-align: top;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 10px 0;
}
.tire__percent_block span {
border: 2px solid var(--main-color-grafit);
width: 64px;
height: 64px;
-webkit-border-radius: 35px;
-moz-border-radius: 35px;
border-radius: 35px;
display: inline-block;
text-align: center;
font: 300 24px/64px Roboto light;
color: var(--main-color-grafit);
}
.tire__percent_block:nth-child(3) span {
border: 2px solid #e31d4d;
}
.tire__time {
width: 100%;
max-width: 1000px;
margin: 0 auto;
padding: 20px 10px 14px;
overflow: hidden;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.tire__time > div {
display: flex;
flex-wrap: wrap;
}
.tire__time > div > div {
display: flex;
flex-wrap: wrap;
}
.tire__time > div > div > div:first-child {
}
.tire__time > div > div .shinka_cars {
/*height: 120px;*/
justify-content: center;
flex-grow: 1;
flex-shrink: 1;
flex-basis: 50%;
flex-wrap: wrap;
font-size: 10px;
}
.tire__time > div > div .shinka_cars p {
/*text-align: right;*/
flex: 1 1 100%;
width: 45%;
float: left;
margin: 5px;
}
@media screen and (max-width: 800px) {
.tire__time_wrapper ~ .vacancies__click, .hasDatepicker ~ .vacancies__click, .tire__time ~ .vacancies__click {
position: fixed;
bottom: 0!important;
z-index: 100!important;
/* margin: 0 auto; */
width: 100%!important;
margin-left: -10px!important;
display: flex;
justify-content: center;
}
.tire__time_wrapper ~ .vacancies__click a, .hasDatepicker ~ .vacancies__click a, .tire__time ~ .vacancies__click a{
width: 100%;
margin: 0!important;
border-radius: 0!important;
padding: 20px 34px!important;
border-top: 2px solid white;
border-left: 1px solid white;
border-right: 1px solid white;
font: 400 18px/16px Roboto medium !important
}
.tire__about_wrap {
flex-direction: column;
}
.tire__about {
width: 100%;
}
}
.tire__time > div > div .shinka_price {
height: 150px;
display: flex!important;
flex-direction: column;
flex-wrap: wrap;
width: 100%!important;
padding:10px!important;
align-content: space-between;
}
.tire__time > div > div:nth-child(2) .shinka_price {
height: 140px;
}
@media screen and (max-width: 530px) {
.tire__time > div > div .shinka_price {
height: auto!important;
max-height: 140px;
}
.tire__time > div > div:nth-child(1) .shinka_price {
max-height: 150px;
}
}
.tire__time_block {
width: 23%;
margin: 0 1% 6px 1%;
float: left;
text-align: center;
position: relative;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.tire__time_block span {
border: 1px solid #d8d4e9;
width: 100%;
padding: 16px 0;
display: block;
-moz-box-sizing: border-box;
box-sizing: border-box;
cursor: pointer;
font: 400 18px/18px Roboto bold;
color: var(--main-color-grafit);
}
#filter-duration {
line-height: 30px;
text-align: center;
}
.filter-duration {
border: 1px solid #d8d4e9;
padding: 6px 12px;
display: inline-block;
cursor: pointer;
font: 400 18px/18px Roboto bold;
color: var(--main-color-grafit);
text-align: center;
margin: 10px;
width: 66px;
}
.filter-duration.active {
background: #fff;
}
.tire__time_block span:hover {
background: #fff;
}
.tire__time_active {
position: relative;
}
.tire__time_active span {
display: block;
-moz-box-sizing: border-box;
box-sizing: border-box;
cursor: pointer;
font: 400 18px/18px Roboto bold;
background: #fff;
color: #d8254c;
}
.tire__time_occupied {
pointer-events: none;
}
.tire__time_occupied span {
color: #cac4e3;
}
.tire__time_occupied span:after {
content: '';
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 61.29818780889621% 33.944954128440365%;
width: 12.75px;
height: 16px;
position: absolute;
top: 6px;
right: 6px;
}
.tire__time_occupied span:hover {
background: transparent;
cursor: not-allowed;
}
.tire__time_input {
width: 48%;
margin: 20px 0 0 0;
display: inline-block;
}
.tire__time_input:nth-child(2n) {
margin-right: 2.8%;
}
.tire__time_label {
text-align: center;
display: block;
margin: 40px 0 20px;
}
.tire__time_checkbox {
display: block;
margin-bottom: 20px;
vertical-align: middle;
}
.tire__time_checkbox input {
float: left;
}
.tire__time_checkbox span {
text-align: left;
padding: 4px 20px 0 0;
vertical-align: top;
vertical-align: -webkit-baseline-middle;
}
.order {
width: 100%;
max-width: 1240px;
padding: 40px 20;
-moz-box-sizing: border-box;
box-sizing: border-box;
border-top: 1px solid #d8d4e9;
margin-top: 40px;
}
.order__title-step {
display: flex;
justify-content: center;
flex-wrap: wrap;
}
.order__title-step a {
font: 300 14px/21px Roboto light;
color: var(--main-color-grafit);
text-decoration: none;
margin: 0 0px;
transition: background .5s ease-in-out, color .3s ease-in-out;
padding: 10px 24px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
display: block;
}
.order__title-step a:hover{
background: #b2accb;
color: #fff;
}
.order_not_exist{
text-align: center;
width:100%;
background: #fff;
border-radius: 5px;
padding:40px 40px 40px 40px;
font-size:24px;
color: var(--main-color-grafit);
position: relative;
margin-top:40px;
}
/*.order_not_exist::after{*/
/*content:":(";*/
/*position: absolute;*/
/*top:65px;*/
/*left:50%;*/
/*margin-left:-25px;*/
/*padding:10px;*/
/*-moz-transform: rotate(90deg); !* Для Firefox *!*/
/*-ms-transform: rotate(90deg); !* Для IE *!*/
/*-webkit-transform: rotate(90deg); !* Для Safari, Chrome, iOS *!*/
/*-o-transform: rotate(90deg); !* Для Opera *!*/
/*transform: rotate(90deg);*/
/*border: 1px solid var(--main-color-grafit);*/
/*border-radius: 50%;*/
/*}*/
.order__step {
left: 0px;
}
.order__input {
margin-top: 20px;
}
.order__input_click {
margin-top: 30px;
}
.order__input_pass {
display: block;
margin-top: 20px;
position: relative;
}
.order__input_pass:after {
content: '';
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 61.29818780889621% 33.944954128440365%;
width: 12.75px;
height: 16px;
position: absolute;
top: 13px;
right: 20px;
}
.order__wrap {
width: 100%;
max-width: 600px;
margin: 0 auto;
position: relative;
overflow: hidden;
}
.order__wrap h2 {
font: 400 14px/21px Roboto bold;
color: var(--main-color-grafit);
padding: 0 10px;
}
.order__wrap_block {
width: 50%;
-moz-box-sizing: border-box;
box-sizing: border-box;
float: left;
padding: 30px 10px;
}
.order__wrap_block p {
font: 300 14px/21px Roboto light;
color: var(--main-color-grafit);
margin: 0 0 30px 0;
}
.order__wrap_forgot {
float: right;
line-height: 22px;
text-decoration: none;
}
.order__checkbox {
margin: 20px 0;
display: block;
}
.order__radio {
display: block;
position: relative;
margin-bottom: 20px;
}
.order__radio_price {
display: inline-block;
margin-right: 15px;
}
.order__radio input {
position: absolute;
left: 0;
top: 0;
}
.order__radio span {
vertical-align: top;
letter-spacing: normal;
padding: 2px 0 0 30px;
display: block;
font: 300 14px/21px Roboto light;
color: var(--main-color-grafit);
}
.order__select {
background: #ffffff url('../../../../../../../../design/themes/avtoopt/media/svg/arrow_menu.svg?1759911146') no-repeat;
background-position: 94% 17px;
padding: 0 30px 0 20px;
}
.order__vk {
display: inline-block;
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 72.94835680751174% 60.97560975609756%;
width: 42px;
height: 42px;
margin-right: 20px;
}
.order__facebook {
display: inline-block;
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 41.34507042253521% 24.634146341463413%;
width: 42px;
height: 42px;
}
.order__twitter {
display: inline-block;
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 68.57276995305165% 49.02439024390244%;
width: 42px;
height: 42px;
}
.order__add {
margin-bottom: 20px;
}
.order__payment {
width: 33%;
float: left;
position: relative;
text-align: center;
padding: 50px 25px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.order__payment-wrap {
width: 100%;
overflow: hidden;
}
.order__payment label {
text-align: left;
}
.order__payment_1 {
display: inline-block;
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 0 45.4054054054054%;
width: 82px;
height: 82px;
margin-bottom: 34px;
}
.order__payment_2 {
display: inline-block;
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 0 26.233766233766232%;
width: 90.63px;
height: 67px;
margin-bottom: 36px;
margin-top: 13px;
}
.order__payment_3 {
display: inline-block;
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 55.79571730169901% 0;
width: 70.12px;
height: 82px;
margin-bottom: 33px;
}
.order__textarea {
height: 120px;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
padding: 20px;
margin-top: 30px;
}
input[type="radio"]:focus {
outline: none;
}
input[type="radio"] {
display: none;
-webkit-appearance: none;
}
input[type="radio"] {
display: inline-block;
vertical-align: middle;
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 39.57977528089888% 33.333333333333336%;
width: 23px;
height: 23px;
cursor: pointer;
border: none;
box-shadow: none;
}
input[type="radio"]:checked {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 44.08539325842697% 86.94638694638695%;
width: 23px;
height: 23px;
}
.vacancies__click p {
font: 300 14px/21px Roboto light;
color: var(--main-color-grafit);
margin: 30px 0;
}
.vacancies__click a {
margin: 0 0 0 60px;
}
.title-step__active {
background: #b2accb;
color: #fff !important;
padding: 10px 24px;
margin: 0 !important;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
}
.delivery {
margin-top: 40px;
overflow: hidden;
height: auto;
}
.delivery__block {
overflow: hidden;
position: relative;
width: 100%;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.delivery__block:nth-child(2n) {
background: #f8f8fb;
}
.delivery__icon {
width: 25%;
float: left;
position: relative;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.delivery__icon_1 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 16.652582393000944% 64.76683937823834%;
width: 65.66px;
height: 66px;
display: block;
margin: 40px auto 20px auto;
}
.delivery__icon_2 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 23.694117647058825% 26.16580310880829%;
width: 85.5px;
height: 66px;
display: block;
margin: 40px auto 20px auto;
}
.delivery__icon_3 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 33% 64.76683937823834%;
width: 66px;
height: 66px;
display: block;
margin: 40px auto 20px auto;
}
.delivery__icon_4 {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 55.53470919324578% 21.243523316062177%;
width: 68.25px;
height: 66px;
display: block;
margin: 40px auto 20px auto;
}
.delivery__text {
width: 75%;
float: left;
padding: 40px 40px 40px 0;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.delivery__text h2 {
font: 400 14px/21px Roboto bold;
color: var(--main-color-grafit);
text-transform: uppercase;
margin-bottom: 20px;
}
.delivery__text p {
display: inline-block;
width: 44%;
margin: 0 5% 0 0;
vertical-align: top;
font: 300 14px/21px Roboto light;
color: var(--main-color-grafit);
}
.lc {
width: 100%;
border-top: 1px solid #d8d4e9;
padding: 0;
-moz-box-sizing: border-box;
box-sizing: border-box;
border-top:none;
}
.lc__button {
position: absolute;
top: -10px;
right: 0;
margin: 0;
}
.lc__button i {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 75.14224671089622% 50.125295997425106%;
width: 23.35px;
height: 17.03px;
display: inline-block;
}
.lc__menu {
width: 25%;
margin-top:20px!important;
float: left;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0 40px 0 0;
display:inline-block;
}
.lc__menu ul {
list-style:none!important;
}
.lc__menu ul li{
list-style:none!important;
margin-left:0!important;
}
.lc__menu_active{
list-style:none!important;
}
.lc__menu{
margin-top:40px;
}
.lc_head{
position: relative;
display: block;
width:100%;
border-bottom: 1px solid #d8d4e9;
padding-bottom: 0px;
}
.lc_head h1{
font:400 12px/16px Roboto bold;
color: var(--main-color-grafit);
text-transform: uppercase;
text-align: left;
padding-left: 12px;
padding-bottom: 15px;
}
.profile-page .ty-mainbox-title {
color: var(--main-color-grafit);
font: 400 12px/16px Roboto bold;
text-transform: uppercase;
padding-bottom: 20px;
}
.profile-page .ty-account h3{
color: var(--main-color-grafit);
}
.profile-page .ty-account input, .profile-page .ty-account select{
margin: 5px 0;
}
.profile-page .ty-account .buttons-container{
float: right;
}
.profile-page .detail-product__content{
background: none;
box-shadow:none;
}
.profile-page .ty-account{
background:#fff;
display:inline-block;
width: 75%;
padding: 20px;
box-shadow: 0px 18px 41.86px 4.14px rgba(0, 0, 0, 0.14);
box-sizing: border-box;
border-radius: 5px;
}
.profile-page .ty-account-detail{
background:#fff;
width: 100%;
padding: 20px;
box-shadow: 0px 18px 41.86px 4.14px rgba(0, 0, 0, 0.14);
box-sizing: border-box;
border-radius: 5px;
font: 400 14px/16px Roboto normal;
margin-top: 40px;
font-family: Roboto;
}
.profile-page .ty-account-detail ul{
list-style: outside;
margin-left:20px;
}
.profile-page .ty-account-detail h4{
color: var(--main-color-grafit);
}
.profile-page .ty-mainbox-body{
white-space: nowrap;
}
.unactive_link{
color:#b8b6cf!important;
opacity: .6;
}
.cm-pagination-container{
display: inline-block;
width:75%;
}
.lc__menu li {
border-bottom: 1px solid #d8d4e9;
}
.lc__menu li:last-child {
border: none;
}
.lc__menu a {
font: 400 12px/16px Roboto bold;
color: var(--main-color-grafit);
text-transform: uppercase;
text-decoration: none;
padding: 16px 0;
display: block;
}
.lc__menu_active {
color: #b8b2cb !important;
}
.lc__wrap {
width: 100%;
float: left;
-moz-box-sizing: border-box;
box-sizing: border-box;
white-space: nowrap;
}
*{
white-space: normal;
}
.lc__wrap_card {
margin-top: 20px;
overflow: hidden;
background: #fff;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.lc__card_title {
padding: 20px;
border-bottom: 1px solid #ebebed;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.lc__card_title p {
font: 300 14px/18px Roboto medium;
color: #161616;
margin: 0;
display: inline-block;
width: 24%;
}
.lc__card_title p span {
font: 300 12px/21px Roboto light;
color: #161616;
margin: 0;
display: block;
}
.lc__card_product {
width: 47%;
float: left;
padding: 20px;
text-align: center;
-moz-box-sizing: border-box;
box-sizing: border-box;
position: relative;
}
.lc__card_info {
width: 50%;
position: relative;
float: left;
padding: 20px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.lc__card_info h2 {
font: 400 12px/21px Roboto bold;
color: var(--main-color-grafit);
text-transform: uppercase;
}
.lc__card_info p {
font: 300 14px/21px Roboto light;
color:var(--main-color-grafit);
margin: 0;
padding: 20px 0;
}
.lc__card_info-button {
margin: 0 0 30px 0;
}
.lc__card {
width: 100%;
border: 1px solid #ebebed;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
-moz-box-sizing: border-box;
box-sizing: border-box;
overflow: hidden;
margin-bottom: 20px;
}
.lc__card_cover {
width: 29%;
display: inline-block;
vertical-align: top;
padding: 20px 0;
}
.lc__card_cover img {
width: 100%;
}
.lc__card_i {
width: 69%;
display: inline-block;
vertical-align: top;
padding: 20px 20px 0 0;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.lc__card_i-button {
margin: 30px auto;
text-align: center;
cursor:pointer;
}
.lc__card_i-title {
font: 300 14px/18px Roboto medium;
color: #161616;
margin: 0 0 20px 0;
display: inline-block;
width: 100% !important;
}
.lc__card_i-title a {
color: var(--main-color-grafit);
}
.lc__card_i p {
font: 300 14px/18px Roboto medium;
color: #161616;
margin: 0 0 20px 0;
display: inline-block;
width: 48%;
text-align: left;
}
.lc__card_i p span {
font: 300 12px/21px Roboto light;
color: #161616;
margin: 0;
display: block;
}
.lc__card_phone {
width: 40px;
height: 40px;
border-radius: 50%;
background: url('../../../../../../../../design/themes/avtoopt/media/../images/phone__white.svg?1759911146') no-repeat var(--main-color-grafit);
background-position: 13px 12px;
font-size: 0;
display: block;
position: absolute;
right: 20px;
}
.lc__card_print {
width: 40px;
height: 40px;
border-radius: 50%;
background: url('../../../../../../../../design/themes/avtoopt/media/../images/print__white.svg?1759911146') no-repeat var(--main-color-grafit);
background-position: 10px 9px;
font-size: 0;
display: block;
position: absolute;
right: 20px;
top: 80px;
}
.lc__messenger {
width: 100%;
height: 200px;
border-top: 1px solid #ebebed;
border-bottom: 1px solid #ebebed;
-moz-box-sizing: border-box;
box-sizing: border-box;
margin: 20px 0 0 0;
overflow: hidden;
position: relative;
}
.lc__messenger_bot {
width: 100%;
padding: 0 35% 0 0;
margin: 10px 0;
display: inline-block;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.lc__messenger_bot p {
font: 300 13px/16px Roboto light;
color: var(--main-color-grafit);
margin: 0;
padding: 14px 30px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
background: #f6f5fb;
display: inline-block;
}
.lc__messenger_client {
width: 100%;
padding: 0 0 0 35%;
margin: 10px -20px;
display: inline-block;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.lc__messenger_client p {
font: 300 13px/16px Roboto light;
color: var(--main-color-grafit);
margin: 0;
padding: 14px 30px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
background: #f6f5fb;
display: inline-block;
float: right;
}
.lc__messenger_form {
position: relative;
width: 100%;
margin: 30px 0 10px 0;
}
.lc__messenger_form-input {
width: 84%;
height: 40px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
border: 1px solid #dfdfdf;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0 20px;
font: 300 14px/21px Roboto light;
box-shadow: none;
outline: 0;
-webkit-appearance: button;
}
.lc__messenger_form-submit {
width: 40px;
height: 40px;
border-radius: 50%;
background: url('../../../../../../../../design/themes/avtoopt/media/../images/messenger.svg?1759911146') no-repeat var(--main-color-grafit);
background-position: 9px 12px;
cursor: pointer;
border: 0;
box-shadow: 0;
margin-left: 20px;
font-size: 0;
top: 0;
right: 0px;
position: absolute;
outline: 0;
}
.mCSB_scrollTools .mCSB_draggerRail {
display: none;
}
.mCSB_draggerContainer {
top: 5px !important;
}
.lc__menu_mobile, .lc__menu_mobile_r {
display: none;
width: 100%;
padding-left: 10px;
padding-top: 6px;
border-radius: 0;
margin-right: 5px;
height: 30px;
}
.lc__menu_mobile--border_left, .lc__menu_mobile--border_right {
display: none;
width: 46%;
border: 1px solid #d8d4e9;
margin-top: 10px;
padding-right: 7px;
float: left;
height: 30px;
overflow: hidden;
}
.lc__menu_mobile--border_right {
float: right;
}
@media screen and (max-width: 580px) {
.order__title-step {
display: none;
}
.lc__menu_mobile, .lc__menu_mobile_r, .lc__menu_mobile--border_left, .lc__menu_mobile--border_right {
display: block;
}
.catalog__category_select {
display: none;
}
.lc__menu_mobile--border_left .catalog__category_select, .lc__menu_mobile--border_right .catalog__category_select {
display: block;
}
}
.clear {
clear: both;
}
.modal__phone {
padding-bottom: 20px !important;
}
.modal__phone select {
margin-top: 20px;
}
.footer-copyright .ty-wysiwyg-content{
max-height:0;
}
#modal-4,
#modal-5,
#modal-6,
#modal-7,
#modal-8 {
position: fixed;
}
/****
* Media
****/
@media screen and (max-width: 1240px) {
.header__menu-catalog-wrap {
border-radius: 0 !important;
}
.catalog__content{
width:72%!important;
}
}
@media screen and (max-width: 1110px) {
.catalog__content_view-cards-tab1 {
display: none;
}
.carousel-products__item_line-min {
display: none;
}
.catalog__item {
width: 47%;
margin: 0 0 20px 2.7%;
}
.catalog__filter-line {
text-align: left;
margin-top: 40px;
}
.catalog__category {
margin: 20px 0 10px;
}
.catalog__content{
width:70%!important;
}
}
@media screen and (max-width: 940px) {
.carousel-products__basket {
height: auto;
}
.carousel-products__basket-cover {
padding-top: 20px;
}
.carousel-products__item_line {
width: 100%;
margin-left: 0%;
}
.catalog__content_open-filter {
display: block;
}
.catalog__filter-line_item {
margin-left: 10px;
}
.catalog__filter {
position: relative;
float:left;
width: 320px;
display: inline-block!important;
}
.catalog__content {
padding: 0;
left:0;
width:100%!important;
}
.js-catalog__content{
left: 50px;
}
.catalog__item {
width: 48%;
margin: 0 0 20px 3%;
}
.catalog__item:nth-child(2n-1) {
margin: 0 0 20px 0;
}
.detail-product__bread-crumbs {
/*display: none;*/
}
.detail-product__content_title {
/*display: none;*/
}
.detail-product__content_title-940 {
display: block;
}
.detail-product__content_cover {
max-width: 940px;
width: 100%;
padding: 30px 0 20px;
}
.detail-product__content_info,
.detail-product__content_title-940 {
width: 100%;
padding: 0 30px 0 30px;
}
.detail-product__slider-item {
display: inline-block;
}
.slider-n {
max-width: 800px;
position: relative;
top: 0;
left: 0px;
width: 100%;
margin: 0 auto;
display: inline-table;
text-align: center;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.header__sub-menu-wrap a {
margin: 0 10px;
}
.header__menu-catalog-wrap-category a {
width: 25%;
}
.mobile-menu-nav-left {
display: block;
}
.home__promo-ya {
display: flex;
flex-wrap: wrap;
}
.home__blocks-orders {
max-width: none;
width: 52%;
/*display: inline-block;*/
/*margin-right: 0;*/
/*float: left;*/
order:10!important;
margin-right: 0;
margin-top: 20px;
}
.home__banner {
width: 100%;
order:2!important;
}
.home__stock {
float: left;
max-width: none;
min-width: 280px;
width: 45%;
}
.footer__item {
width: 40%;
}
.footer__item:nth-child(3) {
display: none;
}
.footer__item:nth-child(2) {
width: 30%;
}
.footer__item:nth-child(4) {
width: 30%;
}
}
.header__sub-menu .header__common-search-form.mobile-search {
display: none;
}
@media screen and (max-width: 810px) {
.header__sub-menu {
display: flex;
}
.header__sub-menu-wrap {
display: none;
}
.header__sub-menu .header__common-search-form.mobile-search {
display: flex;
max-width: none;
}
.header__sub-menu .header__common-search-form.mobile-search .header__common-search-form--input{
width:auto;
margin:0;
}
.header__sub-menu .header__common-search-form.mobile-search .header__common-search-form--submit{
right: 20px;
background: url('../../../../../../../../design/themes/avtoopt/media/../../../../images/mobile--search.svg?1759911146') no-repeat;
background-position: 30px 10px;
padding: 0;
border-left: 1px solid #dfdfdf;
border-radius: 0;
width: 65px;
height: 40px;
}
.header__sub-menu-search-buttom {
display: block;
}
.header__mobile-search {
display: block;
}
.header__common {
height: 70px;
padding: 23px 20px;
}
.header__common-menu-buttom {
display: block;
}
.header__common-search {
display: none;
}
.header__common-basket {
top: 16px;
}
.header__common-logo {
width: 140px;
height: 27px;
margin: 0 auto;
/*background-size: 100%;*/
}
.header__common-phone {
display: none;
}
.header__common-phone-mobile {
width: 80px;
height: 40px;
border-radius: 0;
border: none;
border-right: 1px solid #dfdfdf;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 11px;
cursor: pointer;
}
.header__common-phone-mobile i {
margin: 0 auto;
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 86.66666666666667% 80.64516129032258%;
width: 18px;
height: 18px;
display: block;
}
.header__sub-menu-wrap {
text-align: center;
}
.header__sub-menu-wrap a:not(:last-child) {
display: none;
}
.header__sub-menu-wrap-phone {
position: relative;
}
.header__menu-wrap ul li:not(:first-child) {
display: none;
}
.js-open__catalog--sales {
display: inline-block !important;
}
.js-open__catalog--sales .menu-wrapper {
left: 0;
position: absolute;
width: 100%;
}
.js-open__catalog--sales .menu-top-level {
display: flex;
max-width: 100%;
width: 100%;
}
.js-open__catalog--sales .menu-top-level li a {
width: auto;
}
.header__menu-wrap ul li a {
padding: 16px 14px 17px;
}
.header__menu-catalog-wrap-popular {
height: 150px;
border: none;
}
.header__menu-catalog-wrap-popular a {
width: 50%;
height: 150px;
font: 700 10px/21px Roboto bold !important;
padding: 25px 10px 0 10px;
border-bottom: 1px solid #d8d4e9;
}
.header__menu-catalog-wrap-popular a:nth-child(2) {
border-right: 0;
}
.header__menu-catalog-wrap-category a {
width: 50%;
height: 140px;
font: 700 10px/16px Roboto bold !important;
padding: 25px 10px 0 10px;
border-right: 1px solid #dfdfdf;
border-bottom: 1px solid #dfdfdf;
}
.header__menu-catalog-wrap-category a:nth-child(2n) {
border-right: 0;
}
}
@media screen and (max-width: 760px) {
.catalog__filter-line_item {
display: none;
}
.catalog__filter-line_select {
display: block;
z-index: 900;
}
/*.catalog__category_block {*/
/*display: none;*/
/*}*/
/*.catalog__category_select {*/
/*display: block;*/
/*}*/
.catalog__category {
padding: 25px 0;
}
}
@media screen and (max-width: 724px) {
.carousel-products__basket {
padding: 10px 0;
}
.basket__card_delete-min {
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 18.021978021978022% 53.53075170842825%;
width: 13px;
height: 13px;
position: absolute;
top: 0px;
right: 20px;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
transition: all 0.3s ease;
animation-duration: .5s;
-webkit-animation-duration: .5s;
-webkit-animation-fill-mode: both;
-webkit-animation-name: basket;
animation-name: basket;
}
.carousel-products__basket-cover {
padding-top: 0px;
height: 80px;
border: none;
}
.carousel-products__basket_number {
top: 24px;
float: left;
left: 20px;
width: 120px;
}
.basket__card_delete {
display: none;
}
.basket__card h2 {
width: 100%;
padding: 0 20px 0 90px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.basket__card h3 {
margin-left: 90px;
}
.basket__card h4,
.basket__card_name-price {
right: 20px!important;
}
.basket__card_naming {
width: 100%;
height: 80px;
-moz-box-sizing: border-box;
box-sizing: border-box;
position: relative;
overflow: hidden;
}
.basket__card_nav {
width: 100%;
height: 80px;
-moz-box-sizing: border-box;
box-sizing: border-box;
position: relative;
border-top: 1px solid #ebeaf0;
}
.detail-product {
padding: 10px;
}
.detail-product__slider-item {
width: 80px;
height: 80px;
}
.detail-product__content_title-940,
.detail-product__content_info {
padding: 0 20px;
}
.detail-product__shops {
float: none;
text-align: left;
right: 0;
display: block;
margin-top: 20px;
}
.header__menu-wrap ul li a {
padding: 16px 14px 17px;
}
.home__promo-ya {
padding: 20px 20px 40px 20px;
}
.home__order-two img {
width: 205px;
top: 55px;
right: 20px;
}
.home__order-one img {
width: 125px;
top: 40px;
right: 25px;
}
.home__banner img {
width: 250px;
margin-left: -125px;
margin-top: -65px;
}
.home__blocks-orders {
width: 100%;
margin-top: 20px;
}
.home__stock {
width: 100%;
margin-right: 0;
}
.home-about__item {
display: none;
}
.home-about__item:nth-child(1) {
width: 100%;
display: block;
border-right: none;
}
.home-about__item p {
padding: 20px 0 0 0;
}
.footer {
display: block;
}
.footer__item {
width: 100%;
text-align: center;
}
.footer__item_logo {
margin: 30px auto;
}
.footer__item_section {
padding: 40px 0 0 0;
}
.footer__item_section h2 {
text-align: left;
}
.footer__item p {
padding: 0 0 10px 0;
}
.footer__item_form {
margin-top: 0px;
margin-bottom: 25px;
}
.footer__item:nth-child(1) {
border-right: 0;
border-bottom: 1px solid #d5d5d7;
padding-bottom: 20px;
}
.footer__item:nth-child(3) {
display: none;
}
.footer__item:nth-child(2) {
display: none;
}
.footer__item:nth-child(4) {
width: 100%;
}
.catalog-wrapper .catalog-column {
width: 100%!important;
}
}
@media screen and (max-width: 510px) {
.carousel-products__item_line {
/*display: none;*/
}
.catalog__content_view-cards-tab1 {
display: none;
}
.catalog__content_view-cards-tab2 {
display: none;
}
.catalog__item {
width: 100%;
margin: 0 0 20px 0;
}
.carousel-products__item img {
/*width: 100%;*/
height: auto;
}
.catalog__paging {
width: 100%;
text-align: center;
}
.detail-product {
/*padding: 40px 10px 50px 10px;*/
padding: 10px;
}
.catalog__filter{
width:260px!important;
visibility: hidden;
}
.js-filter-nav-left{
visibility: visible;
}
}
@media screen and (max-width: 450px) {
.detail-product__content_title-940 h1 {
font: 500 16px/24px Roboto medium;
}
.detail-product__price_buy {
/*margin: 10px 0;*/
}
.detail-product__price_buy-one {
width: 72%;
text-align: center;
}
.detail-product__slider-item {
display: inline-block;
vertical-align: top;
}
.header__sub-menu-wrap a {
display: none;
}
.header__location {
margin-left: -15px;
}
.catalog__filter {
width: 320px;
}
.catalog__filter_reset {
padding: 30px 20%;
}
}
@media screen and (max-width: 356px) {
.header__menu-wrap ul li a {
padding: 16px 8px 17px;
}
}
@media screen and (max-width: 320px) {
.slider-n-mobile {
overflow: hidden;
overflow-x: scroll;
white-space: nowrap;
width: 300px;
padding: 0 10px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
}
@media screen and (max-width: 985px) {
.contacts__info_name {
width: 100%;
text-align: center;
padding-bottom: 40px;
}
.contacts__info_time {
width: 49%;
}
.contacts__info_message {
width: 49%;
}
}
@media screen and (max-width: 660px) {
.contacts__phones {
width: 49%;
margin-bottom: 30px;
}
.contacts__phones:nth-child(3),
.contacts__phones:nth-child(4) {
margin-bottom: 0;
}
.contacts__blocks {
width: 100%;
padding: 40px 0 0 0;
}
.contacts__blocks:nth-child(3) {
padding: 40px 0 80px 0;
}
}
@media screen and (max-width: 560px) {
.contacts__info_time {
width: 100%;
text-align: center;
padding: 40px 0 30px;
border-top: 1px solid #ded9f1;
}
.contacts__info_message {
width: 100%;
text-align: center;
}
.contacts__blocks:nth-child(3) {
padding: 40px 0 0 0;
}
.contacts__blocks_requisites {
width: 100%;
}
}
@media screen and (max-width: 1020px) {
.shops__st_block-name {
width: 24%;
padding: 0 10px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.shops__st_block {
width: 24%;
padding: 0 10px;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
}
@media screen and (max-width: 960px) {
.shops__st_block-name {
width: 100%;
}
.shops__st_block {
width: 32%;
}
}
@media screen and (max-width: 660px) {
.shops__st_block-name {
width: 100%;
margin-bottom: 10px;
}
.shops__st_block {
border-top: 1px solid #eae7f7;
width: 100%;
padding: 10px 0;
}
.shops__st {
text-align: center;
}
}
@media screen and (max-width: 940px) {
.actions__sale {
width: 48.6%;
margin-right: 2%;
}
.actions__sale:nth-child(3n+3) {
margin-right: 2%;
}
.actions__sale:nth-child(2n+2) {
margin-right: 0;
}
.row-fluid
{
position: relative;
white-space:nowrap!important;
}
*{
white-space: normal;
}
}
@media screen and (max-width: 640px) {
.actions__sale {
width: 100%;
margin-right: 0;
}
}
@media screen and (max-width: 1080px) {
.about__cover-no-parallax {
display: block;
}
.about__parallax {
display: none;
}
}
@media screen and (max-width: 850px) {
.about__block-text_text {
width: 100%;
}
.about__block-text_text p {
margin-right: 15%;
}
.about__block-text_li {
width: 100%;
padding: 30px 0 0 0;
border-left: none;
border-top: 1px solid #ded9f1;
margin-top: 30px;
}
.about__block-logos_info {
width: 100%;
}
.about__block-logos_info-text {
height: 380px;
}
.about__block-logos_wrap {
width: 100%;
padding: 0;
}
}
@media screen and (max-width: 650px) {
.about__block-text_text {
width: 100%;
}
.about__block-text_text p {
width: 100%;
margin-right: 0;
}
.about__block-text_li {
width: 100%;
padding: 30px 0 0 0;
}
}
@media screen and (max-width: 410px) {
.about__block-logos_item {
width: 48%;
margin: 0 1.6% 20px 0;
}
.about__block-logos_item:nth-child(4n+6) {
margin: 0 1.6% 20px 0;
}
.about__block-logos_item:nth-child(2n+2) {
margin: 0 0 20px 0;
}
}
@media screen and (max-width: 1124px) {
.vacancies__block-car {
width: 49%;
}
.vacancies__block-car img {
margin-left: -180px;
}
.vacancies__block-text {
width: 50%;
padding: 50px 50px 50px 30px;
}
}
@media screen and (max-width: 820px) {
.vacancies__block-car {
width: 45%;
}
.vacancies__block-car img {
margin-left: -270px;
}
.vacancies__block-text {
width: 54%;
padding: 50px 50px 50px 30px;
}
.vacancies__text {
padding: 40px 14%;
}
}
@media screen and (max-width: 760px) {
.vacancies__block-car {
width: 100%;
}
.vacancies__block-car img {
margin-left: 0;
width: 100%;
max-width: 620px;
}
.vacancies__block-text {
width: 100%;
padding: 0 50px 50px 30px;
}
.vacancies__text {
padding: 40px 14%;
}
}
@media screen and (max-width: 490px) {
.carousel-products__item_line-cover {
width: 100px!important;
}
.ty-product-list .ty-no-image__icon {
width: 100px!important;
}
.carousel-products__item_line {
padding: 20px 20px 20px 120px;
}
.carousel-products__item_line_shops {
left: 120px!important;
font-size: 10px!important;
}
.carousel-products__item_line h4 {
margin-top: 20px;
font-size: 12px;
}
.carousel-products__item_line_status {
margin-top: 20px;
font-size: 10px;
}
.carousel-products__item_line h2 {
margin-right: 70px!important;
font-size: 9px;
height: 60px!important;
min-height: 60px!important;
margin-bottom: 0;
}
}
@media screen and (max-width: 420px) {
.vacancies__block-car {
width: 100%;
}
.vacancies__block-car img {
margin-left: 0;
width: 100%;
max-width: 620px;
}
.vacancies__block-text {
width: 100%;
padding: 0 20px 30px 20px;
}
.vacancies__block-text_mob {
display: block;
}
.vacancies__block-text_desk {
display: none;
}
.vacancies__text {
padding: 40px 16%;
}
}
@media screen and (max-width: 780px) {
.trade-marks__content_result {
width: 79%;
display: inline-block;
vertical-align: top;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-column-width: 150px;
-moz-column-width: 150px;
column-width: 150px;
-webkit-column-count: 3;
-moz-column-count: 3;
column-count: 3;
-webkit-column-gap: 30px;
-moz-column-gap: 30px;
column-gap: 30px;
}
.trade-marks__content_result a {
font: 300 14px/43px Roboto medium;
color: var(--main-color-grafit);
text-decoration: none;
text-transform: uppercase;
display: block;
}
}
@media screen and (max-width: 736px) {
.trade-marks__num,
.trade-marks__ru,
.trade-marks__en {
display: none;
}
.trade-marks__mobile {
display: block;
}
.trade-marks__content_letter {
width: 100px;
}
.trade-marks__content_result {
width: 200px;
display: inline-block;
vertical-align: top;
-moz-box-sizing: border-box;
box-sizing: border-box;
-webkit-column-width: 150px;
-moz-column-width: 150px;
column-width: 150px;
-webkit-column-count: 1;
-moz-column-count: 1;
column-count: 1;
-webkit-column-gap: 30px;
-moz-column-gap: 30px;
column-gap: 30px;
}
.trade-marks__content_result a {
font: 300 14px/43px Roboto medium;
color: var(--main-color-grafit);
text-decoration: none;
text-transform: uppercase;
display: block;
}
.demo-x .mCSB_draggerContainer {
display: none;
}
}
@media screen and (max-width: 850px) {
.tire__about {
/*width: 100%;*/
}
.tire__about:nth-child(2) {
/*padding: 0 5% 10px;*/
}
.tire__about_icons {
padding: 40px 0 0;
}
}
@media screen and (max-width: 1200px) {
.tire__wrap_step {
position: relative;
margin: 0 auto 20px auto;
top: 0;
left: 0;
}
}
@media screen and (max-width: 490px) {
.ui-datepicker td a,
.ui-datepicker td span {
padding: 21%;
}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {
padding: 37%;
left: -10%;
top: -18%;
}
.tire__about_icons {
width: 49%;
}
.tire__time_block {
margin: 0 1% 24px;
}
.tire__time_block span {
padding: 25px 0;
}
.tire__time_active span {
padding: 34px 0;
left: 1px;
top: 2px;
}
.tire__time_input {
width: 100%;
}
}
@media screen and (max-width: 980px) {
.order__title-step {
text-align: right;
}
}
@media screen and (max-width: 810px) {
.order__wrap {
max-width: 540px;
}
}
@media screen and (max-width: 780px) {
.order__title-step a {
margin: 0;
}
.title-step__active {
padding: 10px 14px;
}
}
@media screen and (max-width: 730px) {
.order__title-step {
margin: 10px 0;
text-align: center;
}
.order__title-step .option_car {
display: none;
}
.lc_check_btn {
font-size: 8px!important;
}
}
@media screen and (max-width: 580px) {
.order__wrap_block {
width: 100%;
}
.cm-pagination-container{
width:100%;
}
.order__payment {
width: 100%;
padding: 20px 25px 0px;
}
.order {
padding: 40px 10px 20px;
}
.order__title-step a span {
display: none;
}
.profile-page .ty-account {
width: 100%!important;
}
}
@media screen and (max-width: 680px) {
.delivery__text p {
width: 100%;
margin-right: 0;
margin-bottom: 10px;
}
}
@media screen and (max-width: 400px) {
.delivery__icon {
width: 100%;
}
.delivery__text {
width: 100%;
padding: 10px 20px 40px 20px;
}
}
@media screen and (max-width: 910px) {
.lc__card_product {
width: 87%;
}
.lc__card_info {
width: 100%;
}
.lc__wrap {
}
.lc__menu {
width: 35%;
}
.lc__card_title p {
font: 300 12px/16px Roboto medium;
color: #161616;
margin: 0;
display: inline-block;
vertical-align: top;
margin-bottom: 20px;
}
.lc__card_title {
padding: 20px 20px 0 20px;
}
}
@media screen and (max-width: 580px) {
.lc__wrap {
width: 100%;
}
.lc__card_product {
width: 100%;
padding-bottom: 0;
}
.lc__card_info {
padding-top: 0;
}
.lc__menu {
width: 100%;
padding: 0;
display: none;
}
.lc__card_info-button {
margin: 15px 0 15px !important;
width: 100%;
-moz-box-sizing: border-box;
box-sizing: border-box;
text-align: center;
}
.lc__card_info h2, .lc__card_info p {
margin-top: 10px;
padding: 0;
}
.lc__card_i-button {
margin: 30px auto !important;
display: table;
}
.lc__card_print {
top: 20px;
right: 70px;
}
.lc__messenger_bot {
padding: 0 15% 0 0;
}
.lc__messenger_client {
padding: 0 0 0 15%;
}
.lc__menu_mobile {
display: block !important;
}
}
/* General styles for the modal */
@media screen and (max-width: 760px) {
#modal-4,
#modal-5,
#modal-6,
#modal-7,
#modal-8,
.md-modal {
position: absolute;
top: 0;
left: 0!important;
width: 100%;
margin-left: 0!important;
max-width: 100%;
}
.photos_360 {
height:240px!important;
}
.md-content {
color: #fff;
background: #fff;
position: relative;
-webkit-border-radius: 0px;
-moz-border-radius: 0px;
border-radius: 0px;
margin: 0 auto;
}
.wrap__modal_mobile {
display: none;
}
.md-overlay {
background: #ffffff;
}
}
.blog-page .detail-product__content {
height: auto !important;
padding: 20px;
min-height: auto;
}
.blog-page h1 {
font: 500 24px/24px Roboto medium;
color: #0b0b0b;
text-decoration: none;
margin: -5px 0;
}
.blog-page .discussion-block {
display: none;
}
.blog-page .actions__sale img {
display: none;
}
.blog-page .actions__sale h2 {
height: 42px;
overflow: hidden;
}
.blog-page .actions__sale .ty-blog__description {
max-height: 164px;
overflow: hidden;
}
.catalog__filter {
display: inline-block;
padding-right: 20px;
}
.hidden {
display: none!important;
}
.profile-page .detail-product__content {
height: auto !important;
}
/*.profile-page h1 {*/
/*font: 500 24px/24px Roboto medium;*/
/*color: #0b0b0b;*/
/*text-decoration: none;*/
/*margin-bottom: 10px;*/
/*}*/
.profile-page{
font:400 12px/16px Roboto bold;
}
.profile-page h3 {
font: 500 20px/20px Roboto medium;
color: #0b0b0b;
text-decoration: none;
margin: 20px 0;
}
.profile-page .detail-product__content:last-child {
height: auto !important;
}
/*.profile-page .buttons-container, .profile-page .ty-checkout-buttons {
margin-top: 40px;
}*/
.buttons-container button,
.buttons-container button:hover{
border: 0 none;
background: var(--main-color-grafit) none repeat scroll 0 0!important;
border-radius: 25px;
color: #fff !important;
display: inline-block;
font: 400 14px/16px Roboto medium !important;
margin: 0 20px 20px;
padding: 11px 34px;
text-decoration: none;
}
.ty-btn__login,
.ty-btn__login:hover,
.ty-btn {
border: 0 none;
background: var(--main-color-grafit) none repeat scroll 0 0!important;
border-radius: 25px;
color: #fff !important;
display: inline-block;
font: 400 14px/16px Roboto medium !important;
text-decoration: none;
padding: 11px 25px;
}
.notification-content strong {
display: block;
}
.notification-content {
position: relative;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 10px 35px 10px 18px;
line-height: 150%;
border-radius: 2px;
}
.notification-container {
position: fixed;
top: 0;
right: 40px;
z-index: 1022;
min-width: 300px;
width: 40%;
}
.alert-error {
border-color: #c0392b;
background: #eb7064;
color: white;
}
.alert-success, .alert-warning, .alert-error {
position: relative;
margin: 7px 0 7px 0;
border: 1px solid;
font-size: 100%;
opacity: 0.96;
}
.alert-error .close {
color: #c0392b;
}
.close {
position: absolute;
top: 5px;
right: 7px;
float: right;
padding: 0;
border: 0;
background: transparent;
font-size: 20px;
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
line-height: 15px;
cursor: pointer;
-webkit-appearance: none;
}
.alert-warning {
border-color:#f39c12;
background:#f5e08c;
color:#ac6e0b;
}
.alert-warning .close {
color:#f39c12;
}
.alert-success {
border-color:#8bc045;
background:#d0eaae;
color:#496e16;
}
.alert-success .close {
color:#8bc045;
}
.ty-step__container h3 {
border-bottom: 1px solid gray;
padding-bottom: 20px;
}
.profile-page label.ty-payments-list__item-title {
display: none;
}
.profile-page .ty-payments-list__item-group {
display: inline-block;
}
.profile-page .checkout-steps {
text-align: left!important;
}
.ty-product-feature {
border-top: 1px dotted #bbb;
clear: both;
padding: 3px 0;
}
.ty-product-feature__value {
float: right;
text-align: right;
}
.catalog__filter_checkbox-title{
font: 300 14px/14px Roboto light;
color: var(--main-color-grafit);
vertical-align: middle;
}
.cm-preview-wrapper .ty-no-image__icon {
background: url('../../../../../../../../design/themes/avtoopt/media/images/cap.png?1759911146') no-repeat scroll 0 0 / contain;
display: block;
height: 300px;
margin: auto;
width: 300px;
}
.ty-grid-list__image .ty-no-image__icon {
background: url('../../../../../../../../design/themes/avtoopt/media/images/cap.png?1759911146') no-repeat scroll 0 0 / contain;
display: block;
height: 200px;
margin: auto;
width: 200px;
}
.ty-product-list .ty-no-image__icon {
background: url('../../../../../../../../design/themes/avtoopt/media/images/cap.png?1759911146') no-repeat scroll 0 0 / contain;
display: block;
height: 150px;
margin: auto;
width: 150px;
}
.lc__wrap_card .ty-no-image__icon {
background: url('../../../../../../../../design/themes/avtoopt/media/images/cap.png?1759911146') no-repeat scroll 0 0 / contain;
display: block;
height: 110px;
width: 110px;
}
@media screen and (max-width: 400px) {
.lc__wrap_card .ty-no-image__icon {
background: url('../../../../../../../../design/themes/avtoopt/media/images/cap.png?1759911146') no-repeat scroll 0 0 / contain;
display: block;
height: 80px;
width: 80px;
}
}
.ty-form-builder .ty-control-group .ty-control-group__title {
display: inline-block;
width: 250px;
}
.ty-form-builder .ty-control-group {
margin: 15px 0;
}
.ty-form-builder .ty-control-group .ty-calendar__block {
display: inline-block;
}
.ty-form-builder .ty-control-group .ty-form-builder__checkbox-label {
display: block;
margin-left: 20px;
}
.cm-range-slider {
display: none;
}
.accordion-border {
position: relative;
}
.tabs__content div {
font: 300 14px/21px Roboto light;
color: #656565;
}
.er404{text-align:center}
.er404 img{max-width:400px;width:100%;margin-top:50px}
.er404 h2{font:700 14px/21px Roboto bold;color:var(--main-color-grafit);text-transform:uppercase;text-decoration:none;margin:50px 0 20px;padding:0 30px}
.er404 p{font:400 14px/21px Roboto light;color:#434343}
.ty-sort-container {
/*display: none;*/
}
.blog-page .detail-product__content div {
font: 14px/21px Roboto light;
color: var(--main-color-grafit);
margin: 0;
display: block;
vertical-align: top;
}
.ui-autocomplete {
z-index: 10000;
background-color: #fff;
/* width: 31%!important;
*/ border-radius: 5px;
box-shadow: 2px 10px 20px rgba(0,0,0,.5);
}
@media screen and (max-width: 1600px) {
.ui-autocomplete {
/*width: 40%!important;*/
}
}
.ui-menu-item {
cursor: pointer;
padding: 5px 15px;
background: white;
color: #656565;
}
.ui-menu-item.ui-state-focus {
background: var(--main-color-grafit);
color: #fff;
}
.ui-autocomplete-category {
color: var(--main-color-grafit);
padding: 20px 15px 5px 15px!important;
}
.detail-product__content_cover-img .ty-pict {
max-width: 100%;
max-height: 500px;
vertical-align: middle;
margin: 0 auto;
/*display: block;*/
}
@media screen and (max-width: 940px) {
.detail-product__content_cover-img .ty-pict {
display: block;
}
}
.ty-checkout__register-methods-hint {
display: none;
}
.ty-password-forgot__a {
position: absolute;
right: 0;
}
.ty-checkout-login-form {
display: table;
}
.ty-checkout-login-form .ty-control-group {
display: table-row;
margin: 10px 0;
}
.ty-checkout-login-form .ty-control-group>* {
display: table-cell;
}
.search-results .carousel-products__item a {
max-height: 180px;
overflow: hidden;
display: block;
text-align: center;
}
.modal__content .help-inline p {
color: red;
padding: 5px 0 0 !important;
}
.help-inline {
color: red;
}
.ty-icon-products-multicolumns {
display: inline-block;
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 6.122448979591836% 100%;
width: 27px;
height: 27px;
margin-left: 20px;
opacity: .3;
}
.ty-icon-products-multicolumns.active,
.ty-icon-products-without-options.active {
opacity: 1;
}
.ty-icon-products-without-options {
display: inline-block;
background: url('../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1759911146') no-repeat;
background-position: 0 100%;
width: 27px;
height: 27px;
margin-left: 20px;
opacity: .3;
}
.basket__card h2 {
height: 20px;
overflow: hidden;
}
.carousel-products__item_line h2 {
margin-right: 95px;
max-height: 40px;
overflow: hidden;
}
.catalog__content {
background: #f3f3f3 none repeat scroll 0 0;
/*z-index: 700;*/
position: relative;
width:78%;
transition: left .5s ease-in-out;
}
div.btn-6.active {
/*font-weight: bold!important;*/
background: #e4e2ee;
border-left: 1px solid #d8254c!important;
/*color: #d8254c!important;*/
}
.icon__car {
height: 50px;
margin: 10px auto;
display: block;
}
.tire__time tr {
cursor: pointer;
font: 400 16px/16px Roboto;
}
.action__01 {
background: #9ed995;
text-align: center;
}
@media screen and (max-width: 760px) {
.action__01 {
height: 520px;
max-height: 440px;
}
}
.action__01 h2 {
font: 500 24px/24px Roboto medium;
top: 20px !important;
left: 20px !important;
color: #272727 !important;
position: absolute;
text-decoration: none;
text-align: left;
}
.action__01 span {
font: 500 14px/21px Roboto light;
top: 50px !important;
left: 20px !important;
color: #272727 !important;
position: absolute;
text-decoration: none;
text-align: left;
}
.action__01_button {
font: 500 14px/21px Roboto medium;
color: #fff;
text-decoration: none;
position: absolute;
bottom: 40px;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
border-radius: 50px;
padding: 8px 20px;
left: 50%;
margin-left: -60px;
background: #75af6a;
}
.action__01_button_2 {
font: 500 14px/21px Roboto medium;
color: #fff;
text-decoration: none;
position: absolute;
bottom: 40px;
-webkit-border-radius: 50px;
-moz-border-radius: 50px;
border-radius: 50px;
padding: 8px 42px;
left: 50%;
margin-left: -80px;
background: #75af6a;
}
.action__01_text {
width: 100%;
padding: 50px 20px;
-moz-box-sizing: border-box;
box-sizing: border-box;
position: absolute;
bottom: 55px;
}
.action__01_text p {
text-align: center;
}
.action__01_text-2 {
width: 100%;
padding: 50px 20px;
-moz-box-sizing: border-box;
box-sizing: border-box;
position: absolute;
bottom: 55px;
}
.action__01_text-2 p {
text-align: center;
font: 600 14px/21px Roboto light;
}
.action__01_img {
top: 180px;
}
.action__02_img {
top: -180px
}
.action__01_i {
top: 45px;
right: -20px;
position: absolute;
}
.action__02_i {
top: -45px;
right: -20px;
position: absolute;
}
.home__stock a {
top: 0;
left: 0;
}
.banner-slider__text {
width: 115px;
height: 40px;
-webkit-border-radius: 0 50px 50px 0;
-moz-border-radius: 0 50px 50px 0;
border-radius: 0 50px 50px 0;
background: #c5ecbf;
position: absolute;
top: 100px;
left: 0;
}
.banner-slider__text div {
position: absolute;
top: 0;
left: 0;
font: 500 14px/21px Roboto medium;
padding: 10px 0 0 20px;
}
.home__stock a {
top: 0;
left: 0;
}
.banner-slider__text {
width: 200px;
height: 40px;
-webkit-border-radius: 0 50px 50px 0;
-moz-border-radius: 0 50px 50px 0;
border-radius: 0 50px 50px 0;
background: #c5ecbf;
position: absolute;
top: 100px;
left: 0;
}
.banner-slider__text div {
position: absolute;
top: 0;
left: 0;
font: 500 14px/21px Roboto medium;
padding: 10px 0 0 20px;
}
.action__01 span {
font: 500 14px/21px Roboto light;
position: absolute;
text-decoration: none;
}
#queue_select_params .tire__time td:last-child,
#queue_select_params_oil .tire__time td:last-child,
#queue_select_service .tire__time td:last-child {
text-align: left;
padding-left: 30px;
}
#queue_select_params div.btn-6,
#queue_select_shinomontazh div.btn-6,
#queue_select_service div.btn-6 {
overflow: hidden;
position: relative;
border: 1px solid #ccc;
height: 200px;
cursor: pointer;
font: 400 16px/16px Roboto;
flex: 1 1 240px;
}
#queue_select_service div.btn-6 {
height: 140px;
}
#queue_select_params div.btn-6 div,
#queue_select_shinomontazh div.btn-6 div,
#queue_select_service div.btn-6 div {
display: table-cell;
padding: 5px;
text-align: center;
vertical-align: middle;
}
#queue_select_params div.btn-6 div:first-child,
#queue_select_shinomontazh div.btn-6 div:first-child,
#queue_select_service div.btn-6 div:first-child {
max-width: 100%;
flex: 1 1 100%;
}
#queue_select_params div.btn-6 div:last-child,
#queue_select_shinomontazh div.btn-6 div:last-child,
#queue_select_service div.btn-6 div:last-child {
width: 40%;
/*text-align: left;*/
padding-left: 30px;
}
#queue_select_params div.btn-6:hover,
#queue_select_shinomontazh div.btn-6:hover,
#queue_select_service div.btn-6:hover {
color: inherit;
}
#queue_select_params,
#queue_select_shinomontazh {
display: none;
}
.cursorshade {
background: url('../../../../../../../../design/themes/avtoopt/media/images/cursorshade.gif?1759911146') repeat !important;
}
.magnifier {
box-shadow: 0 2px 10px #d7d7d7;
}
@media screen and (max-width: 940px) {
.home_last {
width: 100%;
height: 400px;
margin-top: 20px;
}
.catalog__filter{
margin-left: -400px;
transition: margin-left .5s ease-in-out;
display:inline-block!important;
}
.js-filter-nav-left{
display:inline-block!important;
margin-left:0;
}
}
.carousel-products__item .ty-grid-list__image {
max-width: 244px;
margin: auto;
min-height: 180px;
}
.catalog-wrapper {
padding: 20px 0 20px 50px;
clear: both;
margin-bottom: 25px;
overflow: hidden;
}
.catalog-wrapper .catalog-column {
float: left;
width: 24.9%;
}
.catalog-wrapper .catalog-column ul li {
width: 90%;
float: left;
padding: 2px 0;
line-height: 22px;
}
.catalog-wrapper .catalog-column ul li a {
font: 300 14px/43px Roboto medium;
color: var(--main-color-grafit);
text-decoration: none;
text-transform: uppercase;
display: block;
margin-left: 10px;
}
.catalog-wrapper .catalog-column ul li:hover {
background-color: #ccc;
}
.catalog-wrapper .catalog-column ul li .bukva {
font: 300 14px/43px Roboto medium;
margin-left: -10px;
position: absolute;
color: #d8254c;
font-weight: bold;
}
.catalog-wrapper input {
border: 1px solid #ccc;
}
.catalog-wrapper .g_input_error {
border-color: red;
animation-name: example;
animation-duration: 4s;
}
.profile-page .reg-form-ty-account{
width:100%;
display:flex;
border-radius: 0 0 5px 5px;
box-shadow: none;
padding: 0;
overflow: hidden;
}
.profile-page .reg-form-ty-account .reg_form{
flex: 1 1 480px;
/*max-width: 600px;*/
padding: 15px 20px 20px 0;
animation-name: fadeIn;
animation-duration: 1s;
animation-fill-mode: both;
animation-delay: .2s;
}
.profile-page .reg-form-ty-account .reg_form .change{
padding:20px;
}
.profile-page .reg-form-ty-account .reg_form .change input{
display: none;
}
.profile-page .reg-form-ty-account .reg_form .change label{
color: var(--main-color-grafit);
font: 400 12px Roboto bold;
padding:10px 40px;
position: relative;
cursor: pointer;
overflow: hidden;
z-index: 100;
transition: color .3s ease-in-out;
}
.profile-page .reg-form-ty-account .reg_form .change label.change-opt::after,
.profile-page .reg-form-ty-account .reg_form .change label.is_offline_client-n::after{
content: '';
position: absolute;
height: 100%;
width:0;
background: var(--main-color-grafit);
top:0;
right:0;
z-index: -1;
border-radius: 0 20px 20px 0;
transition: width .5s ease-in-out;
}
.profile-page .reg-form-ty-account .reg_form .change #change-opt:checked + .change-opt::after,
.profile-page .reg-form-ty-account .reg_form .change #is_offline_client-n:checked + .is_offline_client-n::after,
.profile-page .reg-form-ty-account #change-client-n:checked + .change-opt::after{
width:100%;
}
.profile-page .reg-form-ty-account .reg_form .change #change-rozn:checked + .change-rozn::after,
.profile-page .reg-form-ty-account .reg_form .change #is_offline_client-y:checked + .is_offline_client-y::after,
.profile-page .reg-form-ty-account #change-opt:checked + .change-opt::after,
.profile-page .reg-form-ty-account #change-client-y:checked + .change-rozn::after{
width:100%;
}
.profile-page .reg-form-ty-account #change-rozn:checked + .change-rozn::after{
width:100%;
}
.profile-page .reg-form-ty-account .reg_form .change #change-opt:checked + .change-opt,
.profile-page .reg-form-ty-account .reg_form .change #is_offline_client-n:checked + .is_offline_client-n,
.profile-page .reg-form-ty-account .reg_form .change #change-client-n:checked + .change-opt{
color: #fff;
}
.profile-page .reg-form-ty-account .reg_form .change #change-rozn:checked + .change-rozn,
.profile-page .reg-form-ty-account .reg_form .change #is_offline_client-y:checked + .is_offline_client-y,
.profile-page .reg-form-ty-account .reg_form .change #change-client-y:checked + .change-rozn {
color: #fff;
}
.profile-page .reg-form-ty-account .reg_form .change label.change-opt::before,
.profile-page .reg-form-ty-account .reg_form .change label.is_offline_client-n::before,
.profile-page .reg-form-ty-account .reg_form .change label.change-opt::before{
content: '';
position: absolute;
height: 100%;
width:100%;
background: #e5e2ef;
top:0;
right:0;
z-index: -1;
border-radius: 0 20px 20px 0;
transition: width .5s ease-in-out;
}
.profile-page .reg-form-ty-account .reg_form .change label.change-opt:hover::after,
.profile-page .reg-form-ty-account .reg_form .change label.is_offline_client-n:hover::after{
width:100%;
}
.profile-page .reg-form-ty-account .reg_form .change label.change-rozn::after,
.profile-page .reg-form-ty-account .reg_form .change label.is_offline_client-y::after{
content: '';
position: absolute;
height: 100%;
width:0;
background: var(--main-color-grafit);
top:0;
left:0;
z-index: -1;
border-radius: 20px 0 0 20px;
transition: width .5s ease-in-out;
}
.profile-page .reg-form-ty-account .reg_form .change label.change-rozn:hover::after,
.profile-page .reg-form-ty-account .reg_form .change label.is_offline_client-y:hover::after{
width:100%;
}
.profile-page .reg-form-ty-account .reg_form .change label.change-rozn::before,
.profile-page .reg-form-ty-account .reg_form .change label.is_offline_client-y::before{
content: '';
position: absolute;
height: 100%;
width:100%;
background: #e5e2ef;
top:0;
left:0;
z-index: -1;
border-radius: 20px 0 0 20px;
}
.profile-page .reg-form-ty-account .reg_form .change label:hover{
color:#fff;
}
.profile-page .reg-form-ty-account .reg_form .change label.change-opt,
.profile-page .reg-form-ty-account .reg_form .change label.is_offline_client-n{
margin-left:-5px;
border-radius: 0 20px 20px 0;
}
.profile-page .reg-form-ty-account .reg_form .change label.change-rozn,
.profile-page .reg-form-ty-account .reg_form .change label.is_offline_client-y{
border-radius: 20px 0 0 20px;
}
.profile-page .reg-form-ty-account .shag{
flex: 1 1 120px;
text-align: center;
animation-name: fadeIn;
animation-duration: 1s;
animation-fill-mode: both;
}
.profile-page .reg-form-ty-account .shag div:nth-child(1){
color: var(--main-color-grafit);
font: 800 16px Roboto bold;
line-height: 0px;
}
.profile-page .reg-form-ty-account .shag div:nth-child(2){
height:120px;
width: 100%;
position: relative;
margin: 20px 0 10px 0;
}
.profile-page .reg-form-ty-account .shag div:nth-child(2)::after{
content: '';
position: absolute;
height: 100%;
width: 6px;
left: 50%;
margin-left: -3px;
top:0;
background: var(--main-color-grafit);
z-index: 0;
}
.profile-page .reg-form-ty-account .shag div:nth-child(3){
color: #d0cbdf;
font: 800 16px Roboto bold;
line-height: 0px;
transition: color .3s ease-in-out .5s;
}
.profile-page .reg-form-ty-account .profiles_register_form{
margin-top: 60px;
flex: 1 1 100%;
opacity: 1;
transition: opacity .5s ease-in-out;
}
.profile-page .reg-form-ty-account .profiles_register_form .opis{
padding: 0 20px 20px 20px;
font: 400 13px/16px Roboto;
color: var(--main-color-grafit);
}
.profile-page .reg-form-ty-account .profiles_register_form_opt{
margin-top: 60px;
/*margin-left: 50%;*/
flex: 1 1 100%;
opacity: 0;
transition: opacity .5s ease-in-out;
}
.profile-page .reg-form-ty-account .profiles_register_form_opt .opis{
padding: 0 20px 20px 20px;
font: 400 13px/16px Roboto;
color: var(--main-color-grafit);
}
.profile-page .reg-form-ty-account .shag div:nth-child(3) > div{
color: #d0cbdf!important;
transition: color .3s ease-in-out .5s;
}
.profile-page .reg-form-ty-account .shag div:nth-child(2)::after{
background: #d0cbdf!important;
}
.profile-page .reg-form-ty-account .shag-active div:nth-child(3) > div{
color: var(--main-color-grafit)!important;
}
.profile-page .reg-form-ty-account .shag-active div:nth-child(3){
color: var(--main-color-grafit)!important;
}
.profile-page .reg-form-ty-account .shag div:nth-child(2)::before{
content: '';
position: absolute;
height: 0;
width: 6px;
left: 50%;
margin-left: -3px;
top:0;
background: var(--main-color-grafit);
z-index: 1;
transition: height .5s ease-in-out;
}
.change .red-text{
color: red;
margin-top:20px;
margin-bottom: 20px;
}
.profile-page .reg-form-ty-account .shag-active div:nth-child(2)::before{
height: 100%;
}
.profile-page .reg-form-ty-account .shag div > div{
font: 800 48px/60px Roboto!important;
}
.profile-page .reg-form-ty-account .reg_form h1{
font: 800 16px/20px Roboto bold;
color: var(--main-color-grafit);
padding: 0 20px;
}
.profile-page .reg-form-ty-account .ty-account-benefits{
flex: 1 1 600px;
/*max-width:600px;*/
border-left: 1px solid #ebe9f5;
padding: 20px;
background: #fff;
overflow:hidden;
position: relative;
}
.profile-page .reg_form-header{
background: #fff;
padding: 25px 42px;
border-radius:5px 5px 0 0;
border-bottom: 1px solid #ebe9f5;
display: flex;
justify-content: space-between;
}
.profile-page .reg_form-header h1{
font: 400 12px/16px Roboto bold;
color: var(--main-color-grafit);
text-transform: uppercase;
}
.profile-page .reg_form-header .is_reg{
font: 400 13px/16px Roboto;
color: var(--main-color-grafit);
}
.profile-page .reg_form-header .is_reg span{
text-decoration: underline;
cursor: pointer;
}
.profiles_register_forms{
display: flex;
width:200%;
justify-content: space-between;
transition: margin-left .5s ease-in-out;
position: relative;
}
.profiles_register_forms_shag-active-opt{
margin-left: -100%;
}
.profiles_register_forms_shag-active-opt .profiles_register_form_opt{
opacity:1!important;
}
.profiles_register_forms_shag-active-opt .profiles_register_form{
opacity:0!important;
}
.profiles_register_forms_shag-active-rozn{
margin-left: 0;
}
.profiles_register_forms_shag-active-opt .profiles_register_form_rozn{
opacity:0!important;
}
.profiles_register_forms_shag-active-rozn .profiles_register_form{
opacity:1!important;
}
.human{
position: absolute;
z-index: 100;
top: -50px;
padding-top: 100px;
left:0;
width:50%;
text-align: center;
margin-top:120px;
background: rgba(255,255,255,.8);
height:100%;
opacity: 1;
transition: opacity .5s ease-in-out;
}
.human > div
{
font: 400 14px/16px Roboto bold;
color: var(--main-color-grafit);
}
.human > div:last-child{
font: 400 12px/16px Roboto!important;
}
.human.unactive{
opacity:0;
}
.profiles_register_form .ty-btn__secondary{
background: #d8254c!important;
float:right;
padding: 11px 44px!important;
transition: background .5s ease-in-out;
}
.profiles_register_form .ty-btn__secondary:hover{
background: #ea7b92!important;
}
.ty-buyer_checkbox{
position: absolute;
bottom: 30px;
width:150px;
left:25px;
}
.personal_data{
margin-left: 10px;
margin-top: 10px;
}
.personal_data a{
position: relative;
color: #d8254c;
}
.profiles_register_form .personal_data{
bottom:25px!important;
}
.personal_data input[type="checkbox"]{
border:none;
outline: none;
width:15px;
height:15px;
border-radius: 5px;
background: none;
margin-left:4px;
margin-top:4px;
-moz-appearance: none;
}
.personal_data_wrapper
{
width:23px;
height:23px;
background: url(../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1499073326) no-repeat;
background-position: 49.25393258426966% 86.94638694638695%;
float: left;
}
.personal_data_wrapper p{
margin-top:30px;
}
.personal_data input[type="checkbox"]{
transition: background .2s ease-in-out;
}
.personal_data input[type="checkbox"]:checked {
background: #d8254c;
}
.personal_data label{
position: relative;
cursor: pointer;
font: 400 12px/16px Roboto bold;
color: var(--main-color-grafit);
line-height: 25px;
margin-left: 10px;
}
#personal_data_error_message p{
width:200px;
}
.std_about{
height:100%;
}
.std_about img{
position:absolute;
}
.std_about img:first-child{
position:absolute;
animation-name: std_autos1;
animation-duration: 2s;
animation-delay: .3s;
animation-fill-mode: both;
}
.std_about img:nth-child(2) {
width:400px;
height: auto;
top:60px;
left:50px;
animation-name: std_autos2;
animation-duration: 1s;
animation-fill-mode: both;
}
.std_about.unactive img:first-child{
position:absolute;
animation-name: std_autos11;
animation-duration: 2s;
animation-delay: .3s;
animation-fill-mode: both;
}
.std_about.unactive img:nth-child(2) {
width:400px;
height: auto;
top:60px;
left:50px;
animation-name: std_autos22;
animation-duration: 1s;
animation-fill-mode: both;
}
.std_about h1{
position: absolute;
top: 250px;
font: 400 18px/25px Roboto bold;
color: var(--main-color-grafit);
left: 100px;
animation-name: fadeZoomIn;
animation-duration: 1s;
animation-fill-mode: both;
animation-delay: .5s;
}
.std_about div.text_std{
position: absolute;
top: 300px;
font: 400 14px/26px Roboto;
color: var(--main-color-grafit);
left: 100px;
animation-name: fadeZoomIn;
animation-duration: 1s;
animation-fill-mode: both;
animation-delay: .8s;
margin-right:50px;
}
.std_about.unactive h1{
position: absolute;
top: 250px;
font: 400 18px/25px Roboto bold;
color: var(--main-color-grafit);
left: 100px;
animation-name: fadeZoomOut;
animation-duration: 1s;
animation-fill-mode: both;
animation-delay: .5s;
}
.std_about.unactive div.text_std{
position: absolute;
top: 300px;
font: 400 14px/26px Roboto;
color: var(--main-color-grafit);
left: 100px;
animation-name: fadeZoomOut;
animation-duration: 1s;
animation-fill-mode: both;
animation-delay: .8s;
margin-right: 50px;
}
.std_about div.text_std span{
font: 400 14px/26px Roboto;
margin-top: 20px;
}
.std_about div.links{
position: absolute;
bottom:30px;
left: 50%;
margin-left: -180px;
}
.std_about div.links a{
padding: 10px 40px;
border: 1px solid #b2accb;
color: var(--main-color-grafit);
text-decoration: none;
position: relative;
}
.std_about div.links a::after{
content:'';
}
.std_about div.links a:first-child{
border-radius: 20px 0 0 20px;
animation-name: fadeIn;
animation-duration: 1s;
animation-fill-mode: both;
animation-delay: 1s;
}
.std_about div.links a:last-child{
border-radius: 0 20px 20px 0;
animation-name: fadeIn;
animation-duration: 1s;
animation-fill-mode: both;
animation-delay: 1.2s;
}
.std_about.unactive div.links a:first-child{
border-radius: 20px 0 0 20px;
animation-name: fadeOut;
animation-duration: 1s;
animation-fill-mode: both;
animation-delay: 1s;
}
.std_about.unactive div.links a:last-child{
border-radius: 0 20px 20px 0;
animation-name: fadeOut;
animation-duration: 1s;
animation-fill-mode: both;
animation-delay: 1.2s;
}
@keyframes std_autos2{
from{
left:200%;
}
to{
left: 50px;
}
}
@keyframes std_autos1{
from{
left:200%;
}
to{
left: 0px;
}
}
@keyframes std_autos22{
from{
left:50px;
}
to{
left: -80%;
}
}
@keyframes std_autos11{
from{
left:0;
}
to{
left: -200%;
}
}
@keyframes fadeZoomIn{
from{
opacity:0;
transform: scale(0);
}
70%{
opacity: 1;
transform: scale(1.2);
}
to{
transform: scale(1);
}
}
@keyframes fadeZoomOut{
from{
opacity:0;
}
to{
opacity: 0;
}
}
@keyframes fadeIn{
from{
opacity:0;
}
to{
opacity: 1;
}
}
@keyframes fadeOut{
from{
opacity:1;
}
to{
opacity: 0;
}
}
.rozn_about{
height:100%;
opacity: 0;
display: none;
}
.rozn_about.active{
opacity: 1;
display:block;
}
.rozn_about.unactive{
opacity: 1;
display:block;
}
.rozn_about.active img:first-child{
position: absolute;
top:30px;
left:70px;
width:180px;
animation-name: zoomIn;
animation-duration: 1s;
animation-fill-mode: both;
animation-delay: 1s;
}
.rozn_about.active img:nth-child(2){
position: absolute;
top:50px;
left:100px;
width:400px;
animation-name: rozn_auto;
animation-duration: 1s;
animation-fill-mode: both;
animation-delay: 1s;
}
.rozn_about.unactive img:first-child{
position: absolute;
top:30px;
left:70px;
width:180px;
animation-name: zoomOut;
animation-duration: 1s;
animation-fill-mode: both;
animation-delay: 1s;
}
.rozn_about.unactive img:nth-child(2){
position: absolute;
top:50px;
left:100px;
width:400px;
animation-name: rozn_auto_out;
animation-duration: 1s;
animation-fill-mode: both;
animation-delay: .5s;
}
.rozn_about.active h1{
position: absolute;
top: 250px;
font: 400 18px/25px Roboto bold;
color: var(--main-color-grafit);
left: 100px;
animation-name: fadeZoomIn;
animation-duration: 1s;
animation-fill-mode: both;
animation-delay: .1s;
}
.rozn_about.active div.text_std{
position: absolute;
top: 300px;
font: 400 14px/26px Roboto;
color: var(--main-color-grafit);
left: 100px;
animation-name: fadeZoomIn;
animation-duration: 1s;
animation-fill-mode: both;
animation-delay: .3s;
margin-right:50px;
}
.rozn_about.unactive h1{
position: absolute;
top: 250px;
font: 400 18px/25px Roboto bold;
color: var(--main-color-grafit);
left: 100px;
animation-name: fadeZoomOut;
animation-duration: 1s;
animation-fill-mode: both;
animation-delay: .3s;
}
.rozn_about.unactive div.text_std{
position: absolute;
top: 300px;
font: 400 14px/26px Roboto;
color: var(--main-color-grafit);
left: 100px;
animation-name: fadeZoomOut;
animation-duration: 1s;
animation-fill-mode: both;
animation-delay: .3s;
margin-right: 50px;
}
.rozn_about.active div.text_std span{
font: 400 18px/18px Roboto!important;
margin-top: 20px;
}
@keyframes zoomIn{
from{
transform: scale(0);
}
to{
transform: scale(1);
}
}
@keyframes zoomOut{
from{
transform: scale(1);
}
to{
transform: scale(0);
}
}
@keyframes rozn_auto{
from{
left:200%;
}
to{
left: 100px;
}
}
@keyframes rozn_auto_out{
from{
left: 100px;
}
to{
left:-90%;
}
}
.opt_about{
height:100%;
opacity:0;
display: none;
}
.opt_about.active{
opacity: 1;
display:block;
}
.opt_about.unactive{
opacity: 1;
display:block;
}
.opt_about img{
position:absolute;
}
.opt_about.active img:first-child{
position:absolute;
animation-name: std_autos1;
animation-duration: 2s;
animation-delay: .5s;
animation-fill-mode: both;
top:50px;
}
.opt_about.unactive img:first-child{
position:absolute;
animation-name: std_autos11;
animation-duration: 2s;
animation-delay: .3s;
animation-fill-mode: both;
}
.opt_about.active h1{
position: absolute;
top: 250px;
font: 400 18px/25px Roboto bold;
color: var(--main-color-grafit);
left: 100px;
animation-name: fadeZoomIn;
animation-duration: 1s;
animation-fill-mode: both;
animation-delay: .1s;
}
.opt_about.active div.text_std{
position: absolute;
top: 300px;
font: 400 14px/26px Roboto;
color: var(--main-color-grafit);
left: 100px;
animation-name: fadeZoomIn;
animation-duration: 1s;
animation-fill-mode: both;
animation-delay: .3s;
margin-right: 50px;
}
.opt_about.unactive h1{
position: absolute;
top: 250px;
font: 400 18px/25px Roboto bold;
color: var(--main-color-grafit);
left: 100px;
animation-name: fadeZoomOut;
animation-duration: 1s;
animation-fill-mode: both;
animation-delay: .2s;
}
.opt_about.unactive div.text_std{
position: absolute;
top: 300px;
font: 400 14px/26px Roboto;
color: var(--main-color-grafit);
left: 100px;
animation-name: fadeZoomOut;
animation-duration: 1s;
animation-fill-mode: both;
animation-delay: .3s;
margin-right: 50px;
}
.opt_about.active div.text_std span{
font: 400 18px/18px Roboto!important;
margin-top: 20px;
}
@media screen and (max-width: 1090px){
.ty-account-benefits{
display:none!important;
}
.profiles_register_form .ty-btn__secondary{
float: none!important;
}
.profile-page .ty-account .buttons-container{
float: none;
text-align: center;
}
}
.profiles_register_form_opt .ty-btn{
background: #d8254c!important;
transition: background .5s ease-in-out;
float: right;
}
.profiles_register_form_opt .ty-btn:hover{
background: #ea7b92!important;
}
.text-input50{
width:49%;
position: relative!important;
display: inline-block;
}
.text-input501{
width:49%;
margin-left: 5px!important;
}
.profiles_register_form_opt .file_input{
display:none;
}
.profiles_register_form_opt .file_inp_label{
border-radius: 20px;
border: 1px solid #dfdfdf;
font: 300 14px/21px Roboto light;
color: #453875;
max-width: 100%;
display: block;
padding: 0 20px;
max-height: 40px;
cursor:pointer;
position: relative;
border-color: #b2accb;
margin: 5px 0;
line-height: 38px;
}
.be_sure::after{
content: '';
background: url('../../../../../../../../design/themes/avtoopt/media/../images/red_star.png?1759911146') no-repeat;
position: absolute!important;
right:5px;
top:19px;
width:20px;
height: 20px;
z-index: 20;
display: block;
}
.verification_code.be_sure::after{
right:41%;
}
.be_sure{
position: relative!important;
}
.be_sure.input-error::after {
background: url('../../../../../../../../design/themes/avtoopt/media/../images/!.png?1759911146') no-repeat;
}
.be_sure.input-error > input[type='text'], .be_sure.input-error > input[type='password']{
transition: border-color .4s ease-in-out;
}
.be_sure.input-error > input[type='text'], .be_sure.input-error > input[type='password']{
border-color: #d8254c!important;
}
.be_sure.input-error > input[placeholder]{
color: #d8254c!important;
}
.be_sure.input-error > input::-webkit-input-placeholder{
color: #d8254c!important;
}
.be_sure.input-error > input::-moz-placeholder{
color: #d8254c!important;
}
.be_sure.input-error > input:-moz-placeholder{
color: #d8254c!important;
}
.be_sure.input-error > input:-ms-input-placeholder{
color: #d8254c!important;
}
.profiles_register_form_opt span{
position: relative;
}
.profiles_register_form_opt input{
border-color: #b2accb;
}
.profiles_register_form_opt input::-webkit-input-placeholder
{
color: #453875!important;
transition: color .4s ease-in-out;
}
.profiles_register_form_opt input[placeholder]
{
color: #453875!important;
transition: color .4s ease-in-out;
}
.profiles_register_form_opt input::-moz-placeholder
{
color: #453875!important;
transition: color .4s ease-in-out;
}
.profiles_register_form_opt input:-moz-placeholder
{
color: #453875!important;
transition: color .4s ease-in-out;
}
.profiles_register_form_opt input:-ms-input-placeholder
{
color: #453875!important;
transition: color .4s ease-in-out;
}
.profiles_register_form input::-webkit-input-placeholder
{
color: #453875!important;
}
.profiles_register_form input[placeholder]
{
color: #453875!important;
}
.profiles_register_form input::-moz-placeholder
{
color: #453875!important;
}
.profiles_register_form input:-moz-placeholder
{
color: #453875!important;
}
.profiles_register_form input:-ms-input-placeholder
{
color: #453875!important;
}
.profiles_register_form input{
border-color: #b2accb;
}
.profiles_register_form_opt .order__select{
color: #453875;
Cursor: pointer;
border-color: #b2accb;
}
.profiles_register_form_opt .order__select option{
color: #453875;
width:80%;
}
.profiles_register_form_opt input[type="submit"]{
margin-top: 30px;
}
.success_wholesale_reg{
width: 100%;
max-width: 1200px;
background: #fff;
margin:20px auto;
padding: 20px;
border-radius: 5px;
text-align: center;
font: 300 16px/30px Roboto bold;
color: var(--main-color-grafit);
}
.profiles_register_form_opt button{
margin: 60px 0 0 0;
}
.profiles_register_form_opt button[type=submit]:disabled, .profiles_register_form button[type=submit]:disabled{
background-color: grey!important;
}
.buttons-container button{
margin: 20px 0!important;
}
.mobile-shag{
display: none;
}
@media screen and (max-width: 600px){
.shag{
display: none;
}
.is_reg{
display: none;
}
.reg_form-header h1{
text-align: center;
width: 100%;
font-size: 20px;
}
.change{
padding:20px 0 20px 5px!important;
width: 100%;
}
.change > .changer{
border-radius: 0!important;
padding:10px 15px!important;
width:100%;
}
.reg_form h1 div{
display: none;
}
.mobile-shag{
display: block;
float: left;
text-align: center;
padding-right: 10px;
}
.mobile-shag > span{
font-size: 20px;
}
.profile-page .reg-form-ty-account .reg_form{
padding: 15px 0;
}
}
.ty-success-registration__text{
font: 300 17px/24px Roboto bold;
color: var(--main-color-grafit);
}
.success_wholesale_reg a{
color: var(--main-color-grafit)!important;
}
.ty-phone{
display: inline-block;
width:60%;
}
.ty-phone input{
border-radius: 20px 0 0 20px;
}
.phone_verification{
display: inline-block;
width: 40%;
margin-left: -3px;
}
.phone_verification input{
border-radius: 0 20px 20px 0;
margin-top: -5px;
font: 300 12px/24px Roboto bold;
color: #fff;
background: #808080;
border-left: none;
transition: background .5s ease-in-out;
padding: 8px;
cursor: default;
}
.phone_verification input.active {
background: #d8254c!important;
cursor: pointer;
text-wrap: nowrap;
text-overflow: ellipsis;
}
.verification_code{
height: 0;
overflow: hidden;
transition: height .5s ease-in-out;
}
.verification_code.active{
height: 84px;
}
.verification_code input[type="text"]{
display: inline-block;
width:60%;
border-radius: 20px 0 0 20px;
}
.verification_code input[type="button"]{
display: inline-block;
width:40%;
margin-left:-3px;
border-radius: 0 20px 20px 0;
font: 300 12px/24px Roboto bold;
color: #fff;
background: #808080;
border-left: none;
transition: background .5s ease-in-out;
padding: 8px;
cursor: pointer;
}
.verification_code input[type="button"].active{
background: #d8254c!important;
}
.phone_message {
font: 400 13px/16px Roboto;
color: var(--main-color-grafit);
margin-left: 20px;
}
@media screen and (max-width: 1092px){
.verification_code.active{
height: 70px;
}
}
@media screen and (max-width: 640px){
.verification_code.active{
height: 84px;
}
}
@media screen and (max-width: 600px){
.verification_code.active{
height: 70px!important;
}
}
@media screen and (max-width: 500px) {
.verification_code.active {
height: 84px!important;
}
}
#elm_9_error_message{
float:left;
}
.md_prod {
left: 50%;
width: 100%;
margin-left: -470px;
max-width: 1000px;
min-width: 320px;
height: auto;
z-index: 2000;
}
.slider-prod {
position: absolute;
top: 20px;
left: 20px;
width: 300px;
}
#modal-8 .slider-n{
z-index: 30000;
}
.prod-item_active {
}
.d__nav {
vertical-align: middle;
margin: 0 4px;
display: inline-block;
outline: none;
background: none;
border: none;
}
.d__nav_content {
text-align: center;
width: 100%;
box-sizing: border-box;
}
.d__nav_play {
.svg-svg--play;
.svg-svg--play-dims;
display: inline-block;
}
.d__nav_pause {
.svg-svg--pause;
.svg-svg--pause-dims;
display: inline-block;
}
.d__nav_quality {
background: #e8e6e6;
color: var(--main-color-grafit);
font: 600 13px/13px Roboto light;
text-decoration: none;
padding: 6px 20px;
border-radius: 20px;
transition: background .5s ease-in-out, color .5s ease-in-out;
cursor: pointer;
margin-bottom: 5px;
}
.d__nav-active {
background: var(--main-color-grafit) !important;
color: #fff !important;
}
@media screen and (min-width: 940px) {
.detail-product__content_cover-img {
margin: 0 auto !important;
line-height: 400px;
width: 100%;
font-size: 0;
display: block;
text-align: center;
}
}
@media screen and (max-width: 940px) {
.slider-prod {display: none;}
.detail-product__content_cover-img { box-sizing: border-box;}
}
#playButton360, #pauseButton360{
fill: #2c1970;
transition: fill .5s ease-in-out;
}
.d__nav:hover #playButton360, .d__nav:hover #pauseButton360{
fill: red;
}
.ty-pict{
cursor: pointer;
}
.detail-product__content_cover-img img{
/*width:100%;*/
}
#modal-8 {
width:100vw;
min-height: 500px;
display: flex;
position: fixed;
left:0;
top: 5%;
margin-left: 0;
max-width: none;
min-width: none;
}
#modal-8 > .md-content {
width:95%;
height:initial;
}
.photos_360{
overflow: hidden;
position: relative;
height: 86vh;
width: 100%;
max-height: 550px;
padding: 0!important;
margin: 50px auto!important;
}
.photos_360 img{
width: auto;
max-width: 100%;
max-height: 100%;
display: block;
margin: 0px auto;
opacity: 0;
/*height: 100%;*/
vertical-align: middle;
}
.photos_360 > div{
transform: translateY(0);
position: relative;
z-index: 5;
max-width:none;
width:100%;
height: 100%;
line-height: 550px;
font-size: 0;
display: block;
text-align: center;
}
.photos_360 > span{
position: absolute;
background: transparent;
width:100%;
height: 100%;
display: block;
z-index: 20000;
cursor: pointer;
}
.photos_360 > span:active{
cursor: move;
}
/*.d__nav_quality-active {
background: var(--main-color-grafit)!important;
color: #fff!important;
}*/
.checkQuality360:checked + .d__nav_quality{
background: var(--main-color-grafit)!important;
color: #fff!important;
}
.preloader{
position: absolute;
width: 64px;
height:64px;
top: 50%;
left: 50%;
margin-left: -32px!important;
margin-top: -32px!important;
padding: 0!important;
}
.preloader img {
width: 64px;
height:64px;
}
@media screen and (min-width: 1025px) {
.checkQuality360:checked + .d__nav_quality:hover{
background: red;
color: #fff!important;
}
.d__nav_quality:hover {
background: red;
color: #fff!important;
}
}
@media screen and (max-width: 900px) {
.photos_360 {
height:360px!important;
width:100%!important;
margin:100px auto!important;
}
.photo_360 {
margin-left:0!important;
}
}
@media screen and (max-width: 760px) {
.photos_360 {
height:290px!important;
width:100%!important;
margin:120px auto!important;
}
/* .preloader {
margin-top: -112px!important;
}
*/ .photo_360 {
margin-left:0!important;
}
#modal-8 > .md-content {
width: 100%!important;
height: 100vh;
}
#modal-8{
top: 0!important;
}
.d__nav_content{
padding: 20px 40px 0px 40px!important;
}
}
@media screen and (max-width: 480px) {
.photos_360 {
height:250px!important;
width:100%!important;
margin:120px auto!important;
}
.preloader {
margin-top: -112px!important;
}
.photo_360 {
margin-left:0!important;
}
#modal-8 > .md-content {
width: 100%!important;
height: 100vh;
}
#modal-8{
top: 0!important;
}
.d__nav_content{
padding: 20px 40px 0px 40px!important;
}
}
.tour3dButton {
background: none;
border:2px solid var(--main-color-grafit);
/*margin-left: 0px;*/
/*margin: -30px 0px 30px 260px;*/
margin: -30px 0px 30px 23.7%;
border-radius: 20px;
padding: 5px 20px;
color: var(--main-color-grafit);
overflow: hidden;
position: absolute;
z-index: 1;
transition: color .5s ease-in-out, border .6s ease-in-out;
font-size: 14px;
}
.tour3dButton::after , .schemeButton::after {
content: '';
position: absolute;
background: var(--main-color-grafit);
top:0;
left:0;
width:100%;
height: 100%;
z-index: -1;
opacity: 0;
transition: opacity .5s ease-in-out;
}
.tour3dButton:hover::after , .schemeButton:hover::after {
opacity: 1;
}
.tour3dButton:hover , .schemeButton:hover {
color:#fff;
/*border-color: #fff;*/
}
.schemeButton {
position: absolute;
/*margin: 15px 0px 0px 225px;*/
margin: 15px 0px 0px 21%;
font: 16px Roboto;
color: var(--main-color-grafit);
background: none;
border: 2px solid var(--main-color-grafit);
border-radius: 20px; /*11111111111111111111111111111111111111111111111111111111111111111111111111*/
padding: 5px 20px;
overflow: hidden;
z-index: 1;
transition: color .5s ease-in-out, border .6s ease-in-out;
}
.shemeButtonBR {
content: ' ';
display: none;
}
.schemeModal {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1000;
overflow: hidden;
}
.schemeModal-background {
position: absolute;
background-color: #000000;
opacity: 0.5;
top:0;
width: 100%;
height: 100%;
z-index: 900;
}
.schemeModal-title {
position: relative;
text-align: center;
margin: 15px 15px 0px 15px;
width: auto;
background-color: white;
padding: 10px 0px 10px 20px;
font: 16px Roboto;
z-index: 900;
}
.schemeModal-photo {
position: relative;
z-index: 900;
width: auto;
/*max-width: 1250px;*/
max-height: 610px;
min-height: 550px;
height: auto;
margin: 0px 15px 15px 15px;
overflow: scroll;
}
.schemeModal-photo img {
background-size: cover;
height: auto;
min-height: 500px;
width: 100%;
image-rendering: -moz-crisp-edges; /* Firefox */
-ms-interpolation-mode: nearest-neighbor; /* IE */
image-rendering: crisp-edges; /* Стандартное свойство */
}
.schemeModalClose {
position: absolute;
right: 0;
top: 0;
width: 40px;
height: 40px;
opacity: 0.7;
z-index: 950;
}
.schemeModalClose:before , .schemeModalClose:after {
position: absolute;
content: ' ';
top: 3px;
height: 33px;
width: 2px;
background-color: black;
}
.schemeModalClose:before {
transform: rotate(45deg);
}
.schemeModalClose:after {
transform: rotate(-45deg);
}
.schemeModalNext,.schemeModalPrev {
position: absolute;
height: 100%;
width: 50px;
background-color: white;
opacity: 0.5;
}
.schemeModalNext {
right: 0;
top: 0;
}
.schemeModalNext img {
position: absolute;
top: 45%;
height: 40px;
width: 40px;
min-height: 0px;
right: 5px;
}
/*.schemeModalPrev img {
position: absolute;
top: 45%;
left: 5px;
height: 40px;
width: 40px;
min-height: 0px;
}*/
@media screen and (max-width: 1020px)
{
.schemeButton {
position: absolute;
margin: -40px 0px 0px 350px;
}
.tour3dButton {
position: absolute;
margin: -40px 0px 0px 240px;
}
}
@media screen and (max-width: 960px)
{
.schemeButton {
position: absolute;
margin: 5px 0px 0px 240px;
}
.tour3dButton {
position: absolute;
margin: -40px 0px 0px 270px;
}
}
@media screen and (max-width: 660px)
{
.schemeButton {
position: relative;
margin: 10px 0px 10px 0px;
}
.tour3dButton {
position: relative;
margin: 0px 0px 0px 0px;
}
.shemeButtonBR {
content: ' ';
display: block;
}
}
#modal-9 {
height:100vh!important;
position: fixed!important;
width: 100vw;
left: 0!important;
margin-left: 0;
max-width: none;
min-width: none;
}
#modal-9 .md-content {
height:90%!important;
width:95%;
}
#modal-9 .md-content div#container {
padding:0!important;
}
#modal-9 .md-close {
border: 10px solid #fff;
border-radius: 0 0 0px 10px;
box-sizing: content-box;
right:0;
top:0;
padding:0!important;
background-color: #fff;
}
#modal-9 > .md-content .contentBlock {
padding: 0;
height: 100%;
}
.not360photoFix {
opacity: 1!important;
}
@keyframes animateIt {
0% {
opacity: 0;
left: 50px;
}
100% {
opacity: 1;
left: 0;
}
}
.balloon_custom_style_wrapper {
position: relative;
min-width: 400px;
min-height: 100px;
}
.balloon_custom_style{
position: absolute;
box-shadow: 0 0 7px rgba(0,0,0, 0.4);
font: 500 12px/12px Roboto bold;
background-color: white;
min-height: 100px;
animation-name: animateIt;
animation-duration: 0.5s;
animation-fill-mode: both;
}
.balloon_custom_style::after {
content: '';
position: absolute;
top:50%;
left:0;
width:20px;
height:20px;
margin-left:-10px;
margin-top:-10px;
background-color: white;
transform: rotate(45deg);
box-shadow: -3px 3px 3px rgba(0,0,0,0.3);
}
.balloon_content {
padding: 20px;
}
.balloon_content h2 {
font: 500 12px/16px Roboto bold;
color: var(--main-color-grafit);
text-transform: uppercase;
width: 230px;
}
.balloon_content p {
font: 14px/24px Roboto light;
color: #000;
margin: 0;
display: inline-block;
width: 100%;
}
.balloon_content .shops__st_block-name {
width: 100%;
}
@media screen and (max-width: 760px) {
#openControlPanelCheckbox:checked ~ .controlPanel {
bottom:-1px;
}
#closeControlPanelCheckbox:checked ~ .controlPanel {
bottom:-100%;
}
.controlPanel {
position: fixed;
bottom:-100%;
background-color: #fff;
transition: bottom .5s ease-in-out;
z-index: 30000;
background-color: #e8e6e6;
padding: 0!important;
width:100%;
overflow-y: scroll;
}
.openControlPanel {
color:var(--main-color-grafit);
border: 2px solid var(--main-color-grafit);
border-radius: 15px 15px 0 0;
position: absolute;
height:40px;
line-height: 40px;
display: inline-block;
text-align: center;
bottom:0;
width:99%;
}
.slider-n-mobile {
max-height: 300px!important;
}
#openControlPanelCheckbox {
display: none;
}
.closeControlPanel {
color:var(--main-color-grafit);
border: 2px solid var(--main-color-grafit);
border-radius: 0 0 15px 15px;
width:99%;
background: #fff;
position: relative;
height:40px;
line-height: 40px;
display: inline-block;
}
#closeControlPanelCheckbox {
display: none;
}
#qualityPhoto360_21 {
background-color: #fff;
}
#qualityPhoto360_2:checked + #qualityPhoto360_21{
background-color: var(--main-color-grafit);
}
.openControlPanelWrap {
position: fixed;
width:100%;
height:100vh;
bottom: 0;
padding: 0!important;
display: block!important;
}
.closeControlPanelWrap {
width:100%;
padding: 0!important;
text-align: center;
display: block!important;
}
.opencloser, .closeropen {
width:20px;
height:20px;
position: absolute;
left: 5px;
top: 10px;
}
.opencloser path, .closeropen path {
fill: var(--main-color-grafit);
}
.closeropen {
transform: rotate(180deg);
top:7px;
}
}
#openControlPanelCheckbox, #closeControlPanelCheckbox,
.openControlPanelWrap, .closeControlPanelWrap {
display: none;
}
.ty-form-builder__input-text {
width: 100%;
height: 40px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
border: 1px solid #dfdfdf;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0 20px;
font: 300 14px/21px Roboto light;
outline: none;
box-shadow: none;
outline: 0;
-webkit-appearance: button;
position: relative;
margin: 5px 0;
}
.ty-form-builder label {
font: 700 14px/14px Roboto bold;
color: var(--main-color-grafit);
}
.ty-form-builder textarea {
width: 100%;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
border: 1px solid #dfdfdf;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0 20px;
font: 300 14px/21px Roboto light;
outline: none;
box-shadow: none;
outline: 0;
-webkit-appearance: button;
position: relative;
margin: 5px 0;
}
.ty-form-builder {
padding: 10px 30px;
border-radius: 5px;
}
#elm_9 .ty-form-builder__checkbox-label {
margin: 5px 0 0 250px;
background-color: white;
padding: 5px;
cursor: pointer;
border-radius: 5px;
max-width: 500px;
transition: background .2s ease-in-out;
}
#elm_9 .ty-form-builder__checkbox-label:hover {
background-color: #edebeb;
}
#elm_9 .ty-form-builder__checkbox-label input {
margin-right: 10px;
}
.ty-form-builder #elm_9 {
margin-top: -25px;
}
.preorder {
padding: 20px;
position: relative;
display: none;
}
.preorder .header {
padding: 25px 0;
}
.preorder .header h3 {
color: var(--main-color-grafit);
text-transform: uppercase;
font: 700 14px/14px Roboto bold;
}
.preorder .header img {
float: left;
padding: 0 10px;
}
.preorder .headerName {
padding:15px;
text-align: center;
position: relative;
}
.preorder .headerName span {
color: var(--main-color-grafit);
text-transform: uppercase;
font: 400 24px/24px Roboto light;
}
.preorder .table .string {
display: flex;
background-color: #fff;
justify-content: space-between;
cursor: pointer;
transition: background .2s ease-in-out;
}
.preorder .table .string:nth-child(2n+1) {
background-color: #f6f5f9;
}
.preorder .table .string:hover {
background-color: #ececec;
}
.preorder .table .string .tr {
border: .5px solid #ebeaf0;
flex: 1 1 150px;
text-align: center;
padding: 20px 0;
box-sizing: border-box;
border-bottom: none;
border-left: none;
font: 700 12px/12px Roboto bold;
}
.preorder .table .string.headerTable, .preorder .table .string.type {
color: var(--main-color-grafit);
text-transform: uppercase;
font: 700 14px/14px Roboto bold;
background-color: #fff;
}
.preorder .table .string.headerTable:hover, .preorder .table .string.type:hover {
background-color: #fff;
cursor: initial;
}
.preorder .table .string.headerTable {
border-bottom: .5px solid #dcd8e9;
border-top: none;
background-color: #dcd8e9;
}
.preorder .table .string.headerTable:hover {
background-color: #dcd8e9;
}
.preorder .table .string.type {
border-bottom: .5px solid #dcd8e9;
background-color: rgba(220, 216, 233, 0.34);
}
.preorder .table .string.type:hover {
background-color: rgba(220, 216, 233, 0.34);
}
.preorder .table .string.type .tr {
padding: 10px;
}
.preorder .table .string .tr:first-child {
border-left: none;
}
.preorder .table .string .tr:last-child {
border-right: none;
}
.preorder .table .string .tr:nth-child(5),.preorder .table .string .tr:nth-child(4) {
font: 700 14px/14px Roboto bold;
}
.preorder .table .string .tr:nth-child(5):after {
content: " ₽";
}
.fastDelievery {
background-color: #e4f8e4;
}
.preorder .table .string .tr b {
color: var(--main-color-grafit);
font: 700 14px/14px Roboto bold;
text-decoration: none;
border-bottom: 2px dashed var(--main-color-grafit);
}
.preorder .table .string .tr:nth-child(2) {
text-transform: uppercase;
}
#changeBrandOnProducts {
margin-left: 15px;
width:auto;
}
#brandChangerPreorder {
position: absolute;
right: 5px;
top: 2px;
color: var(--main-color-grafit);
font: 400 16px/16px Roboto light;
}
#backButtonPreorder {
background: none;
border:none;
outline: none;
position: absolute;
left:10px;
top:15px;
}
#backButtonPreorder svg {
fill: #fff;
transition: filter .3s ease-in-out;
margin: -3px 10px 0 0;
float: left;
}
#backButtonPreorder b {
color: #fff;
font: 400 24px/20px Roboto bold;
text-transform: none;
transition: filter .3s ease-in-out;
}
#backButtonPreorder:hover svg {
-webkit-filter: drop-shadow( 0px 0px 4px rgba(41, 22, 111, 0.4));
filter: drop-shadow( 0px 0px 3px rgba(41, 22, 111, 0.4));
}
#backButtonPreorder:hover b {
-webkit-filter: drop-shadow( 0px 0px 4px rgba(41, 22, 111, 0.4));
filter: drop-shadow( 0px 0px 3px rgba(41, 22, 111, 0.4));
}
.weDontHaveThisItem {
cursor: default!important;
opacity: 0.3;
text-decoration: line-through;
}
.preloaderPreorder {
position: absolute;
width:100%;
height: 100%;
top:83px;
left:0;
background: rgba(0, 0, 0, 0);
}
.preloaderPreorder img {
position: absolute;
top:30px;
left:50%;
margin-left: -32px;
}
#products_on_order_popup {
display: block!important;
height: auto!important;
color: black;
}
#products_on_order_popup h3 {
color: var(--main-color-grafit);
border-radius: 20px;
}
#modal-10 {
position: fixed;
}
#modal-10 .md-content form button {
margin-top: 20px;
}
@media screen and (max-width: 760px) {
.preorder .table .string:first-child {
display: none;
}
.preorder {
padding: 0;
}
.preorder .headerName span {
font: 700 14px/14px Roboto bold;
}
.preorder .table .string {
background-color: #fff;
border-top: .5px solid #dcd8e9;
flex-wrap: wrap;
padding-bottom: 15px;
}
.preorder .table .string .tr {
border: none;
}
.preorder .table .string .tr {
padding: 10px 15px;
}
.preorder .table .string .tr:nth-child(2) {
order: 0;
flex: 1 1 50px;
font: 400 16px/24px Roboto light;
position: relative;
}
.preorder .table .string .tr:nth-child(2):after {
content: " / ";
font: 400 24px/24px Roboto light;
position: absolute;
top: 50%;
margin: -12px 20px;
}
.preorder .table .string .tr:nth-child(1) {
order: 1;
flex: 10 1 100px;
text-align: left;
font: 700 14px/14px Roboto bold;
position: relative;
}
.preorder .table .string .tr:nth-child(1) span {
position: absolute;
top:50%;
margin-top: -7px;
}
.preorder .table .string .tr:nth-child(3) {
order: 2;
flex: 1 1 100%;
text-align: left;
}
.preorder .table .string .tr:nth-child(4) {
order: 3;
flex: 1 1 100%;
text-align: left;
color: #999;
}
.preorder .table .string .tr:nth-child(4):before {
content: "Доставка: ";
color: #999;
}
.itemNumberPreorder:before {
content: "Кол-во товаров: "!important;
}
.preorder .table .string .tr:nth-child(5) {
order: 4;
flex: 1 1 50%;
color: var(--main-color-grafit);
}
.preorder .table .string .tr:nth-child(6) {
order: 5;
flex: 1 1 50%;
background-color: #756e9b;
}
.preorder .table .string .tr:nth-child(6) b {
border-bottom: none;
color: #fff;
}
.fastDelievery {
background-color: #fff;
}
.ty-pagination__prev, .ty-pagination__next {
display: none;
}
#backButtonPreorder {
left: -5px;
top: 11px;
}
#backButtonPreorder b {
color: var(--main-color-grafit);
font-size: 12px;
}
#backButtonPreorder svg {
fill: var(--main-color-grafit);
width:16px;
height:16px;
margin: 2px 0 0 0!important;
}
.brandChangerPreorder {
display: none;
}
}
.blog-page p img {
max-width: 100%;
height: auto!important;
}
.blackFridayStyleCat {
font-size: 12px;
display: block;
background-color: var(--main-color-grafit);
color: white!important;
padding: 5px;
text-align: center;
font-weight: bold;
position: absolute;
bottom: 0;
left: 0;
width: 100%;
}
.blackFridayStyleProd {
display: block;
padding: 5px;
font-weight: normal!important;
right: 0;
}
/**Main page promo block remake**/
.main_promo_wrap {
display: flex;
width: 100%;
justify-content: space-around;
margin: 10px auto 20px;
max-width: 1200px;
flex-wrap: wrap;
}
.main_promo {
flex: 1 1 380px;
margin: 10px;
overflow: hidden;
border-radius: 5px;
}
.main_promo_wrap .main_promo_full:first-child {
margin-left: 0;
}
.main_promo_wrap .main_promo_full:last-child {
margin-right: 0;
}
.main_promo_wrap .main_promo_full {
height: 500px !important;
}
.main_promo_wrap .main_promo_full_wrap {
margin: 0;
display: flex;
justify-content: space-between ;
flex-direction: column;
margin-top: 10px;
height: 500px;
}
.main_promo_wrap .main_promo_full_wrap .main_promo_half:first-child {
margin-top: 0;
}
.main_promo_wrap .main_promo_full_wrap .main_promo_half:last-child {
margin-bottom: 0;
}
.main_promo_wrap .main_promo_half {
height: 220px;
}
.main_promo_first {
order: 0;
}
.main_promo_sec {
order: 1;
}
.main_promo_second {
order: 0;
}
.main_promo_third {
order: 1;
}
.main_promo_fourth {
order: 2;
}
.main_promo_inner {
position: relative;
height: 100%!important;
}
.main_promo_inner a {
position: absolute;
height: 100%;
width: 100%;
z-index: 100;
}
@media screen and (max-width: 1160px) {
.main_promo_fourth {
order: 1;
}
.main_promo_sec {
order: 2;
}
.main_promo_wrap .main_promo_full_wrap {
/*flex-direction: row;*/
flex: 1 1 100%;
height: auto;
}
.main_promo_wrap .main_promo_full_wrap .main_promo_half:last-child {
margin-top: 0;
}
.main_promo_wrap .main_promo_full {
margin: 20px 10px 10px!important;
height: 400px
}
.main_promo_wrap .main_promo_full:first-child {
height: 500px;
}
.main_promo_wrap .main_promo_half {
max-height: 240px!important;
}
}
@media screen and (max-width: 800px) {
.main_promo_wrap .main_promo_full_wrap {
flex-direction: column;
}
.main_promo_wrap .main_promo_full {
margin: 10px 10px 10px!important;
}
.main_promo_wrap .main_promo_full_wrap .main_promo_half:last-child {
margin-top: 10px;
}
}
.discount_on_car_wash {
background-color: white;
}
.discount_on_car_wash__item-1 {
display: flex;
flex-direction: column;
}
.discount_on_car_wash__item-2 {
position: relative;
display: flex;
flex-direction: row;
margin-bottom: 0;
padding-bottom: 0;
}
.discount_on_car_wash__1, .discount_on_car_wash__2 {
position: relative;
font-size: 32px;
font-family: "Roboto bold";
font-weight: bold;
}
.discount_on_car_wash__1 {
padding-top: 30px;
padding-left: 30px;
}
.discount_on_car_wash__2 {
text-align: right;
padding-top: 15px;
margin-bottom: 30px;
padding-right: 30px;
}
.discount_on_car_wash__1 img, .discount_on_car_wash__2 img {
width: 240px;
position: absolute;
z-index: 0;
}
.discount_on_car_wash__1 img {
top: 10px;
left: 10px;
}
.discount_on_car_wash__2 img {
bottom: -20px;
right: 0px;
}
.discount_on_car_wash__1 span, .discount_on_car_wash__2 span {
position: relative;
z-index: 1;
}
.discount_on_car_wash__3, .discount_on_car_wash__4 {
text-align: center;
}
.discount_on_car_wash__3 {
padding-left: 15px;
}
.discount_on_car_wash__4 {
margin-top: 20px;
padding-right: 15px;
}
.discount_on_car_wash__4 img:first-child {
position: relative;
margin-bottom: -35px;
z-index: 0;
}
.discount_on_car_wash__4 img:last-child {
position: relative;
z-index: 1;
}
.winter_sales {
background-color: #78d2d2;
display: flex;
flex-direction: column;
}
.winter_sales__snow {
position: absolute;
z-index: 1;
}
.winter_sales__block_1 {
position: relative;
width: 100%;
z-index: 20;
padding-top: 20px;
}
.winter_sales__block_1--image_body {
width: 95%;
}
.winter_sales__block_1--image_red_text {
position: absolute;
z-index: 50;
bottom: 70px;
left: 26px;
width: 333px;
}
.winter_sales__block-2 {
width: 100%;
position: relative;
text-align: center;
z-index: 50;
margin: auto 0;
}
.winter_sales__block_2--image_text {
margin: 0 auto;
}
.winter_sales__snow_1 {
top: 30px;
left: 58px;
width: 33px;
}
.winter_sales__snow_2 {
top: 8px;
right: 10px;
width: 23px;
}
.winter_sales__snow_3 {
top: 50px;
right: 131px;
width: 39px;
}
.winter_sales__snow_4 {
top: 127px;
left: 127px;
width: 22px;
}
.winter_sales__snow_5 {
top: 113px;
right: 161px;
width: 22px;
}
.winter_sales__snow_6 {
top: 141px;
right: 67px;
width: 22px;
}
.winter_sales__snow_7 {
bottom: 78px;
left: 17px;
width: 36px;
}
.winter_sales__snow_8 {
bottom: 109px;
right: 24px;
width: 25px;
}
.winter_sales__snow_9 {
bottom: 10px;
left: 30px;
width: 23px;
}
.winter_sales__snow_10 {
bottom: 20px;
right: 17px;
width: 36px;
}
.gift_certificate {
background-color: white;
}
.gift_certificate__body {
text-align: center;
max-height: 100%;
}
.gift_certificate__body img {
max-width: 97%;
}
.gift_certificate__title {
color: #fc1e03;
font-size: 25px;
font-weight: bold;
text-align: center;
/*padding: 15px 0 10px 0;*/
padding: 20px 0;
}
/*.gift_certificate__img--1,*/
.gift_certificate__img--2,
.gift_certificate__img--3 {
text-align: center;
}
/*.gift_certificate__img--1 img,*/
.gift_certificate__img--2 img,
.gift_certificate__img--3 img {
margin: 0 auto;
}
.gift_certificate__img--2 {
position: relative;
z-index: 1;
}
.gift_certificate__img--3 {
/*top: -43px;*/
top: -34px;
position: relative;
}
.gift_certificate__text {
position: relative;
/*top: -50px;*/
top: -34px;
color: #3a3583;
font-weight: bold;
}
@media screen and (max-width: 510px) {
.gift_certificate__title {
font-size: 18px;
}
.gift_certificate__img--3 {
top: -28px;
}
.gift_certificate__text {
/*top: -19px;*/
top: 10px;
}
}
@media screen and (max-width: 1200px) {
.owl-carousel .discount_on_car_wash__3 {
margin-top: 25px;
/*margin-left: 15px;*/
width: 75%;
}
.owl-carousel .discount_on_car_wash__4 {
margin-top: 25px;
/*margin-right: 15px;*/
width: 80%;
}
.owl-carousel .discount_on_car_wash__3 img:last-child {
width: 85%;
}
.owl-carousel .discount_on_car_wash__4 img {
margin: 0 auto;
}
.owl-carousel .discount_on_car_wash__4 img:first-child {
width: 85%;
margin-bottom: -30px;
}
.owl-carousel .discount_on_car_wash__1 span, .owl-carousel .discount_on_car_wash__2 span {
font-size: 28px;
}
.owl-carousel .discount_on_car_wash__1 img, .owl-carousel .discount_on_car_wash__2 img {
width: 218px !important;
}
.owl-carousel .discount_on_car_wash__1 img {
top: 15px;
left: 10px;
}
.owl-carousel .discount_on_car_wash__2 img {
bottom: -17px;
right: 0px;
}
}
.center_this_image_now {
position: absolute;
left: 50%;
}
/** products amount styles starts now **/
#modal-products_amount {
max-width: 960px;
/*margin-left: -480px;*/
width: 100%;
}
#modal-products_amount .product_on_amount {
border-top: 1px solid #d8d4e9;
height: 100px;
padding: 0;
display: flex;
align-items: center;
position: relative;
}
#modal-products_amount .product_on_amount div {
display: inline-block;
}
#modal-products_amount .blackFridayStyleProd {
display: none;
}
#modal-products_amount .md-content {
/*overflow: hidden;*/
/**height: 100vh**/
}
@media screen and (max-width: 800px) {
#modal-products_amount .md-content {
overflow: scroll;
height: 100vh;
}
#modal-products_amount .product_on_amount {
height: 150px;
}
}
#modal-products_amount .product_on_amount .mini_image {
height: 100px;
width: 20%;
max-width: 150px;
}
#modal-products_amount .product_on_amount .product_inf_on_amount {
width: 65%;
color: black;
font-size: 14px;
padding: 0 15px;
}
#modal-products_amount .product_on_amount .buy_now .carousel-products__item_line_basket {
bottom: 27px;
}
#modal-products_amount .product_on_amount .buy_now > div {
color: black;
position: absolute;
right: 70px;
bottom: 38px;
}
#modal-products_amount .product_on_amount .mini_image img, #modal-products_amount .product_on_amount .mini_image i {
height:100px;
width: auto
}
#modal-products_amount .product_on_amount .mini_image .ty-product-block__img {
width: 100%;
height: 100%;
}
#modal-products_amount .modal_content {
padding: 0;
}
#modal-products_amount .modal_content ul {
padding: 10px 0px 10px;
}
#modal-products_amount .modal_content ul li {
color: black;
background-color: white;
transition: background-color .3s ease-in-out;
font-size: 16px;
}
#modal-products_amount .modal_content ul li label > span {
/* position: absolute; */
/* right: 20px; */
font-size: 15px;
color: var(--main-color-grafit);
flex: 1 1 33%;
}
#modal-products_amount .modal_content ul li span:first-child {
font-weight: 500;
}
#modal-products_amount .modal_content ul li label > span:first-child > span {
font-size: 12px;
color: grey!important;
}
#modal-products_amount .modal_content ul li > span:nth-child(2) {
}
#modal-products_amount .modal_content ul li span:nth-child(3) {
text-align: right;
align-self: center;
}
#modal-products_amount .modal_content ul li label {
display: flex;
padding: 15px 20px;
justify-content: space-between;
}
#modal-products_amount .modal_content ul li label input[type=radio] {
margin-right: 10px;
margin-top: -2px;
}
/*#modal-products_amount .modal_content ul li:hover {*/
/*background-color: #f1f1f1;*/
/*}*/
.shop_is_open > span > span {
color: #6fa13e;
font-size: 15px!important;
}
.shop_is_close > span > span {
color: #cc504f;
font-size: 15px;
}
.shop_is_open > span, .shop_is_close > span {
color: grey!important;
font-size: 12px!important;
}
.shop_is_open, .shop_is_close {
display: flex;
justify-content: center;
}
.open_products_amount_modal {
cursor: pointer;
}
#modal-products_amount {
/*position: fixed;*/
}
@media screen and (max-width: 800px) {
#modal-products_amount .modal_content ul li label {
flex-wrap: wrap;
justify-content: center;
}
#modal-products_amount .modal_content ul li label > span:first-child {
flex: 1 1 100%;
text-align: center;
}
#modal-products_amount .modal_content ul li span {
padding: 5px;
}
#modal-products_amount .product_on_amount .buy_now > div {
bottom: 65px;
right: 21px!important;
font-size: 20px;
font-weight: 500;
}
#modal-products_amount .product_on_amount div.product_inf_on_amount + div {
position: absolute;
left: 21px;
bottom: 50px;
}
#modal-products_amount .product_on_amount .product_inf_on_amount {
width: 100%;
margin-top: -90px;
padding: 0 24px;
}
#modal-products_amount .product_on_amount .buy_now .carousel-products__item_line_basket {
bottom: 52px;
left: 170px!important;
}
.fancybox-content#modal-products_amount {
/*position: fixed;*/
padding: 0!important;
}
}
.price_for_one {
text-align: right;
font: 100 14px/16px Roboto medium!important;
}
div.price_for_one {
font-size: 12px !important;
}
.detail-product__price {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.detail-product__price > span {
flex: 1 1 19%;
}
.detail-product__price > h2 {
flex: 1 1 75%;
text-align: right;
}
.detail-product__price .detail-product__price_order {
flex: 1 1 10%;
padding: 0 !important;
}
.detail-product__price .ty-qty.changer {
display: flex;
}
.detail-product__price .ty-product-block__button {
/*flex: 1 1 50%;*/
}
.ty-grid-list__image a {
display: flex;
max-height: 180px;
flex-direction: column;
justify-content: center;
max-width: 100%;
align-items: center;
height: 180px;
}
.ty-grid-list__image a img {
max-width: 100%;
vertical-align: middle;
}
/*.cm-value-changer.ty-value-changer {
display: flex;
}*/
.shops__st_block.shops__time_close, .shops__st_block.shops__time_open {
display: inline-flex;
align-items: center;
}
.shops__st {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-content: center;
align-items: center;
}
.shops__st > h2 {
flex: 1 1 100%;
}
.product_on_amount .slider-n-mobile {
display: none!important;
}
.slider-n.ty-product-thumbnails{
/*height:610px;*/
/*position: relative!important;*/
/*top: 0!important;*/
/*margin-top: -300px!important;*/
}
@media screen and (max-width: 940px) {
.slider-n.ty-product-thumbnails {
height: 172px!important;
top: 85px!important;
}
.slider-n-mobile {
overflow: auto!important;
}
}
.slider-n-mobile {
max-height: 740px;
overflow: hidden;
}
#modal-8 .slider-n.ty-product-thumbnails {
max-height: 80vh;
position: absolute!important;
margin-top: 0!important;
top: 50px!important;
}
@media screen and (max-width: 800px) {
.shops__st_block.shops__time_close, .shops__st_block.shops__time_open {
justify-content: center;
}
}
.products_on_order_modal_header {
padding: 0!important;
border-bottom: 1px solid #d8d4e9;
font-size: 14px!important;
font-weight: 500;
color: var(--main-color-grafit);
}
.products_on_order_modal_header li label span {
font-size: 14px!important;
}
.products_on_order_modal_header li label > span:nth-child(2) {
text-align: center;
}
#modal-products_amount .modal__title {
border-bottom: none!important;
padding-bottom: 0!important;
}
* {
font-family: Roboto;
}
@media screen and (max-width: 940px) {
.detail-product__content_title > .detail-product__content_title > h1 {
display: none;
}
}
.pg-overlay {
position: fixed;
width: 100%;
height: 100%;
visibility: hidden;
top: 0;
left: 0;
z-index: 100000;
opacity: 0;
background: rgba(67, 68, 94, 0.8);
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
vertical-align: middle;
}
.tire__time h3, .tire__time .wrapper {
color: var(--main-color-grafit);
text-transform: uppercase;
text-align: center;
margin-bottom: 10px;
}
.pg-spinner {
width: 180px;
height: 90px;
text-align: center;
font-size: 10px;
margin-left: -90px;
margin-top: -45px;
top: 50%;
left: 50%;
position: absolute;
}
.pg-spinner > div {
background-color: #fff;
height: 100%;
width: 20px;
display: inline-block;
margin: 3px;
border-radius: 4px;
-webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
animation: sk-stretchdelay 1.2s infinite ease-in-out;
}
.pg-spinner .rect2 {
-webkit-animation-delay: -1.1s;
animation-delay: -1.1s;
}
.pg-spinner .rect3 {
-webkit-animation-delay: -1.0s;
animation-delay: -1.0s;
}
.pg-spinner .rect4 {
-webkit-animation-delay: -0.9s;
animation-delay: -0.9s;
}
.pg-spinner .rect5 {
-webkit-animation-delay: -0.8s;
animation-delay: -0.8s;
}
@-webkit-keyframes sk-stretchdelay {
0%, 40%, 100% { -webkit-transform: scaleY(0.4) }
20% { -webkit-transform: scaleY(1.0) }
}
@keyframes sk-stretchdelay {
0%, 40%, 100% {
transform: scaleY(0.4);
-webkit-transform: scaleY(0.4);
opacity: 0;
} 20% {
transform: scaleY(1.0);
-webkit-transform: scaleY(1.0);
opacity: 1;
}
}
.title-blocks__pages h3 {
padding: 25px;
color: var(--main-color-grafit);
text-transform: uppercase;
font: 700 14px/14px Roboto bold;
}
.span16 > .ty-sidebox{display:none;}
.scroller {
position: fixed;
bottom: 0px;
right: 5px;
z-index: 4;
display: none;
cursor: pointer;
background-color: rgba(206,206,206,0.5);
padding: 10px;
}
@media screen and (max-width: 640px) {
.scroller {
display: none!important;
}
}
@media screen and (max-width: 420px) {
.owl-carousel .owl-item .main_promo_wrap img {
width: 100%!important;
}
.main_promo_wrap .main_promo_full {
height: auto!important;
}
}
.queue {
display: flex;
flex-direction: column;
align-items: center;
font-size: 18px;
line-height: 1.2em;
color: var(--main-color-grafit);
font-weight: 700;
}
.ask-btn {
background: white;
margin: 2px;
padding: 30px 5px;
cursor: pointer;
}
.queue__group {
display: flex;
margin: 1px 0;
text-align: center;
justify-content: space-between;
width: 100%;
flex-wrap: wrap;
}
.queue__group--wrap {
border: 2px solid #e4e2ee;
display: flex;
width: 100%;
margin-bottom: 10px;
}
.queue__overall p{
text-align: center;
margin: 10px auto;
color: #434343;
width: 90%;
padding: 0 20px;
}
.queue__overall,
.queue__question,
.queue__answer{
padding: 20px 5px;
background: #fff;
margin: 2px;
transition: .5s;
flex-grow: 1;
overflow: hidden;
}
.queue__small_question {
display: flex;
font-size: 12px;
width: 500px;
margin-left: 285px;
margin-top: 4px;
line-height: 14px;
}
.queue__overall {
/*padding: 20px;*/
}
#queue_select_service .queue__welcome {
margin-bottom: 5px;
line-height: 18px;
}
#queue_select_service .queue__welcome:first-child {
font-size: 24px;
text-align: center;
font-weight: normal;
line-height: 1em;
}
#queue_select_service .queue__welcome:nth-child(2n) {
font-size: 18px;
margin-top: 25px;
color: #737373;
}
.block_step > h2 {
font-size: 18px;
}
.queue__img {
margin-left: 10px;
}
.queue__answer:hover {
background: #e4e2ee;
cursor: pointer;
}
.queue__answer--selected {
background: #e4e2ee;
}
.queue__answer--8-review {
font-size: 12px;
}
.queue__overall--warn {
color: red;
}
.queue__review {
background: #FFFFFF;
text-align: center;
width: 100%;
padding: 10px;
margin: 1px 2px;
text-decoration: none;
color: var(--main-color-grafit);
}
.queue__small {
font-size: 14px;
margin: 1px 2px;
}
#queue_add_info input[type="text"] {
display: block;
margin: 20px auto;
}
#queue_add_info #enroll_phone {
border: 2px solid #999999
}
.queue__wrapper {
display: flex;
flex-direction: column;
margin: 20px auto;
flex-grow: 1;
flex-basis: 25%;
justify-content: stretch;
max-width: 1240px;
}
@media screen and (min-width: 1111px) {
.size-fix {
position: absolute;
}
}
.queue__services {
display: flex;
flex-wrap: wrap-reverse;
flex-direction: row-reverse;
}
.queue__answer {
text-align: center;
flex-basis: 90px;
padding: 20px 10px;
color: #434343;
text-decoration: none;
}
#owl-demo {
max-width: 1240px;
display: block;
margin: 20px auto;
}
.item {
margin: 5px;
}
.owl-dot {
outline: none;
}
.owl-dot span {
background: #b2accb!important;
}
.owl-dot.active span {
background: var(--main-color-grafit)!important;
}
#owl-demo .owl-nav .owl-prev, #owl-demo .owl-nav .owl-next {
font-size: 100px!important;
position: absolute;
outline: none;
color: var(--main-color-grafit)!important;
transition: 300ms;
opacity: 0.5;
margin: 10px!important;
padding: 5px!important;
padding-top: 0!important;
padding-bottom: 15px!important;
}
#owl-demo .owl-nav .owl-prev:hover, #owl-demo .owl-nav .owl-next:hover {
background: rgba(0, 0, 0, .2)!important;
opacity: 1;
}
.owl-prev {
left: 0;
top: 35%;
}
.owl-next {
right: 0;
top: 35%;
}
.not_carousel {
display: none;
}
.main_promo_wrap {
max-width: 400px;
}
@media screen and (min-width: 1200px) {
#owl-demo {
display: none;
}
.not_carousel {
display: flex;
justify-content: center;
}
.main_promo_wrap {
margin: 10px;
max-width: 400px;
}
}
@media screen and (max-width: 1160px) {
.news_block a.g_all_news {
bottom: 30px!important;
}
}
@media screen and (max-width: 800px) {
.news_block a.g_all_news {
bottom: 10px!important;
}
}
.animate-service {
position: absolute;
transition: all 2s;
}
.man {
left: 250px;
}
.car {
left: -20px;
}
.queue__wrapper--right {
flex-grow: 2;
flex-basis: 65%;
}
.queue__wrap {
display: flex;
flex-wrap: wrap;
}
.queue__title {
font: 400 14px/21px Roboto bold!important;
color: var(--main-color-grafit);
text-transform: uppercase;
text-align: left!important;
}
.queue__pluses {
border-bottom: 1px solid #d3d3d3;
margin-bottom: 20px;
padding-bottom: 20px;
}
.radio__hidden {
display: none!important;
}
.radio__hidden:checked + label {
background: #e4e2ee;
}
.radio__hidden_8march:checked + label {
background: #ffbeda;
}
.queue_bonus_link {
font-weight: bold;
color: var(--main-color-grafit);
margin-top: 20px;
display: block;
}
.queue--center {
text-align: center;
}
.queue__answer--add-review {
display: flex;
flex-direction: column;
width: 100%;
}
.queue__answer--add-review > * {
flex-basis: 30px;
padding: 0;
line-height: 30px;
overflow: inherit;
}
.pseudo3d {
position: absolute;
right: 15px;
bottom: 15px;
background: url(../../../../../../../../design/themes/avtoopt/media/svg/sprite.css-2dac796f.svg?1536035416) no-repeat;
background-position: -141px -75px;
width: 29px;
height: 20px;
transform: scale(2);
border-radius: 2px;
box-shadow: 1px 1px 2px grey;
}
#run3d {
position: absolute;
right: 15px;
top: 30px;
background-color: var(--main-color-grafit);
width: 50px;
height: 50px;
text-align: center;
color: #fff;
font-size: 30px;
border-radius: 50%;
line-height: 1.7;
padding: 10px;
box-shadow: 1px 1px 2px grey;
margin: 10px auto;
text-decoration: none;
opacity: .75;
cursor: pointer;
z-index: 100;
display: block;
}
#run3d:hover {
opacity: 1;
}
.queue__answer--bg,
.queue__answer--no-bg{
display: flex;
justify-content: center;
flex-basis: 140px;
}
.queue__answer--n,
.queue__answer--y {
flex-basis: 50px;
}
@media screen and (max-width: 800px) {
.queue__price {
position: fixed;
z-index: 100;
bottom: 55px;
border-top: 5px solid var(--main-color-grafit);
left: 0;
padding: 10px;
width: 93%;
}
#run3d {
top: -30px;
}
}
.queue-price-wrapper {
text-align: center;
margin: 5px auto;
/*width: 120px;*/
color: grey;
}
@media screen and (max-width: 810px) {
.slideout-menu {
position: fixed;
top: 0;
bottom: 0;
width: 256px;
min-height: 100vh;
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
z-index: 0;
display: none;
}
.slideout-menu-left {
left: 0;
}
.slideout-menu-right {
right: 0;
}
.slideout-panel {
position: relative;
z-index: 1;
/*will-change: transform;*/
background-color: #f3f3f3; /* A background-color is required */
min-height: 100vh;
}
.slideout-open,
.slideout-open body,
.slideout-open .slideout-panel {
overflow: hidden;
}
.slideout-open .slideout-menu {
display: block;
}
}
/*.change-pswd .be_sure::after {*/
/*top: 35px;*/
/*}*/
.payVariants img {
min-height: 80px;
}
.progress {
width: 120px;
height: 120px;
text-align: center;
font-size: 10px;
margin-left: -60px;
margin-top: -45px;
top: 50%;
left: 50%;
position: absolute;
}
.progress > svg {
height: 100%;
display: block;
}
@keyframes rotating {
from {
transform: rotate(0deg);
-ms-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
}
to {
transform: rotate(360deg);
-ms-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
}
}
@-webkit-keyframes rotating /* Safari and Chrome */ {
from {
transform: rotate(0deg);
-ms-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
}
to {
transform: rotate(360deg);
-ms-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
}
}
.rotating {
-webkit-animation: rotating 2s linear infinite;
-moz-animation: rotating 2s linear infinite;
-ms-animation: rotating 2s linear infinite;
-o-animation: rotating 2s linear infinite;
animation: rotating 2s linear infinite;
transform-origin: 50% 50%;
}
.brands_title {
font-size: 12px;
margin: 25px 25px 0 25px;
/*float: left;*/
color: var(--main-color-grafit);
}
.brands_container {
max-width: 1240px;
margin: 0 auto;
}
@keyframes service {
to {
transform: translateX(-215px);
}
}
.tire__wrap .service--wrapper {
display: flex;
flex-wrap: nowrap;
justify-content: space-around;
width: 100%;
}
@media screen and (max-width: 760px) {
.tire__wrap .service--wrapper {
display: none;
}
}
.tire__wrap .service__img {
max-width: 310px;
overflow: hidden;
margin: 25px auto;
border-radius: 25px;
height: 200px;
width: auto;
}
/*.tire__wrap .service__img img {*/
/*animation: service 4s linear infinite alternate;*/
/*animation-play-state:paused;*/
/*}*/
/*.tire__wrap .service__img:hover img {*/
/*animation-play-state:running;*/
/*}*/
.basket__card_nav .blackFridayStyleProd {
display: none;
}
.detail-product__price_order_amount {
float: left;
line-height: 20px;
padding: 7px 10px;
/*margin-top: 10px;*/
border: 2px solid var(--main-color-grafit);
border-radius: 25px 0 0 25px;
text-align: center;
}
.detail-product__price_order_amount a {
color: var(--main-color-grafit);
font: 14px Roboto;
display: inherit;
/*cursor: pointer;*/
}
.detail-product__price_order_plus {
padding: 5px 10px;
/*margin-top: 10px;*/
line-height: 00px;
height: 34px;
border: none;
background: var(--main-color-grafit);
border: 2px solid var(--main-color-grafit);
border-radius: 0 25px 25px 0;
font: 14px Roboto;
color: #fff;
font-weight: bold;
border-left: none;
}
@media screen and (max-width: 760px) {
.ty-center {
display: none;
}
.detail-product__price_order {
position: fixed;
bottom: 0;
left: 0;
margin-top: 0;
z-index: 1000;
background-color: white;
}
.ty-product-detail .ty-btn__add-to-cart {
flex: 1 1 100%;
position: fixed;
bottom: 0;
right: 0;
z-index: 1000;
background-color: white;
margin-top: 0px;
width: -webkit-fill-available;
border-radius: 0;
}
.detail-product__price_order_cart{
box-shadow: 0 -1px 3px 0 var(--main-color-grafit)8a;
}
.detail-product__price_order_amount {
flex: 1 1 90%;
bottom: 0;
left: 0;
margin-top: 0;
z-index: 1000;
background-color: white;
border-radius: 0;
}
.detail-product__price_order_plus {
flex: 1 1 10%;
bottom: 0;
right: 0;
z-index: 1000;
margin-top: 0px;
border-radius: 0;
}
.ty-btn__add-to-cart span {
display: inline-block!important;
color: #fff;
}
}
.products_on_order-ajax-loader {
background-image: url('../../../../../../../../design/themes/avtoopt/media/images/addons/products_on_order/ajax-loader.gif?1759911146');
height: 204px;
width: 200px;
display: none;
}
.products_on_order {
clear: both;
}
.products_on_order > span {
display: inline-block;
overflow: hidden;
vertical-align: top;
}
.products_on_order .brand_oem {
width: 200px;
}
.products_on_order .title {
width: 400px;
}
.products_on_order .price {
width: 100px;
float: right;
}
.products_on_order .duration {
width: 100px;
float: right;
}
.products_on_order .buy {
width: 100px;
float: right;
text-align: center;
}
.products_on_order.header {
font-weight: bold;
}
#products_on_order_popup {
display: none;
height: 400px;
}
#products_on_order_popup .ty-cr-product-info-header {
max-width: 400px!important;
}
#products_on_order_popup h3 {
font-size: 20px!important;
}
#content_products_on_order_data_original,
#content_products_on_order_data_analog {
border: 1px solid #666666;
margin: 20px 0;
}
#content_products_on_order_data_original .header,
#content_products_on_order_data_analog .header {
text-align: center;
background-image: linear-gradient(to bottom, #f2f2f2, #f2f2f2);
background-color: #f2f2f2;
border-bottom: 1px solid #666666;
padding: 5px;
text-align: center;
}
/**
* Owl Carousel v2.3.4
* Copyright 2013-2018 David Deutsch
* Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE
*/
.owl-carousel,.owl-carousel .owl-item{-webkit-tap-highlight-color:transparent;position:relative}.owl-carousel{display:none;width:100%;z-index:1}.owl-carousel .owl-stage{position:relative;-ms-touch-action:pan-Y;touch-action:manipulation;-moz-backface-visibility:hidden}.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0}.owl-carousel .owl-stage-outer{position:relative;overflow:hidden;-webkit-transform:translate3d(0,0,0)}.owl-carousel .owl-item,.owl-carousel .owl-wrapper{-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0)}.owl-carousel .owl-item{min-height:1px;float:left;-webkit-backface-visibility:hidden;-webkit-touch-callout:none}.owl-carousel .owl-item img{display:block;width:100%}.owl-carousel .owl-dots.disabled,.owl-carousel .owl-nav.disabled{display:none}.no-js .owl-carousel,.owl-carousel.owl-loaded{display:block}.owl-carousel .owl-dot,.owl-carousel .owl-nav .owl-next,.owl-carousel .owl-nav .owl-prev{cursor:pointer;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel .owl-nav button.owl-next,.owl-carousel .owl-nav button.owl-prev,.owl-carousel button.owl-dot{background:0 0;color:inherit;border:none;padding:0!important;font:inherit}.owl-carousel.owl-loading{opacity:0;display:block}.owl-carousel.owl-hidden{opacity:0}.owl-carousel.owl-refresh .owl-item{visibility:hidden}.owl-carousel.owl-drag .owl-item{-ms-touch-action:pan-y;touch-action:pan-y;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.owl-carousel.owl-grab{cursor:move;cursor:grab}.owl-carousel.owl-rtl{direction:rtl}.owl-carousel.owl-rtl .owl-item{float:right}.owl-carousel .animated{animation-duration:1s;animation-fill-mode:both}.owl-carousel .owl-animated-in{z-index:0}.owl-carousel .owl-animated-out{z-index:1}.owl-carousel .fadeOut{animation-name:fadeOut}@keyframes fadeOut{0%{opacity:1}100%{opacity:0}}.owl-height{transition:height .5s ease-in-out}.owl-carousel .owl-item .owl-lazy{opacity:0;transition:opacity .4s ease}.owl-carousel .owl-item .owl-lazy:not([src]),.owl-carousel .owl-item .owl-lazy[src^=""]{max-height:0}.owl-carousel .owl-item img.owl-lazy{transform-style:preserve-3d}.owl-carousel .owl-video-wrapper{position:relative;height:100%;background:#000}.owl-carousel .owl-video-play-icon{position:absolute;height:80px;width:80px;left:50%;top:50%;margin-left:-40px;margin-top:-40px;background:url('../../../../../../../../design/themes/avtoopt/media/owl.video.play.png?1759911146') no-repeat;cursor:pointer;z-index:1;-webkit-backface-visibility:hidden;transition:transform .1s ease}.owl-carousel .owl-video-play-icon:hover{-ms-transform:scale(1.3,1.3);transform:scale(1.3,1.3)}.owl-carousel .owl-video-playing .owl-video-play-icon,.owl-carousel .owl-video-playing .owl-video-tn{display:none}.owl-carousel .owl-video-tn{opacity:0;height:100%;background-position:center center;background-repeat:no-repeat;background-size:contain;transition:opacity .4s ease}.owl-carousel .owl-video-frame{position:relative;z-index:1;height:100%;width:100%}
/**
* Owl Carousel v2.3.4
* Copyright 2013-2018 David Deutsch
* Licensed under: SEE LICENSE IN https://github.com/OwlCarousel2/OwlCarousel2/blob/master/LICENSE
*/
.owl-theme .owl-dots,.owl-theme .owl-nav{text-align:center;-webkit-tap-highlight-color:transparent}.owl-theme .owl-nav{margin-top:10px}.owl-theme .owl-nav [class*=owl-]{color:#FFF;font-size:14px;margin:5px;padding:4px 7px;background:#D6D6D6;display:inline-block;cursor:pointer;border-radius:3px}.owl-theme .owl-nav [class*=owl-]:hover{background:#869791;color:#FFF;text-decoration:none}.owl-theme .owl-nav .disabled{opacity:.5;cursor:default}.owl-theme .owl-nav.disabled+.owl-dots{margin-top:10px}.owl-theme .owl-dots .owl-dot{display:inline-block;zoom:1}.owl-theme .owl-dots .owl-dot span{width:10px;height:10px;margin:5px 7px;background:#D6D6D6;display:block;-webkit-backface-visibility:visible;transition:opacity .2s ease;border-radius:30px}.owl-theme .owl-dots .owl-dot.active span,.owl-theme .owl-dots .owl-dot:hover span{background:#869791}
.logo {
text-align: right;
margin: 20px;
}
.logo__label {
font-size: 14px;
color: #29166f;
font-weight: bold;
}
.akb-sale {
background-color: #ffffff;
background-image: linear-gradient(17deg, rgba(255,255,255,1) 0%, rgba(255,255,255,1) 33%, rgba(246,41,12,1) 33.28%, rgba(255,26,0,1) 80%, rgba(255,255,255,1) 80.28%, rgba(255,255,255,1) 100%);;
}
.akb-sale__main {
color: #ffffff;
font-size: 28px;
margin: 15px auto;
max-width: 260px;
}
.akb-sale__main--big {
font-size: 120px;
}
.secondary-label {
text-align: center;
color: #29166f;
font-size: 20px;
font-weight: bold;
margin-top: 45px;
}
.akb-sale__akb {
position: relative;
left: 70%;
margin-top: 15px;
}
.akb-sale--button {
background: none;
border: none;
color: white;
background-color: #29166f;
margin: 10px auto;
display: block;
padding: 15px 40px;
font-weight: bold;
font-size: 24px;
}
.owl-carousel .owl-item .main_promo_wrap img {
width: inherit;
}
.logo__img {
width: 150px!important;
margin-left: auto;
}
.condition {
background-color: #fff;
background-image: url('/images/promo/banner-cond.png?2'), url('/images/promo/snow_bottom.png?2');
background-size: contain;
background-position: top, bottom;
display: flex;
flex-direction: column;
justify-content: center;
background-repeat: no-repeat;
}
.condition__label {
background-color: #487dab;
color: #fff;
font-weight: bold;
padding: 15px 30px;
font-size: 26px;
margin-bottom: 10px;
transform: rotate(-20deg);
margin-right: -50px;
}
.condition__text {
color: #487dab;
margin-top: 75px;
font-weight: bold;
align-self: center;
font-size: 20px;
}
.stoika {
background-color: #fff;
align-items: center;
}
.stoika__img {
position: absolute;
bottom: 0;
}
.stoika__img--sells {
height: 100%;
width: auto;
}
.stoika__img--title {
top: 0;
}
.march {
background-color: #fff;
align-items: center;
}
.march__img {
position: absolute;
}
.march__img--bg {
height: 120%;
/*height: auto;*/
right: -10%;
top: -10%;
}
.blink_8march_wrapper img {
display: none;
bottom: 20px;
}
.blink_8march_wrapper img:first-child {
display: block;
}
.march_warn {
font-size: 26px;
color: #d3206e;
position: absolute;
font-weight: 800;
bottom: 10px;
width: 270px;
left: 16%;
}
.march_2020_bg {
width: 100%;
height: 100%;
}
/*.march_2020_bg img {
width: 100%;
height: 100%;
}*/
.march_2020_bg .blink_8march_wrapper .march__img {
max-width: 95%;
}
.promo_block_img_center {
display: flex;
justify-content: center;
}
.promo_block_img_center img {
height: 100%;
}
@media screen and (max-width: 390px) {
.promo_block_img_fix{
align-items: center;
}
.promo_block_img_fix img {
height: auto!important;
width: 100%!important;
}
}
#queue {
margin-top: 50px;
position: relative;
min-width: 910px;
}
#queue h1 {
margin-bottom: 20px;
text-align: center;
text-transform: uppercase;
border-bottom: 1px solid lightgray;
font-size: 200%;
}
#queue .placeholder {
color: #666666;
font-size: 14px;
left: 20px;
position: absolute;
top: 20px;
}
#queue #selectMonth {
position: absolute;
right: 20px;
top: 20px;
}
#queue .calendar {
background-color: #F6F6F6;
border: 1px solid #E8E8E8;
border-radius: 3px;
padding: 20px;
position: relative;
width: 372px;
height: 437px;
}
#queue .calendar .calendar-header {
background-color: #0000ff;
}
#queue .calendar table {
margin-top: 30px;
}
#queue .calendar table tr th {
background-color: #464a49;
font-weight: bold;
color: #ffffff;
height: 37px !important;
line-height: 37px !important;
}
#queue .calendar table tr th,
#queue .calendar table tr td {
border: 1px solid #ffffff;
height: 52px;
width: 52px;
line-height: 52px;
text-align: center;
font-size: 16px;
}
#queue .calendar table tr td {
background: url('../../../../../../../../design/themes/avtoopt/media/../../../../../../design/themes/responsive/templates/addons/queue/images/calendar_bg.png?1759911146');
color: #281668;
}
#queue .calendar table tr td:not(.past-day) {
cursor: pointer;
}
#queue .calendar table tr td.past-day {
cursor: not-allowed;
}
/*#queue .calendar .past-day {*/
/*background-color: graytext;*/
/*color: #cfcbd9;*/
/*}*/
/*#queue .calendar .free-day {*/
/*background-color: lightgreen;*/
/*}*/
#queue .calendar .occupied-day span {
background: url('../../../../../../../../design/themes/avtoopt/media/../../../../../../design/themes/responsive/templates/addons/queue/images/calendar_occupied.png?1759911146') no-repeat scroll 37px 5px rgba(0, 0, 0, 0);
cursor: not-allowed !important;
display: block;
}
#queue .calendar .inactive {
color: #cfcbd9;
cursor: not-allowed !important;
}
#queue .calendar .help .occupied-day {
background-color: #e64169;
}
#queue .calendar .part-day {
background-color: lightyellow;
}
#queue .calendar .current-day {
text-transform: uppercase;
font-size: 18px;
font-weight: bold;
}
#queue .calendar .help {
margin-top: 20px;
}
#queue .calendar .help div {
line-height: 30px;
}
#queue .calendar .help span {
width: 20px;
height: 20px;
display: inline-block;
vertical-align: middle;
}
#queue .schedule {
position: absolute;
top: 50px;
height: 438px;
margin-left: 450px;
background-color: #F6F6F6;
border: 1px solid #E8E8E8;
border-radius: 3px;
padding: 20px;
}
#queue .schedule #dayTimes {
margin-top: 30px;
}
#queue .schedule .column>div.free,
#queue .schedule .column>div.occupied {
background: linear-gradient(to bottom, #fefcea, #a9a9a9);
color: #28166c;
font-size: 20px;
font-weight: bold;
height: 40px;
line-height: 40px;
margin: 0 2px 4px;
text-align: center;
width: 97px;
position: relative;
}
#queue .column {
float: left;
}
#queue .schedule .column>div.free {
background-color: green;
cursor: pointer;
}
#queue .schedule .column>div.occupied {
background: linear-gradient(to top right, #fefcea, #d7d7d7);
cursor: not-allowed;
color: #cccccc;
}
#enroll {
background: none repeat scroll 0 0 #FFFFFF;
border: 1px solid #CCCCCC;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
display: none;
/*height: 335px;*/
left: 50%;
margin: -160px 0 0 -180px;
position: absolute;
top: 50%;
width: 360px;
z-index: 100;
border-radius: 7px 7px 7px 7px;
}
#enroll_wrapper {
background-color: #000000;
display: none;
height: 100%;
left: 0;
opacity: 0.8;
position: absolute;
top: 0;
width: 100%;
z-index: 50;
}
#enroll > .wrapper {
margin: 30px;
}
#enroll > .wrapper input {
margin-bottom: 10px;
}
#enroll > .wrapper textarea {
width: 300px !important;
height: 60px !important;
}
#enroll h3 {
font-size: 16px;
font-weight: bold;
margin: 20px 0 10px;
text-align: center;
}
#enroll h4 {
font-size: 14px;
font-weight: bold;
text-align: center;
}
#enroll div.button {
text-align: right;
margin-top: 5px;
width: 100%;
}
#enroll div.button input[type="button"] {
background-color: #777;
border: 1px solid #ccc;
padding: 3px;
text-shadow: 0 0 1px rgba(0, 0, 0, 0.4);
border-radius: 5px;
box-shadow: 0 0 5px rgba(0,0,0,0.3);
color: #fff;
cursor: pointer;
}
#enroll #enroll_close {
width: 16px;
height: 16px;
background: url('../../../../../../../../design/themes/avtoopt/media/../../../../../../design/themes/responsive/templates/addons/queue/images/window-close.png?1759911146');
position: absolute;
top: 3px;
right: 3px;
}
#enroll a {
outline: none;
}
#enroll .error {
background-color: #ffa3a2;
}
#enroll .input-text-large {
width: 300px;
}
#garage_wizard {
width: 400px;
height: 500px;
}
#garage_wizard #garage_add_car_prev {
float: left;
display: none;
}
#garage_wizard #garage_add_car_next, #garage_wizard #garage_add_car_create {
float: right;
}
#garage_wizard #garage_add_car_create {
display: none;
}
#garage_wizard select {
height: 200px;
width: 100%;
font-size: 16px;
}
#garage_wizard #garage_wizard_navigation p {
padding: 2px 0;
width: 100%;
}
#garage_wizard #garage_wizard_navigation p span {
float: right;
}
#car_finish {
display: none;
}
.ty-compact-list__price .ty-strike {display: none;}
.ty-compact-list__title a {display: inline-block;}
.ty-compact-list__title a {color: #333333; cursor: inherit}
.ty-compact-list__title a:hover {color: #333333;}
.ty-compact-list__title a.underline {text-decoration: underline; cursor: pointer}
.ty-compact-list__title a:not(.underline):hover {text-decoration: none;}
.ty-compact-list__sku {float: left; padding: 7px 0; margin-left: 5px; width: 50px;}
.ty-compact-list__add_to_cart {display: inline-block; padding: 0 5px; width: 120px;}
.ty-compact-list__controls .ty-qty select, .ty-compact-list__controls .ty-value-changer {min-width: 62px;}
.ty-compact-list__controls .ty-qty input {min-width: 45px; text-align: left!important;}
.ty-compact-list__item {padding: 5px 0!important; height: inherit!important;line-height: inherit!important; overflow: visible!important;}
.ty-compact-list__title {margin: 0!important; width: 38%!important;}
.ty-compact-list__header {background-color: #dfdfdf; font-weight: bold; margin-bottom: 5px;}
.ty-compact-list__header .ty-compact-list__price {margin: 8px 40px;}
.ty-compact-list__analogues {float: left; width: 40px; text-align: center;padding: 7px 0;}
.ty-compact-list__description {float: left; width: 20px; text-align: center;padding: 7px 0;}
.ty-compact-list__analogues a {outline: none!important;}
.ty-compact-list__analogues_list {background-color: #eefdfe; display: none;border: 1px solid gray; border-radius: 5px; padding: 10px 0; position: relative;}
.ty-compact-list__description_list {background-color: #eefdfe; display: none;border: 1px solid gray; border-radius: 5px; padding: 10px; position: relative;}
.ty-compact-list__analogues_list h4, .ty-compact-list__description_list h4 {text-align: center;}
.ty-compact-list__image {width: 30px!important;padding: 0 25px 0 0!important;margin-top: 6px;}
.ty-compact-list__price {width: 110px!important;margin: 8px 0!important;}
.ty-compact-list__image .ty-no-image {background: transparent!important;}
.ty-compact-list__header .ty-compact-list__title {padding: 7px 0;}
.ty-compact-list__header .ty-compact-list__image {margin-top: 8px;}
.span13.main-content-grid .ty-sort-container {background: transparent!important;}
.ty-compact-list__analogues_list .analogues_close_button, .ty-compact-list__description_list .description_close_button {position: absolute; right: 5px; top:5px; cursor: pointer;}
.ty-compact-list__image {float: left !important;}
.ty-compact-list__package {float: left !important; padding: 7px 0; width: 60px;}
.ty-compact-list__qty {float: left !important; padding: 7px 0; width: 50px;}
.ty-compact-list__item .ty-qty {width: 45px;}
@media (max-width: 1110px) {
.ty-compact-list__title {margin: 0!important; width: 30%!important;}
.ty-compact-list__title a {font-size: 10px;}
}
@media (max-width: 961px) {
.ty-compact-list__item .ty-price-num { font-size: 12px; }
.ty-compact-list__price {width: 80px!important;}
}
@media (max-width: 850px) {
.ty-compact-list__add_to_cart {display: inline-block; padding: 0 5px; width: 80px; font-size: 10px}
.ty-compact-list__add_to_cart a {font-size: 10px;}
}
@media (max-width: 800px) {
.ty-compact-list__item .ty-price-num { font-size: 10px; }
.ty-compact-list__price {width: 65px!important;}
}
@media (max-width: 768px) {
.opt_cart_link { margin: 8px 0 0 25px; }
}
.span16 > .ty-sidebox {display: none;}
.ty-dropdown-box__content .ty-account-info__buttons { margin-top: 0!important;}
.ty-compact-list .grouped_date {
text-align: center;
font-size: 16px;
background-color: #eff0ef;
padding: 3px;
margin: 3px 0;
}
table.partner tr {vertical-align:top !important; }
table.partner img {height:50px !important; float:left; margin:8px; }
div.partner img {height:50px !important; margin:8px;}
div.partner p { margin:8px 0; }
.sticky {
position: -webkit-sticky !important;
position: -moz-sticky !important;
position: -ms-sticky !important;
position: -o-sticky !important;
position: sticky !important;
opacity: 1;
z-index: 99;
top: 0;
}
.ty-status-info__inline{
margin-top: 2px;
}
.garage {
display: flex;
align-items: flex-start;
flex-wrap: wrap;
}
.panel {
background: white;
border-radius: 5px;
padding: 15px;
min-width: 220px;
}
.chat_panel {
max-width: 500px;
margin: 15px auto!important;
}
.car-card__specs {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
align-items: center;
}
.car-panel {
flex: 3;
}
.right-panel {
flex: 1;
}
.garage button,
.car-card h2,
.car-card h3,
.car-card ol,
.car-card__specs,
.car-card p,
.panel {
margin: 15px;
}
.car-card__specs img {
margin: 10px auto;
}
.car-card h2 {
color: #161616;
font-size: 18px;
/*margin-bottom: 30px;*/
}
.car-card ul,
.car-card ol {
font-size: 12px;
font-weight: 300;
line-height: 21px;
min-width: 55px;
}
.car-card ol {
list-style: decimal;
margin-left: 30px;
}
.car-card h3 {
font-size: 16px;
}
.car-card__diag {
display: flex;
flex-wrap: wrap;
align-items: flex-start;
}
.car-card__diag button {
flex: 2;
}
.car-card__diag p {
flex: 1 150px;
font-size: 12px;
line-height: 18px;
}
.garage button {
display: block;
border: none;
background: #29166f;
color: white;
padding: 10px 20px;
font-family: Roboto;
font-weight: 500 ;
border-radius: 20px;
outline: none;
font-size: 14px;
}
.garage hr {
border: none;
color: #ebebeb;
background-color: #ebebeb;
height: 2px;
}
.extra-panel h2 {
color: #29166f;
font-size: 12px;
font-weight: 700;
line-height: 21px;
text-transform: uppercase;
}
.garage a {
color: #29166f;
font-size: 12px;
font-weight: 300;
line-height: 18px;
}
.extra-panel p {
font-size: 12px;
line-height: 18px;
text-align: center;
}
.extra-panel button {
/*width: 150px;*/
display: block;
margin: 20px auto;
}
.share-panel {
color: #040404;
font-size: 12px;
font-weight: 400;
text-align: center;
}
.share-panel cite {
color: #040404;
font-weight: 300;
font-style: normal;
border-radius: 20px;
border: 13px solid #f7f7f7;
margin: 15px;
display: block;
padding: 4px;
padding-left: 30px;
background: #f7f7f7 url('../../../../../../../../design/themes/avtoopt/media/../../../../images/personal_area/copy.png?1759911146') no-repeat 3px;
overflow: auto;
}
.pdf-panel {
padding-left: 20%;
background: #fff url('../../../../../../../../design/themes/avtoopt/media/../../../../images/personal_area/pdf.png?1759911146') no-repeat 10%;
}
.car-panel .car-card .add-car {
padding-right: 50px;
background: #29166f url('../../../../../../../../design/themes/avtoopt/media/../../../../images/personal_area/plus.png?1759911146') no-repeat 90%;
}
.local-ref {
display: flex;
justify-content: space-between;
}
.extra-panel li,
.local-ref__block {
padding: 10px;
}
.extra-panel li a,
.local-ref__block a {
margin-left: 30px;
display: block;
}
@media screen and (max-width: 580px) {
.panel {
margin: 15px 0;
}
}
.car-card__head {
display: flex;
justify-content: space-between;
align-items: center;
}
.car-card__head a {
margin: 15px;
}
.car-card__status {
display: flex;
flex-direction: column;
align-items: center;
margin: 20px;
}
.car-card__status p {
font-size: 12px;
font-weight: 300;
line-height: 24px;
margin: 0
}
.car-card__status img {
margin: 10px;
}
.car-card .btn-more {
margin: 15px auto;
display: block;
border: none;
background: #29166f;
color: white;
padding: 10px 20px;
font-weight: 500 ;
border-radius: 20px;
font-size: 14px;
width: 145px;
text-decoration: none;
}
.service-dates {
background-color: #f3f3f3;
border-radius: 5px;
border: 1px solid #ded9f1;
}
.service-dates__calendar {
display: flex;
border-radius: 3px;
margin: 10px 0;
padding: 8px;
background: #fff;
align-items: flex-start;
}
.service-dates__calendar p {
margin: 6px 12px;
color: #161616;
font-size: 11px;
font-weight: 300;
line-height: 18px;
}
.extra-panel .service-dates__calendar p {
border-left: 5px dotted #e6e6e8;
padding-left: 2px;
}
.service-dates__calendar .date {
padding: 5px;
color: #29166f;
font-size: 18px;
font-weight: 500;
line-height: 18px;
text-align: center;
}
.service-dates__calendar .date .date--month,
.service-dates__calendar--wrap .mileage {
color: #8d88a0;
font-size: 12px;
font-weight: 500;
line-height: 18px;
}
.car-card .service-dates__calendar {
border: 1px solid #ebeaec;
border-radius: 7px;
}
.car-card .service-dates__calendar .date {
border: none;
}
.car-card__head--btn-add {
padding-left: 30px!important;
background: #29166f url('../../../../../../../../design/themes/avtoopt/media/../../../../images/personal_area/plus.png?1759911146') no-repeat 10% 50%!important;
}
.car-card__more {
display: block;
width: 100px;
margin: 0 auto;
}
.service-dates__calendar--wrap {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
width: 100%;
align-items: flex-end;
}
.service-dates__calendar--wrap p {
margin: 10px 0;
}
.service-dates__calendar--wrap:first-child {
flex-wrap: nowrap;
}
.service-dates__calendar--panel {
display: flex;
align-items: baseline;
/*justify-content: space-between;*/
/*width: 100%;*/
}
/*#history-slider .service-dates__calendar--panel {*/
/*width: 100%;*/
/*}*/
.service-dates__calendar--wrap .service-dates__calendar--panel h3 {
margin: 0;
font-size: 13px;
}
.service-dates__calendar--panel button {
border: none;
color: #000;
margin: 2px;
padding: 0;
width: 15px;
height: 15px;
}
.car-card__add-payment {
display: flex;
flex-wrap: wrap;
}
.car-card .car-card__add-payment button {
margin: 5px 10px;
flex: 1;
}
.car-card__stats {
display: flex;
justify-content: space-between;
align-items: flex-end;
}
.car-card__stats ul {
margin: 15px;
}
.car-detail--wrap {
display: flex;
align-items: center;
}
.car-detail__specs {
display: flex;
flex-direction: column;
width: 100%;
}
.car-detail__head {
display: flex;
justify-content: space-between;
align-items: center;
}
.car-detail__head--left {
display: flex;
align-items: center;
}
.car-detail__head--left .danger {
color: #d8254c;
font-size: 13px;
}
.car-detail__head--left .ok {
color: #6bb138;
font-size: 13px;
}
.car-detail__trouble--main {
font-size: 12px;
line-height: 24px;
/*margin: 0 15px;*/
width: 100%;
display: flex;
justify-content: space-between;
}
.car-detail__trouble--urgent {
font-size: 12px;
line-height: 24px;
font-weight: 500;
color: #d8254c;
}
.car-detail__trouble {
display: flex;
}
.modal--wrap {
display: flex;
justify-content: center;
align-items: flex-start;
margin-bottom: 30px;
position: absolute;
top: 0;
left: 0;
z-index: 1001;
width: 100%;
height: 100%;
}
.modal--wrap button {
background: none;
border: none;
outline: none;
color: #29166f;
font-size: 12px;
font-weight: 700;
text-transform: uppercase;
}
.modal--wrap {
background-color: rgba(67,68,94,.75);
display: none;
}
.modal-service__head {
border-bottom: 1px solid #ebe9f5;
display: flex;
justify-content: space-between;
align-items: center;
color: #29166f;
font-size: 14px;
line-height: 21px;
text-transform: uppercase;
padding: 20px;
}
.modal-service {
background: white;
border-radius: 5px;
margin-top: 180px;
max-width: 725px;
padding: 10px;
text-align: center;
min-width: 250px;
}
#change_plan .modal-service,
#edit_plan .modal-service {
margin-top: 450px;
}
.modal-service__buttons {
margin: 40px 20px;
display: flex;
}
.modal-service .modal-service__button {
padding: 20px;
border-right: 1px solid #ebe9f5;
transition: 0.5s;
}
.modal-service .modal-service__button:hover {
background-color: rgba(67,68,94,.25);
}
.modal-service .modal-service__button:last-child {
border:none;
}
.modal-service__form {
display: flex;
flex-direction: column;
padding: 10px;
}
.inputfile {
width: 0.1px;
height: 0.1px;
opacity: 0;
overflow: hidden;
position: absolute;
z-index: -1;
}
#upload-container {
display: block;
padding: 70px 70px;
border-radius: 20px;
font-size: 14px;
text-align: center;
margin: 0 20px;
border: 5px dashed #e4e4e4;
color: #777777;
cursor: pointer; /* "hand" cursor */
line-height: 1.5em;
max-width: 300px;
}
#upload-container.dragover {
background-color: #fafafa;
outline-offset: -17px;
}
.modal-service__form input[type="text"],
.modal-service__form input[type="date"],
.modal-service__form input[type="number"],
.modal-service__form input[type="tel"],
.modal-service__form textarea,
.modal-service__form select,
.customer-notes__text {
display: block;
border-radius: 20px;
border: 1px solid #b2accb;
line-height: 21px;
margin: 0 10px 10px 5px;
padding: 6px 12px;
background-color: white;
outline: none;
max-width: 330px;
width: 85%;
}
textarea {
resize: none;
}
.modal-service__form a {
display: block;
color: #29166f;
font-size: 12px;
font-weight: 300;
line-height: 21px;
margin: 10px;
}
.modal-service__form button,
.modal-service__form input[type="submit"],
#btn-delete {
display: block;
border: none;
background: #29166f;
color: white;
padding: 10px 20px;
font-weight: 500 ;
border-radius: 20px;
outline: none;
font-size: 14px;
margin: 20px;
text-transform: none;
}
.modal-service__form input::placeholder {
color: #29166f;
font-size: 14px;
font-weight: 300;
line-height: 21px;
opacity: 0.5;
}
.own-work {
display: flex;
align-items: center;
margin: 5px 10px;
color: #29166f;
}
.own-work a {
text-decoration: underline;
display: inline-block;
}
.add_own_work {
background-color: rgba(67, 68, 94, .5);
display: flex;
flex-direction: column;
border-radius: 10px;
}
.add_own_work option {
color: #29166f;
font-size: 14px;
font-weight: 300;
line-height: 21px;
opacity: 0.5;
}
.add_work {
color: #29166f;
font-size: 14px;
font-weight: 300;
line-height: 21px;
display: flex;
justify-content: space-between;
align-items: center;
margin: 5px;
}
.add_work div {
display: flex;
align-items: center;
}
.add_work input[type="checkbox"] {
margin-right: 4px;
}
.material {
display: flex;
}
.material label {
margin-right: 6px;
color: #29166f;
font-size: 14px;
font-weight: 300;
line-height: 21px;
}
.hor_group {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
}
.hor_group [type=number] {
max-width: 60px;
}
.btn_group {
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.modal-service__form .btn-alert {
background-color: #d8254c;
}
.car_card_props {
display: flex;
justify-content: space-around;
margin: 0 auto;
align-items: flex-end;
}
.car-photo-wrap {
position: relative;
}
.car-photo-wrap .car-load-photo {
display: none;
}
.car-photo-wrap:hover .car-load-photo {
display: block;
position: absolute;
bottom: 13px;
left: 0;
color: white;
font-size: 12px;
background-color: rgba(0, 0, 0, 0.5);
width: 100%;
cursor: pointer;
text-align: center;
padding: 5px 0;
}
.diag_comment{
margin: 10px;
padding: 5px 10px;
position: relative;
border: 1px solid #ccc;
border-radius: 5px;
max-width: 300px;
}
.lowest--wrapper::before, .lowest--wrapper::after {
content: '';
position: absolute;
left: -20px;
top: 10px;
border: 10px solid transparent;
border-right: 10px solid #ccc;
}
.lowest--wrapper::after {
border-right: 10px solid white;
left: -19px;
top: 10px;
}
.arr_bot{
width: 0;
height: 0;
position: absolute;
top: -20px;
left: 10px;
border: 10px solid transparent;
border-bottom-color: #ccc;
}
.arr_bot:after{
content: '';
width: 0;
height: 0;
position: absolute;
bottom: -16px;
right: -15px;
border: 15px solid transparent;
border-bottom-color: #fff;
}
.car-detal__pic {
align-self: flex-start;
}
.gallery-image {
margin: 5px;
display: block;
border-radius: 10px;
}
#gallery-div {
display: flex;
flex-wrap: wrap;
justify-content: center;
max-width: 725px;
max-height: 625px;
overflow-y: auto;
}
.gallery-capture {
margin: 3px auto;
font-size: 10px;
max-width: 150px;
text-align: center;
color: #555;
}
.gallery-label {
cursor: pointer;
margin: 5px;
border: 1px dashed #b2accb;
border-radius: 10px;
}
.gallery-radio:checked + label {
background: #b2accb;
color: white;
border-radius: 10px;
}
.car_avatar {
height: 100px;
width: auto;
object-fit: contain;
}
[name="brand"],
[name='type'] {
display: none!important;
}
.for_hidden {
cursor: pointer;
padding: 10px 15px;
border-radius: 15px;
border: 1px solid #b2accb;
}
[name="brand"]:checked + .for_hidden,
[name='type']:checked + .for_hidden {
background: #b2accb;
color: #fff;
}
.statistic_table {
font-size: 12px;
width: 100%;
margin: 10px 0;
}
.statistic_table tr td {
padding: 3px 0;
}
.statistic_table tr td:last-child {
text-align: right;
}
.statistic_table tr.anchor td {
text-align: center;
}
.statistic_table tr td.last_fuel {
text-align: left;
color: #888;
}
.can_click {
cursor: pointer;
}
.product__wrapper {
border-bottom: 1px solid #eee;
/*border-radius: 5px;*/
padding: 5px;
align-items: center;
margin: 5px;
display: flex;
}
.product__title {
font-size: 10px!important;
text-decoration: none;
line-height: 1.5em;
flex: 250px 1 1;
color: black!important;
}
.product__price {
font-size: 12px!important;
font-weight: 700;
text-align: right;
}
.rec-product__hide {
display: none;
position: relative;
}
.car-detail__trouble--main {
padding: 10px 0;
}
.product__amount {
font-size: 10px!important;
text-align: right;
}
.show_related_products {
text-decoration: none;
font-weight: bold!important;
}
.diag_buttons {
display: none;
border: 1px solid #f3f3f3;
background: #f3f3f3;
padding: 7px 7px 0 7px;
border-radius: 5px;
max-height: 25px;
min-width: 60px;
}
.diag_buttons a {
opacity: 0.5;
transition: 300ms;
}
.diag_buttons a:hover {
opacity: 1;
}
.car-detail__trouble:hover .diag_buttons {
display: inline-block;
}
.diag-label {
min-height: 35px;
}
.car_feedback__header {
display: flex;
justify-content: space-between;
align-items: center;
}
.car_feedback__text {
display: flex;
justify-content: space-between;
align-items: flex-start;
}
.car_feedback__date {
font-size: 10px;
color: #5f5f5f;
text-align: right;
line-height: 1.5em;
}
.car_feedback__title {
font-size: 14px!important;
}
.car_feedback__status {
margin: 13px;
text-align: right;
font-size: 13px;
}
.car_feedback__cite {
font-size: 12px;
line-height: 1.5em;
}
.chat__bubble {
font-size: 12px;
color: #5c4d92;
background: #f3f1f9;
padding: 10px 20px;
max-width: 300px;
line-height: 1.5em;
border-radius: 50px;
margin: 10px;
width: fit-content;
}
.garage_chat {
display: flex;
flex-direction: column;
}
.chat__bubble--question {
align-self: flex-end;
}
button.garage_chat_send {
border-radius: 50%;
font-size: 20px;
padding: 8px 13px 8px 8px;
text-align: center;
display: block;
border: none;
background: #29166f;
color: white;
font-weight: 500;
outline: none;
}
.garage_chat__form {
display: flex;
justify-content: space-between;
align-items: center;
}
.garage_chat__input {
width: 100%;
height: fit-content;
border-radius: 25px;
padding: 10px;
border: 1px solid #b2accb;
outline: none;
}
.garage_chat__input::placeholder {
font-size: 12px;
color: #695c9a;
}
.car_feedback__href {
position: absolute;
width: 100%;
height: 100%;
}
.car_feedback {
position: relative;
}
.car_feedback__nothing {
color:#886ca5;
margin: 25px;
text-align: center;
}
.oem_complect_count {
color: #847979;
font-size: 15px;
}
.oem_list {
padding: 0 0 0 60px;
min-height: 100px!important;
}
.oem_list_title {
margin: 20px 0 20px -30px;
font: 500 14px/21px Roboto medium;
text-transform: uppercase;
color: #29166f;
}
.oem_list_dropdown_model {
margin-left: 20px;
}
.oem_list_body {
font: 500 14px/21px Roboto;
}
.oem_list_model_font {
font: 500 18px/25px Roboto;
cursor: pointer;
margin-top: 6px;
}
.oem_list_complect {
list-style-type: square!important;
margin-left: 35px;
}
.oem_list_item {
list-style-type: none!important;
margin-left: 20px;
margin-top: 3px;
font: 500 14px/21px Roboto;
}
.oem_list_item:before {
content: "\2212";
margin-right: 7px;
}
.oem_list_item_font {
font: 12px/21px Roboto;
}
summary.oem_list_body {
cursor: pointer;
margin-top: 3px;
}
details summary::-webkit-details-marker {
display: none
}
details > summary {
list-style: none;
}
details.oem_parent summary.oem_list_model_font:before {
content: "\002b";
margin-right: 10px;
}
details.oem_parent[open] summary.oem_list_model_font:before {
content: "\2212";
margin-right: 10px;
}
details.oem_list_dropdown_model summary.oem_list_body:before {
content: "\002b";
margin-right: 10px;
}
details.oem_list_dropdown_model[open] summary.oem_list_body:before {
content: "\2212";
margin-right: 10px;
}
.availability {
display: flex;
margin: 20px auto;
width: 100%;
justify-content: space-between;
flex-wrap: wrap;
}
.availability__shop {
color: grey!important;
font-size: 12px!important;
text-align: center;
margin: 5px auto;
flex-basis: 105px;
}
.availability__shop img {
opacity: .6;
}
.availability__label {
font-size: 12px;
color: #847979
}
.availability__label div {
color: #6fa13e;
font-size: 12px;
line-height: 1.6;
}
.input-number_detail::-webkit-outer-spin-button,
.input-number_detail::-webkit-inner-spin-button {
-webkit-appearance: none;
-moz-appearance: textfield;
margin: 0;
}
.catalog__filter-line_title-active_shop {
background: #b2accb;
padding: 10px 20px 10px 20px;
color: #fff !important;
-webkit-border-radius: 35px;
-moz-border-radius: 35px;
border-radius: 35px;
border: none !important;
position: relative;
}
.catalog__filter-line_item_shop {
font: 300 14px/21px Roboto light;
color: #29166f;
display: inline-block;
margin-left: 20px;
cursor: pointer;
}
.adaptive-shop {
display: none!important;
}
.catalog__filter-line_shop{
vertical-align: super;
display: inline-block;
float: left;
}
.catalog_filter_line-custom {
float: none!important;
text-align: left!important;
}
.search__filter-shop {
margin-left: 20px;
}
.catalog__category-custom div {
margin: 0 20px 0 25px!important;
}
@media screen and (max-width: 1110px) {
.catalog__filter-line_shop {
display: none;
}
.adaptive-shop {
display: block !important;
margin-top: 20px !important;
}
.catalog__category-custom div {
margin: 0 20px 0 20px!important;
}
}
@media screen and (max-width: 760px) {
.adaptive-shop {
display: none!important;
}
}
.pa_tooltip {
cursor: pointer;
}
.pa_tooltip::after {
background: rgba(0, 0, 0, 0.8);
border-radius: 8px 8px 8px 8px;
box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.5);
color: #FFF;
content: attr(data-tooltip);
margin-top: 15px;
opacity: 0;
padding: 3px 7px;
position: absolute;
visibility: hidden;
transition: all 0.4s ease-in-out;
min-width: 200px;
text-align: center;
margin-left: -230px;
max-width: 230px;
}
.pa_tooltip:hover::after {
opacity: 1;
visibility: visible;
}
@font-face {
font-family: 'Glyphicons Halflings';
src: url('../../../../../../../../design/themes/avtoopt/media/../../../../../../../../design/themes/avtoopt/media/fonts/bs/glyphicons-halflings-regular.eot?1759911146');
src: url('../../../../../../../../design/themes/avtoopt/media/../../../../../../../../design/themes/avtoopt/media/fonts/bs/glyphicons-halflings-regular.eot?1759911146#iefix') format('embedded-opentype'), url('../../../../../../../../design/themes/avtoopt/media/../../../../../../../../design/themes/avtoopt/media/fonts/bs/glyphicons-halflings-regular.woff2?1759911146') format('woff2'), url('../../../../../../../../design/themes/avtoopt/media/../../../../../../../../design/themes/avtoopt/media/fonts/bs/glyphicons-halflings-regular.woff?1759911146') format('woff'), url('../../../../../../../../design/themes/avtoopt/media/../../../../../../../../design/themes/avtoopt/media/fonts/bs/glyphicons-halflings-regular.ttf?1759911146') format('truetype'), url('../../../../../../../../design/themes/avtoopt/media/../../../../../../../../design/themes/avtoopt/media/fonts/bs/glyphicons-halflings-regular.svg?1759911146#glyphicons_halflingsregular') format('svg');
}
.glyphicon {
position: relative;
top: 1px;
display: inline-block;
font-family: 'Glyphicons Halflings';
font-style: normal;
font-weight: normal;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.glyphicon-asterisk:before {
content: "\002a";
}
.glyphicon-plus:before {
content: "\002b";
}
.glyphicon-euro:before,
.glyphicon-eur:before {
content: "\20ac";
}
.glyphicon-minus:before {
content: "\2212";
}
.glyphicon-cloud:before {
content: "\2601";
}
.glyphicon-envelope:before {
content: "\2709";
}
.glyphicon-pencil:before {
content: "\270f";
}
.glyphicon-glass:before {
content: "\e001";
}
.glyphicon-music:before {
content: "\e002";
}
.glyphicon-search:before {
content: "\e003";
}
.glyphicon-heart:before {
content: "\e005";
}
.glyphicon-star:before {
content: "\e006";
}
.glyphicon-star-empty:before {
content: "\e007";
}
.glyphicon-user:before {
content: "\e008";
}
.glyphicon-film:before {
content: "\e009";
}
.glyphicon-th-large:before {
content: "\e010";
}
.glyphicon-th:before {
content: "\e011";
}
.glyphicon-th-list:before {
content: "\e012";
}
.glyphicon-ok:before {
content: "\e013";
}
.glyphicon-remove:before {
content: "\e014";
}
.glyphicon-zoom-in:before {
content: "\e015";
}
.glyphicon-zoom-out:before {
content: "\e016";
}
.glyphicon-off:before {
content: "\e017";
}
.glyphicon-signal:before {
content: "\e018";
}
.glyphicon-cog:before {
content: "\e019";
}
.glyphicon-trash:before {
content: "\e020";
}
.glyphicon-home:before {
content: "\e021";
}
.glyphicon-file:before {
content: "\e022";
}
.glyphicon-time:before {
content: "\e023";
}
.glyphicon-road:before {
content: "\e024";
}
.glyphicon-download-alt:before {
content: "\e025";
}
.glyphicon-download:before {
content: "\e026";
}
.glyphicon-upload:before {
content: "\e027";
}
.glyphicon-inbox:before {
content: "\e028";
}
.glyphicon-play-circle:before {
content: "\e029";
}
.glyphicon-repeat:before {
content: "\e030";
}
.glyphicon-refresh:before {
content: "\e031";
}
.glyphicon-list-alt:before {
content: "\e032";
}
.glyphicon-lock:before {
content: "\e033";
}
.glyphicon-flag:before {
content: "\e034";
}
.glyphicon-headphones:before {
content: "\e035";
}
.glyphicon-volume-off:before {
content: "\e036";
}
.glyphicon-volume-down:before {
content: "\e037";
}
.glyphicon-volume-up:before {
content: "\e038";
}
.glyphicon-qrcode:before {
content: "\e039";
}
.glyphicon-barcode:before {
content: "\e040";
}
.glyphicon-tag:before {
content: "\e041";
}
.glyphicon-tags:before {
content: "\e042";
}
.glyphicon-book:before {
content: "\e043";
}
.glyphicon-bookmark:before {
content: "\e044";
}
.glyphicon-print:before {
content: "\e045";
}
.glyphicon-camera:before {
content: "\e046";
}
.glyphicon-font:before {
content: "\e047";
}
.glyphicon-bold:before {
content: "\e048";
}
.glyphicon-italic:before {
content: "\e049";
}
.glyphicon-text-height:before {
content: "\e050";
}
.glyphicon-text-width:before {
content: "\e051";
}
.glyphicon-align-left:before {
content: "\e052";
}
.glyphicon-align-center:before {
content: "\e053";
}
.glyphicon-align-right:before {
content: "\e054";
}
.glyphicon-align-justify:before {
content: "\e055";
}
.glyphicon-list:before {
content: "\e056";
}
.glyphicon-indent-left:before {
content: "\e057";
}
.glyphicon-indent-right:before {
content: "\e058";
}
.glyphicon-facetime-video:before {
content: "\e059";
}
.glyphicon-picture:before {
content: "\e060";
}
.glyphicon-map-marker:before {
content: "\e062";
}
.glyphicon-adjust:before {
content: "\e063";
}
.glyphicon-tint:before {
content: "\e064";
}
.glyphicon-edit:before {
content: "\e065";
}
.glyphicon-share:before {
content: "\e066";
}
.glyphicon-check:before {
content: "\e067";
}
.glyphicon-move:before {
content: "\e068";
}
.glyphicon-step-backward:before {
content: "\e069";
}
.glyphicon-fast-backward:before {
content: "\e070";
}
.glyphicon-backward:before {
content: "\e071";
}
.glyphicon-play:before {
content: "\e072";
}
.glyphicon-pause:before {
content: "\e073";
}
.glyphicon-stop:before {
content: "\e074";
}
.glyphicon-forward:before {
content: "\e075";
}
.glyphicon-fast-forward:before {
content: "\e076";
}
.glyphicon-step-forward:before {
content: "\e077";
}
.glyphicon-eject:before {
content: "\e078";
}
.glyphicon-chevron-left:before {
content: "\e079";
}
.glyphicon-chevron-right:before {
content: "\e080";
}
.glyphicon-plus-sign:before {
content: "\e081";
}
.glyphicon-minus-sign:before {
content: "\e082";
}
.glyphicon-remove-sign:before {
content: "\e083";
}
.glyphicon-ok-sign:before {
content: "\e084";
}
.glyphicon-question-sign:before {
content: "\e085";
}
.glyphicon-info-sign:before {
content: "\e086";
}
.glyphicon-screenshot:before {
content: "\e087";
}
.glyphicon-remove-circle:before {
content: "\e088";
}
.glyphicon-ok-circle:before {
content: "\e089";
}
.glyphicon-ban-circle:before {
content: "\e090";
}
.glyphicon-arrow-left:before {
content: "\e091";
}
.glyphicon-arrow-right:before {
content: "\e092";
}
.glyphicon-arrow-up:before {
content: "\e093";
}
.glyphicon-arrow-down:before {
content: "\e094";
}
.glyphicon-share-alt:before {
content: "\e095";
}
.glyphicon-resize-full:before {
content: "\e096";
}
.glyphicon-resize-small:before {
content: "\e097";
}
.glyphicon-exclamation-sign:before {
content: "\e101";
}
.glyphicon-gift:before {
content: "\e102";
}
.glyphicon-leaf:before {
content: "\e103";
}
.glyphicon-fire:before {
content: "\e104";
}
.glyphicon-eye-open:before {
content: "\e105";
}
.glyphicon-eye-close:before {
content: "\e106";
}
.glyphicon-warning-sign:before {
content: "\e107";
}
.glyphicon-plane:before {
content: "\e108";
}
.glyphicon-calendar:before {
content: "\e109";
}
.glyphicon-random:before {
content: "\e110";
}
.glyphicon-comment:before {
content: "\e111";
}
.glyphicon-magnet:before {
content: "\e112";
}
.glyphicon-chevron-up:before {
content: "\e113";
}
.glyphicon-chevron-down:before {
content: "\e114";
}
.glyphicon-retweet:before {
content: "\e115";
}
.glyphicon-shopping-cart:before {
content: "\e116";
}
.glyphicon-folder-close:before {
content: "\e117";
}
.glyphicon-folder-open:before {
content: "\e118";
}
.glyphicon-resize-vertical:before {
content: "\e119";
}
.glyphicon-resize-horizontal:before {
content: "\e120";
}
.glyphicon-hdd:before {
content: "\e121";
}
.glyphicon-bullhorn:before {
content: "\e122";
}
.glyphicon-bell:before {
content: "\e123";
}
.glyphicon-certificate:before {
content: "\e124";
}
.glyphicon-thumbs-up:before {
content: "\e125";
}
.glyphicon-thumbs-down:before {
content: "\e126";
}
.glyphicon-hand-right:before {
content: "\e127";
}
.glyphicon-hand-left:before {
content: "\e128";
}
.glyphicon-hand-up:before {
content: "\e129";
}
.glyphicon-hand-down:before {
content: "\e130";
}
.glyphicon-circle-arrow-right:before {
content: "\e131";
}
.glyphicon-circle-arrow-left:before {
content: "\e132";
}
.glyphicon-circle-arrow-up:before {
content: "\e133";
}
.glyphicon-circle-arrow-down:before {
content: "\e134";
}
.glyphicon-globe:before {
content: "\e135";
}
.glyphicon-wrench:before {
content: "\e136";
}
.glyphicon-tasks:before {
content: "\e137";
}
.glyphicon-filter:before {
content: "\e138";
}
.glyphicon-briefcase:before {
content: "\e139";
}
.glyphicon-fullscreen:before {
content: "\e140";
}
.glyphicon-dashboard:before {
content: "\e141";
}
.glyphicon-paperclip:before {
content: "\e142";
}
.glyphicon-heart-empty:before {
content: "\e143";
}
.glyphicon-link:before {
content: "\e144";
}
.glyphicon-phone:before {
content: "\e145";
}
.glyphicon-pushpin:before {
content: "\e146";
}
.glyphicon-usd:before {
content: "\e148";
}
.glyphicon-gbp:before {
content: "\e149";
}
.glyphicon-sort:before {
content: "\e150";
}
.glyphicon-sort-by-alphabet:before {
content: "\e151";
}
.glyphicon-sort-by-alphabet-alt:before {
content: "\e152";
}
.glyphicon-sort-by-order:before {
content: "\e153";
}
.glyphicon-sort-by-order-alt:before {
content: "\e154";
}
.glyphicon-sort-by-attributes:before {
content: "\e155";
}
.glyphicon-sort-by-attributes-alt:before {
content: "\e156";
}
.glyphicon-unchecked:before {
content: "\e157";
}
.glyphicon-expand:before {
content: "\e158";
}
.glyphicon-collapse-down:before {
content: "\e159";
}
.glyphicon-collapse-up:before {
content: "\e160";
}
.glyphicon-log-in:before {
content: "\e161";
}
.glyphicon-flash:before {
content: "\e162";
}
.glyphicon-log-out:before {
content: "\e163";
}
.glyphicon-new-window:before {
content: "\e164";
}
.glyphicon-record:before {
content: "\e165";
}
.glyphicon-save:before {
content: "\e166";
}
.glyphicon-open:before {
content: "\e167";
}
.glyphicon-saved:before {
content: "\e168";
}
.glyphicon-import:before {
content: "\e169";
}
.glyphicon-export:before {
content: "\e170";
}
.glyphicon-send:before {
content: "\e171";
}
.glyphicon-floppy-disk:before {
content: "\e172";
}
.glyphicon-floppy-saved:before {
content: "\e173";
}
.glyphicon-floppy-remove:before {
content: "\e174";
}
.glyphicon-floppy-save:before {
content: "\e175";
}
.glyphicon-floppy-open:before {
content: "\e176";
}
.glyphicon-credit-card:before {
content: "\e177";
}
.glyphicon-transfer:before {
content: "\e178";
}
.glyphicon-cutlery:before {
content: "\e179";
}
.glyphicon-header:before {
content: "\e180";
}
.glyphicon-compressed:before {
content: "\e181";
}
.glyphicon-earphone:before {
content: "\e182";
}
.glyphicon-phone-alt:before {
content: "\e183";
}
.glyphicon-tower:before {
content: "\e184";
}
.glyphicon-stats:before {
content: "\e185";
}
.glyphicon-sd-video:before {
content: "\e186";
}
.glyphicon-hd-video:before {
content: "\e187";
}
.glyphicon-subtitles:before {
content: "\e188";
}
.glyphicon-sound-stereo:before {
content: "\e189";
}
.glyphicon-sound-dolby:before {
content: "\e190";
}
.glyphicon-sound-5-1:before {
content: "\e191";
}
.glyphicon-sound-6-1:before {
content: "\e192";
}
.glyphicon-sound-7-1:before {
content: "\e193";
}
.glyphicon-copyright-mark:before {
content: "\e194";
}
.glyphicon-registration-mark:before {
content: "\e195";
}
.glyphicon-cloud-download:before {
content: "\e197";
}
.glyphicon-cloud-upload:before {
content: "\e198";
}
.glyphicon-tree-conifer:before {
content: "\e199";
}
.glyphicon-tree-deciduous:before {
content: "\e200";
}
.glyphicon-cd:before {
content: "\e201";
}
.glyphicon-save-file:before {
content: "\e202";
}
.glyphicon-open-file:before {
content: "\e203";
}
.glyphicon-level-up:before {
content: "\e204";
}
.glyphicon-copy:before {
content: "\e205";
}
.glyphicon-paste:before {
content: "\e206";
}
.glyphicon-alert:before {
content: "\e209";
}
.glyphicon-equalizer:before {
content: "\e210";
}
.glyphicon-king:before {
content: "\e211";
}
.glyphicon-queen:before {
content: "\e212";
}
.glyphicon-pawn:before {
content: "\e213";
}
.glyphicon-bishop:before {
content: "\e214";
}
.glyphicon-knight:before {
content: "\e215";
}
.glyphicon-baby-formula:before {
content: "\e216";
}
.glyphicon-tent:before {
content: "\26fa";
}
.glyphicon-blackboard:before {
content: "\e218";
}
.glyphicon-bed:before {
content: "\e219";
}
.glyphicon-apple:before {
content: "\f8ff";
}
.glyphicon-erase:before {
content: "\e221";
}
.glyphicon-hourglass:before {
content: "\231b";
}
.glyphicon-lamp:before {
content: "\e223";
}
.glyphicon-duplicate:before {
content: "\e224";
}
.glyphicon-piggy-bank:before {
content: "\e225";
}
.glyphicon-scissors:before {
content: "\e226";
}
.glyphicon-bitcoin:before {
content: "\e227";
}
.glyphicon-btc:before {
content: "\e227";
}
.glyphicon-xbt:before {
content: "\e227";
}
.glyphicon-yen:before {
content: "\00a5";
}
.glyphicon-jpy:before {
content: "\00a5";
}
.glyphicon-ruble:before {
content: "\20bd";
}
.glyphicon-rub:before {
content: "\20bd";
}
.glyphicon-scale:before {
content: "\e230";
}
.glyphicon-ice-lolly:before {
content: "\e231";
}
.glyphicon-ice-lolly-tasted:before {
content: "\e232";
}
.glyphicon-education:before {
content: "\e233";
}
.glyphicon-option-horizontal:before {
content: "\e234";
}
.glyphicon-option-vertical:before {
content: "\e235";
}
.glyphicon-menu-hamburger:before {
content: "\e236";
}
.glyphicon-modal-window:before {
content: "\e237";
}
.glyphicon-oil:before {
content: "\e238";
}
.glyphicon-grain:before {
content: "\e239";
}
.glyphicon-sunglasses:before {
content: "\e240";
}
.glyphicon-text-size:before {
content: "\e241";
}
.glyphicon-text-color:before {
content: "\e242";
}
.glyphicon-text-background:before {
content: "\e243";
}
.glyphicon-object-align-top:before {
content: "\e244";
}
.glyphicon-object-align-bottom:before {
content: "\e245";
}
.glyphicon-object-align-horizontal:before {
content: "\e246";
}
.glyphicon-object-align-left:before {
content: "\e247";
}
.glyphicon-object-align-vertical:before {
content: "\e248";
}
.glyphicon-object-align-right:before {
content: "\e249";
}
.glyphicon-triangle-right:before {
content: "\e250";
}
.glyphicon-triangle-left:before {
content: "\e251";
}
.glyphicon-triangle-bottom:before {
content: "\e252";
}
.glyphicon-triangle-top:before {
content: "\e253";
}
.glyphicon-console:before {
content: "\e254";
}
.glyphicon-superscript:before {
content: "\e255";
}
.glyphicon-subscript:before {
content: "\e256";
}
.glyphicon-menu-left:before {
content: "\e257";
}
.glyphicon-menu-right:before {
content: "\e258";
}
.glyphicon-menu-down:before {
content: "\e259";
}
.glyphicon-menu-up:before {
content: "\e260";
}
.jstree-node,.jstree-children,.jstree-container-ul{display:block;margin:0;padding:0;list-style-type:none;list-style-image:none}.jstree-node{white-space:nowrap}.jstree-anchor{display:inline-block;color:#000;white-space:nowrap;padding:0 4px 0 1px;margin:0;vertical-align:top}.jstree-anchor:focus{outline:0}.jstree-anchor,.jstree-anchor:link,.jstree-anchor:visited,.jstree-anchor:hover,.jstree-anchor:active{text-decoration:none;color:inherit}.jstree-icon{display:inline-block;text-decoration:none;margin:0;padding:0;vertical-align:top;text-align:center}.jstree-icon:empty{display:inline-block;text-decoration:none;margin:0;padding:0;vertical-align:top;text-align:center}.jstree-ocl{cursor:pointer}.jstree-leaf>.jstree-ocl{cursor:default}.jstree .jstree-open>.jstree-children{display:block}.jstree .jstree-closed>.jstree-children,.jstree .jstree-leaf>.jstree-children{display:none}.jstree-anchor>.jstree-themeicon{margin-right:2px}.jstree-no-icons .jstree-themeicon,.jstree-anchor>.jstree-themeicon-hidden{display:none}.jstree-hidden,.jstree-node.jstree-hidden{display:none}.jstree-rtl .jstree-anchor{padding:0 1px 0 4px}.jstree-rtl .jstree-anchor>.jstree-themeicon{margin-left:2px;margin-right:0}.jstree-rtl .jstree-node{margin-left:0}.jstree-rtl .jstree-container-ul>.jstree-node{margin-right:0}.jstree-wholerow-ul{position:relative;display:inline-block;min-width:100%}.jstree-wholerow-ul .jstree-leaf>.jstree-ocl{cursor:pointer}.jstree-wholerow-ul .jstree-anchor,.jstree-wholerow-ul .jstree-icon{position:relative}.jstree-wholerow-ul .jstree-wholerow{width:100%;cursor:pointer;position:absolute;left:0;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.jstree-contextmenu .jstree-anchor{-webkit-user-select:none;-webkit-touch-callout:none}.vakata-context{display:none}.vakata-context,.vakata-context ul{margin:0;padding:2px;position:absolute;background:#f5f5f5;border:1px solid #979797;box-shadow:2px 2px 2px #999}.vakata-context ul{list-style:none;left:100%;margin-top:-2.7em;margin-left:-4px}.vakata-context .vakata-context-right ul{left:auto;right:100%;margin-left:auto;margin-right:-4px}.vakata-context li{list-style:none}.vakata-context li>a{display:block;padding:0 2em;text-decoration:none;width:auto;color:#000;white-space:nowrap;line-height:2.4em;text-shadow:1px 1px 0 #fff;border-radius:1px}.vakata-context li>a:hover{position:relative;background-color:#e8eff7;box-shadow:0 0 2px #0a6aa1}.vakata-context li>a.vakata-context-parent{background-image:url(data:image/gif;base64,R0lGODlhCwAHAIAAACgoKP///yH5BAEAAAEALAAAAAALAAcAAAIORI4JlrqN1oMSnmmZDQUAOw==);background-position:right center;background-repeat:no-repeat}.vakata-context li>a:focus{outline:0}.vakata-context .vakata-context-hover>a{position:relative;background-color:#e8eff7;box-shadow:0 0 2px #0a6aa1}.vakata-context .vakata-context-separator>a,.vakata-context .vakata-context-separator>a:hover{background:#fff;border:0;border-top:1px solid #e2e3e3;height:1px;min-height:1px;max-height:1px;padding:0;margin:0 0 0 2.4em;border-left:1px solid #e0e0e0;text-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;border-radius:0}.vakata-context .vakata-contextmenu-disabled a,.vakata-context .vakata-contextmenu-disabled a:hover{color:silver;background-color:transparent;border:0;box-shadow:0 0 0}.vakata-context li>a>i{text-decoration:none;display:inline-block;width:2.4em;height:2.4em;background:0 0;margin:0 0 0 -2em;vertical-align:top;text-align:center;line-height:2.4em}.vakata-context li>a>i:empty{width:2.4em;line-height:2.4em}.vakata-context li>a .vakata-contextmenu-sep{display:inline-block;width:1px;height:2.4em;background:#fff;margin:0 .5em 0 0;border-left:1px solid #e2e3e3}.vakata-context .vakata-contextmenu-shortcut{font-size:.8em;color:silver;opacity:.5;display:none}.vakata-context-rtl ul{left:auto;right:100%;margin-left:auto;margin-right:-4px}.vakata-context-rtl li>a.vakata-context-parent{background-image:url(data:image/gif;base64,R0lGODlhCwAHAIAAACgoKP///yH5BAEAAAEALAAAAAALAAcAAAINjI+AC7rWHIsPtmoxLAA7);background-position:left center;background-repeat:no-repeat}.vakata-context-rtl .vakata-context-separator>a{margin:0 2.4em 0 0;border-left:0;border-right:1px solid #e2e3e3}.vakata-context-rtl .vakata-context-left ul{right:auto;left:100%;margin-left:-4px;margin-right:auto}.vakata-context-rtl li>a>i{margin:0 -2em 0 0}.vakata-context-rtl li>a .vakata-contextmenu-sep{margin:0 0 0 .5em;border-left-color:#fff;background:#e2e3e3}#jstree-marker{position:absolute;top:0;left:0;margin:-5px 0 0 0;padding:0;border-right:0;border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:5px solid;width:0;height:0;font-size:0;line-height:0}#jstree-dnd{line-height:16px;margin:0;padding:4px}#jstree-dnd .jstree-icon,#jstree-dnd .jstree-copy{display:inline-block;text-decoration:none;margin:0 2px 0 0;padding:0;width:16px;height:16px}#jstree-dnd .jstree-ok{background:green}#jstree-dnd .jstree-er{background:red}#jstree-dnd .jstree-copy{margin:0 2px}.jstree-default .jstree-node,.jstree-default .jstree-icon{background-repeat:no-repeat;background-color:transparent}.jstree-default .jstree-anchor,.jstree-default .jstree-animated,.jstree-default .jstree-wholerow{transition:background-color .15s,box-shadow .15s}.jstree-default .jstree-hovered{background:#e7f4f9;border-radius:2px;box-shadow:inset 0 0 1px #ccc}.jstree-default .jstree-context{background:#e7f4f9;border-radius:2px;box-shadow:inset 0 0 1px #ccc}.jstree-default .jstree-clicked{background:#beebff;border-radius:2px;box-shadow:inset 0 0 1px #999}.jstree-default .jstree-no-icons .jstree-anchor>.jstree-themeicon{display:none}.jstree-default .jstree-disabled{background:0 0;color:#666}.jstree-default .jstree-disabled.jstree-hovered{background:0 0;box-shadow:none}.jstree-default .jstree-disabled.jstree-clicked{background:#efefef}.jstree-default .jstree-disabled>.jstree-icon{opacity:.8;filter:url("data:image/svg+xml;utf8,#jstree-grayscale");filter:gray;-webkit-filter:grayscale(100%)}.jstree-default .jstree-search{font-style:italic;color:#8b0000;font-weight:700}.jstree-default .jstree-no-checkboxes .jstree-checkbox{display:none!important}.jstree-default.jstree-checkbox-no-clicked .jstree-clicked{background:0 0;box-shadow:none}.jstree-default.jstree-checkbox-no-clicked .jstree-clicked.jstree-hovered{background:#e7f4f9}.jstree-default.jstree-checkbox-no-clicked>.jstree-wholerow-ul .jstree-wholerow-clicked{background:0 0}.jstree-default.jstree-checkbox-no-clicked>.jstree-wholerow-ul .jstree-wholerow-clicked.jstree-wholerow-hovered{background:#e7f4f9}.jstree-default>.jstree-striped{min-width:100%;display:inline-block;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAkCAMAAAB/qqA+AAAABlBMVEUAAAAAAAClZ7nPAAAAAnRSTlMNAMM9s3UAAAAXSURBVHjajcEBAQAAAIKg/H/aCQZ70AUBjAATb6YPDgAAAABJRU5ErkJggg==) left top repeat}.jstree-default>.jstree-wholerow-ul .jstree-hovered,.jstree-default>.jstree-wholerow-ul .jstree-clicked{background:0 0;box-shadow:none;border-radius:0}.jstree-default .jstree-wholerow{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box}.jstree-default .jstree-wholerow-hovered{background:#e7f4f9}.jstree-default .jstree-wholerow-clicked{background:#beebff;background:-webkit-linear-gradient(top,#beebff 0,#a8e4ff 100%);background:linear-gradient(to bottom,#beebff 0,#a8e4ff 100%)}.jstree-default .jstree-node{min-height:24px;line-height:24px;margin-left:24px;min-width:24px}.jstree-default .jstree-anchor{line-height:24px;height:24px}.jstree-default .jstree-icon{width:24px;height:24px;line-height:24px}.jstree-default .jstree-icon:empty{width:24px;height:24px;line-height:24px}.jstree-default.jstree-rtl .jstree-node{margin-right:24px}.jstree-default .jstree-wholerow{height:24px}.jstree-default .jstree-node,.jstree-default .jstree-icon{background-image:url('../../../../../../../../design/themes/avtoopt/media/32px.png?1759911146')}.jstree-default .jstree-node{background-position:-292px -4px;background-repeat:repeat-y}.jstree-default .jstree-last{background:0 0}.jstree-default .jstree-open>.jstree-ocl{background-position:-132px -4px}.jstree-default .jstree-closed>.jstree-ocl{background-position:-100px -4px}.jstree-default .jstree-leaf>.jstree-ocl{background-position:-68px -4px}.jstree-default .jstree-themeicon{background-position:-260px -4px}.jstree-default>.jstree-no-dots .jstree-node,.jstree-default>.jstree-no-dots .jstree-leaf>.jstree-ocl{background:0 0}.jstree-default>.jstree-no-dots .jstree-open>.jstree-ocl{background-position:-36px -4px}.jstree-default>.jstree-no-dots .jstree-closed>.jstree-ocl{background-position:-4px -4px}.jstree-default .jstree-disabled{background:0 0}.jstree-default .jstree-disabled.jstree-hovered{background:0 0}.jstree-default .jstree-disabled.jstree-clicked{background:#efefef}.jstree-default .jstree-checkbox{background-position:-164px -4px}.jstree-default .jstree-checkbox:hover{background-position:-164px -36px}.jstree-default.jstree-checkbox-selection .jstree-clicked>.jstree-checkbox,.jstree-default .jstree-checked>.jstree-checkbox{background-position:-228px -4px}.jstree-default.jstree-checkbox-selection .jstree-clicked>.jstree-checkbox:hover,.jstree-default .jstree-checked>.jstree-checkbox:hover{background-position:-228px -36px}.jstree-default .jstree-anchor>.jstree-undetermined{background-position:-196px -4px}.jstree-default .jstree-anchor>.jstree-undetermined:hover{background-position:-196px -36px}.jstree-default .jstree-checkbox-disabled{opacity:.8;filter:url("data:image/svg+xml;utf8,#jstree-grayscale");filter:gray;-webkit-filter:grayscale(100%)}.jstree-default>.jstree-striped{background-size:auto 48px}.jstree-default.jstree-rtl .jstree-node{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAACAQMAAAB49I5GAAAABlBMVEUAAAAdHRvEkCwcAAAAAXRSTlMAQObYZgAAAAxJREFUCNdjAAMOBgAAGAAJMwQHdQAAAABJRU5ErkJggg==);background-position:100% 1px;background-repeat:repeat-y}.jstree-default.jstree-rtl .jstree-last{background:0 0}.jstree-default.jstree-rtl .jstree-open>.jstree-ocl{background-position:-132px -36px}.jstree-default.jstree-rtl .jstree-closed>.jstree-ocl{background-position:-100px -36px}.jstree-default.jstree-rtl .jstree-leaf>.jstree-ocl{background-position:-68px -36px}.jstree-default.jstree-rtl>.jstree-no-dots .jstree-node,.jstree-default.jstree-rtl>.jstree-no-dots .jstree-leaf>.jstree-ocl{background:0 0}.jstree-default.jstree-rtl>.jstree-no-dots .jstree-open>.jstree-ocl{background-position:-36px -36px}.jstree-default.jstree-rtl>.jstree-no-dots .jstree-closed>.jstree-ocl{background-position:-4px -36px}.jstree-default .jstree-themeicon-custom{background-color:transparent;background-image:none;background-position:0 0}.jstree-default>.jstree-container-ul .jstree-loading>.jstree-ocl{background:url('../../../../../../../../design/themes/avtoopt/media/throbber.gif?1759911146') center center no-repeat}.jstree-default .jstree-file{background:url('../../../../../../../../design/themes/avtoopt/media/32px.png?1759911146') -100px -68px no-repeat}.jstree-default .jstree-folder{background:url('../../../../../../../../design/themes/avtoopt/media/32px.png?1759911146') -260px -4px no-repeat}.jstree-default>.jstree-container-ul>.jstree-node{margin-left:0;margin-right:0}#jstree-dnd.jstree-default{line-height:24px;padding:0 4px}#jstree-dnd.jstree-default .jstree-ok,#jstree-dnd.jstree-default .jstree-er{background-image:url('../../../../../../../../design/themes/avtoopt/media/32px.png?1759911146');background-repeat:no-repeat;background-color:transparent}#jstree-dnd.jstree-default i{background:0 0;width:24px;height:24px;line-height:24px}#jstree-dnd.jstree-default .jstree-ok{background-position:-4px -68px}#jstree-dnd.jstree-default .jstree-er{background-position:-36px -68px}.jstree-default .jstree-ellipsis{overflow:hidden}.jstree-default .jstree-ellipsis .jstree-anchor{width:calc(100% - 29px);text-overflow:ellipsis;overflow:hidden}.jstree-default .jstree-ellipsis.jstree-no-icons .jstree-anchor{width:calc(100% - 5px)}.jstree-default.jstree-rtl .jstree-node{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAACAQMAAAB49I5GAAAABlBMVEUAAAAdHRvEkCwcAAAAAXRSTlMAQObYZgAAAAxJREFUCNdjAAMOBgAAGAAJMwQHdQAAAABJRU5ErkJggg==)}.jstree-default.jstree-rtl .jstree-last{background:0 0}.jstree-default-small .jstree-node{min-height:18px;line-height:18px;margin-left:18px;min-width:18px}.jstree-default-small .jstree-anchor{line-height:18px;height:18px}.jstree-default-small .jstree-icon{width:18px;height:18px;line-height:18px}.jstree-default-small .jstree-icon:empty{width:18px;height:18px;line-height:18px}.jstree-default-small.jstree-rtl .jstree-node{margin-right:18px}.jstree-default-small .jstree-wholerow{height:18px}.jstree-default-small .jstree-node,.jstree-default-small .jstree-icon{background-image:url('../../../../../../../../design/themes/avtoopt/media/32px.png?1759911146')}.jstree-default-small .jstree-node{background-position:-295px -7px;background-repeat:repeat-y}.jstree-default-small .jstree-last{background:0 0}.jstree-default-small .jstree-open>.jstree-ocl{background-position:-135px -7px}.jstree-default-small .jstree-closed>.jstree-ocl{background-position:-103px -7px}.jstree-default-small .jstree-leaf>.jstree-ocl{background-position:-71px -7px}.jstree-default-small .jstree-themeicon{background-position:-263px -7px}.jstree-default-small>.jstree-no-dots .jstree-node,.jstree-default-small>.jstree-no-dots .jstree-leaf>.jstree-ocl{background:0 0}.jstree-default-small>.jstree-no-dots .jstree-open>.jstree-ocl{background-position:-39px -7px}.jstree-default-small>.jstree-no-dots .jstree-closed>.jstree-ocl{background-position:-7px -7px}.jstree-default-small .jstree-disabled{background:0 0}.jstree-default-small .jstree-disabled.jstree-hovered{background:0 0}.jstree-default-small .jstree-disabled.jstree-clicked{background:#efefef}.jstree-default-small .jstree-checkbox{background-position:-167px -7px}.jstree-default-small .jstree-checkbox:hover{background-position:-167px -39px}.jstree-default-small.jstree-checkbox-selection .jstree-clicked>.jstree-checkbox,.jstree-default-small .jstree-checked>.jstree-checkbox{background-position:-231px -7px}.jstree-default-small.jstree-checkbox-selection .jstree-clicked>.jstree-checkbox:hover,.jstree-default-small .jstree-checked>.jstree-checkbox:hover{background-position:-231px -39px}.jstree-default-small .jstree-anchor>.jstree-undetermined{background-position:-199px -7px}.jstree-default-small .jstree-anchor>.jstree-undetermined:hover{background-position:-199px -39px}.jstree-default-small .jstree-checkbox-disabled{opacity:.8;filter:url("data:image/svg+xml;utf8,#jstree-grayscale");filter:gray;-webkit-filter:grayscale(100%)}.jstree-default-small>.jstree-striped{background-size:auto 36px}.jstree-default-small.jstree-rtl .jstree-node{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAACAQMAAAB49I5GAAAABlBMVEUAAAAdHRvEkCwcAAAAAXRSTlMAQObYZgAAAAxJREFUCNdjAAMOBgAAGAAJMwQHdQAAAABJRU5ErkJggg==);background-position:100% 1px;background-repeat:repeat-y}.jstree-default-small.jstree-rtl .jstree-last{background:0 0}.jstree-default-small.jstree-rtl .jstree-open>.jstree-ocl{background-position:-135px -39px}.jstree-default-small.jstree-rtl .jstree-closed>.jstree-ocl{background-position:-103px -39px}.jstree-default-small.jstree-rtl .jstree-leaf>.jstree-ocl{background-position:-71px -39px}.jstree-default-small.jstree-rtl>.jstree-no-dots .jstree-node,.jstree-default-small.jstree-rtl>.jstree-no-dots .jstree-leaf>.jstree-ocl{background:0 0}.jstree-default-small.jstree-rtl>.jstree-no-dots .jstree-open>.jstree-ocl{background-position:-39px -39px}.jstree-default-small.jstree-rtl>.jstree-no-dots .jstree-closed>.jstree-ocl{background-position:-7px -39px}.jstree-default-small .jstree-themeicon-custom{background-color:transparent;background-image:none;background-position:0 0}.jstree-default-small>.jstree-container-ul .jstree-loading>.jstree-ocl{background:url('../../../../../../../../design/themes/avtoopt/media/throbber.gif?1759911146') center center no-repeat}.jstree-default-small .jstree-file{background:url('../../../../../../../../design/themes/avtoopt/media/32px.png?1759911146') -103px -71px no-repeat}.jstree-default-small .jstree-folder{background:url('../../../../../../../../design/themes/avtoopt/media/32px.png?1759911146') -263px -7px no-repeat}.jstree-default-small>.jstree-container-ul>.jstree-node{margin-left:0;margin-right:0}#jstree-dnd.jstree-default-small{line-height:18px;padding:0 4px}#jstree-dnd.jstree-default-small .jstree-ok,#jstree-dnd.jstree-default-small .jstree-er{background-image:url('../../../../../../../../design/themes/avtoopt/media/32px.png?1759911146');background-repeat:no-repeat;background-color:transparent}#jstree-dnd.jstree-default-small i{background:0 0;width:18px;height:18px;line-height:18px}#jstree-dnd.jstree-default-small .jstree-ok{background-position:-7px -71px}#jstree-dnd.jstree-default-small .jstree-er{background-position:-39px -71px}.jstree-default-small .jstree-ellipsis{overflow:hidden}.jstree-default-small .jstree-ellipsis .jstree-anchor{width:calc(100% - 23px);text-overflow:ellipsis;overflow:hidden}.jstree-default-small .jstree-ellipsis.jstree-no-icons .jstree-anchor{width:calc(100% - 5px)}.jstree-default-small.jstree-rtl .jstree-node{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAACAQMAAABv1h6PAAAABlBMVEUAAAAdHRvEkCwcAAAAAXRSTlMAQObYZgAAAAxJREFUCNdjAAMHBgAAiABBI4gz9AAAAABJRU5ErkJggg==)}.jstree-default-small.jstree-rtl .jstree-last{background:0 0}.jstree-default-large .jstree-node{min-height:32px;line-height:32px;margin-left:32px;min-width:32px}.jstree-default-large .jstree-anchor{line-height:32px;height:32px}.jstree-default-large .jstree-icon{width:32px;height:32px;line-height:32px}.jstree-default-large .jstree-icon:empty{width:32px;height:32px;line-height:32px}.jstree-default-large.jstree-rtl .jstree-node{margin-right:32px}.jstree-default-large .jstree-wholerow{height:32px}.jstree-default-large .jstree-node,.jstree-default-large .jstree-icon{background-image:url('../../../../../../../../design/themes/avtoopt/media/32px.png?1759911146')}.jstree-default-large .jstree-node{background-position:-288px 0;background-repeat:repeat-y}.jstree-default-large .jstree-last{background:0 0}.jstree-default-large .jstree-open>.jstree-ocl{background-position:-128px 0}.jstree-default-large .jstree-closed>.jstree-ocl{background-position:-96px 0}.jstree-default-large .jstree-leaf>.jstree-ocl{background-position:-64px 0}.jstree-default-large .jstree-themeicon{background-position:-256px 0}.jstree-default-large>.jstree-no-dots .jstree-node,.jstree-default-large>.jstree-no-dots .jstree-leaf>.jstree-ocl{background:0 0}.jstree-default-large>.jstree-no-dots .jstree-open>.jstree-ocl{background-position:-32px 0}.jstree-default-large>.jstree-no-dots .jstree-closed>.jstree-ocl{background-position:0 0}.jstree-default-large .jstree-disabled{background:0 0}.jstree-default-large .jstree-disabled.jstree-hovered{background:0 0}.jstree-default-large .jstree-disabled.jstree-clicked{background:#efefef}.jstree-default-large .jstree-checkbox{background-position:-160px 0}.jstree-default-large .jstree-checkbox:hover{background-position:-160px -32px}.jstree-default-large.jstree-checkbox-selection .jstree-clicked>.jstree-checkbox,.jstree-default-large .jstree-checked>.jstree-checkbox{background-position:-224px 0}.jstree-default-large.jstree-checkbox-selection .jstree-clicked>.jstree-checkbox:hover,.jstree-default-large .jstree-checked>.jstree-checkbox:hover{background-position:-224px -32px}.jstree-default-large .jstree-anchor>.jstree-undetermined{background-position:-192px 0}.jstree-default-large .jstree-anchor>.jstree-undetermined:hover{background-position:-192px -32px}.jstree-default-large .jstree-checkbox-disabled{opacity:.8;filter:url("data:image/svg+xml;utf8,#jstree-grayscale");filter:gray;-webkit-filter:grayscale(100%)}.jstree-default-large>.jstree-striped{background-size:auto 64px}.jstree-default-large.jstree-rtl .jstree-node{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAACAQMAAAB49I5GAAAABlBMVEUAAAAdHRvEkCwcAAAAAXRSTlMAQObYZgAAAAxJREFUCNdjAAMOBgAAGAAJMwQHdQAAAABJRU5ErkJggg==);background-position:100% 1px;background-repeat:repeat-y}.jstree-default-large.jstree-rtl .jstree-last{background:0 0}.jstree-default-large.jstree-rtl .jstree-open>.jstree-ocl{background-position:-128px -32px}.jstree-default-large.jstree-rtl .jstree-closed>.jstree-ocl{background-position:-96px -32px}.jstree-default-large.jstree-rtl .jstree-leaf>.jstree-ocl{background-position:-64px -32px}.jstree-default-large.jstree-rtl>.jstree-no-dots .jstree-node,.jstree-default-large.jstree-rtl>.jstree-no-dots .jstree-leaf>.jstree-ocl{background:0 0}.jstree-default-large.jstree-rtl>.jstree-no-dots .jstree-open>.jstree-ocl{background-position:-32px -32px}.jstree-default-large.jstree-rtl>.jstree-no-dots .jstree-closed>.jstree-ocl{background-position:0 -32px}.jstree-default-large .jstree-themeicon-custom{background-color:transparent;background-image:none;background-position:0 0}.jstree-default-large>.jstree-container-ul .jstree-loading>.jstree-ocl{background:url('../../../../../../../../design/themes/avtoopt/media/throbber.gif?1759911146') center center no-repeat}.jstree-default-large .jstree-file{background:url('../../../../../../../../design/themes/avtoopt/media/32px.png?1759911146') -96px -64px no-repeat}.jstree-default-large .jstree-folder{background:url('../../../../../../../../design/themes/avtoopt/media/32px.png?1759911146') -256px 0 no-repeat}.jstree-default-large>.jstree-container-ul>.jstree-node{margin-left:0;margin-right:0}#jstree-dnd.jstree-default-large{line-height:32px;padding:0 4px}#jstree-dnd.jstree-default-large .jstree-ok,#jstree-dnd.jstree-default-large .jstree-er{background-image:url('../../../../../../../../design/themes/avtoopt/media/32px.png?1759911146');background-repeat:no-repeat;background-color:transparent}#jstree-dnd.jstree-default-large i{background:0 0;width:32px;height:32px;line-height:32px}#jstree-dnd.jstree-default-large .jstree-ok{background-position:0 -64px}#jstree-dnd.jstree-default-large .jstree-er{background-position:-32px -64px}.jstree-default-large .jstree-ellipsis{overflow:hidden}.jstree-default-large .jstree-ellipsis .jstree-anchor{width:calc(100% - 37px);text-overflow:ellipsis;overflow:hidden}.jstree-default-large .jstree-ellipsis.jstree-no-icons .jstree-anchor{width:calc(100% - 5px)}.jstree-default-large.jstree-rtl .jstree-node{background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAACAQMAAAAD0EyKAAAABlBMVEUAAAAdHRvEkCwcAAAAAXRSTlMAQObYZgAAAAxJREFUCNdjgIIGBgABCgCBvVLXcAAAAABJRU5ErkJggg==)}.jstree-default-large.jstree-rtl .jstree-last{background:0 0}@media (max-width:768px){#jstree-dnd.jstree-dnd-responsive{line-height:40px;font-weight:700;font-size:1.1em;text-shadow:1px 1px #fff}#jstree-dnd.jstree-dnd-responsive>i{background:0 0;width:40px;height:40px}#jstree-dnd.jstree-dnd-responsive>.jstree-ok{background-image:url('../../../../../../../../design/themes/avtoopt/media/40px.png?1759911146');background-position:0 -200px;background-size:120px 240px}#jstree-dnd.jstree-dnd-responsive>.jstree-er{background-image:url('../../../../../../../../design/themes/avtoopt/media/40px.png?1759911146');background-position:-40px -200px;background-size:120px 240px}#jstree-marker.jstree-dnd-responsive{border-left-width:10px;border-top-width:10px;border-bottom-width:10px;margin-top:-10px}}@media (max-width:768px){.jstree-default-responsive .jstree-icon{background-image:url('../../../../../../../../design/themes/avtoopt/media/40px.png?1759911146')}.jstree-default-responsive .jstree-node,.jstree-default-responsive .jstree-leaf>.jstree-ocl{background:0 0}.jstree-default-responsive .jstree-node{min-height:40px;line-height:40px;margin-left:40px;min-width:40px;white-space:nowrap}.jstree-default-responsive .jstree-anchor{line-height:40px;height:40px}.jstree-default-responsive .jstree-icon,.jstree-default-responsive .jstree-icon:empty{width:40px;height:40px;line-height:40px}.jstree-default-responsive>.jstree-container-ul>.jstree-node{margin-left:0}.jstree-default-responsive.jstree-rtl .jstree-node{margin-left:0;margin-right:40px;background:0 0}.jstree-default-responsive.jstree-rtl .jstree-container-ul>.jstree-node{margin-right:0}.jstree-default-responsive .jstree-ocl,.jstree-default-responsive .jstree-themeicon,.jstree-default-responsive .jstree-checkbox{background-size:120px 240px}.jstree-default-responsive .jstree-leaf>.jstree-ocl,.jstree-default-responsive.jstree-rtl .jstree-leaf>.jstree-ocl{background:0 0}.jstree-default-responsive .jstree-open>.jstree-ocl{background-position:0 0!important}.jstree-default-responsive .jstree-closed>.jstree-ocl{background-position:0 -40px!important}.jstree-default-responsive.jstree-rtl .jstree-closed>.jstree-ocl{background-position:-40px 0!important}.jstree-default-responsive .jstree-themeicon{background-position:-40px -40px}.jstree-default-responsive .jstree-checkbox,.jstree-default-responsive .jstree-checkbox:hover{background-position:-40px -80px}.jstree-default-responsive.jstree-checkbox-selection .jstree-clicked>.jstree-checkbox,.jstree-default-responsive.jstree-checkbox-selection .jstree-clicked>.jstree-checkbox:hover,.jstree-default-responsive .jstree-checked>.jstree-checkbox,.jstree-default-responsive .jstree-checked>.jstree-checkbox:hover{background-position:0 -80px}.jstree-default-responsive .jstree-anchor>.jstree-undetermined,.jstree-default-responsive .jstree-anchor>.jstree-undetermined:hover{background-position:0 -120px}.jstree-default-responsive .jstree-anchor{font-weight:700;font-size:1.1em;text-shadow:1px 1px #fff}.jstree-default-responsive>.jstree-striped{background:0 0}.jstree-default-responsive .jstree-wholerow{border-top:1px solid rgba(255,255,255,.7);border-bottom:1px solid rgba(64,64,64,.2);background:#ebebeb;height:40px}.jstree-default-responsive .jstree-wholerow-hovered{background:#e7f4f9}.jstree-default-responsive .jstree-wholerow-clicked{background:#beebff}.jstree-default-responsive .jstree-children .jstree-last>.jstree-wholerow{box-shadow:inset 0 -6px 3px -5px #666}.jstree-default-responsive .jstree-children .jstree-open>.jstree-wholerow{box-shadow:inset 0 6px 3px -5px #666;border-top:0}.jstree-default-responsive .jstree-children .jstree-open+.jstree-open{box-shadow:none}.jstree-default-responsive .jstree-node,.jstree-default-responsive .jstree-icon,.jstree-default-responsive .jstree-node>.jstree-ocl,.jstree-default-responsive .jstree-themeicon,.jstree-default-responsive .jstree-checkbox{background-image:url('../../../../../../../../design/themes/avtoopt/media/40px.png?1759911146');background-size:120px 240px}.jstree-default-responsive .jstree-node{background-position:-80px 0;background-repeat:repeat-y}.jstree-default-responsive .jstree-last{background:0 0}.jstree-default-responsive .jstree-leaf>.jstree-ocl{background-position:-40px -120px}.jstree-default-responsive .jstree-last>.jstree-ocl{background-position:-40px -160px}.jstree-default-responsive .jstree-themeicon-custom{background-color:transparent;background-image:none;background-position:0 0}.jstree-default-responsive .jstree-file{background:url('../../../../../../../../design/themes/avtoopt/media/40px.png?1759911146') 0 -160px no-repeat;background-size:120px 240px}.jstree-default-responsive .jstree-folder{background:url('../../../../../../../../design/themes/avtoopt/media/40px.png?1759911146') -40px -40px no-repeat;background-size:120px 240px}.jstree-default-responsive>.jstree-container-ul>.jstree-node{margin-left:0;margin-right:0}}
/* jquery.Jcrop.min.css v0.9.12 (build:20130126) */
.jcrop-holder{direction:ltr;text-align:left;}
.jcrop-vline,.jcrop-hline{background:#FFF url('../../../../../../../../design/themes/avtoopt/media/Jcrop.gif?1759911146');font-size:0;position:absolute;}
.jcrop-vline{height:100%;width:1px!important;}
.jcrop-vline.right{right:0;}
.jcrop-hline{height:1px!important;width:100%;}
.jcrop-hline.bottom{bottom:0;}
.jcrop-tracker{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;height:100%;width:100%;}
.jcrop-handle{background-color:#333;border:1px #EEE solid;font-size:1px;height:7px;width:7px;}
.jcrop-handle.ord-n{left:50%;margin-left:-4px;margin-top:-4px;top:0;}
.jcrop-handle.ord-s{bottom:0;left:50%;margin-bottom:-4px;margin-left:-4px;}
.jcrop-handle.ord-e{margin-right:-4px;margin-top:-4px;right:0;top:50%;}
.jcrop-handle.ord-w{left:0;margin-left:-4px;margin-top:-4px;top:50%;}
.jcrop-handle.ord-nw{left:0;margin-left:-4px;margin-top:-4px;top:0;}
.jcrop-handle.ord-ne{margin-right:-4px;margin-top:-4px;right:0;top:0;}
.jcrop-handle.ord-se{bottom:0;margin-bottom:-4px;margin-right:-4px;right:0;}
.jcrop-handle.ord-sw{bottom:0;left:0;margin-bottom:-4px;margin-left:-4px;}
.jcrop-dragbar.ord-n,.jcrop-dragbar.ord-s{height:7px;width:100%;}
.jcrop-dragbar.ord-e,.jcrop-dragbar.ord-w{height:100%;width:7px;}
.jcrop-dragbar.ord-n{margin-top:-4px;}
.jcrop-dragbar.ord-s{bottom:0;margin-bottom:-4px;}
.jcrop-dragbar.ord-e{margin-right:-4px;right:0;}
.jcrop-dragbar.ord-w{margin-left:-4px;}
.jcrop-light .jcrop-vline,.jcrop-light .jcrop-hline{background:#FFF;filter:alpha(opacity=70)!important;opacity:.70!important;}
.jcrop-light .jcrop-handle{-moz-border-radius:3px;-webkit-border-radius:3px;background-color:#000;border-color:#FFF;border-radius:3px;}
.jcrop-dark .jcrop-vline,.jcrop-dark .jcrop-hline{background:#000;filter:alpha(opacity=70)!important;opacity:.7!important;}
.jcrop-dark .jcrop-handle{-moz-border-radius:3px;-webkit-border-radius:3px;background-color:#FFF;border-color:#000;border-radius:3px;}
.solid-line .jcrop-vline,.solid-line .jcrop-hline{background:#FFF;}
.jcrop-holder img,img.jcrop-preview{max-width:none;}
body.compensate-for-scrollbar {
overflow: hidden;
}
.fancybox-active {
height: auto;
}
.fancybox-is-hidden {
left: -9999px;
margin: 0;
position: absolute !important;
top: -9999px;
visibility: hidden;
}
.fancybox-container {
-webkit-backface-visibility: hidden;
height: 100%;
left: 0;
outline: none;
position: fixed;
-webkit-tap-highlight-color: transparent;
top: 0;
-ms-touch-action: manipulation;
touch-action: manipulation;
transform: translateZ(0);
width: 100%;
z-index: 99992;
}
.fancybox-container * {
box-sizing: border-box;
}
.fancybox-outer,
.fancybox-inner,
.fancybox-bg,
.fancybox-stage {
bottom: 0;
left: 0;
position: absolute;
right: 0;
top: 0;
}
.fancybox-outer {
-webkit-overflow-scrolling: touch;
overflow-y: auto;
}
.fancybox-bg {
background: rgba(30, 30, 30, 0.3);
opacity: 0;
transition-duration: inherit;
transition-property: opacity;
transition-timing-function: cubic-bezier(.47, 0, .74, .71);
}
.fancybox-is-open .fancybox-bg {
opacity: .9;
transition-timing-function: cubic-bezier(.22, .61, .36, 1);
}
.fancybox-infobar,
.fancybox-toolbar,
.fancybox-caption,
.fancybox-navigation .fancybox-button {
direction: ltr;
opacity: 0;
position: absolute;
transition: opacity .25s ease, visibility 0s ease .25s;
visibility: hidden;
z-index: 99997;
}
.fancybox-show-infobar .fancybox-infobar,
.fancybox-show-toolbar .fancybox-toolbar,
.fancybox-show-caption .fancybox-caption,
.fancybox-show-nav .fancybox-navigation .fancybox-button {
opacity: 1;
transition: opacity .25s ease 0s, visibility 0s ease 0s;
visibility: visible;
}
.fancybox-infobar {
color: #ccc;
font-size: 13px;
-webkit-font-smoothing: subpixel-antialiased;
height: 44px;
left: 0;
line-height: 44px;
min-width: 44px;
mix-blend-mode: difference;
padding: 0 10px;
pointer-events: none;
top: 0;
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.fancybox-toolbar {
right: 0;
top: 0;
}
.fancybox-stage {
direction: ltr;
overflow: visible;
transform: translateZ(0);
z-index: 99994;
}
.fancybox-is-open .fancybox-stage {
overflow: hidden;
}
.fancybox-slide {
-webkit-backface-visibility: hidden; /* Using without prefix would break IE11 */
display: none;
height: 100%;
left: 0;
outline: none;
overflow: auto;
-webkit-overflow-scrolling: touch;
padding: 44px;
position: absolute;
text-align: center;
top: 0;
transition-property: transform, opacity;
white-space: normal;
width: 100%;
z-index: 99994;
}
.fancybox-slide::before {
content: '';
display: inline-block;
font-size: 0;
height: 100%;
vertical-align: middle;
width: 0;
}
.fancybox-is-sliding .fancybox-slide,
.fancybox-slide--previous,
.fancybox-slide--current,
.fancybox-slide--next {
display: block;
}
.fancybox-slide--image {
overflow: hidden;
padding: 44px 0;
}
.fancybox-slide--image::before {
display: none;
}
.fancybox-slide--html {
padding: 6px;
}
.fancybox-content {
background: #fff;
display: inline-block;
margin: 0;
max-width: 100%;
overflow: auto;
-webkit-overflow-scrolling: touch;
padding: 44px;
position: relative;
text-align: left;
vertical-align: middle;
}
.fancybox-slide--image .fancybox-content {
animation-timing-function: cubic-bezier(.5, 0, .14, 1);
-webkit-backface-visibility: hidden;
background: transparent;
background-repeat: no-repeat;
background-size: 100% 100%;
left: 0;
max-width: none;
overflow: visible;
padding: 0;
position: absolute;
top: 0;
-ms-transform-origin: top left;
transform-origin: top left;
transition-property: transform, opacity;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
z-index: 99995;
}
.fancybox-can-zoomOut .fancybox-content {
cursor: zoom-out;
}
.fancybox-can-zoomIn .fancybox-content {
cursor: zoom-in;
}
.fancybox-can-swipe .fancybox-content,
.fancybox-can-pan .fancybox-content {
cursor: -webkit-grab;
cursor: grab;
}
.fancybox-is-grabbing .fancybox-content {
cursor: -webkit-grabbing;
cursor: grabbing;
}
.fancybox-container [data-selectable='true'] {
cursor: text;
}
.fancybox-image,
.fancybox-spaceball {
background: transparent;
border: 0;
height: 100%;
left: 0;
margin: 0;
max-height: none;
max-width: none;
padding: 0;
position: absolute;
top: 0;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
width: 100%;
}
.fancybox-spaceball {
z-index: 1;
}
.fancybox-slide--video .fancybox-content,
.fancybox-slide--map .fancybox-content,
.fancybox-slide--pdf .fancybox-content,
.fancybox-slide--iframe .fancybox-content {
height: 100%;
overflow: visible;
padding: 0;
width: 100%;
}
.fancybox-slide--video .fancybox-content {
background: #000;
}
.fancybox-slide--map .fancybox-content {
background: #e5e3df;
}
.fancybox-slide--iframe .fancybox-content {
background: #fff;
}
.fancybox-video,
.fancybox-iframe {
background: transparent;
border: 0;
display: block;
height: 100%;
margin: 0;
overflow: hidden;
padding: 0;
width: 100%;
}
/* Fix iOS */
.fancybox-iframe {
left: 0;
position: absolute;
top: 0;
}
.fancybox-error {
background: #fff;
cursor: default;
max-width: 400px;
padding: 40px;
width: 100%;
}
.fancybox-error p {
color: #444;
font-size: 16px;
line-height: 20px;
margin: 0;
padding: 0;
}
/* Buttons */
.fancybox-button {
background: rgba(30, 30, 30, .6);
border: 0;
border-radius: 0;
box-shadow: none;
cursor: pointer;
display: inline-block;
height: 44px;
margin: 0;
padding: 10px;
position: relative;
transition: color .2s;
vertical-align: top;
visibility: inherit;
width: 44px;
}
.fancybox-button,
.fancybox-button:visited,
.fancybox-button:link {
color: #ccc;
}
.fancybox-button:hover {
color: #fff;
}
.fancybox-button:focus {
outline: none;
}
.fancybox-button.fancybox-focus {
outline: 1px dotted;
}
.fancybox-button[disabled],
.fancybox-button[disabled]:hover {
color: #888;
cursor: default;
outline: none;
}
/* Fix IE11 */
.fancybox-button div {
height: 100%;
color: #ccc;
}
.fancybox-button svg {
display: block;
height: 100%;
overflow: visible;
position: relative;
width: 100%;
}
.fancybox-button svg path {
fill: currentColor;
stroke-width: 0;
}
.fancybox-button--play svg:nth-child(2),
.fancybox-button--fsenter svg:nth-child(2) {
display: none;
}
.fancybox-button--pause svg:nth-child(1),
.fancybox-button--fsexit svg:nth-child(1) {
display: none;
}
.fancybox-progress {
background: #ff5268;
height: 2px;
left: 0;
position: absolute;
right: 0;
top: 0;
-ms-transform: scaleX(0);
transform: scaleX(0);
-ms-transform-origin: 0;
transform-origin: 0;
transition-property: transform;
transition-timing-function: linear;
z-index: 99998;
}
/* Close button on the top right corner of html content */
.fancybox-close-small {
background: transparent;
border: 0;
border-radius: 0;
color: #ccc;
cursor: pointer;
opacity: .8;
padding: 8px;
position: absolute;
right: -12px;
top: -44px;
z-index: 401;
}
.fancybox-close-small:hover {
color: #fff;
opacity: 1;
}
.fancybox-slide--html .fancybox-close-small {
color: currentColor;
padding: 10px;
right: 0;
top: 0;
}
.fancybox-slide--image.fancybox-is-scaling .fancybox-content {
overflow: hidden;
}
.fancybox-is-scaling .fancybox-close-small,
.fancybox-is-zoomable.fancybox-can-pan .fancybox-close-small {
display: none;
}
/* Navigation arrows */
.fancybox-navigation .fancybox-button {
background-clip: content-box;
height: 100px;
opacity: 0;
position: absolute;
top: calc(50% - 50px);
width: 70px;
}
.fancybox-navigation .fancybox-button div {
padding: 7px;
}
.fancybox-navigation .fancybox-button--arrow_left {
left: 0;
left: env(safe-area-inset-left);
padding: 31px 26px 31px 6px;
}
.fancybox-navigation .fancybox-button--arrow_right {
padding: 31px 6px 31px 26px;
right: 0;
right: env(safe-area-inset-right);
}
/* Caption */
.fancybox-caption {
background: linear-gradient(
to top,
rgba(0, 0, 0, .85) 0%,
rgba(0, 0, 0, .3) 50%,
rgba(0, 0, 0, .15) 65%,
rgba(0, 0, 0, .075) 75.5%,
rgba(0, 0, 0, .037) 82.85%,
rgba(0, 0, 0, .019) 88%,
rgba(0, 0, 0, 0) 100%
);
bottom: 0;
color: #eee;
font-size: 14px;
font-weight: 400;
left: 0;
line-height: 1.5;
padding: 75px 44px 25px 44px;
pointer-events: none;
right: 0;
text-align: center;
z-index: 99996;
}
@supports (padding: max(0px)) {
.fancybox-caption {
padding: 75px max(44px, env(safe-area-inset-right)) max(25px, env(safe-area-inset-bottom)) max(44px, env(safe-area-inset-left));
}
}
.fancybox-caption--separate {
margin-top: -50px;
}
.fancybox-caption__body {
max-height: 50vh;
overflow: auto;
pointer-events: all;
color: #fff;
}
.fancybox-caption a,
.fancybox-caption a:link,
.fancybox-caption a:visited {
color: #ccc;
text-decoration: none;
}
.fancybox-caption a:hover {
color: #fff;
text-decoration: underline;
}
/* Loading indicator */
.fancybox-loading {
animation: fancybox-rotate 1s linear infinite;
background: transparent;
border: 4px solid #888;
border-bottom-color: #fff;
border-radius: 50%;
height: 50px;
left: 50%;
margin: -25px 0 0 -25px;
opacity: .7;
padding: 0;
position: absolute;
top: 50%;
width: 50px;
z-index: 99999;
}
@keyframes fancybox-rotate {
100% {
transform: rotate(360deg);
}
}
/* Transition effects */
.fancybox-animated {
transition-timing-function: cubic-bezier(0, 0, .25, 1);
}
/* transitionEffect: slide */
.fancybox-fx-slide.fancybox-slide--previous {
opacity: 0;
transform: translate3d(-100%, 0, 0);
}
.fancybox-fx-slide.fancybox-slide--next {
opacity: 0;
transform: translate3d(100%, 0, 0);
}
.fancybox-fx-slide.fancybox-slide--current {
opacity: 1;
transform: translate3d(0, 0, 0);
}
/* transitionEffect: fade */
.fancybox-fx-fade.fancybox-slide--previous,
.fancybox-fx-fade.fancybox-slide--next {
opacity: 0;
transition-timing-function: cubic-bezier(.19, 1, .22, 1);
}
.fancybox-fx-fade.fancybox-slide--current {
opacity: 1;
}
/* transitionEffect: zoom-in-out */
.fancybox-fx-zoom-in-out.fancybox-slide--previous {
opacity: 0;
transform: scale3d(1.5, 1.5, 1.5);
}
.fancybox-fx-zoom-in-out.fancybox-slide--next {
opacity: 0;
transform: scale3d(.5, .5, .5);
}
.fancybox-fx-zoom-in-out.fancybox-slide--current {
opacity: 1;
transform: scale3d(1, 1, 1);
}
/* transitionEffect: rotate */
.fancybox-fx-rotate.fancybox-slide--previous {
opacity: 0;
-ms-transform: rotate(-360deg);
transform: rotate(-360deg);
}
.fancybox-fx-rotate.fancybox-slide--next {
opacity: 0;
-ms-transform: rotate(360deg);
transform: rotate(360deg);
}
.fancybox-fx-rotate.fancybox-slide--current {
opacity: 1;
-ms-transform: rotate(0deg);
transform: rotate(0deg);
}
/* transitionEffect: circular */
.fancybox-fx-circular.fancybox-slide--previous {
opacity: 0;
transform: scale3d(0, 0, 0) translate3d(-100%, 0, 0);
}
.fancybox-fx-circular.fancybox-slide--next {
opacity: 0;
transform: scale3d(0, 0, 0) translate3d(100%, 0, 0);
}
.fancybox-fx-circular.fancybox-slide--current {
opacity: 1;
transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
}
/* transitionEffect: tube */
.fancybox-fx-tube.fancybox-slide--previous {
transform: translate3d(-100%, 0, 0) scale(.1) skew(-10deg);
}
.fancybox-fx-tube.fancybox-slide--next {
transform: translate3d(100%, 0, 0) scale(.1) skew(10deg);
}
.fancybox-fx-tube.fancybox-slide--current {
transform: translate3d(0, 0, 0) scale(1);
}
/* Styling for Small-Screen Devices */
@media all and (max-height: 576px) {
.fancybox-slide {
padding-left: 6px;
padding-right: 6px;
}
.fancybox-slide--image {
padding: 6px 0;
}
.fancybox-close-small {
right: -6px;
}
.fancybox-slide--image .fancybox-close-small {
background: #4e4e4e;
color: #f2f4f6;
height: 36px;
opacity: 1;
padding: 6px;
right: 0;
top: 0;
width: 36px;
}
.fancybox-caption {
padding-left: 12px;
padding-right: 12px;
}
@supports (padding: max(0px)) {
.fancybox-caption {
padding-left: max(12px, env(safe-area-inset-left));
padding-right: max(12px, env(safe-area-inset-right));
}
}
}
/* Share */
.fancybox-share {
background: #f4f4f4;
border-radius: 3px;
max-width: 90%;
padding: 30px;
text-align: center;
}
.fancybox-share h1 {
color: #222;
font-size: 35px;
font-weight: 700;
margin: 0 0 20px 0;
}
.fancybox-share p {
margin: 0;
padding: 0;
}
.fancybox-share__button {
border: 0;
border-radius: 3px;
display: inline-block;
font-size: 14px;
font-weight: 700;
line-height: 40px;
margin: 0 5px 10px 5px;
min-width: 130px;
padding: 0 15px;
text-decoration: none;
transition: all .2s;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
white-space: nowrap;
}
.fancybox-share__button:visited,
.fancybox-share__button:link {
color: #fff;
}
.fancybox-share__button:hover {
text-decoration: none;
}
.fancybox-share__button--fb {
background: #3b5998;
}
.fancybox-share__button--fb:hover {
background: #344e86;
}
.fancybox-share__button--pt {
background: #bd081d;
}
.fancybox-share__button--pt:hover {
background: #aa0719;
}
.fancybox-share__button--tw {
background: #1da1f2;
}
.fancybox-share__button--tw:hover {
background: #0d95e8;
}
.fancybox-share__button svg {
height: 25px;
margin-right: 7px;
position: relative;
top: -1px;
vertical-align: middle;
width: 25px;
}
.fancybox-share__button svg path {
fill: #fff;
}
.fancybox-share__input {
background: transparent;
border: 0;
border-bottom: 1px solid #d7d7d7;
border-radius: 0;
color: #5d5b5b;
font-size: 14px;
margin: 10px 0 0 0;
outline: none;
padding: 10px 15px;
width: 100%;
}
/* Thumbs */
.fancybox-thumbs {
background: #ddd;
bottom: 0;
display: none;
margin: 0;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: -ms-autohiding-scrollbar;
padding: 2px 2px 4px 2px;
position: absolute;
right: 0;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
top: 0;
width: 212px;
z-index: 99995;
}
.fancybox-thumbs-x {
overflow-x: auto;
overflow-y: hidden;
}
.fancybox-show-thumbs .fancybox-thumbs {
display: block;
}
.fancybox-show-thumbs .fancybox-inner {
right: 212px;
}
.fancybox-thumbs__list {
font-size: 0;
height: 100%;
list-style: none;
margin: 0;
overflow-x: hidden;
overflow-y: auto;
padding: 0;
position: absolute;
position: relative;
white-space: nowrap;
width: 100%;
}
.fancybox-thumbs-x .fancybox-thumbs__list {
overflow: hidden;
}
.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar {
width: 7px;
}
.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-track {
background: #fff;
border-radius: 10px;
box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
}
.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-thumb {
background: #2a2a2a;
border-radius: 10px;
}
.fancybox-thumbs__list a {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
background-color: rgba(0, 0, 0, .1);
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
cursor: pointer;
float: left;
height: 75px;
margin: 2px;
max-height: calc(100% - 8px);
max-width: calc(50% - 4px);
outline: none;
overflow: hidden;
padding: 0;
position: relative;
-webkit-tap-highlight-color: transparent;
width: 100px;
}
.fancybox-thumbs__list a::before {
border: 6px solid #ff5268;
bottom: 0;
content: '';
left: 0;
opacity: 0;
position: absolute;
right: 0;
top: 0;
transition: all .2s cubic-bezier(.25, .46, .45, .94);
z-index: 99991;
}
.fancybox-thumbs__list a:focus::before {
opacity: .5;
}
.fancybox-thumbs__list a.fancybox-thumbs-active::before {
opacity: 1;
}
/* Styling for Small-Screen Devices */
@media all and (max-width: 576px) {
.fancybox-thumbs {
width: 110px;
}
.fancybox-show-thumbs .fancybox-inner {
right: 110px;
}
.fancybox-thumbs__list a {
max-width: calc(100% - 10px);
}
}
:root {
--main-color-grafit: #37383a;
}
.ui-autocomplete-category {
font-weight: bold;
padding: .2em .4em;
margin: .4em 0 .2em;
line-height: 1.5;
/*border-bottom: 1px solid #cccccc;*/
border-top: 1px solid #cccccc;
}
.ui-autocomplete-category:first-child {
border-top: none;
}
#search_shadow {
top: 0;
opacity: 0.3;
position: absolute;
text-transform: lowercase;
font-weight: bold;
left: 0;
}
#search_input {
z-index: 10;
background: transparent;
text-transform: lowercase;
font-weight: bold;
}
.menu-wrapper {
position: absolute;
top: 47px;
width: auto;
display: none;
}
.menu-wrapper--garage {
position: absolute;
top: 182px;
left: 0;
width: 100%;
display: none;
z-index: 999;
max-width: 1240px;
margin: 0 auto;
right: 0;
}
@media screen and (max-width: 810px) {
.menu-wrapper--garage {
top: 159px;
}
}
header {
position: relative;
}
.js-open__catalog {
z-index: 1000;
}
.js-open__catalog:hover .menu-wrapper {
display: flex;
}
.js-open__catalog:hover > a {
background-color: var(--main-color-grafit);
}
.location_in_garage {
display: inline-block;
text-decoration: none;
color: var( --main-color-grafit);
font: 14px Roboto;
padding: 10px;
border-bottom: 2px solid var( --main-color-grafit);
border-right: 2px solid var( --main-color-grafit);
border-radius: 0 0 5px 0;
padding-top: 16px;
}
.location_in_garage:hover {
background-color: var( --main-color-grafit);
color: white;
}
.garage-menu-wrapper {
width: 85%;
max-width: 1030px;
margin: 0 58px 0 auto;
background-color: #f3f3f3;
font-size: initial;
border-top: none;
overflow: hidden;
}
.garage-menu-main-1, .garage-menu-main-2, .garage-menu-main-3 {
display: flex;
border-right: 1px solid lightgrey;
}
.garage-menu-main-1 {
cursor: pointer;
}
.garage-menu-main_two_block {
width: 70%;
display: flex;
flex-direction: row;
}
.garage-menu-main-1, .garage-menu-main-2 {
width: 100%;
}
.garage-menu-main-1 {
margin-top: 15px;
padding: 0px 20px 20px 0px;
flex-direction: row;
line-height: 20px;
color: var( --main-color-grafit);
}
.garage-menu-main-1 img {
margin: auto 10px;
}
#data_vin {
font-size: 12px;
}
.garage-menu-main-2 {
padding-left: 15px;
display: block;
}
.garage-menu-main-2_else, .garage-menu-main-2_if {
margin-top: 15px;
text-align: center;
color: var( --main-color-grafit);
}
.garage-menu-main-2_else p {
margin-left: 7.5px;
margin-right: 7.5px;
}
.garage-menu-main-2_else button, .garage-menu-main-2_if button {
background-color: var( --main-color-grafit);
color: #ffffff;
border-radius: 15px;
padding: 7px 15px;
border: none;
}
.garage-menu-main-3 {
width: 30%;
}
.garage-menu-main-3 ul {
display: flex;
flex-direction: column;
}
.garage-menu-main-3 ul li {
display: flex;
flex-direction: row;
width: 100%;
text-align: center;
padding: 7px;
margin-left: 25px;
}
.garage-menu-main-3 ul li a {
color: var( --main-color-grafit);
line-height: normal;
display: inline-block;
text-align: left;
font-size: 15px;
margin-left: 5px;
padding-left: 5px;
}
.garage-menu-main-3 ul li img {
display: block;
width: 20px;
height: 20px;
}
#modal--choose_car {
display: none;
}
#modal--choose_car_service {
display: none;
}
.car_chooser_button {
border: 0 none;
background: var( --main-color-grafit) none repeat scroll 0 0!important;
border-radius: 25px;
color: #fff !important;
display: inline-block;
font: 400 14px/16px Roboto medium !important;
text-decoration: none;
padding: 11px 0;
}
.choose_car {
display: inline-block;
position: relative;
margin-left: 15px;
padding: 12px 0 4px 0;
border-bottom: 1px dashed var( --main-color-grafit);
text-decoration: none;
font: 14px Roboto;
color: var( --main-color-grafit);
cursor: pointer;
}
.modal--choose_car--item {
display: flex;
flex-direction: column;
border: 2px dashed lightgrey;
border-radius: 10px;
padding: 10px 10px;
margin: 10px 20px;
width: 177px;
}
.modal--choose_car--items {
display: flex;
flex-wrap: wrap;
}
.modal--choose_car--item:hover {
background-color: #f7f4f4;
}
.modal--choose_car--item p {
text-align: left;
margin: 20px auto auto auto;
color: var( --main-color-grafit);
line-height: 20px;
}
@media screen and (max-width: 1100px) {
.garage-menu-wrapper {
width: 95%;
margin: 0 auto;
}
}
@media screen and (max-width: 950px) {
.garage-menu-main {
display: flex;
flex-direction: column;
}
.garage-menu-main_two_block {
width: 100%;
display: flex;
flex-direction: row;
}
.garage-menu-main-1, .garage-menu-main-2 {
width: 50%;
}
.garage-menu-main-3 {
width: 100%;
}
.garage-menu-main-1 {
padding-right: 7px;
}
.garage-menu-main-3 ul {
display: flex;
flex-direction: row;
}
.garage-menu-main-3 ul li {
display: flex;
flex-direction: row;
width: 25%;
margin-left: 10px;
text-align: center;
}
.garage-menu-main-3 ul li img {
display: block;
width: 20px;
height: 20px;
}
.garage-menu-main-3 ul li a {
display: inline-block;
text-align: left;
font-size: 15px;
margin-left: 5px;
padding-left: 5px;
}
}
@media screen and (max-width: 700px) {
.md-overlay {
background: #f3f3f3;
}
.garage-menu-wrapper {
width: 100%;
}
.garage-menu-main_two_block {
flex-direction: column;
}
.garage-menu-main-1, .garage-menu-main-2 {
width: 100%;
}
.garage-menu-main-1 img {
text-align: center;
}
.garage-menu-main-1 div {
display: block;
width: 50%;
}
.garage-menu-main-3 ul {
width: 100%;
flex-direction: column;
}
.garage-menu-main-3 ul li {
width: auto;
margin: 0 auto;
}
.location_in_garage{
display: inline-block;
border-right: none;
width: 97.5%;
text-align: center;
border-bottom: 2px solid lightgrey;
}
.garage-menu-main-2 {
border-top: 1px solid lightgrey;
border-bottom: 1px solid lightgrey;
padding: 20px 0;
text-align: center;
}
.garage-menu-main-2 p {
max-width: 375px;
margin: 15px auto;
}
.garage-menu-main-3 {
margin: 20px auto;
}
.garage-menu-main-2_if {
margin-top: 0;
}
}
@media screen and (max-width: 532px) {
.modal--choose_car--item {
margin: 10px 5px;
}
}
@media screen and (max-width: 452px) {
.modal--choose_car--item {
margin: 10px auto;
}
}
@media screen and (max-width: 400px) {
.garage-menu-main-1 img {
width: 120px;
}
.garage-menu-main-2 {
border-top: 1px solid lightgrey;
border-bottom: 1px solid lightgrey;
padding: 20px 0;
text-align: center;
}
.garage-menu-main-3 {
margin: 20px auto;
}
.garage-menu-main-2_if {
margin-top: 0;
}
}
@charset "UTF-8";
/*!
* animate.css -http://daneden.me/animate
* Version - 3.7.0
* Licensed under the MIT license - http://opensource.org/licenses/MIT
*
* Copyright (c) 2018 Daniel Eden
*/
@-webkit-keyframes bounce {
from,
20%,
53%,
80%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
40%,
43% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -30px, 0);
transform: translate3d(0, -30px, 0);
}
70% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -15px, 0);
transform: translate3d(0, -15px, 0);
}
90% {
-webkit-transform: translate3d(0, -4px, 0);
transform: translate3d(0, -4px, 0);
}
}
@keyframes bounce {
from,
20%,
53%,
80%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
40%,
43% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -30px, 0);
transform: translate3d(0, -30px, 0);
}
70% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -15px, 0);
transform: translate3d(0, -15px, 0);
}
90% {
-webkit-transform: translate3d(0, -4px, 0);
transform: translate3d(0, -4px, 0);
}
}
.bounce {
-webkit-animation-name: bounce;
animation-name: bounce;
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
}
@-webkit-keyframes flash {
from,
50%,
to {
opacity: 1;
}
25%,
75% {
opacity: 0;
}
}
@keyframes flash {
from,
50%,
to {
opacity: 1;
}
25%,
75% {
opacity: 0;
}
}
.flash {
-webkit-animation-name: flash;
animation-name: flash;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes pulse {
from {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
50% {
-webkit-transform: scale3d(1.05, 1.05, 1.05);
transform: scale3d(1.05, 1.05, 1.05);
}
to {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes pulse {
from {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
50% {
-webkit-transform: scale3d(1.05, 1.05, 1.05);
transform: scale3d(1.05, 1.05, 1.05);
}
to {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.pulse {
-webkit-animation-name: pulse;
animation-name: pulse;
}
@-webkit-keyframes rubberBand {
from {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
30% {
-webkit-transform: scale3d(1.25, 0.75, 1);
transform: scale3d(1.25, 0.75, 1);
}
40% {
-webkit-transform: scale3d(0.75, 1.25, 1);
transform: scale3d(0.75, 1.25, 1);
}
50% {
-webkit-transform: scale3d(1.15, 0.85, 1);
transform: scale3d(1.15, 0.85, 1);
}
65% {
-webkit-transform: scale3d(0.95, 1.05, 1);
transform: scale3d(0.95, 1.05, 1);
}
75% {
-webkit-transform: scale3d(1.05, 0.95, 1);
transform: scale3d(1.05, 0.95, 1);
}
to {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes rubberBand {
from {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
30% {
-webkit-transform: scale3d(1.25, 0.75, 1);
transform: scale3d(1.25, 0.75, 1);
}
40% {
-webkit-transform: scale3d(0.75, 1.25, 1);
transform: scale3d(0.75, 1.25, 1);
}
50% {
-webkit-transform: scale3d(1.15, 0.85, 1);
transform: scale3d(1.15, 0.85, 1);
}
65% {
-webkit-transform: scale3d(0.95, 1.05, 1);
transform: scale3d(0.95, 1.05, 1);
}
75% {
-webkit-transform: scale3d(1.05, 0.95, 1);
transform: scale3d(1.05, 0.95, 1);
}
to {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.rubberBand {
-webkit-animation-name: rubberBand;
animation-name: rubberBand;
}
@-webkit-keyframes shake {
from,
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
10%,
30%,
50%,
70%,
90% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
20%,
40%,
60%,
80% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
}
@keyframes shake {
from,
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
10%,
30%,
50%,
70%,
90% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
20%,
40%,
60%,
80% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
}
.shake {
-webkit-animation-name: shake;
animation-name: shake;
}
@-webkit-keyframes headShake {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
6.5% {
-webkit-transform: translateX(-6px) rotateY(-9deg);
transform: translateX(-6px) rotateY(-9deg);
}
18.5% {
-webkit-transform: translateX(5px) rotateY(7deg);
transform: translateX(5px) rotateY(7deg);
}
31.5% {
-webkit-transform: translateX(-3px) rotateY(-5deg);
transform: translateX(-3px) rotateY(-5deg);
}
43.5% {
-webkit-transform: translateX(2px) rotateY(3deg);
transform: translateX(2px) rotateY(3deg);
}
50% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes headShake {
0% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
6.5% {
-webkit-transform: translateX(-6px) rotateY(-9deg);
transform: translateX(-6px) rotateY(-9deg);
}
18.5% {
-webkit-transform: translateX(5px) rotateY(7deg);
transform: translateX(5px) rotateY(7deg);
}
31.5% {
-webkit-transform: translateX(-3px) rotateY(-5deg);
transform: translateX(-3px) rotateY(-5deg);
}
43.5% {
-webkit-transform: translateX(2px) rotateY(3deg);
transform: translateX(2px) rotateY(3deg);
}
50% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
.headShake {
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
-webkit-animation-name: headShake;
animation-name: headShake;
}
@-webkit-keyframes swing {
20% {
-webkit-transform: rotate3d(0, 0, 1, 15deg);
transform: rotate3d(0, 0, 1, 15deg);
}
40% {
-webkit-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg);
}
60% {
-webkit-transform: rotate3d(0, 0, 1, 5deg);
transform: rotate3d(0, 0, 1, 5deg);
}
80% {
-webkit-transform: rotate3d(0, 0, 1, -5deg);
transform: rotate3d(0, 0, 1, -5deg);
}
to {
-webkit-transform: rotate3d(0, 0, 1, 0deg);
transform: rotate3d(0, 0, 1, 0deg);
}
}
@keyframes swing {
20% {
-webkit-transform: rotate3d(0, 0, 1, 15deg);
transform: rotate3d(0, 0, 1, 15deg);
}
40% {
-webkit-transform: rotate3d(0, 0, 1, -10deg);
transform: rotate3d(0, 0, 1, -10deg);
}
60% {
-webkit-transform: rotate3d(0, 0, 1, 5deg);
transform: rotate3d(0, 0, 1, 5deg);
}
80% {
-webkit-transform: rotate3d(0, 0, 1, -5deg);
transform: rotate3d(0, 0, 1, -5deg);
}
to {
-webkit-transform: rotate3d(0, 0, 1, 0deg);
transform: rotate3d(0, 0, 1, 0deg);
}
}
.swing {
-webkit-transform-origin: top center;
transform-origin: top center;
-webkit-animation-name: swing;
animation-name: swing;
}
@-webkit-keyframes tada {
from {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
10%,
20% {
-webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
}
30%,
50%,
70%,
90% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
}
40%,
60%,
80% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
}
to {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes tada {
from {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
10%,
20% {
-webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
}
30%,
50%,
70%,
90% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
}
40%,
60%,
80% {
-webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
}
to {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.tada {
-webkit-animation-name: tada;
animation-name: tada;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes wobble {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
15% {
-webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
}
30% {
-webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
}
45% {
-webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
}
60% {
-webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
}
75% {
-webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes wobble {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
15% {
-webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
}
30% {
-webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
}
45% {
-webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
}
60% {
-webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
}
75% {
-webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.wobble {
-webkit-animation-name: wobble;
animation-name: wobble;
}
@-webkit-keyframes jello {
from,
11.1%,
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
22.2% {
-webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
transform: skewX(-12.5deg) skewY(-12.5deg);
}
33.3% {
-webkit-transform: skewX(6.25deg) skewY(6.25deg);
transform: skewX(6.25deg) skewY(6.25deg);
}
44.4% {
-webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
transform: skewX(-3.125deg) skewY(-3.125deg);
}
55.5% {
-webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
transform: skewX(1.5625deg) skewY(1.5625deg);
}
66.6% {
-webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
transform: skewX(-0.78125deg) skewY(-0.78125deg);
}
77.7% {
-webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
transform: skewX(0.390625deg) skewY(0.390625deg);
}
88.8% {
-webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
}
}
@keyframes jello {
from,
11.1%,
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
22.2% {
-webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
transform: skewX(-12.5deg) skewY(-12.5deg);
}
33.3% {
-webkit-transform: skewX(6.25deg) skewY(6.25deg);
transform: skewX(6.25deg) skewY(6.25deg);
}
44.4% {
-webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
transform: skewX(-3.125deg) skewY(-3.125deg);
}
55.5% {
-webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
transform: skewX(1.5625deg) skewY(1.5625deg);
}
66.6% {
-webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
transform: skewX(-0.78125deg) skewY(-0.78125deg);
}
77.7% {
-webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
transform: skewX(0.390625deg) skewY(0.390625deg);
}
88.8% {
-webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
}
}
.jello {
-webkit-animation-name: jello;
animation-name: jello;
-webkit-transform-origin: center;
transform-origin: center;
}
@-webkit-keyframes heartBeat {
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
14% {
-webkit-transform: scale(1.3);
transform: scale(1.3);
}
28% {
-webkit-transform: scale(1);
transform: scale(1);
}
42% {
-webkit-transform: scale(1.3);
transform: scale(1.3);
}
70% {
-webkit-transform: scale(1);
transform: scale(1);
}
}
@keyframes heartBeat {
0% {
-webkit-transform: scale(1);
transform: scale(1);
}
14% {
-webkit-transform: scale(1.3);
transform: scale(1.3);
}
28% {
-webkit-transform: scale(1);
transform: scale(1);
}
42% {
-webkit-transform: scale(1.3);
transform: scale(1.3);
}
70% {
-webkit-transform: scale(1);
transform: scale(1);
}
}
.heartBeat {
-webkit-animation-name: heartBeat;
animation-name: heartBeat;
-webkit-animation-duration: 1.3s;
animation-duration: 1.3s;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
@-webkit-keyframes bounceIn {
from,
20%,
40%,
60%,
80%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
20% {
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
40% {
-webkit-transform: scale3d(0.9, 0.9, 0.9);
transform: scale3d(0.9, 0.9, 0.9);
}
60% {
opacity: 1;
-webkit-transform: scale3d(1.03, 1.03, 1.03);
transform: scale3d(1.03, 1.03, 1.03);
}
80% {
-webkit-transform: scale3d(0.97, 0.97, 0.97);
transform: scale3d(0.97, 0.97, 0.97);
}
to {
opacity: 1;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes bounceIn {
from,
20%,
40%,
60%,
80%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
20% {
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
40% {
-webkit-transform: scale3d(0.9, 0.9, 0.9);
transform: scale3d(0.9, 0.9, 0.9);
}
60% {
opacity: 1;
-webkit-transform: scale3d(1.03, 1.03, 1.03);
transform: scale3d(1.03, 1.03, 1.03);
}
80% {
-webkit-transform: scale3d(0.97, 0.97, 0.97);
transform: scale3d(0.97, 0.97, 0.97);
}
to {
opacity: 1;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
.bounceIn {
-webkit-animation-duration: 0.75s;
animation-duration: 0.75s;
-webkit-animation-name: bounceIn;
animation-name: bounceIn;
}
@-webkit-keyframes bounceInDown {
from,
60%,
75%,
90%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, -3000px, 0);
transform: translate3d(0, -3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, 25px, 0);
transform: translate3d(0, 25px, 0);
}
75% {
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
90% {
-webkit-transform: translate3d(0, 5px, 0);
transform: translate3d(0, 5px, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes bounceInDown {
from,
60%,
75%,
90%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(0, -3000px, 0);
transform: translate3d(0, -3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, 25px, 0);
transform: translate3d(0, 25px, 0);
}
75% {
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
90% {
-webkit-transform: translate3d(0, 5px, 0);
transform: translate3d(0, 5px, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.bounceInDown {
-webkit-animation-name: bounceInDown;
animation-name: bounceInDown;
}
@-webkit-keyframes bounceInLeft {
from,
60%,
75%,
90%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(-3000px, 0, 0);
transform: translate3d(-3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(25px, 0, 0);
transform: translate3d(25px, 0, 0);
}
75% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
90% {
-webkit-transform: translate3d(5px, 0, 0);
transform: translate3d(5px, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes bounceInLeft {
from,
60%,
75%,
90%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
0% {
opacity: 0;
-webkit-transform: translate3d(-3000px, 0, 0);
transform: translate3d(-3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(25px, 0, 0);
transform: translate3d(25px, 0, 0);
}
75% {
-webkit-transform: translate3d(-10px, 0, 0);
transform: translate3d(-10px, 0, 0);
}
90% {
-webkit-transform: translate3d(5px, 0, 0);
transform: translate3d(5px, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.bounceInLeft {
-webkit-animation-name: bounceInLeft;
animation-name: bounceInLeft;
}
@-webkit-keyframes bounceInRight {
from,
60%,
75%,
90%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
from {
opacity: 0;
-webkit-transform: translate3d(3000px, 0, 0);
transform: translate3d(3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(-25px, 0, 0);
transform: translate3d(-25px, 0, 0);
}
75% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
90% {
-webkit-transform: translate3d(-5px, 0, 0);
transform: translate3d(-5px, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes bounceInRight {
from,
60%,
75%,
90%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
from {
opacity: 0;
-webkit-transform: translate3d(3000px, 0, 0);
transform: translate3d(3000px, 0, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(-25px, 0, 0);
transform: translate3d(-25px, 0, 0);
}
75% {
-webkit-transform: translate3d(10px, 0, 0);
transform: translate3d(10px, 0, 0);
}
90% {
-webkit-transform: translate3d(-5px, 0, 0);
transform: translate3d(-5px, 0, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.bounceInRight {
-webkit-animation-name: bounceInRight;
animation-name: bounceInRight;
}
@-webkit-keyframes bounceInUp {
from,
60%,
75%,
90%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
from {
opacity: 0;
-webkit-transform: translate3d(0, 3000px, 0);
transform: translate3d(0, 3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
75% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
90% {
-webkit-transform: translate3d(0, -5px, 0);
transform: translate3d(0, -5px, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes bounceInUp {
from,
60%,
75%,
90%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}
from {
opacity: 0;
-webkit-transform: translate3d(0, 3000px, 0);
transform: translate3d(0, 3000px, 0);
}
60% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
75% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
90% {
-webkit-transform: translate3d(0, -5px, 0);
transform: translate3d(0, -5px, 0);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.bounceInUp {
-webkit-animation-name: bounceInUp;
animation-name: bounceInUp;
}
@-webkit-keyframes bounceOut {
20% {
-webkit-transform: scale3d(0.9, 0.9, 0.9);
transform: scale3d(0.9, 0.9, 0.9);
}
50%,
55% {
opacity: 1;
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
}
@keyframes bounceOut {
20% {
-webkit-transform: scale3d(0.9, 0.9, 0.9);
transform: scale3d(0.9, 0.9, 0.9);
}
50%,
55% {
opacity: 1;
-webkit-transform: scale3d(1.1, 1.1, 1.1);
transform: scale3d(1.1, 1.1, 1.1);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
}
.bounceOut {
-webkit-animation-duration: 0.75s;
animation-duration: 0.75s;
-webkit-animation-name: bounceOut;
animation-name: bounceOut;
}
@-webkit-keyframes bounceOutDown {
20% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
40%,
45% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
@keyframes bounceOutDown {
20% {
-webkit-transform: translate3d(0, 10px, 0);
transform: translate3d(0, 10px, 0);
}
40%,
45% {
opacity: 1;
-webkit-transform: translate3d(0, -20px, 0);
transform: translate3d(0, -20px, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
.bounceOutDown {
-webkit-animation-name: bounceOutDown;
animation-name: bounceOutDown;
}
@-webkit-keyframes bounceOutLeft {
20% {
opacity: 1;
-webkit-transform: translate3d(20px, 0, 0);
transform: translate3d(20px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
@keyframes bounceOutLeft {
20% {
opacity: 1;
-webkit-transform: translate3d(20px, 0, 0);
transform: translate3d(20px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
.bounceOutLeft {
-webkit-animation-name: bounceOutLeft;
animation-name: bounceOutLeft;
}
@-webkit-keyframes bounceOutRight {
20% {
opacity: 1;
-webkit-transform: translate3d(-20px, 0, 0);
transform: translate3d(-20px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
@keyframes bounceOutRight {
20% {
opacity: 1;
-webkit-transform: translate3d(-20px, 0, 0);
transform: translate3d(-20px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
.bounceOutRight {
-webkit-animation-name: bounceOutRight;
animation-name: bounceOutRight;
}
@-webkit-keyframes bounceOutUp {
20% {
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
40%,
45% {
opacity: 1;
-webkit-transform: translate3d(0, 20px, 0);
transform: translate3d(0, 20px, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
@keyframes bounceOutUp {
20% {
-webkit-transform: translate3d(0, -10px, 0);
transform: translate3d(0, -10px, 0);
}
40%,
45% {
opacity: 1;
-webkit-transform: translate3d(0, 20px, 0);
transform: translate3d(0, 20px, 0);
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
.bounceOutUp {
-webkit-animation-name: bounceOutUp;
animation-name: bounceOutUp;
}
@-webkit-keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.fadeIn {
-webkit-animation-name: fadeIn;
animation-name: fadeIn;
}
@-webkit-keyframes fadeInDown {
from {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes fadeInDown {
from {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.fadeInDown {
-webkit-animation-name: fadeInDown;
animation-name: fadeInDown;
}
@-webkit-keyframes fadeInDownBig {
from {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes fadeInDownBig {
from {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.fadeInDownBig {
-webkit-animation-name: fadeInDownBig;
animation-name: fadeInDownBig;
}
@-webkit-keyframes fadeInLeft {
from {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes fadeInLeft {
from {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.fadeInLeft {
-webkit-animation-name: fadeInLeft;
animation-name: fadeInLeft;
}
@-webkit-keyframes fadeInLeftBig {
from {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes fadeInLeftBig {
from {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.fadeInLeftBig {
-webkit-animation-name: fadeInLeftBig;
animation-name: fadeInLeftBig;
}
@-webkit-keyframes fadeInRight {
from {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes fadeInRight {
from {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.fadeInRight {
-webkit-animation-name: fadeInRight;
animation-name: fadeInRight;
}
@-webkit-keyframes fadeInRightBig {
from {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes fadeInRightBig {
from {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.fadeInRightBig {
-webkit-animation-name: fadeInRightBig;
animation-name: fadeInRightBig;
}
@-webkit-keyframes fadeInUp {
from {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes fadeInUp {
from {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.fadeInUp {
-webkit-animation-name: fadeInUp;
animation-name: fadeInUp;
}
@-webkit-keyframes fadeInUpBig {
from {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes fadeInUpBig {
from {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.fadeInUpBig {
-webkit-animation-name: fadeInUpBig;
animation-name: fadeInUpBig;
}
@-webkit-keyframes fadeOut {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
@keyframes fadeOut {
from {
opacity: 1;
}
to {
opacity: 0;
}
}
.fadeOut {
-webkit-animation-name: fadeOut;
animation-name: fadeOut;
}
@-webkit-keyframes fadeOutDown {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes fadeOutDown {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
.fadeOutDown {
-webkit-animation-name: fadeOutDown;
animation-name: fadeOutDown;
}
@-webkit-keyframes fadeOutDownBig {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
@keyframes fadeOutDownBig {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, 2000px, 0);
transform: translate3d(0, 2000px, 0);
}
}
.fadeOutDownBig {
-webkit-animation-name: fadeOutDownBig;
animation-name: fadeOutDownBig;
}
@-webkit-keyframes fadeOutLeft {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes fadeOutLeft {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
.fadeOutLeft {
-webkit-animation-name: fadeOutLeft;
animation-name: fadeOutLeft;
}
@-webkit-keyframes fadeOutLeftBig {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
@keyframes fadeOutLeftBig {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(-2000px, 0, 0);
transform: translate3d(-2000px, 0, 0);
}
}
.fadeOutLeftBig {
-webkit-animation-name: fadeOutLeftBig;
animation-name: fadeOutLeftBig;
}
@-webkit-keyframes fadeOutRight {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes fadeOutRight {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
.fadeOutRight {
-webkit-animation-name: fadeOutRight;
animation-name: fadeOutRight;
}
@-webkit-keyframes fadeOutRightBig {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
@keyframes fadeOutRightBig {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(2000px, 0, 0);
transform: translate3d(2000px, 0, 0);
}
}
.fadeOutRightBig {
-webkit-animation-name: fadeOutRightBig;
animation-name: fadeOutRightBig;
}
@-webkit-keyframes fadeOutUp {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes fadeOutUp {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
.fadeOutUp {
-webkit-animation-name: fadeOutUp;
animation-name: fadeOutUp;
}
@-webkit-keyframes fadeOutUpBig {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
@keyframes fadeOutUpBig {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(0, -2000px, 0);
transform: translate3d(0, -2000px, 0);
}
}
.fadeOutUpBig {
-webkit-animation-name: fadeOutUpBig;
animation-name: fadeOutUpBig;
}
@-webkit-keyframes flip {
from {
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
rotate3d(0, 1, 0, -360deg);
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
rotate3d(0, 1, 0, -190deg);
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
rotate3d(0, 1, 0, -190deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
50% {
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
rotate3d(0, 1, 0, -170deg);
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
rotate3d(0, 1, 0, -170deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
80% {
-webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
rotate3d(0, 1, 0, 0deg);
transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
rotate3d(0, 1, 0, 0deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
to {
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
rotate3d(0, 1, 0, 0deg);
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
}
@keyframes flip {
from {
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
rotate3d(0, 1, 0, -360deg);
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
40% {
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
rotate3d(0, 1, 0, -190deg);
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
rotate3d(0, 1, 0, -190deg);
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
50% {
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
rotate3d(0, 1, 0, -170deg);
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px)
rotate3d(0, 1, 0, -170deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
80% {
-webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
rotate3d(0, 1, 0, 0deg);
transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0)
rotate3d(0, 1, 0, 0deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
to {
-webkit-transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0)
rotate3d(0, 1, 0, 0deg);
transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
}
.animated.flip {
-webkit-backface-visibility: visible;
backface-visibility: visible;
-webkit-animation-name: flip;
animation-name: flip;
}
@-webkit-keyframes flipInX {
from {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
}
to {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
@keyframes flipInX {
from {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
}
to {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
.flipInX {
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipInX;
animation-name: flipInX;
}
@-webkit-keyframes flipInY {
from {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
}
to {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
@keyframes flipInY {
from {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
opacity: 0;
}
40% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
60% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
opacity: 1;
}
80% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
}
to {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
}
.flipInY {
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipInY;
animation-name: flipInY;
}
@-webkit-keyframes flipOutX {
from {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
opacity: 1;
}
to {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
opacity: 0;
}
}
@keyframes flipOutX {
from {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
opacity: 1;
}
to {
-webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
opacity: 0;
}
}
.flipOutX {
-webkit-animation-duration: 0.75s;
animation-duration: 0.75s;
-webkit-animation-name: flipOutX;
animation-name: flipOutX;
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important;
}
@-webkit-keyframes flipOutY {
from {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
opacity: 1;
}
to {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
opacity: 0;
}
}
@keyframes flipOutY {
from {
-webkit-transform: perspective(400px);
transform: perspective(400px);
}
30% {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
opacity: 1;
}
to {
-webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
opacity: 0;
}
}
.flipOutY {
-webkit-animation-duration: 0.75s;
animation-duration: 0.75s;
-webkit-backface-visibility: visible !important;
backface-visibility: visible !important;
-webkit-animation-name: flipOutY;
animation-name: flipOutY;
}
@-webkit-keyframes lightSpeedIn {
from {
-webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
transform: translate3d(100%, 0, 0) skewX(-30deg);
opacity: 0;
}
60% {
-webkit-transform: skewX(20deg);
transform: skewX(20deg);
opacity: 1;
}
80% {
-webkit-transform: skewX(-5deg);
transform: skewX(-5deg);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes lightSpeedIn {
from {
-webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
transform: translate3d(100%, 0, 0) skewX(-30deg);
opacity: 0;
}
60% {
-webkit-transform: skewX(20deg);
transform: skewX(20deg);
opacity: 1;
}
80% {
-webkit-transform: skewX(-5deg);
transform: skewX(-5deg);
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.lightSpeedIn {
-webkit-animation-name: lightSpeedIn;
animation-name: lightSpeedIn;
-webkit-animation-timing-function: ease-out;
animation-timing-function: ease-out;
}
@-webkit-keyframes lightSpeedOut {
from {
opacity: 1;
}
to {
-webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
transform: translate3d(100%, 0, 0) skewX(30deg);
opacity: 0;
}
}
@keyframes lightSpeedOut {
from {
opacity: 1;
}
to {
-webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
transform: translate3d(100%, 0, 0) skewX(30deg);
opacity: 0;
}
}
.lightSpeedOut {
-webkit-animation-name: lightSpeedOut;
animation-name: lightSpeedOut;
-webkit-animation-timing-function: ease-in;
animation-timing-function: ease-in;
}
@-webkit-keyframes rotateIn {
from {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate3d(0, 0, 1, -200deg);
transform: rotate3d(0, 0, 1, -200deg);
opacity: 0;
}
to {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
@keyframes rotateIn {
from {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate3d(0, 0, 1, -200deg);
transform: rotate3d(0, 0, 1, -200deg);
opacity: 0;
}
to {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
.rotateIn {
-webkit-animation-name: rotateIn;
animation-name: rotateIn;
}
@-webkit-keyframes rotateInDownLeft {
from {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
to {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
@keyframes rotateInDownLeft {
from {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
to {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
.rotateInDownLeft {
-webkit-animation-name: rotateInDownLeft;
animation-name: rotateInDownLeft;
}
@-webkit-keyframes rotateInDownRight {
from {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
to {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
@keyframes rotateInDownRight {
from {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
to {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
.rotateInDownRight {
-webkit-animation-name: rotateInDownRight;
animation-name: rotateInDownRight;
}
@-webkit-keyframes rotateInUpLeft {
from {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
to {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
@keyframes rotateInUpLeft {
from {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
to {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
.rotateInUpLeft {
-webkit-animation-name: rotateInUpLeft;
animation-name: rotateInUpLeft;
}
@-webkit-keyframes rotateInUpRight {
from {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, -90deg);
transform: rotate3d(0, 0, 1, -90deg);
opacity: 0;
}
to {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
@keyframes rotateInUpRight {
from {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, -90deg);
transform: rotate3d(0, 0, 1, -90deg);
opacity: 0;
}
to {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
opacity: 1;
}
}
.rotateInUpRight {
-webkit-animation-name: rotateInUpRight;
animation-name: rotateInUpRight;
}
@-webkit-keyframes rotateOut {
from {
-webkit-transform-origin: center;
transform-origin: center;
opacity: 1;
}
to {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate3d(0, 0, 1, 200deg);
transform: rotate3d(0, 0, 1, 200deg);
opacity: 0;
}
}
@keyframes rotateOut {
from {
-webkit-transform-origin: center;
transform-origin: center;
opacity: 1;
}
to {
-webkit-transform-origin: center;
transform-origin: center;
-webkit-transform: rotate3d(0, 0, 1, 200deg);
transform: rotate3d(0, 0, 1, 200deg);
opacity: 0;
}
}
.rotateOut {
-webkit-animation-name: rotateOut;
animation-name: rotateOut;
}
@-webkit-keyframes rotateOutDownLeft {
from {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
to {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
}
@keyframes rotateOutDownLeft {
from {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
to {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, 45deg);
transform: rotate3d(0, 0, 1, 45deg);
opacity: 0;
}
}
.rotateOutDownLeft {
-webkit-animation-name: rotateOutDownLeft;
animation-name: rotateOutDownLeft;
}
@-webkit-keyframes rotateOutDownRight {
from {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
to {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
}
@keyframes rotateOutDownRight {
from {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
to {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
}
.rotateOutDownRight {
-webkit-animation-name: rotateOutDownRight;
animation-name: rotateOutDownRight;
}
@-webkit-keyframes rotateOutUpLeft {
from {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
to {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
}
@keyframes rotateOutUpLeft {
from {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
opacity: 1;
}
to {
-webkit-transform-origin: left bottom;
transform-origin: left bottom;
-webkit-transform: rotate3d(0, 0, 1, -45deg);
transform: rotate3d(0, 0, 1, -45deg);
opacity: 0;
}
}
.rotateOutUpLeft {
-webkit-animation-name: rotateOutUpLeft;
animation-name: rotateOutUpLeft;
}
@-webkit-keyframes rotateOutUpRight {
from {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
to {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, 90deg);
transform: rotate3d(0, 0, 1, 90deg);
opacity: 0;
}
}
@keyframes rotateOutUpRight {
from {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
opacity: 1;
}
to {
-webkit-transform-origin: right bottom;
transform-origin: right bottom;
-webkit-transform: rotate3d(0, 0, 1, 90deg);
transform: rotate3d(0, 0, 1, 90deg);
opacity: 0;
}
}
.rotateOutUpRight {
-webkit-animation-name: rotateOutUpRight;
animation-name: rotateOutUpRight;
}
@-webkit-keyframes hinge {
0% {
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
20%,
60% {
-webkit-transform: rotate3d(0, 0, 1, 80deg);
transform: rotate3d(0, 0, 1, 80deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
40%,
80% {
-webkit-transform: rotate3d(0, 0, 1, 60deg);
transform: rotate3d(0, 0, 1, 60deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
opacity: 1;
}
to {
-webkit-transform: translate3d(0, 700px, 0);
transform: translate3d(0, 700px, 0);
opacity: 0;
}
}
@keyframes hinge {
0% {
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
20%,
60% {
-webkit-transform: rotate3d(0, 0, 1, 80deg);
transform: rotate3d(0, 0, 1, 80deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
}
40%,
80% {
-webkit-transform: rotate3d(0, 0, 1, 60deg);
transform: rotate3d(0, 0, 1, 60deg);
-webkit-transform-origin: top left;
transform-origin: top left;
-webkit-animation-timing-function: ease-in-out;
animation-timing-function: ease-in-out;
opacity: 1;
}
to {
-webkit-transform: translate3d(0, 700px, 0);
transform: translate3d(0, 700px, 0);
opacity: 0;
}
}
.hinge {
-webkit-animation-duration: 2s;
animation-duration: 2s;
-webkit-animation-name: hinge;
animation-name: hinge;
}
@-webkit-keyframes jackInTheBox {
from {
opacity: 0;
-webkit-transform: scale(0.1) rotate(30deg);
transform: scale(0.1) rotate(30deg);
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
}
50% {
-webkit-transform: rotate(-10deg);
transform: rotate(-10deg);
}
70% {
-webkit-transform: rotate(3deg);
transform: rotate(3deg);
}
to {
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
}
}
@keyframes jackInTheBox {
from {
opacity: 0;
-webkit-transform: scale(0.1) rotate(30deg);
transform: scale(0.1) rotate(30deg);
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
}
50% {
-webkit-transform: rotate(-10deg);
transform: rotate(-10deg);
}
70% {
-webkit-transform: rotate(3deg);
transform: rotate(3deg);
}
to {
opacity: 1;
-webkit-transform: scale(1);
transform: scale(1);
}
}
.jackInTheBox {
-webkit-animation-name: jackInTheBox;
animation-name: jackInTheBox;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes rollIn {
from {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes rollIn {
from {
opacity: 0;
-webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
}
to {
opacity: 1;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.rollIn {
-webkit-animation-name: rollIn;
animation-name: rollIn;
}
/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
@-webkit-keyframes rollOut {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
}
}
@keyframes rollOut {
from {
opacity: 1;
}
to {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
}
}
.rollOut {
-webkit-animation-name: rollOut;
animation-name: rollOut;
}
@-webkit-keyframes zoomIn {
from {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
50% {
opacity: 1;
}
}
@keyframes zoomIn {
from {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
50% {
opacity: 1;
}
}
.zoomIn {
-webkit-animation-name: zoomIn;
animation-name: zoomIn;
}
@-webkit-keyframes zoomInDown {
from {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomInDown {
from {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomInDown {
-webkit-animation-name: zoomInDown;
animation-name: zoomInDown;
}
@-webkit-keyframes zoomInLeft {
from {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomInLeft {
from {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomInLeft {
-webkit-animation-name: zoomInLeft;
animation-name: zoomInLeft;
}
@-webkit-keyframes zoomInRight {
from {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomInRight {
from {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomInRight {
-webkit-animation-name: zoomInRight;
animation-name: zoomInRight;
}
@-webkit-keyframes zoomInUp {
from {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomInUp {
from {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomInUp {
-webkit-animation-name: zoomInUp;
animation-name: zoomInUp;
}
@-webkit-keyframes zoomOut {
from {
opacity: 1;
}
50% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
to {
opacity: 0;
}
}
@keyframes zoomOut {
from {
opacity: 1;
}
50% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
to {
opacity: 0;
}
}
.zoomOut {
-webkit-animation-name: zoomOut;
animation-name: zoomOut;
}
@-webkit-keyframes zoomOutDown {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomOutDown {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomOutDown {
-webkit-animation-name: zoomOutDown;
animation-name: zoomOutDown;
}
@-webkit-keyframes zoomOutLeft {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
transform: scale(0.1) translate3d(-2000px, 0, 0);
-webkit-transform-origin: left center;
transform-origin: left center;
}
}
@keyframes zoomOutLeft {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
transform: scale(0.1) translate3d(-2000px, 0, 0);
-webkit-transform-origin: left center;
transform-origin: left center;
}
}
.zoomOutLeft {
-webkit-animation-name: zoomOutLeft;
animation-name: zoomOutLeft;
}
@-webkit-keyframes zoomOutRight {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
transform: scale(0.1) translate3d(2000px, 0, 0);
-webkit-transform-origin: right center;
transform-origin: right center;
}
}
@keyframes zoomOutRight {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
}
to {
opacity: 0;
-webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
transform: scale(0.1) translate3d(2000px, 0, 0);
-webkit-transform-origin: right center;
transform-origin: right center;
}
}
.zoomOutRight {
-webkit-animation-name: zoomOutRight;
animation-name: zoomOutRight;
}
@-webkit-keyframes zoomOutUp {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
@keyframes zoomOutUp {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
}
.zoomOutUp {
-webkit-animation-name: zoomOutUp;
animation-name: zoomOutUp;
}
@-webkit-keyframes slideInDown {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
visibility: visible;
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes slideInDown {
from {
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
visibility: visible;
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.slideInDown {
-webkit-animation-name: slideInDown;
animation-name: slideInDown;
}
@-webkit-keyframes slideInLeft {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
visibility: visible;
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes slideInLeft {
from {
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
visibility: visible;
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.slideInLeft {
-webkit-animation-name: slideInLeft;
animation-name: slideInLeft;
}
@-webkit-keyframes slideInRight {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
visibility: visible;
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes slideInRight {
from {
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
visibility: visible;
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.slideInRight {
-webkit-animation-name: slideInRight;
animation-name: slideInRight;
}
@-webkit-keyframes slideInUp {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
visibility: visible;
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
@keyframes slideInUp {
from {
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
visibility: visible;
}
to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
}
.slideInUp {
-webkit-animation-name: slideInUp;
animation-name: slideInUp;
}
@-webkit-keyframes slideOutDown {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
@keyframes slideOutDown {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(0, 100%, 0);
transform: translate3d(0, 100%, 0);
}
}
.slideOutDown {
-webkit-animation-name: slideOutDown;
animation-name: slideOutDown;
}
@-webkit-keyframes slideOutLeft {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
@keyframes slideOutLeft {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0, 0);
}
}
.slideOutLeft {
-webkit-animation-name: slideOutLeft;
animation-name: slideOutLeft;
}
@-webkit-keyframes slideOutRight {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
@keyframes slideOutRight {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0);
}
}
.slideOutRight {
-webkit-animation-name: slideOutRight;
animation-name: slideOutRight;
}
@-webkit-keyframes slideOutUp {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
@keyframes slideOutUp {
from {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
to {
visibility: hidden;
-webkit-transform: translate3d(0, -100%, 0);
transform: translate3d(0, -100%, 0);
}
}
.slideOutUp {
-webkit-animation-name: slideOutUp;
animation-name: slideOutUp;
}
.animated {
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
.animated.infinite {
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
}
.animated.delay-1s {
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
.animated.delay-2s {
-webkit-animation-delay: 2s;
animation-delay: 2s;
}
.animated.delay-3s {
-webkit-animation-delay: 3s;
animation-delay: 3s;
}
.animated.delay-4s {
-webkit-animation-delay: 4s;
animation-delay: 4s;
}
.animated.delay-5s {
-webkit-animation-delay: 5s;
animation-delay: 5s;
}
.animated.fast {
-webkit-animation-duration: 800ms;
animation-duration: 800ms;
}
.animated.faster {
-webkit-animation-duration: 500ms;
animation-duration: 500ms;
}
.animated.slow {
-webkit-animation-duration: 2s;
animation-duration: 2s;
}
.animated.slower {
-webkit-animation-duration: 3s;
animation-duration: 3s;
}
@media (print), (prefers-reduced-motion) {
.animated {
-webkit-animation: unset !important;
animation: unset !important;
-webkit-transition: none !important;
transition: none !important;
}
}
/*
JQuery Simple MobileMenu
https://github.com/Position2/jQuery-Simple-MobileMenu
*/
/*Main style*/
body.mmactive {
overflow: hidden;
}
.mobile_menu {
display: none;
position: relative;
height: 100%;
}
.mobile_menu > li svg {
height: auto;
max-height: 30px;
width: 30px;
margin-right: 10px;
}
.img-wrap {
/*width: 30px;*/
/*margin-right: 10px;*/
width: auto;
max-width: 150px;
max-height: 125px;
display: block;
margin: auto;
align-self: center;
}
.mobile_menu .sub-img {
height: auto;
max-height: 30px;
max-width: 30px;
margin: auto;
}
.sm_menu_outer.active .mobile_menu {
display: block;
margin-top: 50px;
}
.sm_menu_outer {
height: 100vh;
overflow-y: scroll;
overflow-x: hidden;
position: fixed;
right: 0;
bottom: 0;
z-index: -9;
width: 100%;
opacity: 0;
background-color: #f3f3f3;
-webkit-transition: opacity 0.2s;
-moz-transition: opacity 0.2s;
transition: opacity 0.2s;
}
.sm_menu_outer.active {
opacity: 1;
z-index: 9999;
}
.sm_menu_outer .mobile_menu li.back a {
padding: 20px 5px 20px 55px;
background: url('../../../../../../../../design/themes/avtoopt/media/../images/back.svg?1759911146') no-repeat scroll 15px center / 5% auto;
}
.sm_menu_outer .mobile_menu a {
color: #3A3A3A;
display: flex;
align-items: center;
font-size: 15px;
line-height: 21px;
padding: 15px;
padding-right: 35px;
text-decoration: none;
background-color: #fff!important;
}
/*Sub Menu anim */
.sm_menu_outer .mobile_menu .submenu {
background-color: #fff;
height: 100%;
position: absolute;
right: -100%;
top: 0;
transition: all 0.5s ease 0s;
width: 100%;
z-index: 9999;
}
.sm_menu_outer .mobile_menu li.active>.submenu {
right: 0;
}
.sm_menu_outer .mobile_menu li {
list-style-type: none;
border-bottom: 0.5px solid rgba(0, 0, 0, 0);
/*border-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, #2a2a2a 20%, #2a2a2a 50%, #2a2a2a 80%, rgba(0, 0, 0, 0) 100%) 0 0 1 0;*/
color: #29166f;
border-bottom: solid 1px #d8d8d8;
}
.sm_menu_outer .mobile_menu li.hasChild>a {
background: url('../../../../../../../../design/themes/avtoopt/media/../images/next.svg?1759911146') no-repeat scroll 95% center / 5% auto;
}
.sm_menu_outer .mobile_menu li >a {
background: url('../../../../../../../../design/themes/avtoopt/media/../images/next.svg?1759911146') no-repeat scroll 95% center / 5% auto;
}
/*Hamburger Animation */
#sm_menu_ham {
cursor: pointer;
float: right;
height: 25px;
position: fixed;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: all 0.5s ease-in-out 0s;
-moz-transition: all 0.5s ease-in-out 0s;
-o-transition: all 0.5s ease-in-out 0s;
transition: all 0.5s ease-in-out 0s;
width: 30px;
top: 15px;
right: 15px;
z-index: 10000;
background-color: rgba(255, 255, 255, .5);
display: none;
}
#sm_menu_ham span {
background-color: #37383a;
border-radius: 5px;
display: block;
height: 2px;
left: 0;
opacity: 1;
position: absolute;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: all 0.25s ease-in-out 0s;
-moz-transition: all 0.25s ease-in-out 0s;
-o-transition: all 0.25s ease-in-out 0s;
transition: all 0.25s ease-in-out 0s;
width: 30px;
}
#sm_menu_ham span:nth-child(1) {
top: 0;
}
#sm_menu_ham span:nth-child(2),
#sm_menu_ham span:nth-child(3) {
top: 10px;
}
#sm_menu_ham span:nth-child(4) {
top: 20px;
}
#sm_menu_ham.open {
display: block;
}
#sm_menu_ham.open span:nth-child(1) {
left: 50%;
top: 18px;
width: 0;
}
#sm_menu_ham.open span:nth-child(2) {
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
transform: rotate(45deg);
}
#sm_menu_ham.open span:nth-child(3) {
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
transform: rotate(-45deg);
}
#sm_menu_ham.open span:nth-child(4) {
left: 50%;
top: 18px;
width: 0;
}
/*@media (min-width: 0px) and (max-width: 767px) {}
@media (min-width: 768px) and (max-width: 991px) {}
@media (min-width: 992px) and (max-width: 1024px) {}*/
@media (min-width: 1024px) {
#sm_menu_ham,
.sm_menu_outer {
display: none;
}
}
:root {
--main-color-grafit: #37383a;
}
.menu-top-level {
display: flex;
flex-direction: column;
background-color: #fbfbfb!important;
/*border-radius: 5px 0 0 5px;*/
position: relative;
/*margin: -40px 25px 16px -20px;*/
max-width: 225px;
float: left;
z-index: 999;
}
.menu-top-level li {
border-radius: 0;
margin: 0;
padding: 12px!important;
border: none;
display: block!important;
}
.menu-top-level li svg, .menu-top-level li a i {
max-height: 23px;
height: 23px;
max-width: 23px;
margin-right: 10px;
fill: var(--main-color-grafit);
flex: 1 1 auto;
}
.menu-top-level > li {
padding: 0!important;
}
.menu-top-level > li:last-child {
border-bottom: 1px solid #ded9f1;
}
.menu-top-level > li:hover > a {
color: var(--main-color-grafit)!important;
/*font-weight: bold;*/
}
.middle-level-menu li:hover > a {
color: var(--main-color-grafit)!important;
font-weight: bold!important;
}
.menu-top-level li > a {
border-radius: 0;
border: none;
margin: 0!important;
padding: 0!important;
font: 300 14px/14px Roboto light!important;
text-decoration: none;
color: var(--main-color-grafit)!important;
text-transform: none!important;
}
.menu-top-level > li > a {
border: 1px solid #ded9f1;
border-bottom: none;
width: 200px;
display: flex;
align-items: center;
height: 20px;
padding: 13px 12px!important;
color: black!important;
}
.menu-top-level li:hover > .middle-level-menu {
display: flex;
}
.menu-top-level li a:hover {
background: none!important;
}
.menu-top-level > li:hover > a{
background: white!important;
border-right: 2px solid white;
}
.menu-top-level > li:hover > a > .glyphicon{
display: none;
}
.middle-level-menu {
display: none;
position: absolute;
background-color: #fff;
border: 1px solid #ddd;
border-left: none;
padding: 5px 15px;
padding-top: 20px;
border-radius: 0 5px 5px 0;
flex-direction: column;
flex-wrap: wrap;
top: 0;
left: 226px;
width: 940px;
min-width: 100%;
max-width: 940px;
height: 585px;
background-size: 40% !important;
animation-duration: 300ms;
}
.middle-level-menu > li {
max-width: 250px;
position: relative;
padding: 5px 15px!important;
}
.middle-level-menu > li > a {
line-height: 1.2em;
}
.low-level-menu {
display: block;
top: 10px;
width: 300px;
z-index: 100500;
margin-top: 5px;
margin-bottom: 10px;
}
.low-level-menu > li{
padding: 3px 0 3px 12px!important;
width: fit-content;
position: relative;
display: block!important;
}
.low-level-menu > a {
line-height: 1.2em;
}
.menu-top-level .middle-level-menu .haschild > a {
font: 700 14px/14px Roboto bold!important;
}
.lowest-level-menu {
display: none;
position: absolute;
background: #fbfbfb;
padding: 10px;
z-index: 100600;
border: 1px solid #ddd;
width: 250px;
box-shadow: 1px 1px 2px rgba(0,0,0, 0.3);
animation-duration: 300ms;
top: -10px;
left: 100%;
}
.lowest-level-menu > li {
padding: 5px!important;
}
.low-level-menu .haschild2:hover .lowest-level-menu {
display: block;
}
.goods_count {
color: #666;
margin: 5px;
font-size: 13px;
}
.menu-categories-wrapper {
margin: -10px 20px 0px -20px;
float: left;
}
@media (max-width: 1020px) {
.menu-top-level {
display: none;
}
}
@media (max-width: 764px) {
.catalog__category_block--custom {
/*justify-content: stretch;*/
flex-direction: column;
}
.catalog__category_block--custom a {
flex: 1 1 175px!important;
border: none!important;
}
.catalog__category .catalog__category_block--custom a,
.category_back {
flex-direction: row;
padding: 0;
justify-content: flex-start;
margin: 0;
max-height: 60px;
color: #333;
background: #fff url('../../../../../../../../design/themes/avtoopt/media/../images/next.svg?1759911146') no-repeat scroll 95% center / 5% auto;
}
.catalog__category .catalog__category_block--custom a img {
max-width: 50px;
max-height: 50px;
margin: 0 auto;
}
.img-wrap {
width: 25%;
margin: 0;
flex-shrink: 0;
}
.goods_count {
display: none;
}
.category_title {
font-size: 15px!important;
display: inline!important;
}
.mobile_goods_count {
color: #4c2f75;
display: inline!important;
}
.catalog__category--custom {
padding: 0;
margin: 0;
border:none;
}
.category_wrap {
margin-right: 30px;
text-align: left;
}
.category_back {
display: flex!important;
background: none!important;
border: none;
}
.category_back .img-wrap {
width: 12%;
}
.category_back img {
height: 30px;
width: auto;
}
.title-blocks__pages--custom {
display: none;
}
.detail-product__bread-crumbs--custom {
display: none;
}
}
@media (max-width: 480px) {
.catalog__category_block--custom a {
flex: 1 1 90px!important;
}
/*.catalog__category .catalog__category_block--custom a img {*/
/*max-width: 100px;*/
/*}*/
.catalog__category .catalog__category_block--custom a span {
/*word-break: break-all;*/
font-size: 14px;
-webkit-hyphens: auto;
-moz-hyphens: auto;
-ms-hyphens: auto;
}
.catalog__category .catalog__category_block--custom a {
height: 180px;
}
.catalog__category .catalog__category_block--custom a .ty-no-image__icon {
width: 100%;
}
.b24-widget-button-inner-container {
display: none!important;
}
}
.menu-top-level .glyphicon {
color: var(--main-color-grafit);
font-size: 10px;
text-align: right;
margin-left: auto;
}
.lowest-level-menu .arr_bot {
width: 0;
height: 0;
position: absolute;
top: 10px;
left: -20px;
border: 10px solid transparent;
border-right-color: #ccc;
}
.lowest-level-menu .arr_bot:after {
content: '';
width: 0;
height: 0;
position: absolute;
bottom: -15px;
right: -17px;
border: 15px solid transparent;
border-right-color: #fbfbfb;
}
.lowest--wrapper {
max-height: 350px;
overflow-y: auto;
}
.lowest--wrapper > li {
padding: 5px!important;
}
.menu_goods_count {
color: #a1a1a1;
margin: 0 5px;
font-size: 10px;
background-color: #f3f1f169;
padding: 0px 3px;
display: inline-block;
text-align: center;
font-weight: normal;
}
@media screen and (min-width: 940px) {
.catalog_flex > .row-fluid {
display: flex;
}
.catalog_custom {
width: 100%;
}
}
.ty-buy-together__products{white-space:nowrap;}.ty-buy-together__product{display:inline-block;margin:10px 0px 20px;width:195px;vertical-align:middle;text-align:center;}.ty-buy-together__plus{display:inline-block;margin:0 15px 20px;color:#bdc3c7;font-size:350%;}.ty-buy-together__product-name{padding:5px 0 0;white-space:normal;}.ty-buy-together__product-options{padding:5px 0 0;}.ty-buy-together__product-price{padding:5px 0 0;}.ty-buy-together-option{padding:5px 0 0;}.ty-buy-together-option__name{font-weight:bold;}.ty-buy-together__description{padding-top:10px;margin:20px 5px 5px;border-top:1px dotted #ccc;}.ty-buy-together-box{text-align:left;min-width:360px;}.ty-buy-together-box .ty-product-variant-image{margin-left:134px;}.ty-buy-together-box select{min-width:220px;}.ty-buy-together-price{padding:20px 20px 0px;margin:55px 0;border-top:1px solid #e3e9ec;}.ty-buy-together-price__title{display:inline-block;padding-right:30px;width:140px;}.ty-buy-together-price__new{padding-top:10px;font-size:140%;font-weight:bold;}.ty-buy-together-notification__item{margin-left:20px;margin-bottom:7px;overflow:hidden;}.ty-buy-together-notification__item-link{float:left;max-width:60%;}.ty-buy-together-orders__products{margin-top:10px;}.ty-buy-together-cart-items__list{padding-left:20px;margin-left:20px;margin-top:10px;border-left:1px solid #eee;}.ty-buy-together-info{margin-top:10px;}.ty-buy-together-info__product{margin:0;font-size:120%;font-weight:bold;}.ty-buy-together-info__item{padding:10px 0;border-bottom:1px solid #e5e5e5;color:#737373;}.ty-buy-together-info__item:last-child{border-bottom:0;}.ty-buy-together-popup{margin-bottom:20px;}@media (max-width: 979px){.ty-buy-together__products{white-space:normal;}.ty-buy-together__product{width:175px;}}@media (max-width: 767px){.ty-buy-together__product{display:block;margin:0;width:100%;}.ty-buy-together__plus{margin:0;width:100%;text-align:center;}.ty-buy-together-notification__item{margin-left:0px;}.ty-buy-together-notification__item-link{max-width:60%;}.ty-product-notification__price{margin-left:0px;}.ty-product-notification__body ul ul{margin-left:20px;}.ty-buy-together-notification__items .ty-product-notification__body .ty-product-options__info{margin-top:0px;}.ty-buy-together-notification__items .ty-buy-together-notification__items .ty-buy-together-notification__item{padding-left:20px;}.ty-buy-together-popup .ty-table__responsive-content{float:left;width:50%;}.ty-buy-together-popup .ty-table__responsive-header{width:35%;}.ty-buy-together-box .ty-product-variant-image{margin-left:0px;}.ty-buy-together-box{min-width:100px;}.ty-buy-together-cart-items__list .ty-cart-items__list-item-desc{width:150px;}}.ty-social-buttons{margin:20px 0px;}.ty-social-buttons__inline{display:inline-block;vertical-align:top;margin:5px 20px 10px 0;}.ty-social-buttons__email-sharing{text-decoration:none;}.ty-social-buttons__email-icon{vertical-align:middle;margin-left:5px;font-size:16px;}.ty-product-bigpicture .ty-social-buttons__inline{margin:5px 0 0;}.pinterest__wrapper{margin-top:-1px;display:block;}@media (max-width: 767px){.ty-social-buttons__inline{display:block;}}.ty-tag-cloud{margin:10px 0;}.ty-tag-cloud__item{margin-right:10px;}.ty-tag-level-0,.ty-tag-level-0:active{font-size:100%;}.ty-tag-level-1,.ty-tag-level-1:active{font-size:150%;}.ty-tag-level-2,.ty-tag-level-2:active{font-size:200%;}.ty-tag-level-3,.ty-tag-level-3:active{font-size:250%;}.ty-tag-level-4,.ty-tag-level-4:active{font-size:300%;}.ty-tag-level-5,.ty-tag-level-5:active{font-size:350%;}.ty-tag-level-6,.ty-tag-level-6:active{font-size:400%;}ul.ty-tags-list{padding-left:0;}.ty-tags-list__item{display:inline-block;}.ty-tags-list__a{position:relative;display:block;float:left;margin:3px 5px 3px 15px;padding:0 27px 0 10px;font-size:12px;line-height:24px;text-decoration:none;border:0 none;background:#e6e6e6;}.ty-tags-list__a:before{position:absolute;top:50%;left:-14px;float:left;margin-top:-12px;width:0;height:0;border-width:12px 14px 12px 0;border-style:solid;border-color:transparent #e6e6e6 transparent transparent;content:"";}.ty-tags-list__a:after{position:absolute;top:50%;left:0;float:left;margin-top:-2px;width:4px;height:4px;background:#fff;content:"";}.ty-tags-list__a{background:#e6e6e6;color:#676767;transition:none;padding-right:10px;}.ty-tags-list__a:hover{background:#16a085;color:#fff;text-shadow:none;}.ty-tags-list__a:hover:before{border-right-color:#16a085;}.ty-icon-feed{display:inline-block;float:right;margin-top:-25px;font-size:16px;}.ty-newsletters{margin-bottom:30px;}.ty-newsletters__item{margin-bottom:5px;}.checkout-steps .ty-newsletters{padding:0 20px;}.ty-checkout__billing-options .ty-newsletters{padding:0;}.ty-footer-form-block--responsive > form{display:-webkit-box;display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:center;-ms-flex-pack:center;ustify-content:center;}.ty-footer-form-block--responsive .ty-footer-form-block__title{padding:0;}.ty-footer-form-block--responsive .ty-footer-form-block__form-container{padding-left:10px;}.ty-footer-form-block--responsive .ty-footer-form-block__form-container .ty-footer-form-block-policy__input{width:100%;padding-bottom:10px;}.ty-footer-form-block--responsive .ty-footer-form-block__form-container .ty-lable-subscribe-policy{margin-bottom:10px;}.ty-footer-form-block--responsive .ty-lable-subscribe-policy > a{color:inherit;text-decoration:underline;}.ty-geo-maps__geolocation{display:inline-block;}.ty-geo-maps__geolocation__opener{display:inline-block;padding:8px 2px;}.ty-geo-maps__geolocation__map{height:405px;margin:0 auto 10px auto;}@media (min-width: 768px){.ty-geo-maps__geolocation__map{width:690px;}}@media (max-width: 768px){.ty-geo-maps__geolocation__map{height:calc(100vh - 165px);}}.geo-map-google-search-bar{background-color:#fff;font-family:Roboto;font-size:15px;font-weight:300;margin-top:12px;margin-left:12px;padding:0 11px 0 13px;text-overflow:ellipsis;width:400px;}.geo-map-google-search-bar:focus{border-color:#4d90fe;}.ty-geo-maps-shipping__wrapper{margin-top:20px;border-top:1px solid #dcdcdc;}.ty-geo-maps-shipping__title{font-weight:700;margin-top:10px;}.ty-geo-maps-shipping__item{padding-top:6px;padding-bottom:6px;}.ty-geo-maps-shipping__label{display:inline-block;}.ty-geo-maps-shipping__value{display:inline-block;}.ty-geo-maps-shipping__link-text{border-bottom:1px dotted currentColor;}.ty-geo-maps-shipping__price{font-weight:700;}.ty-geo-maps-shipping__popup{margin-bottom:20px;text-align:left;}.ty-geo-maps-shipping__list{border:0;margin-top:0;margin-top:10px;}.ty-geo-maps-shipping__list-city{text-align:right;font-weight:700;}.ty-table tr.ty-geo-maps-shipping__list-item:nth-child(2n){background:none;}.ty-geo-maps-shipping__list-item:last-child .ty-geo-maps-shipping__list-col{border-bottom:0;}th.ty-geo-maps-shipping__list-head{background:none;border-right:0;}th.ty-geo-maps-shipping__list-head--price{text-align:right;}.ty-geo-maps-shipping__list-col--price{font-weight:700;text-align:right;}td.ty-geo-maps-shipping__list-col{border-right:0;}.ty-product-bigpicture .ty-geo-maps-shipping__wrapper{margin-left:20px;margin-right:20px;}.ty-product-bigpicture .ty-geo-maps-shipping__item{text-align:left;margin-left:40px;margin-right:20px;}.ty-product-bigpicture .ty-geo-maps-shipping__label{text-indent:-20px;}.ty-geo-maps-shipping__loader{width:50px;height:50px;background:url('../../../../../../../../design/themes/responsive/media/images/icons/ajax_loader.svg?1759911146') no-repeat;}.ty-gift-certificate{margin-top:25px;}.ty-gift-certificate__amount-alert{color:#a6a6a6;padding-top:2px;}.error .ty-gift-certificate__amount-alert{color:#b94a48;}.ty-gift-certificate__amount-input{width:115px;}.ty-gift-certificate__switch{margin:25px 0px;padding:15px 20px;border:2px solid #bdc3c7;background:white;}.ty-gift-certificate__switch-label{float:left;}.ty-gift-certificate__switch-mail{float:right;}.ty-gift-certificate__send{float:left;padding-right:15px;}.ty-gift-certificate__products .ty-no-items{display:none;}.ty-gift-certificate__products .product-picker-icon{float:left;margin:2px 5px 0 0;}.ty-gift-certificate__select{width:100%;}.ty-gift-certificate__country{display:inline-block;width:47%;}.ty-gift-certificate__state{display:inline-block;margin-left:5%;width:47%;}.ty-gift-certificate-validate{margin-top:42px;}.ty-gift-certificate-validate .ty-input-append{width:88%;float:right;}.ty-gift-certificate-validate__title{font-weight:normal;text-align:right;}.ty-gift-certificate__icon{position:absolute;top:3px;left:-35px;font-size:27px;line-height:27px;color:#ddd;}.ty-gift-certificate-verify{min-width:600px;max-width:600px;}table.ty-gift-certificate-verify__table{margin:10px 0 20px 0;width:100%;}table.ty-gift-certificate-verify__table{margin-top:0;width:100%;}.ty-gift-certificate-verify__row{padding:7px 13px;}.ty-gift-certificate-verify__error{max-width:250px;text-align:center;font-weight:bold;}.ty-gift-certificate-history{width:100%;}.ty-gift-image{position:relative;display:block;margin:0 auto;border:1px solid #ebebeb;background-color:#f9f9f9;color:#c8c8c8;cursor:default;}.ty-gift-image__icon{position:absolute;top:50%;left:50%;display:inline-block;margin:-16px 0 0 -16px;width:32px;height:32px;font-size:32px;line-height:32px;}.ty-product-notification__item .ty-gift-image{margin-right:20px;}.ty-gift-certificate-order{margin-top:10px;}.ty-gift-certificate-order__group-label{display:inline-block;padding:6px 0;width:100px;}.ty-gift-certificate-order__group-item{display:inline-block;padding:6px 0;}.ty-gift-certificate-history .ty-no-items{margin-bottom:0;}@media (max-width: 979px){.ty-gift-certificate__preview-btn{float:none;margin-top:10px;}}@media (max-width: 767px){.ty-gift-certificate-verify{min-width:inherit;}.ty-gift-certificate-verify__row{display:block;}.ty-gift-certificate-validate{margin-top:20px;}.certificates-verify-grid{margin-bottom:30px;}}.ty-store-location{margin-top:30px;}.ty-store-location__map-wrapper{float:left;width:600px;height:450px;border:1px solid #979797;margin:0 30px 20px 0;}.ty-store-location__locations-wrapper{display:block;vertical-align:top;overflow:hidden;}.ty-store-location__item:first-child{margin-top:0;}.ty-store-location__item{margin:20px 0;}h3.ty-store-location__item-title{font-size:22px;margin:0 0 2px 0;}.ty-store-location__item-country{font-size:13px;font-weight:normal;}.ty-store-location__item-view{margin:20px 0;}@media (max-width: 979px){.ty-store-location__map-wrapper{width:400px;height:300px;}}@media (max-width: 767px){.ty-store-location__map-wrapper{width:100%;float:none;}}.native-captcha{margin-bottom:10px;min-width:200px;}.native-captcha__image-container{background:#f5f5f5;text-align:center;padding:5px 0;border:1px solid #c4c4c4;border-bottom:0;border-radius:5px 5px 0 0;}.native-captcha__answer{width:100%;margin-bottom:0;border-top-left-radius:0 !important;border-top-right-radius:0 !important;}@media (min-width: 480px){.native-captcha--short{max-width:310px;}}.ty-variations-list__wrapper{width:100%;overflow-x:auto;}.ty-variations-list__product-elem .ty-control-group{margin-bottom:0;}.ty-variations-list__product-elem .ty-control-group__item{padding:0;}.ty-variations-list__product-elem .ty-btn{margin-right:10px;margin-bottom:13px;}@media (min-width: 768px){.ty-variations-list__product-elem .ty-btn{margin-left:10px;margin-right:0;margin-bottom:0;}}.ty-variations-list__product-elem .ty-qty-out-of-stock{margin-right:10px;margin-bottom:13px;vertical-align:middle;}@media (min-width: 768px){.ty-variations-list__product-elem .ty-qty-out-of-stock{margin-left:15px;margin-right:0;margin-bottom:0;vertical-align:baseline;}}.ty-variations-list__image img{max-width:none;}.ty-variations-list__sku .ty-sku-item{font-size:13px;color:#465f73;}.ty-variations-list__controls{white-space:nowrap;text-align:right;}.ty-variations-list__controls .ty-add-to-wish.ty-btn i{margin-left:3px;margin-right:3px;}.ty-variations-list__controls form > div{display:inline-block;}.ty-variations-list__controls .ty-table__responsive-header{display:none;}.ty-variations-list__price{margin-bottom:13px;vertical-align:middle;}@media (min-width: 768px){.ty-variations-list__price{margin-bottom:0;}}.ty-variations-list__controls form > .ty-variations-list__price{display:block;}@media (min-width: 768px){.ty-variations-list__controls form > .ty-variations-list__price{display:inline-block;}}.ty-variations-list.ty-table{border:none;}.ty-variations-list.ty-table th{background:none;border-right:none;padding-left:5px;padding-right:5px;}@media (min-width: 980px){.ty-variations-list.ty-table th{padding-left:12px;padding-right:12px;}}.ty-variations-list.ty-table tbody tr:nth-child(2n){background:none;}.ty-variations-list.ty-table td,.ty-variations-list.ty-table .table td{border-right:none;padding-left:5px;padding-right:5px;}@media (min-width: 980px){.ty-variations-list.ty-table td,.ty-variations-list.ty-table .table td{padding-left:13px;padding-right:13px;}}.ty-variations-list .ty-table__responsive-content{display:inline-block;width:auto;}.ty-grid-list__item-features{display:flex;flex-direction:column;margin-top:10px;margin-bottom:5px;}.ty-grid-list__item-features-description{color:#8c8c8c;}.ty-grid-list__item-features-item{margin-bottom:5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.ty-grid-list__item-features-variant{margin-left:0.5rem;}.ty-product-variations__variation-features--secondary{color:#737373;}.ty-product-variations__variation-features--inline{display:inline-block;}.ty-product-variations__variation-features--mini{font-size:11.7px;}.ty-product-variations__variation-features--clearfix{clear:both;}.ty-reward-points__info{margin-top:10px;}.ty-reward-points__points-in-use{display:block;overflow:hidden;padding-top:5px;}.ty-reward-points__delete-icon{position:relative;top:3px;text-decoration:none;}.ty-reward-points__delete-icon:hover{text-decoration:none;}.ty-reward-points-userlog{width:100%;}.ty-reward-points-userlog__date{width:20%;}.ty-reward-points-userlog__points{width:10%;}.ty-reward-points-userlog__reason{width:70%;}.ty-checkout-summary__item .ty-reward-points__coupon{display:block;}.ty-reward-points__product-info:last-child{margin-bottom:0;}.ty-cart-content-products .ty-reward-points__product-info .ty-control-group__label{font-weight:bold;}.ty-cr-product-info-container{max-width:430px;}.ty-cr-product-info-image{display:inline-block;vertical-align:top;padding:10px 20px 10px 0;}.ty-cr-product-info-header{padding:10px;display:inline-block;max-width:260px;}.cr-popup-error-box{max-width:430px;padding-bottom:10px;}.ty-dropdown-box__title a{white-space:nowrap;}.ty-cr-phone-number-link{padding-left:30%;}.ty-cr-phone-number-link{margin:4px 0px 0px;text-align:center;}.ty-cr-phone-number-link .ty-cr-phone{white-space:nowrap;}.ty-cr-phone-number-link .ty-cr-phone{color:#888;font-weight:bold;font-size:18px;line-height:1em;}.ty-cr-phone-number-link .ty-cr-link{margin:3px 0px 0px;}.ty-cr-phone-number-link .ty-cr-link a{margin:0;}.ty-cr-phone-number-link .ty-cr-phone-prefix{color:#c8c8c8;font-weight:400;}.ty-cr-or{margin-bottom:-4px;margin-top:-3px;text-align:center;text-transform:uppercase;}.ty-cr-widget-content-grid .ty-cr-phone-number-link{margin:0;padding-left:0%;}@media (max-width: 1100px){.ty-cr-phone-number-link{padding-left:0%;}.ty-cr-phone-number-link .ty-cr-phone span{font-size:16px;}}@media (max-width: 767px){.ty-cr-content-grid .ty-cr-phone-number-link{margin:10px 0px 0px;float:left;}.ty-cr-phone-prefix{display:inline;}.ty-cr-widget-content-grid .ty-cr-phone-number-link{clear:both;padding:12px;}.header-widget-grid .cart-content-grid{width:100%;}.ty-cr-product-info-container,.cr-popup-error-box{max-width:100%;}.ty-cr-product-info-header{padding:0;display:block;max-width:100%;}.ty-cr-product-info-image{display:block;text-align:center;}}.ty-form-builder__checkbox-label,.ty-form-builder__radio-label{display:inline-block;margin:0 15px 5px 0;white-space:nowrap;}.ty-form-builder__multiple-select,.ty-form-builder__select,.ty-form-builder__state,.ty-form-builder__country{width:100%;max-width:500px;}.ty-form-builder__textarea{width:100%;max-width:500px;}.ty-form-builder .ty-input-text{width:100%;max-width:500px;}@media (max-width: 979px){.ty-form-builder__textarea{max-width:400px;}.ty-form-builder .ty-input-text{max-width:400px;}.ty-form-builder__multiple-select,.ty-form-builder__select,.ty-form-builder__state,.ty-form-builder__country{max-width:400px;}}.ty-banner__image-item{text-align:center;}.ty-banner__image-wrapper{position:relative;overflow:hidden;margin:0 0 10px 0;text-align:center;}.ty-scroller-discussion-list{margin-left:-10px;margin-right:-10px;}.ty-discussion-post__content{margin-top:10px;margin-bottom:10px;}.ty-discussion-post__content a{display:block;position:relative;}.ty-scroller-discussion-list__item{margin-left:10px;margin-right:10px;}.ty-discussion-post{position:relative;margin:10px 0 15px 0;padding:15px;border:1px solid #eee;}.ty-discussion-post__author{font-weight:bold;}.ty-discussion-post__date{float:right;right:0;margin-top:1px;color:#adadad;font-size:12px;}.ty-discussion-post__rating{font-size:15px;margin-bottom:5px;}.ty-discussion-post__message{line-height:1.75;word-wrap:break-word;}.ty-company-detail__top-links .ty-stars__icon{font-size:21px;}.ty-discussion__rating-wrapper{margin-bottom:10px;}.ty-discussion__rating-wrapper .ty-stars .ty-stars__icon{font-size:20px;margin-right:0px;}.ty-stars,.ty-discussion__review-a,.ty-discussion__review-write{display:inline-block;margin-right:25px;cursor:pointer;}.ty-grid-vendors .grid-list__rating{text-align:center;word-wrap:break-word;}.ty-grid-vendors .grid-list__rating .ty-stars{margin-right:10px;}.ty-grid-vendors .grid-list__rating .ty-discussion__review-quantity{color:#8c8c8c;display:inline-block;}.ty-stars{color:#08c;}.ty-stars__icon{vertical-align:middle;margin-left:2px;font-size:14px;}.ty-stars__icon:first-child{margin-left:0;}.ty-stars a:hover{text-decoration:none;}.ty-product-list__rating{position:absolute;text-align:center;right:0;left:0;}.ty-product-list__rating .ty-stars{margin-right:0;}.grid-list__rating .ty-stars{margin-bottom:5px;}.ty-companies .ty-stars{display:block;margin:5px 0 0;}.ty-rating{float:left;color:#08c;}.ty-rating__label{display:inline-block;}.ty-rating:not(:checked) > .ty-rating__check{position:absolute;left:-9999px;clip:rect(0,0,0,0);}.ty-rating:not(:checked) > .ty-rating__label{float:right;width:17px;padding:0;overflow:hidden;white-space:nowrap;cursor:pointer;font-size:100%;line-height:1.2;margin-right:2px;}.ty-rating:not(:checked) > .ty-rating__label:before{font-family:glyphs;speak:none;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;font-size:21px;line-height:1;-webkit-font-smoothing:antialiased;content:"\e004";}.ty-rating:not(:checked) > .ty-rating__label:hover:before,.ty-rating:not(:checked) > .ty-rating__label:hover ~ .ty-rating__label:before{content:"\e041";}.ty-rating > .ty-rating__check:checked ~ .ty-rating__label:before,.ty-rating > .ty-rating__check:checked + .ty-rating__label:hover:before,.ty-rating > .ty-rating__check:checked + .ty-rating__label:hover ~ .ty-rating__label:before,.ty-rating > .ty-rating__check:checked ~ .ty-rating__label:hover:before,.ty-rating > .ty-rating__check:checked ~ .ty-rating__label:hover ~ .ty-rating__label:before,.ty-rating > .ty-rating__label:hover ~ .ty-rating__check:checked ~ .ty-rating__label:before{content:"\e041";}.ty-template-small__item-description .ty-stars{display:block;}@media (max-width: 979px){.ty-discussion-post__author{display:block;}.ty-discussion-post__date{display:block;float:none;}}.cloudzoom-lens{border:1px solid #b3b3b3;cursor:move;width:150px;height:150px;}.cloudzoom-zoom{border:1px solid #a6a6a6;height:450px;width:450px;z-index:2000;background:#fff;-webkit-box-shadow:0 4px 15px rgba(0,0,0,0.2);-moz-box-shadow:0 4px 15px rgba(0,0,0,0.2);box-shadow:0 4px 15px rgba(0,0,0,0.2);}.cloudzoom-zoom-inside{border:medium none;box-shadow:none;z-index:2000;}.cloudzoom-caption{background-color:#000;color:#fff;display:none;font-family:sans-serif;font-size:11px;font-weight:bold;padding:10px;text-align:left;}.cloudzoom-blank{background-image:url('../../../../../../../../design/themes/avtoopt/media/images/addons/image_zoom/blank.png?1759911146');z-index:2000;}.cloudzoom-ajax-loader{background-image:url('../../../../../../../../design/themes/avtoopt/media/images/icons/ajax_loader.gif?1759911146');height:32px;width:32px;}.ty-hybrid-auth__icon{margin-right:5px;}.ty-link-unlink-provider{position:relative;}.ty-link-unlink-provider img{opacity:0.25;filter:alpha(opacity=25);}.ty-link-unlink-provider .ty-hybrid-auth__add{position:absolute;top:12px;left:7px;font-size:22px;z-index:1;display:none;line-height:0;}.ty-link-unlink-provider:hover .ty-hybrid-auth__add{display:block;}.ty-link-unlink-provider:hover img{opacity:1;filter:alpha(opacity=100);}.ty-hybrid-auth__icon{position:relative;}.ty-hybrid-auth__icon .ty-hybrid-auth__remove{position:absolute;top:-7px;left:29px;z-index:1;display:none;line-height:0;}.ty-hybrid-auth__icon:hover .ty-hybrid-auth__remove{display:block;}.feedback-table .ty-icon-chat{font-size:1.3em;}.feedback-has-answer:hover,.feedback-has-no-answer:hover{text-decoration:none;}.feedback-has-no-answer{color:#eee;}.feedback-response-form{margin-top:40px;}.feedback-chat{margin:8px 0;}.feedback-chat-question .feedback-chat-message,.feedback-chat-answer .feedback-chat-message{border-radius:6px;padding:16px 12px;background:#ffed9f;border:1px solid #eadb97;text-align:left;display:inline-block;box-shadow:2px 2px 2px 0px #efefef;}.feedback-chat-answer{text-align:right;}.feedback-chat-answer .feedback-chat-message{background:#bbffb9;border:1px solid #abe8a9;}.feedback-chat-question{text-align:left;}.feedback-chat-date{text-align:right;font-size:0.8em;color:#797979;}.feedback-type sup{color:#8d8d8d;font-size:80%;}.feedback-meta{margin-top:10px;text-align:right;font-size:85%;color:#555;}.feedback-meta-type{display:inline-block;text-align:left;width:100px;}.feedback-meta-date{margin-left:10px;}.feedback-read-lnk{color:#34495e;}.feedback-read-lnk:hover{text-decoration:none;}.feedback-reply-input{max-width:100%;}.dl-horizontal dt{font-weight:bold;line-height:20px;float:left;width:120px;clear:left;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}.dl-horizontal dd{line-height:20px;margin-left:130px;}.ty-product-filters__group{margin:0;padding:0;}.ty-product-filters__group label.disabled,.ty-product-filters__group label.disabled > input{display:none;}.ty-product-filters__group label{margin:5px 3px;padding:2px 0;display:block;}h2 span.match{color:#e51a4b;font-weight:bold;}.notification-content-extended h1{background:#777;color:#fff;}.ty-btn__secondary{color:#666;}.ty-btn__secondary:hover{background:#cacbcf;color:#666;}.ty-btn__primary.ty-btn__text{color:#08c;}.ty-product-filters__switch-right,.ty-product-filters__switch-down,.ty-product-filters__title{color:#7b7b7b;}.ty-menu-vertical .ty-menu__submenu .ty-menu__submenu-item-header .ty-menu__item-link,.ty-menu__submenu-items .ty-menu__submenu-link{color:#333;}.ty-sort-dropdown__content,.ty-dropdown-box__content,.ty-select-block,.ty-horizontal-product-filters-dropdown__content{border:1px solid #c8c8c8;}.ty-select-block__a.open,.ty-select-block__a.open:hover,.ty-dropdown-box__title.open{background:#c8c8c8;color:#eee;}.ty-sort-dropdown__wrapper.open,.ty-horizontal-product-filters-dropdown__wrapper.open{background:#c8c8c8;color:#fff;}.ty-horizontal-product-filters{margin-bottom:0;}.ty-horizontal-product-filters .ty-product-filters__wrapper{margin:0;padding-bottom:0;}.footer-stay-connected{background:#777;border-bottom:1px solid #d1d8e6;border-top:1px solid #d1d8e6;color:#333;}.ty-footer-menu__header{color:#08c;}.ty-footer-menu__item a{color:#333;}.ty-cr-phone-number-link .ty-cr-phone-prefix{color:#959595;}@media (max-width: 767px){.ty-menu__submenu .ty-menu__submenu-items .ty-menu__submenu-item-active a,.ty-menu-vertical .ty-menu__submenu .menu-level-2.ty-menu__item-active .ty-menu__item-link{text-decoration:underline;color:#08c;}.ty-menu-vertical .menu-level-1.ty-menu__item-active > .ty-menu__submenu-item-header{background:#e0e0e0;}.ty-horizontal-product-filters-dropdown__content{border-bottom:none;border-left:1px solid #eee;border-right:1px solid #eee;}}