/* Table of Contents I. Generic -------------------------------------- 01. Reset ------------------------------------ 02. Base ------------------------------------- 03. Fonts ------------------------------------ 04. Helpers ---------------------------------- Clear ------------------------------------ Notext ----------------------------------- Separator -------------------------------- Hidden ----------------------------------- Alignleft -------------------------------- Alignright ------------------------------- Disabled --------------------------------- Grid ------------------------------------- Responsive Helpers ----------------------- II. Regions -------------------------------------- 01. Container -------------------------------- 02. Content ---------------------------------- 03. Footer ----------------------------------- 04. Header ----------------------------------- 05. Main ------------------------------------- 06. Shell ------------------------------------ 07. Sidebar ---------------------------------- 08. Wrapper ---------------------------------- III. Modules -------------------------------------- 01. Article ---------------------------------- 02. Button ----------------------------------- Button Block ----------------------------- 03. Button Primary --------------------------- 04. Button Secondary ------------------------- 05. Button Burger ---------------------------- 06. Callout ---------------------------------- 07. Features --------------------------------- 08. Feature ---------------------------------- 09. Feature Primary -------------------------- 10. Form Elements ---------------------------- 11. Form ------------------------------------- 12. Icons ------------------------------------ 13. Intro ------------------------------------ 14. List ------------------------------------- 15. List Cars -------------------------------- 16. Logo ------------------------------------- 17. Nav -------------------------------------- 18. Search ----------------------------------- 19. Section ---------------------------------- 20. Section ---------------------------------- 21. Section Secondary ------------------------ 22. Slider Cars ------------------------------ 23. Socials ---------------------------------- 24. Table ------------------------------------ 25. Widget ----------------------------------- */ /* .ico-arrow-next { background-image: url(images/sprite_icons.png); background-position: 99.34640522875817% 36.29242819843342%; background-size: 3160% 1765.2173913043478%; width: 15px; height: 23px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-arrow-prev { background-image: url(images/sprite_icons.png); background-position: 99.34640522875817% 29.242819843342037%; background-size: 3160% 1765.2173913043478%; width: 15px; height: 23px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-contact-gray { background-image: url(images/sprite_icons.png); background-position: 36.5% 96.61016949152543%; background-size: 640.5405405405405% 780.7692307692307%; width: 74px; height: 52px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-contact-orange { background-image: url(images/sprite_icons.png); background-position: 17% 96.61016949152543%; background-size: 640.5405405405405% 780.7692307692307%; width: 74px; height: 52px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-dots-left { background-image: url(images/sprite_icons.png); background-position: 94.93087557603687% 75%; background-size: 1185% 1845.4545454545453%; width: 40px; height: 22px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-dots-right { background-image: url(images/sprite_icons.png); background-position: 94.93087557603687% 81.77083333333334%; background-size: 1185% 1845.4545454545453%; width: 40px; height: 22px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-facebook-big { background-image: url(images/sprite_icons.png); background-position: 66% 22.75449101796407%; background-size: 640.5405405405405% 563.8888888888889%; width: 74px; height: 72px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-facebook { background-image: url(images/sprite_icons.png); background-position: 56.58536585365853% 80.11695906432749%; background-size: 740.625% 634.375%; width: 64px; height: 64px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-faq-gray { background-image: url(images/sprite_icons.png); background-position: 83.82352941176471% 22.023809523809522%; background-size: 718.1818181818181% 580%; width: 66px; height: 70px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-faq-orange { background-image: url(images/sprite_icons.png); background-position: 83.82352941176471% 0%; background-size: 718.1818181818181% 580%; width: 66px; height: 70px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-circle { background-image: url(images/sprite_icons.png); background-position: 97.16981132075472% 16.292134831460675%; background-size: 948% 811.9999999999999%; width: 50px; height: 50px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-feature-1 { background-image: url(images/sprite_icons.png); background-position: 0% 48.87218045112782%; background-size: 359.09090909090907% 290%; width: 132px; height: 140px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-feature-2 { background-image: url(images/sprite_icons.png); background-position: 0% 0%; background-size: 296.25% 322.22222222222223%; width: 160px; height: 126px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-feature-3 { background-image: url(images/sprite_icons.png); background-position: 43.386243386243386% 0%; background-size: 493.75% 414.28571428571433%; width: 96px; height: 98px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-linkedin { background-image: url(images/sprite_icons.png); background-position: 83.41463414634146% 63.1578947368421%; background-size: 740.625% 634.375%; width: 64px; height: 64px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-location-gray { background-image: url(images/sprite_icons.png); background-position: 94.93087557603687% 50.86705202312138%; background-size: 1185% 676.6666666666666%; width: 40px; height: 60px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-location-orange { background-image: url(images/sprite_icons.png); background-position: 94.93087557603687% 32.369942196531795%; background-size: 1185% 676.6666666666666%; width: 40px; height: 60px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-pinterest { background-image: url(images/sprite_icons.png); background-position: 83.41463414634146% 43.27485380116959%; background-size: 740.625% 634.375%; width: 64px; height: 64px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-search-white { background-image: url(images/sprite_icons.png); background-position: 92.7927927927928% 89.94708994708994%; background-size: 1580% 1450%; width: 30px; height: 28px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-search { background-image: url(images/sprite_icons.png); background-position: 96.26168224299066% 66.29834254143645%; background-size: 1030.4347826086957% 922.7272727272726%; width: 46px; height: 44px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-twitter-big { background-image: url(images/sprite_icons.png); background-position: 66% 0%; background-size: 640.5405405405405% 563.8888888888889%; width: 74px; height: 72px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-twitter { background-image: url(images/sprite_icons.png); background-position: 40% 80.11695906432749%; background-size: 740.625% 634.375%; width: 64px; height: 64px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-youtube-big { background-image: url(images/sprite_icons.png); background-position: 66% 45.50898203592814%; background-size: 640.5405405405405% 563.8888888888889%; width: 74px; height: 72px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-youtube { background-image: url(images/sprite_icons.png); background-position: 0% 100%; background-size: 740.625% 634.375%; width: 64px; height: 64px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-profile-gray { background-image: url(images/sprite_icons1.png); background-position: 0% 80.11695906432749%; background-size: 607.6923076923076% 634.375%; width: 78px; height: 64px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-profile-orange { background-image: url(images/sprite_icons1.png); background-position: 20.707070707070706% 80.11695906432749%; background-size: 607.6923076923076% 634.375%; width: 78px; height: 64px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-message-gray { background-image: url(images/sprite_icons1.png); background-position: 83.82352941176471% 22.023809523809522%; background-size: 718.1818181818181% 580%; width: 66px; height: 70px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-message-orange { background-image: url(images/sprite_icons1.png); background-position: 83.82352941176471% 0%; background-size: 718.1818181818181% 580%; width: 66px; height: 70px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-offers-gray { background-image: url(images/sprite_icons1.png); background-position: 94.93087557603687% 50.86705202312138%; background-size: 1185% 676.6666666666666%; width: 40px; height: 60px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-offers-orange { background-image: url(images/sprite_icons1.png); background-position: 94.93087557603687% 32.369942196531795%; background-size: 1185% 676.6666666666666%; width: 40px; height: 60px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-bids-gray { background-image: url(images/sprite_icons1.png); background-position: 36.5% 96.61016949152543%; background-size: 640.5405405405405% 780.7692307692307%; width: 74px; height: 52px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-bids-orange { background-image: url(images/sprite_icons1.png); background-position: 17% 96.61016949152543%; background-size: 640.5405405405405% 780.7692307692307%; width: 74px; height: 52px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-logout-gray { background-image: url(images/sprite_icons1.png); background-position: 83.00970873786407% 80.68181818181817%; background-size: 764.516129032258% 751.8518518518518%; width: 62px; height: 54px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-logout-orange { background-image: url(images/sprite_icons1.png); background-position: 100% 0%; background-size: 764.516129032258% 751.8518518518518%; width: 62px; height: 54px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-listing-gray { background-image: url(images/sprite_icons1.png); background-position: 43.15789473684211% 51.4792899408284%; background-size: 504.2553191489362% 597.0588235294118%; width: 94px; height: 68px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-listing-orange { background-image: url(images/sprite_icons1.png); background-position: 43.15789473684211% 30.17751479289941%; background-size: 504.2553191489362% 597.0588235294118%; width: 94px; height: 68px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-bidding-gray { background-image: url(images/sprite_icons3.png); background-position: 36.5% 96.61016949152543%; background-size: 640.5405405405405% 780.7692307692307%; width: 74px; height: 52px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-bidding-orange { background-image: url(images/sprite_icons3.png); background-position: 17% 96.61016949152543%; background-size: 640.5405405405405% 780.7692307692307%; width: 74px; height: 52px; display: inline-block; vertical-align: middle; font-size: 0; } */ .ico-buy-gray { background-image: url(images/sprite_icons.png); background-position: 34% 1%; background-size: 1300% 1300%; width: 80px; height: 80px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-buy-orange { background-image: url(images/sprite_icons.png); background-position: 23% 1%; background-size: 1300% 1300%; width: 80px; height: 80px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-home-gray { background-image: url(images/sprite_icons.png); background-position: 11.2% 0%; background-size: 1000% 1000%; width: 80px; height: 80px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-home-orange { background-image: url(images/sprite_icons.png); background-position: 0% 0%; background-size: 1000% 1000%; width: 80px; height: 80px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-sell-gray { background-image: url(images/sprite_icons.png); background-position: 55% 0%; background-size: 1000% 1000%; width: 80px; height: 80px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-sell-orange { background-image: url(images/sprite_icons.png); background-position: 43.8% 0%; background-size: 1000% 1000%; width: 80px; height: 80px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-equipment-gray { background-image: url(images/sprite_icons.png); background-position: 77.6% 0%; background-size: 1000% 1000%; width: 80px; height: 80px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-equipment-orange { background-image: url(images/sprite_icons.png); background-position: 66.6% 0%; background-size: 1000% 1000%; width: 80px; height: 80px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-offers-gray { background-image: url(images/sprite_icons.png); background-position: 99.4% 0%; background-size: 1000% 1000%; width: 80px; height: 80px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-offers-orange { background-image: url(images/sprite_icons.png); background-position: 88.4% 0%; background-size: 1000% 1000%; width: 80px; height: 80px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-faq-gray { background-image: url(images/sprite_icons.png); background-position: 11.2% 11% ; background-size: 1000% 1000%; width: 80px; height: 80px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-faq-orange { background-image: url(images/sprite_icons.png); background-position: 0% 11% ; background-size: 1000% 1000%; width: 80px; height: 80px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-contact-gray { background-image: url(images/sprite_icons.png); background-position: 33.4% 11%; background-size: 1000% 1000%; width: 80px; height: 80px; display: inline-block; vertical-align: middle; font-size: 0; } .ico-contact-orange { background-image: url(images/sprite_icons.png); background-position: 22.2% 11%; background-size: 1000% 1000%; width: 80px; height: 80px; display: inline-block; vertical-align: middle; font-size: 0; } /* ------------------------------------------------------------ *\ I. Generic \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Reset \* ------------------------------------------------------------ */ *, *:before, *:after { padding: 0; margin: 0; outline: 0; box-sizing: border-box; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, main { display: block; } html { tap-highlight-color: rgba(0,0,0,0); } body { -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; -webkit-text-size-adjust: none; -ms-text-size-adjust: none; text-size-adjust: none; } img, iframe, video, audio, object { max-width: 100%; } img, iframe { border: 0 none; } img { height: auto; display: inline-block; vertical-align: middle; } b, strong { font-weight: bold; } address { font-style: normal; } svg:not(:root) { overflow: hidden; } a, button, input[type="submit"], input[type="button"], input[type="reset"], input[type="file"], input[type="image"], label[for] { cursor: pointer; } a[href^="tel"], button[disabled], input[disabled], textarea[disabled], select[disabled] { cursor: default; } button::-moz-focus-inner, input::-moz-focus-inner { padding: 0; border: 0; } input[type="text"], input[type="password"], input[type="date"], input[type="datetime"], input[type="datetime-local"], input[type="month"], input[type="week"], input[type="email"], input[type="number"], input[type="search"], input[type="tel"], input[type="time"], input[type="url"], input[type="color"], textarea, a[href^="tel"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } textarea { overflow: auto; -webkit-overflow-scrolling: touch; overflow-scrolling: touch; } button, input, optgroup, select, textarea { font-family: inherit; font-size: inherit; color: inherit; -moz-osx-font-smoothing: grayscale; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; } button, select { text-transform: none; } table { width: 100%; border-collapse: collapse; border-spacing: 0; } nav ul, nav ol { list-style: none outside none; } /* ------------------------------------------------------------ *\ Base \* ------------------------------------------------------------ */ body { min-width: 320px; background: #f6f6f6; font-family: 'Myriad Pro', 'Helvetica', sans-serif; font-size: 13px; line-height: 1.46; color: #000; } a { color: inherit; text-decoration: underline; } a:hover { text-decoration: none; } a[href^="tel"] { text-decoration: none; } h1, h2, h3, h4, h5, h6 { margin-bottom: 0.73em; } h1 { font-size: 71px; } h2 { font-size: 40px; } h3 { font-size: 28px; } h4 { font-size: 27px; } h5 { font-size: ; } h6 { font-size: 14px; } p, ul, ol, dl, table, blockquote { margin-bottom: 1.46em; } h1[class], h2[class], h3[class], h4[class], h5[class], h6[class], h1:last-child, h2:last-child, h3:last-child, h4:last-child, h5:last-child, h6:last-child, p:last-child, ul:last-child, ol:last-child, dl:last-child, table:last-child, blockquote:last-child { margin-bottom: 0; } /* ------------------------------------------------------------ *\ Fonts \* ------------------------------------------------------------ */ @font-face { font-family: 'Asap'; src: url('fonts/Asap-Regular.eot'); src: url('fonts/Asap-Regular.eot?#iefix') format('embedded-opentype'), url('fonts/Asap-Regular.woff') format('woff'), url('fonts/Asap-Regular.ttf') format('truetype'); font-weight: normal; font-style: normal; } /* ------------------------------------------------------------ *\ Helpers \* ------------------------------------------------------------ */ /* Clear */ .clear:after { content: ''; line-height: 0; display: table; clear: both; } /* Notext */ .notext { white-space: nowrap; text-indent: 100%; text-shadow: none; overflow: hidden; } .notext-old { font-size: 0; line-height: 0; text-indent: -4000px; } /* Separator */ .separator { display: inline-block; width: 32px; text-align: center; } /* Hidden */ [hidden], .hidden { display: none; } /* Alignleft */ .alignleft { float: left; } /* Alignright */ .alignright { float: right; } /* Disabled */ [disabled], .disabled { cursor: default; } /* Grid */ .cols { margin: 0 -15px; display: -webkit-flex; display: -ms-flexbox; display: flex; } .col { padding: 0 15px; } .col--size1 { width: 57%; } .col--size2 { width: 43%; } @media (max-width: 1200px) { .col--size1 { width: 64%; } .col--size2 { width: 36%; } } @media (max-width: 1023px) { .col--size1, .col--size2 { width: 100%; } } /* Responsive Helpers */ .visible-xs-block, .visible-xs-inline, .visible-xs-inline-block, .visible-sm-block, .visible-sm-inline, .visible-sm-inline-block, .visible-md-block, .visible-md-inline, .visible-md-inline-block, .visible-lg-block, .visible-lg-inline, .visible-lg-inline-block { display: none !important; } @media (max-width: 767px) { .hidden-xs { display: none !important; } .visible-xs-block { display: block !important; } .visible-xs-inline { display: inline !important; } .visible-xs-inline-block { display: inline-block !important; } } @media (min-width: 768px) and (max-width: 1023px) { .hidden-sm { display: none !important; } .visible-sm-block { display: block !important; } .visible-sm-inline { display: inline !important; } .visible-sm-inline-block { display: inline-block !important; } } @media (min-width: 1024px) and (max-width: 1200px) { .hidden-md { display: none !important; } .visible-md-block { display: block !important; } .visible-md-inline { display: inline !important; } .visible-md-inline-block { display: inline-block !important; } } @media (min-width: 1201px) { .hidden-lg { display: none !important; } .visible-lg-block { display: block !important; } .visible-lg-inline { display: inline !important; } .visible-lg-inline-block { display: inline-block !important; } } /* ------------------------------------------------------------ *\ II. Regions \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Container \* ------------------------------------------------------------ */ .container {} /* ------------------------------------------------------------ *\ Content \* ------------------------------------------------------------ */ .content {} /* ------------------------------------------------------------ *\ Footer \* ------------------------------------------------------------ */ .footer { background: #fff url(../css/images/temp/pattern-gray.png) repeat-x 0 0; padding-top: 25px; position: relative; } .footer .search { width: 307px; } .footer .socials { position: relative; top: -4px; } .footer .socials li + li { margin-left: 13px; } .footer .footer__body { background: #8a8a8a; } .footer .footer__body__inner { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-items: center; -ms-flex-align: center; align-items: center; padding: 21px 0 16px; position: relative; } .footer .footer__bar { background: #000; color: #fff; } .footer .footer__bar p { display: inline-block; margin: 0; color: #8a8a8a; } .footer .footer__bar__inner { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-items: center; -ms-flex-align: center; align-items: center; padding: 24px 0 20px; } .footer .footer__logo { position: absolute; bottom: -15%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 208px; height: 58px; opacity: .35; margin-left: 46px; margin-top: 2px; margin-top: -26px; } .footer .footer__nav { font-size: 16px; color: #fff; } .footer .footer__nav ul { display: -webkit-flex; display: -ms-flexbox; display: flex; } .footer .footer__nav a { text-decoration: none; transition: opacity .4s; } .footer .footer__nav a:hover { opacity: .7; } .footer .footer__nav li { position: relative; } .footer .footer__nav li + li { margin-left: 21px; padding-left: 20px; } .footer .footer__nav li + li:after { content: ''; position: absolute; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); left: 0; width: 2px; height: 17px; background: #b9b9b9; } .footer .footer__links a { text-decoration: none; transition: color .4s; } .footer .footer__links a:hover { color: #fff; } .footer .footer__links .active { color: #fff; } @media (max-width: 1023px) { .footer .footer__logo { display: none; } } @media (max-width: 767px) { .footer { text-align: center; } .footer .search { width: 100%; } .footer .socials { margin-top: 10px; } .footer .socials ul { -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } .footer .footer__nav { text-align: center; margin: 0 0 20px; } .footer .footer__nav ul { display: block; } .footer .footer__nav li + li { margin: 5px 0 0; padding: 0; } .footer .footer__nav li + li:after { display: none; } .footer .footer__body__inner { display: block; padding: 20px 0 10px; } .footer .footer__bar__inner { display: block; } .footer .footer__bar p { display: block; } .footer .footer__links { margin: 10px 0 0 !important; } .footer .footer__links .separator:first-child { display: none; } } /* ------------------------------------------------------------ *\ Header \* ------------------------------------------------------------ */ .header .header__inner { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; padding: 30px 0px 36px 42px; } .header .header__aside { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; margin-right: 2px; } .header .header__content { margin-left: 30px; } .header .header__btn { margin-left: 56px;margin-top: 2px; } .header .socials { margin-bottom: 4px; margin-left: 0px; } .header .search { margin-right: -0px; } .header .nav { margin-top: 3px; } @media (max-width: 1560px) { .header .header__inner { padding: 30px 0; } .header .header__content { margin-left: 20px; } .header .header__btn { margin-left: 35px; } .header .header__inner { -webkit-align-items: center; -ms-flex-align: center; -ms-grid-row-align: center; align-items: center; } } @media (max-width: 1200px) { .header .nav { margin-top: 0; } } @media (max-width: 1023px) { .header .header__inner { padding: 60px 0 30px; } .header .header__content { position: absolute; top: 10px; right: 10px; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-items: center; -ms-flex-align: center; align-items: center } .header .socials { margin: 0 10px 0 0; } } @media (max-width: 767px) { .header { } .header .header__inner { position: relative; padding: 20px 0; } .header .socials { margin-bottom: 10px; } .header .search { margin: 0; } .header .nav { margin: 0 0 20px; } .header .socials ul { -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } .header .header__content { position: static; display: block; margin: 0; } .header .header__aside { z-index: 10; position: absolute; top: 0; left: 0; margin: 0 -10px; width: calc(100% + 20px); height: 100vh; display: block; background: #fff; padding: 50px 10px 10px; text-align: center; overflow: auto; -webkit-transform: scale(0); -ms-transform: scale(0); transform: scale(0); transition: -webkit-transform .4s; transition: transform .4s; transition: transform .4s, -webkit-transform .4s; } .header .header__btn { margin: 0 0 20px; } .header.active .header__aside { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } /* ------------------------------------------------------------ *\ Main \* ------------------------------------------------------------ */ .main {} /* ------------------------------------------------------------ *\ Shell \* ------------------------------------------------------------ */ .shell { max-width: 1530px; padding-left: 10px; padding-right: 10px; margin: auto; } .shell-fluid { max-width: none; } .shell--medium { max-width: 980px; } /* ------------------------------------------------------------ *\ Sidebar \* ------------------------------------------------------------ */ .sidebar {} /* ------------------------------------------------------------ *\ Wrapper \* ------------------------------------------------------------ */ .wrapper { min-height: 100vh; overflow: hidden; } /* ------------------------------------------------------------ *\ III. Modules \* ------------------------------------------------------------ */ /* ------------------------------------------------------------ *\ Article \* ------------------------------------------------------------ */ .article { text-align: center; } .article h6 { color: #ffd500; } .article h6 span { color: #444; text-transform: uppercase; } .article .article__image { border: 1px solid #d6d6d6; position: relative; } .article .article__image:after { content: ''; position: absolute; top: 100%; left: 0; width: 100%; height: 13px; background: url(../css/images/temp/shadow-bottom.png) no-repeat 0 0; } .article .article__content { padding-top: 25px; } /* ------------------------------------------------------------ *\ Button \* ------------------------------------------------------------ */ .btn { display: inline-block; vertical-align: middle; text-align: center; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none; } /* Button Block */ .btn-block { display: block; padding-left: 0; padding-right: 0; text-decoration: none;} /* ------------------------------------------------------------ *\ Button Primary \* ------------------------------------------------------------ */ .btn-primary1 { display: inline-block; color: #124095; position: relative; background: #ffd500; font-size: 18px; text-decoration: none; text-align: center; line-height: 1; text-transform: uppercase; padding: 12px 14px 12px 0px; min-width: 250px; letter-spacing: -0.03em; transition: opacity .4s; } .btn-primary1:hover { opacity: .7;color: #124095 } .btn-primary1:after, .btn-primary1:before { content: ''; position: absolute; right: 100%; width: 0; height: 0; border-style: solid; transition: opacity .4s; } .btn-primary1:after { top: 0; border-width: 0 24px 40px 0; border-color: transparent #ffd500 transparent transparent; } .btn-primary1:before { bottom: 0; border-width: 0 0 40px 24px; border-color: transparent transparent #ffd500 transparent; } .btn-primary1 span { font-size: 32px; display: block; letter-spacing: -0.05em; margin-top: 5px; } @media (max-width: 1560px) { .btn-primary1 { min-width: 200px; font-size: 16px; } .btn-primary1 span { font-size: 30px; } } @media (max-width: 1200px) { .btn-primary1 { min-width: 167px; font-size: 14px; padding: 16px 0; } .btn-primary1 span { font-size: 25px; } } @media (max-width: 767px) { .btn-primary1:after, .btn-primary1:before { display: none; } } /* ------------------------------------------------------------ *\ Button Secondary \* ------------------------------------------------------------ */ .btn-secondary { display: inline-block; text-decoration: none; font-family: 'TitilliumWeb', sans-serif; text-transform: uppercase; font-weight: 700; font-size: 15px; color: #8a8a8a; letter-spacing: -0.1em; } .btn-secondary span { display: inline-block; text-align: center; padding: 0 11px; vertical-align: middle; } .btn-secondary i { vertical-align: middle; } /* ------------------------------------------------------------ *\ Button Burger \* ------------------------------------------------------------ */ .btn-burger { display: none; width: 30px; height: 20px; position: absolute; right: 0; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); z-index: 201; } .btn-burger span { width: 100%; height: 4px; background: #f4ad31; position: absolute; left: 0; border-radius: 2px; transition: top .2s .25s, left .2s .25s, opacity .2s .25s, -webkit-transform .2s 0s; transition: top .2s .25s, left .2s .25s, opacity .2s .25s, transform .2s 0s; transition: top .2s .25s, left .2s .25s, opacity .2s .25s, transform .2s 0s, -webkit-transform .2s 0s; } .btn-burger span:first-child { top: 0; } .btn-burger span:nth-child(2) { top: 8px; } .btn-burger span:last-child { top: 16px; } .btn-burger.active span { transition: background .2s, top .2s, left .2s, opacity .2s, -webkit-transform .2s .25s; transition: background .2s, top .2s, left .2s, opacity .2s, transform .2s .25s; transition: background .2s, top .2s, left .2s, opacity .2s, transform .2s .25s, -webkit-transform .2s .25s; } .btn-burger.active span:first-child { top: 8px; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .btn-burger.active span:nth-child(2) { opacity: 0; } .btn-burger.active span:last-child { top: 8px; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } @media (max-width: 767px) { .btn-burger { display: block; } } /* ------------------------------------------------------------ *\ Callout \* ------------------------------------------------------------ */ .callout { background: #ffd500; position: relative; text-align: center; padding: 39px 0; } .callout a { text-decoration: none; display: inline-block; position: relative; transition: opacity .4s; cursor: pointer; } .callout a:hover { opacity: .7; } .callout h2 { text-transform: uppercase; font-weight: 400; line-height: 1; } .callout h2 span { color: #d50f1d; } .callout h2 span a:after { content: ''; position: absolute; bottom: -2px; left: 0; width: 100%; height: 2px; background: #d50f1d; transition: width .4s; } .callout .callout__ico { position: absolute; top: -13px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); margin-left: 2px; } @media (max-width: 1023px) { .callout h2 { font-size: 35px; } } @media (max-width: 767px) { .callout { padding: 27px 0; } .callout h2 { font-size: 25px; line-height: 1.25; } .callout h2 span a:after { bottom: 2px; } } /* ------------------------------------------------------------ *\ Features \* ------------------------------------------------------------ */ .features { display: -webkit-flex; display: -ms-flexbox; display: flex; margin: 0 -10px; list-style: none; } @media (max-width: 767px) { .features { display: block; margin: 0; } } /* ------------------------------------------------------------ *\ Feature \* ------------------------------------------------------------ */ .feature { padding: 0 10px; -webkit-flex: 0 0 33.33%; -ms-flex: 0 0 33.33%; flex: 0 0 33.33%; max-width: 33.33%; } .feature h4 { line-height: .85; font-weight: 400; color: #2f2f2f; letter-spacing: -0.03em; } .feature h4 span { display: block; color: #ffc600; margin-top: 7px; } .feature p { font-family: 'Asap', sans-serif; letter-spacing: -0.015em; line-height: 1.5; padding-right: 5px; font-size: 15px;} .feature a { transition: color .4s; } .feature a:hover { color: #2f2f2f; } .feature .feature__inner { background: #fff; padding: 43px 0px 16px 27px; position: relative; } .feature .feature__inner:after { content: ''; position: absolute; top: 100%; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); max-width: 318px; width: 100%; height: 38px; background: url(../css/images/temp/bottom-arrow.png) no-repeat top center; } .feature .feature__head { padding-left: 62px; margin-bottom: 10px; position: relative; } .feature .feature__head i { position: absolute; top: 50%; left: -12px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); margin-top: -10px; } .feature .feature__body { padding-bottom: 20px; } .feature .feature__actions { text-align: center; border-top: 1px solid #e8e8e8; margin-left: -27px; padding-top: 29px; } .feature.active .feature__inner:after { background-image: url(../css/images/temp/bottom-arrow-yellow.png); } .feature.active .feature__actions { border: none; } .feature.active .feature__actions a { color: #2f2f2f; } .feature:nth-child(2) .feature__head { padding-left: 54px; } .feature:nth-child(2) .feature__head i { left: -26px; margin-top: -4px; } .feature:nth-child(3) .feature__head { padding-left: 59px; } .feature:nth-child(3) .feature__head i { left: -2px; margin-top: -2px; } @media (max-width: 1560px) { .feature br { display: none; } .feature .feature__inner { padding: 40px 10px 15px; } .feature .feature__head { padding-left: 51px; } .feature .feature__head i { left: 0 !important; } .feature .feature__actions { margin: 0 -10px; } .feature:nth-child(2) .feature__head { padding-left: 57px; } .feature:nth-child(2) .feature__head i { left: -30px; margin-top: -4px; } .feature:nth-child(3) .feature__head { padding-left: 53px; } .feature:nth-child(3) .feature__head i { left: -2px; margin-top: -10px; } } @media (max-width: 1023px) { .feature h4 { font-size: 24px; } .feature:nth-child(2) .feature__head i { left: -30px; margin-top: 0px; } .feature:nth-child(3) .feature__head i { left: -2px; margin-top: 2px; } } @media (max-width: 767px) { .feature { max-width: 100%; padding: 0; } .feature .feature__inner { border-bottom: 6px solid #e1e1e1; } .feature .feature__inner:after { background-size: 100% auto; height: 47px; display: none; } .feature .feature__head, .feature .feature__body { height: initial !important; } .feature .feature__actions { padding-top: 22px; } .feature + .feature { margin-top: 20px; } .feature.active .feature__inner { border-color: #fad500; } } /* ------------------------------------------------------------ *\ Feature Primary \* ------------------------------------------------------------ */ .feature-primary { background: #fff; text-align: center; padding: 15px 0 24px; overflow: hidden; } .feature-primary h4 { font-weight: 400; color: #2f2f2f; margin-left: 44px; margin-bottom: 8px; line-height: 1; } .feature-primary h4 span { color: #ffc600; } .feature-primary img { margin-left: 14px; } @media (max-width: 1560px) { .feature-primary { padding: 15px 10px 24px; } .feature-primary img { width: 100%; margin: 0; } .feature-primary h4 { margin: 0 0 8px; } } @media (max-width: 1023px) { .feature-primary { padding: 15px 30px 24px; } } @media (max-width: 767px) { .feature-primary { padding: 15px 10px 24px; } .feature-primary h4 { font-size: 24px; } } /* ------------------------------------------------------------ *\ Form Elements \* ------------------------------------------------------------ */ input::-webkit-input-placeholder { color: inherit; opacity: 1; } input::-moz-placeholder { color: inherit; opacity: 1; } input:-ms-input-placeholder { color: inherit; opacity: 1; } input::placeholder { color: inherit; opacity: 1; } textarea::-webkit-input-placeholder { color: inherit; opacity: 1; } textarea::-moz-placeholder { color: inherit; opacity: 1; } textarea:-ms-input-placeholder { color: inherit; opacity: 1; } textarea::placeholder { color: inherit; opacity: 1; } input:-webkit-autofill { -webkit-text-fill-color: inherit; -webkit-box-shadow: 0 0 0 1000px #fff inset; } .field {} .textarea {} .select {} .radio {} .checkbox {} /* ------------------------------------------------------------ *\ Form \* ------------------------------------------------------------ */ .form {} /* ------------------------------------------------------------ *\ Icons \* ------------------------------------------------------------ */ .ico-buy-gray { width: 50px; height: 50px; } .ico-buy-orange { width: 50px; height: 50px; } .ico-circle { width: 25px; height: 25px; } .ico-contact-gray { width: 50px; height: 50px; } .ico-contact-orange { width: 50px; height: 50px; } .ico-bidding-gray { width: 44px; height: 30px; } .ico-bidding-orange { width: 44px; height: 30px; } .ico-dots-left { width: 20px; height: 11px; } .ico-dots-right { width: 20px; height: 11px; } .ico-facebook { width: 32px; height: 32px; } .ico-faq-gray { width: 50px; height: 50px; } .ico-faq-orange { width: 50px; height: 50px; } .ico-feature-1 { width: 66px; height: 70px; } .ico-feature-2 { width: 80px; height: 63px; } .ico-feature-3 { width: 48px; height: 49px; } .ico-home-gray { width: 50px; height: 50px; } .ico-home-orange { width: 50px; height: 50px; } .ico-linkedin { width: 32px; height: 32px; } .ico-location-gray { width: 20px; height: 30px; } .ico-location-orange { width: 20px; height: 30px; } .ico-pinterest { width: 32px; height: 32px; } .ico-search-white { width: 15px; height: 14px; } .ico-search { width: 23px; height: 22px; } .ico-sell-gray { width: 50px; height: 50px; } .ico-sell-orange { width: 50px; height: 50px; } .ico-twitter { width: 32px; height: 32px; } .ico-youtube { width: 32px; height: 32px; } .ico-facebook-big { width: 37px; height: 36px; } .ico-twitter-big { width: 37px; height: 36px; } .ico-youtube-big { width: 37px; height: 36px; } .ico-profile-gray { width: 39px; height: 32px; } .ico-profile-orange { width: 39px; height: 32px; } .ico-message-gray { width: 39px; height: 32px; } .ico-message-orange { width: 39px; height: 32px; } .ico-offers-gray { width: 50px; height: 50px; } .ico-offers-orange { width: 50px; height: 50px; } .ico-bids-orange { width: 39px; height: 32px; } .ico-bids-gray { width: 39px; height: 32px; } .ico-logout-orange { width: 39px; height: 32px; } .ico-logout-gray { width: 39px; height: 32px; } .ico-listing-orange { width: 39px; height: 32px; } .ico-listing-gray { width: 39px; height: 32px; } .ico-equipment-orange { width: 50px; height: 50px; } .ico-equipment-gray { width: 50px; height: 50px; } @media (max-width: 1560px) { .ico-feature-1 { width: 45px; height: 48px; } .ico-feature-2 { width: 55px; height: 43px; } .ico-feature-3 { width: 33px; height: 33px; } } @media (max-width: 1200px) { .ico-buy-gray { width: 19px; height: 17px; } .ico-buy-orange { width: 19px; height: 17px; } .ico-contact-gray { width: 23px; height: 16px; } .ico-contact-orange { width: 23px; height: 16px; } .ico-faq-gray { width: 21px; height: 22px; } .ico-faq-orange { width: 21px; height: 22px; } .ico-home-gray { width: 25px; height: 20px; } .ico-home-orange { width: 25px; height: 20px; } .ico-location-gray { width: 12px; height: 19px; } .ico-location-orange { width: 12px; height: 19px; } .ico-sell-gray { width: 30px; height: 21px; } .ico-sell-orange { width: 30px; height: 21px; } .ico-profile-gray { width: 25px; height: 20px; } .ico-profile-orange { width: 25px; height: 20px; } .ico-message-gray { width: 25px; height: 20px; } .ico-message-orange { width: 25px; height: 20px; } .ico-offers-gray { width: 25px; height: 20px; } .ico-offers-orange { width: 25px; height: 20px; } .ico-bids-orange { width: 25px; height: 20px; } .ico-bids-gray { width: 25px; height: 20px; } .ico-logout-orange { width: 25px; height: 20px; } .ico-logout-gray { width: 25px; height: 20px; } .ico-listing-orange { width: 25px; height: 20px; } .ico-listing-gray { width: 25px; height: 20px; } .ico-bidding-gray { width: 23px; height: 16px; } .ico-bidding-orange { width: 23px; height: 16px; } .ico-equipment-orange { width: 23px; height: 16px; } .ico-equipment-gray { width: 23px; height: 16px; } } /* ------------------------------------------------------------ *\ Intro \* ------------------------------------------------------------ */ .intro { min-height: 471px; background-size: cover; background-position: center center; position: relative; text-align: right; margin-bottom: 55px; } .intro:after { content: ''; position: absolute; top: 100%; left: 0; width: 100%; height: 60px; background: url(../css/images/temp/shadow-big.png) no-repeat 0 0; } .intro h1 { line-height: 1; margin: 0; color: #ffd500; margin-right: 1px; } .intro h2 { color: #fff; line-height: 1; margin-right: 3px; } .intro { } .intro .intro__inner { position: absolute; bottom: 0; left: 0; width: 100%; padding: 17px 0; } @media (max-width: 1560px) { .intro { min-height: 400px; } } @media (max-width: 1023px) { .intro { min-height: 350px; } .intro h1 { font-size: 60px; } } @media (max-width: 767px) { .intro { margin-bottom: 30px; } .intro h1 { font-size: 27px; } .intro h2 { font-size: 20px; } .intro:after { background-position: top center; } } .intro2 { min-height: 250px; background-size: cover; background-position: center center; position: relative; text-align: right; margin-bottom: 55px; } .intro2:after { content: ''; position: absolute; top: 100%; left: 0; width: 100%; height: 60px; background: url(../css/images/temp/shadow-big.png) no-repeat 0 0; } .intro2 h1 { line-height: 1; margin: 0; color: #ffd500; margin-right: 1px; } .intro2 h2 { color: #fff; line-height: 1; margin-right: 3px; } .intro2 { } .intro2 .intro__inner { position: absolute; bottom: 0; left: 0; width: 100%; padding: 17px 0; } @media (max-width: 1560px) { .intro2 { min-height: 250px; } } @media (max-width: 1023px) { .intro2 { min-height: 250px; } .intro2 h1 { font-size: 60px; } } @media (max-width: 767px) { .intro2 { margin-bottom: 30px; } .intro2 h1 { font-size: 27px; } .intro2 h2 { font-size: 20px; } .intro2:after { background-position: top center; } } /* ------------------------------------------------------------ *\ List \* ------------------------------------------------------------ */ [class^="list-"] { list-style: none outside none; } /* ------------------------------------------------------------ *\ List Cars \* ------------------------------------------------------------ */ .list-cars { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; text-align: center; margin: 0 -12px; text-align: center; color: #6baadf; } .list-cars li { padding: 0 12px; } .list-cars a { text-decoration: none; } .list-cars h6 { font-weight: 400; font-size: 13px; margin: 12px 0 0; } @media (max-width: 767px) { .list-cars { margin-top: -15px !important; } .list-cars li { -webkit-flex: 0 0 50%; -ms-flex: 0 0 50%; flex: 0 0 50%; margin-top: 15px; } } @media(max-width: 380px){ .list-cars { display: block; margin-top: 0 !important; } .list-cars li { margin-top: 0; } } /* ------------------------------------------------------------ *\ Logo \* ------------------------------------------------------------ */ .logo { display: inline-block; background: url(../css/images/logo.png) no-repeat 0 0; width: 318px; height: 87px; background-size: 100% 100%; } .footerlogo { display: inline-block; background: url(../css/images/footerlogo.png) no-repeat 0 0; width: 318px; height: 87px; background-size: 100% 100%; } @media (max-width: 1560px) { .logo { width: 240px; height: 65px; } .footerlogo { width: 240px; height: 65px; } } @media (max-width: 1200px) { .logo { width: 166px; height: 45px; } .footerlogo { width: 166px; height: 45px; } } /* ------------------------------------------------------------ *\ Nav \* ------------------------------------------------------------ */ .nav { font-weight: 700; font-size: 14px; color: #878484; padding: 9px 41px 6px; text-align: center; margin-right:50px;} .nav ul { list-style: none; display: -webkit-flex; display: -ms-flexbox; display: flex; } .nav a { text-decoration: none; display: block; position: relative; transition: color .4s; } .nav div { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; height: 35px; margin-bottom: 6px; } .nav span { position: relative; display: inline-block; } .nav i { transition: opacity .4s, visibility .4s; } .nav li + li { margin-left: 32px; } .nav a:hover { color: #f4ad31; } .nav a:hover i { opacity: 0; visibility: hidden; } .nav a:hover .primary { opacity: 1; visibility: visible; } .nav .primary { opacity: 0; visibility: hidden; -webkit-backface-visibility: hidden; backface-visibility: hidden; position: absolute; top: 0; left: 0; } .nav .active i { opacity: 0; visibility: hidden; } .nav .active { color: #f4ad31; } .nav .active .primary { opacity: 1; visibility: visible; } @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { .nav .ico-contact-orange { top: 1px !important; } } @supports (-ms-ime-align:auto) { .nav .ico-contact-orange { top: 1px !important; } } @media (max-width: 1560px) { .nav { padding: 7px 10px; } .nav li + li { margin-left: 25px; } } @media (max-width: 1200px) { .nav { padding: 15px 10px; font-size: 14px; } .nav div { height: 26px; margin-bottom: 2px; } .nav li + li { margin-left: 17px; } } @media (max-width: 767px) { .nav { background: none; box-shadow: none; padding: 0; text-align: center; } .nav ul { display: block; } .nav a { padding: 0; display: inline-block; } .nav div { display: none; } .nav li + li { margin: 10px 0 0; } } /* ------------------------------------------------------------ *\ Search \* ------------------------------------------------------------ */ .search { position: relative; } .search .search__field { border: 1px solid #c2c2c2; font-weight: 700; font-size: 16px; color: #b7b7b7; text-align: center; height: 46px; width: 99%; text-transform: uppercase; } .search .search__btn { background: none; border: none; position: absolute; top: 50%; left: 16px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .search--primary .search__btn { left: auto; right: 13px; margin-top: -2px; } .search--primary .search__field { background: linear-gradient(#5e5e5e, #6f6f6f); border: none; border-bottom: 1px solid #9c9c9c; height: 34px; text-align: left; font-size: 12px; color: #b7b7b7; font-family: 'Arial', sans-serif; text-transform: none; font-weight: 400; padding: 0 12px; border-radius: 3px; } @media (max-width: 1560px) { .search .search__field { height: 40px; } .search--primary .search__field { height: 34px; } } /* ------------------------------------------------------------ *\ Section \* ------------------------------------------------------------ */ .section {} /* ------------------------------------------------------------ *\ Section \* ------------------------------------------------------------ */ .section-primary { background: url(../css/images/temp/pattern.png) repeat-x 0 0; padding: 68px 0 68px; } .section-primary .cols { padding: 0 5px 0 0; margin-left: -19px; } @media (max-width: 1560px) { .section-primary .cols { padding: 0; margin-left: -15px; } } @media (max-width: 1023px) { .section-primary .cols { display: block; } .section-primary .feature-primary { margin: 100px 0 0; } } @media (max-width: 767px) { .section-primary { padding: 50px 0; } .section-primary .feature-primary { margin: 72px 0 0; } } /* ------------------------------------------------------------ *\ Section Secondary \* ------------------------------------------------------------ */ .section-secondary { background: #fff url(../css/images/temp/shadow-primary.png) no-repeat top center; padding: 30px 0 41px; position: relative; overflow: hidden; } .section-secondary:after { content: ''; position: absolute; bottom: -15px; left: 0; width: 100%; background: url(../css/images/temp/shadow-bottom1.png) no-repeat top center; height: 18px; } .section-secondary .section__inner { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .section-secondary .section__body { width: 1121px; padding: 0 0 0 50px; } .section-secondary .section__aside { background: url(../css/images/temp/shadow.png) no-repeat 0 center; padding-left: 14px; text-align: center; margin-right: 41px; padding-top: 30px; padding-bottom: 30px; } .section-secondary .section__aside h3 { color: #7c7c7c; font-weight: 400; text-transform: uppercase; margin-bottom: 23px; } .section-secondary .section__aside h3 span { color: #ffc600; } @media (max-width: 1560px) { .section-secondary .section__body { width: 800px; } } @media (max-width: 1200px) { .section-secondary .section__body { width: 670px; } } @media (max-width: 1023px) { .section-secondary .section__inner { -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; } .section-secondary .section__body { -webkit-order: 1; -ms-flex-order: 1; order: 1; width: 100%; padding: 0; } .section-secondary .section__aside { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; margin: 0 0 30px; width: 100%; background: #fff; } .section-secondary .section__aside h3 { margin: 0 20px 0 0; } } @media (max-width: 767px) { .section-secondary .section__aside { display: block; margin: 0; width: 100%; padding: 20px 0; } .section-secondary .section__aside h3 { margin: 0 0 20px; } } /* ------------------------------------------------------------ *\ Slider Cars \* ------------------------------------------------------------ */ .slider-cars { background: #fff; padding-bottom: 9px; position: relative; } .slider-cars .slider__slide { padding: 14px 0; } .slider-cars .slider__clip { padding: 0 105px 0 81px; } .slider-cars .owl-nav { position: absolute; top: 50%; left: 0; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); margin: 0 -45px; width: calc(100% + 85px); display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; margin-top: -21px; } .slider-cars .owl-stage-outer { margin: 0 -10px; padding: 0 10px; } @media (max-width: 1200px) { .slider-cars .slider__clip { padding: 0 30px; } .slider-cars .owl-nav { margin: -26px -30px; width: calc(100% + 60px) } } /* ------------------------------------------------------------ *\ Socials \* ------------------------------------------------------------ */ .socials ul { list-style: none; display: -webkit-flex; display: -ms-flexbox; display: flex; } .socials li + li { margin-left: 8px; } .socials a { transition: opacity .4s; } .socials a:hover { opacity: .7; } /* ------------------------------------------------------------ *\ Table \* ------------------------------------------------------------ */ .table {} /* ------------------------------------------------------------ *\ Widget \* ------------------------------------------------------------ */ .widgets { list-style: none outside none; }