/* Theme Name: RR Westor Kft. Theme URI: https://rrwestor.hu Description: Az RR Westor Kft. webáruház alapértelmezett sablonja. Author: Digitalform Author URI: https://digitalform.hu Version: 1.0 */ *{ margin: 0; border: 0; padding: 0; flex-wrap: wrap; text-decoration: none; } *, *:after, *::before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } :root { --color-body-text: #333333; --color-green: #2bbfb1; --color-dark: #313640; --color-dark-2: #495565; --color-rogue-pink: #c50f62; --color-silver: #f4f6f8; --color-gray: #dddddd; } body { font-family: 'Montserrat', sans-serif; font-size: 17px; color: var(--color-body-text); line-height: 25px; overflow-x: hidden; } body.rwd_menu__opened { overflow: hidden; } h1, h2, h3, h4, h5 { font-weight: normal; } button, input, select, textarea { font-family: 'Montserrat', sans-serif; font-size: 17px; outline: none; } select { height: 50px; } img.alignleft { margin: 0 20px 5px 0; float: left; } img.alignright { margin: 0 0 5px 20px; float: right; } hr { height: 30px; border-top: 3px solid #eee; } .left { float: left; } .right { float: right; } .clear, .related { clear: both; } .inner { max-width: 1280px; margin: auto; position: relative; } .inner_900 { max-width: 900px; } .inner_700 { max-width: 700px; } .hide { display: none !important; } .b_r_3 { -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .b_r_50p { -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .vertical_middle { top: 50%; position: relative; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .required, .red { color: #d91828; } .button { height: 50px; padding: 0 30px; font-size: 14px; font-weight: 700; text-transform: uppercase; text-decoration: none !important; color: white !important; line-height: 50px; background-color: var(--color-rogue-pink); cursor: pointer; display: inline-block; -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } .button:hover { background-color: #292d35; } .button:disabled { color: white !important; background-color: #ccc; } .button.button_small { height: 40px; padding: 0 15px; line-height: 40px; } .button.button_green { background-color: var(--color-green); } .button.button_green:hover { background-color: #292d35; } .button.button_white_hover:hover { color: #000 !important; background-color: white; } /* Font */ .center { text-align: center; } .uppercase { text-transform: uppercase; } /* Animation */ .anim, #header ul.menu li a:after, .social_media_icons a:hover:before, .woof_reset_button_2 { -webkit-transition: all 0.2s ease-out; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; transition: all 0.2s ease-out; } .anim_cubic, #categories .category .cover:before { -webkit-transition: all 1s cubic-bezier(0.19, 1, 0.22, 1); -moz-transition: all 1s cubic-bezier(0.19, 1, 0.22, 1); -o-transition: all 1s cubic-bezier(0.19, 1, 0.22, 1); transition: all 1s cubic-bezier(0.19, 1, 0.22, 1); } /* Checkbox and radio */ input[type=checkbox], input[type=radio] { width: 20px; min-width: 20px; height: 20px; margin: -4px 4px 0 0 !important; padding: 0 !important; text-align: center !important; background-color: white; border: 1px solid #d8d8d8; clear: none; cursor: pointer; display: inline-block; line-height: 0; outline: 0; vertical-align: middle !important; position: relative; -webkit-appearance: none; -webkit-box-shadow: none; box-shadow: none; -webkit-transition: .05s border-color ease-in-out; transition: .05s border-color ease-in-out; } input[type=radio] { -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } input[type=radio]:checked:before, input[type=checkbox]:checked:before { top: 4px; right: 4px; bottom: 4px; left: 4px; text-align: center; background: var(--color-green); position: absolute; display: block; content: '' !important; } input[type=radio]:checked:before { -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } /* ------------- MODAL ------------- */ .fancybox-button--close { background-color: var(--color-rogue-pink); } .fancybox-button--close path { fill: white !important; } .fancybox-container .modal_added_to_cart { width: 100%; max-width: 600px; padding: 0; display: none; } .fancybox-container .modal_added_to_cart h3 { margin-bottom: 20px; padding: 30px 30px 0; font-size: 25px; font-weight: 700; color: var(--color-green); line-height: 100%; } .fancybox-container .modal_added_to_cart .ordered_product { padding: 0 30px 30px; display: flex; } .fancybox-container .modal_added_to_cart .thumbnail { width: 150px; height: 150px; padding: 4px; text-align: center; border: 1px solid #eae6e5; } .fancybox-container .modal_added_to_cart .thumbnail img { width: 100%; height: auto; display: block; } .fancybox-container .modal_added_to_cart .datas { width: calc(100% - 150px); padding-left: 20px; } .fancybox-container .modal_added_to_cart .datas h4 { margin-bottom: 15px; font-size: 17px; font-weight: 900; color: #3a3a3a; line-height: 20px; } .fancybox-container .modal_added_to_cart .datas .price { margin-bottom: 15px; font-size: 20px; color: #8a817a; } .fancybox-container .modal_added_to_cart .datas .price del { display: none; } .fancybox-container .modal_added_to_cart .close_fancybox_wrap { padding: 15px 30px; font-size: 16px; text-align: center; line-height: 20px; background: #e1e5ec; } .fancybox-container .modal_added_to_cart .close_fancybox { font-weight: 700; text-decoration: underline; color: #000; } .fancybox-container .modal_added_to_cart .close_fancybox:hover { text-decoration: none; } /* Search */ .fancybox-container .modal_search { width: 100%; max-width: 500px; margin-top: 100px; padding: 30px; vertical-align: top; } .fancybox-container .modal_search h3 { margin-bottom: 20px; font-size: 25px; font-weight: 700; color: var(--color-green); line-height: 100%; } .fancybox-container .modal_search .aws-container { height: 50px; border: 1px solid #ddd !important; -webkit-box-shadow: inset 0px 4px 0px 0px rgba(0 0 0 / 3%); box-shadow: inset 0px 4px 0px 0px rgba(0 0 0 / 3%); } .fancybox-container .modal_search .aws-container .aws-search-form { height: 100% !important; } .fancybox-container .modal_search .aws-container .aws-search-form .aws-form-btn { background-color: transparent !important; border: none !important; } .aws-container .aws-search-field { height: 100%; padding-left: 10px !important; font-size: 15px !important; background: transparent !important; } /* Custom offer */ .fancybox-container .modal_custom_offer { width: 100%; max-width: 600px; padding: 0; display: none; } .fancybox-container .modal_custom_offer .modal_content { padding: 30px; } .fancybox-container .modal_custom_offer h3 { margin-bottom: 20px; font-size: 25px; font-weight: 700; color: var(--color-green); line-height: 100%; } .fancybox-container .modal_custom_offer p { margin-bottom: 20px; } .fancybox-container .modal_custom_offer a { text-decoration: underline; color: var(--color-rogue-pink); } .fancybox-container .modal_custom_offer a:hover { color: #292d35; } /* Exitpopup */ .fancybox-container .fancybox-content.exitpopup { max-width: 800px; padding: 0; } .fancybox-container .fancybox-content.exitpopup .fancybox-close-small { width: 40px; height: 40px; right: 10px; top: 10px; padding: 0; line-height: 30px; background: var(--color-rogue-pink) url(images/icon-close-white.svg) no-repeat center; background-size: auto 16px; position: absolute; cursor: pointer; opacity: 1; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .fancybox-container .fancybox-content.exitpopup .fancybox-close-small:hover { background-color: #2e2e2e; } .fancybox-container .fancybox-content.exitpopup .fancybox-close-small svg { display: none; } .fancybox-container .fancybox-content.exitpopup .wrapper { padding: 30px; } .fancybox-container .fancybox-content.exitpopup .wrapper h3 { margin-bottom: 10px; font-size: 25px; font-weight: 700; color: var(--color-red); line-height: 100%; } .fancybox-container .fancybox-content.exitpopup .wrapper img { max-width: 100%; height: auto; max-height: 250px; margin: auto; display: block; } .fancybox-container .fancybox-content.exitpopup .wrapper p { margin-bottom: 20px; line-height: 30px; } .fancybox-container .fancybox-content.exitpopup .wrapper p:last-child { margin-bottom: 0; } .fancybox-container .fancybox-content.exitpopup .wrapper ul { margin-left: 20px; margin-bottom: 20px; } .fancybox-container .fancybox-content.exitpopup .wrapper ul li { list-style: square; } .fancybox-container .fancybox-content.exitpopup .wrapper ul.check { margin-left: 10px; } .fancybox-container .fancybox-content.exitpopup .wrapper ul.check li { list-style: none; } .fancybox-container .fancybox-content.exitpopup .wrapper ul.check li:before { margin-right: 5px; font-size: 19px; color: #85ad74; content: '✔'; } .fancybox-container .fancybox-content.exitpopup .wrapper.has_image { padding: 0; font-size: 0; display: table; table-layout: fixed; } .fancybox-container .fancybox-content.exitpopup .wrapper.has_image .image { width: 50%; background-color: #2e2e2e; background-repeat: no-repeat; background-position: center; background-size: cover; display: table-cell; } .fancybox-container .fancybox-content.exitpopup .wrapper.has_image .content { width: 50%; padding: 30px; font-size: 17px; line-height: 30px; display: table-cell; } .fancybox-container .fancybox-content.exitpopup .wrapper.has_only_image { padding: 0; } .fancybox-container .fancybox-content.exitpopup .wrapper.has_only_image img { width: 100%; height: auto; display: block; } /* -------------- SEARCH -------------- */ .aws-container .aws-search-form { height: 100% !important; } .aws-container .aws-search-form .aws-form-btn { background-color: transparent !important; border: none !important; } .aws-container .aws-search-field { font-size: 14px !important; border: none !important; } .aws-search-result { border-color: #eee !important; } .aws-search-result ul li { border-color: #eee !important; } .aws-search-result .aws_result_content { font-size: 14px; } .aws-search-result .aws_result_item:hover, .aws-search-result .aws_result_item.hovered { background: var(--color-silver) !important; } .aws-search-result .aws_result_title { color: #000 !important; } .aws-search-result .aws_search_more a { font-weight: 700; color: var(--color-rogue-pink) !important; } /* ---------------- RWD NAV ---------------- */ #rwd_menu { width: 100%; left: 0; top: 100px; bottom: 0; background: rgba(49 54 64 / 20%); position: fixed; z-index: 100; visibility: hidden; opacity: 0; } #rwd_menu .rwd_menu_wrap { width: 450px; height: 100%; right: -100%; top: 0; background: var(--color-dark); position: absolute; overflow-y: auto; } /* Menu */ #rwd_menu .menu ul li { float: none !important; position: relative; } #rwd_menu .menu ul li.hide_in_rwd { display: none; } #rwd_menu .menu ul li a { color: white; display: block; } /* Primary menu */ #rwd_menu ul.primary_menu { margin-bottom: 30px; } #rwd_menu ul.primary_menu li { border-bottom: 1px solid rgba(255 255 255 / 10%); } #rwd_menu ul.primary_menu li a { padding: 15px 20px; font-size: 20px; font-weight: 900; color: white; line-height: 1; display: block; position: relative; } #rwd_menu ul.primary_menu li a:hover { text-decoration: underline; } #rwd_menu ul.primary_menu li.menu-item-has-children > a:before { width: 0; height: 100%; left: 0; top: 0; background: #313131; position: absolute; content: ''; } #rwd_menu ul.primary_menu li.menu-item-has-children > a:after { width: 20px; height: 20px; right: 20px; top: calc(50% - 10px); background: url(images/icon-arrow-down-white.svg) no-repeat center; background-size: 16px; position: absolute; content: ''; } #rwd_menu ul.primary_menu li.menu-item-has-children.open > a:before { width: 8px; } #rwd_menu ul.primary_menu li.menu-item-has-children.open > a:after { ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); } #rwd_menu ul.primary_menu li ul { background: white; display: none; } #rwd_menu ul.primary_menu li ul li { border-bottom-color: #eee; } #rwd_menu ul.primary_menu li ul li:last-child { border-bottom: none; } #rwd_menu ul.primary_menu li ul li a { left: auto !important; padding: 15px 15px 15px 20px; font-size: 17px; color: #333 !important; line-height: 20px; opacity: 100% !important; } #rwd_menu ul.primary_menu li ul li.menu-item-has-children > a:after { width: 20px; height: 20px; right: 20px; top: calc(50% - 10px); background: url(images/icon-arrow-down-small.svg) no-repeat center; background-size: 12px; position: absolute; content: ''; } #rwd_menu ul.primary_menu li ul li.open > a:before { display: none; } #rwd_menu ul.primary_menu li ul li ul { background: #eef0f4; } #rwd_menu ul.primary_menu li ul li ul li { border-bottom: none; } #rwd_menu ul.primary_menu li ul li ul li a { padding: 10px 20px; } /* Secondary menu */ #rwd_menu .menu.secondary_menu { padding-bottom: 80px; } #rwd_menu .menu.secondary_menu ul li { margin-bottom: 5px; } #rwd_menu .menu.secondary_menu ul li a { padding: 0 20px; font-size: 18px; font-weight: 500; } #rwd_menu .menu.secondary_menu ul li a:hover { text-decoration: underline; } /* Phone and e-mail */ #rwd_menu a.phone { margin-bottom: 20px; margin-left: 20px; padding-left: 50px; font-weight: 700; color: white; line-height: 40px; display: block; position: relative; } #rwd_menu a.phone:before { width: 40px; height: 40px; left: 0; top: 0; background: var(--color-rogue-pink) url(images/icon-phone-white.svg) no-repeat center; background-size: 20px auto; position: absolute; content: ''; } #rwd_menu a.email { margin-bottom: 20px; margin-left: 20px; padding-left: 50px; font-weight: 700; color: white; line-height: 40px; display: block; position: relative; } #rwd_menu a.email:before { width: 40px; height: 40px; left: 0; top: 0; background: var(--color-rogue-pink) url(images/icon-email-white.svg) no-repeat center; background-size: 20px auto; position: absolute; content: ''; } #rwd_menu a.search { margin-bottom: 20px; margin-left: 20px; padding-left: 50px; font-weight: 700; color: white; line-height: 40px; display: block; position: relative; } #rwd_menu a.search:before { width: 40px; height: 40px; left: 0; top: 0; background: var(--color-rogue-pink) url(images/icon-search-white.svg) no-repeat center; background-size: 20px auto; position: absolute; content: ''; } /* Search */ #rwd_menu .aws-container { margin: 0 20px 20px; } #rwd_menu .aws-container input[type=search] { height: 50px; color: #000; background: rgba(255 255 255 / 10%) !important; } #rwd_menu .aws-container input[type=search]:focus { background: rgba(255 255 255 / 100%) !important; } /* Button */ #rwd_menu .button { width: 450px; left: -100%; bottom: 0; padding: 0 !important; text-align: center; display: block; position: fixed; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; } #rwd_menu .button:hover { color: white !important; background-color: #333 !important; } body.rwd_menu__opened #rwd_menu { visibility: visible; opacity: 100%; } body.rwd_menu__opened #rwd_menu .rwd_menu_wrap { right: 0; } /* --------------- TOP BAR --------------- */ #top_bar { height: 50px; font-size: 14px; font-weight: 700; color: white; background: var(--color-dark-2); position: relative; } #top_bar:after { width: calc((100% - 1280px) /2); height: 100%; right: 0; top: 0; background: var(--color-dark); position: absolute; content: ''; } #top_bar a { color: #c4c6cc; } #top_bar a:hover { text-decoration: underline; color: white; } #top_bar .top_bar_wrap { height: 100%; display: flex; justify-content: space-between; } #top_bar .top_bar_wrap .wrap_left { display: flex; align-items: center; } #top_bar .top_bar_wrap .wrap_left .sep { width: 30px; font-size: 20px; text-align: center; color: var(--color-green); } #top_bar .top_bar_wrap .wrap_left .email a { text-decoration: underline; } #top_bar .top_bar_wrap .wrap_right { display: flex; align-items: center; position: relative; z-index: 0; } #top_bar .top_bar_wrap .wrap_right ul { margin-right: 40px; display: flex; list-style: none; } #top_bar .top_bar_wrap .wrap_right ul li { margin-left: 25px; } #top_bar .top_bar_wrap .wrap_right ul li:first-child { margin-left: 0; } #top_bar .top_bar_wrap .wrap_right .profile { height: 100%; position: relative; background: var(--color-dark); display: flex; align-items: center; } #top_bar .top_bar_wrap .wrap_right .profile:before { width: 40px; height: 100%; left: -16px; top: 0; background: var(--color-dark); position: absolute; content: ''; z-index: -1; transform: skewX(-26deg); -moz-transform: skewX(-26deg); -webkit-transform: skewX(-26deg); } #top_bar .top_bar_wrap .wrap_right .profile a { padding-left: 25px; background: url(images/icon-user-white.svg) no-repeat left center; background-size: auto 16px; } /* --------------- HEADER --------------- */ #header { height: 120px; position: relative; } #header .header_wrap { height: 100%; display: flex; align-items: center; } #header .header_wrap .wrap_left { height: 100%; display: flex; align-items: center; } #header .header_wrap .wrap_right { height: 100%; display: flex; align-items: center; justify-content: right; flex: 1 1 auto; } /* Logo */ #header .logo { margin-right: 40px; padding-right: 40px; border-right: 1px solid #dbdde0; display: inline-block; } #header .logo img { width: auto; height: 60px; display: block; } /* Menu */ #header ul.menu { height: 100%; display: flex; align-items: center; list-style: none; } #header ul.menu li { margin-right: 20px; position: relative; } #header ul.menu li a { font-size: 15px; font-weight: 700; color: #3c424e; line-height: 50px; display: block; position: relative; } #header ul.menu li a:after { width: 0; height: 5px; left: 0; bottom: 0; background: var(--color-green); position: absolute; content: ''; } #header ul.menu li a:hover:after { width: 100%; } #header ul.menu li.current-menu-item a:after { width: 100%; background: var(--color-green); } #header ul.menu li.menu-item-has-children:hover a:after { width: 100%; background: var(--color-green); } #header ul.menu li.menu-item-has-children:hover > ul { visibility: visible; opacity: 100%; } #header ul.menu li ul { width: 450px; left: 0; top: 100%; background: white; display: block; position: absolute; z-index: 10; visibility: hidden; opacity: 0; list-style: none; -moz-box-shadow: 0 2px 3px rgba(0 0 0 / 10%); -webkit-box-shadow: 0 2px 3px rgba(0 0 0 / 10%); box-shadow: 0 2px 3px rgba(0 0 0 / 10%); } #header ul.menu li ul li { margin-right: 0; } #header ul.menu li ul li a { padding: 25px 0 25px 85px; font-size: 18px; line-height: 20px; border-left: 5px solid transparent; text-transform: none; } #header ul.menu li ul li a:hover { background: #eef0f4; border-left-color: var(--color-green); } #header ul.menu li ul li a:before { width: 50px; height: 50px; left: 20px; top: calc(50% - 25px); background-repeat: no-repeat; background-position: center; background-size: auto 24px; position: absolute; content: ''; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } #header ul.menu li ul li a:hover:before { background-color: #e1e5ec; } #header ul.menu li ul li.menu-item-78 a:before, #header ul.menu li ul li.product-cat-18 a:before { background-image: url(images/icon-woods.svg); } #header ul.menu li ul li.menu-item-79 a:before, #header ul.menu li ul li.product-cat-24 a:before { background-image: url(images/icon-window.svg); } #header ul.menu li ul li.menu-item-80 a:before, #header ul.menu li ul li.product-cat-25 a:before { background-image: url(images/icon-design-elements.svg); } #header ul.menu li ul li.menu-item-81 a:before, #header ul.menu li ul li.product-cat-26 a:before { background-image: url(images/icon-woodhouse.svg); } #header ul.menu li ul li.menu-item-82 a:before, #header ul.menu li ul li.product-cat-27 a:before { background-image: url(images/icon-roof.svg); } #header ul.menu li ul li.menu-item-83 a:before { background-image: url(images/icon-screws.svg); } #header ul.menu li ul li.menu-item-114 a:before, #header ul.menu li ul li.product-cat-37 a:before { background-image: url(images/icon-tile.svg); } #header ul.menu li ul li.menu-item-160 a:before, #header ul.menu li ul li.product-cat-108 a:before { background-image: url(images/icon-door.svg); } #header ul.menu li ul li.menu-item-186 a:before, #header ul.menu li ul li.product-cat-53 a:before { background-image: url(images/icon-log-house.svg); } #header ul.menu li ul li.menu-item-389 a:before, #header ul.menu li ul li.product-cat-53000 a:before { background-image: url(images/icon-strip-dark.svg); } #header ul.menu li ul li a:after { width: auto !important; height: 1px; left: 90px; right: 50px; background: #ddd !important; } #header ul.menu li ul li:last-child a:after { display: none !important; } #header ul.menu li ul li.menu-item-has-children:hover a { background: #eef0f4; border-left-color: var(--color-green); } #header ul.menu li ul li.menu-item-has-children:hover a:before { background-color: #e1e5ec; } #header ul.menu li ul li.menu-item-has-children:hover ul { visibility: visible; opacity: 100%; } #header ul.menu li ul ul { width: 350px; min-height: 100%; left: 100%; top: 0; padding: 30px; background: #eef0f4; position: absolute; visibility: hidden; opacity: 0; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } #header ul.menu li ul ul li a { margin-bottom: 10px; padding: 0; font-size: 16px; font-weight: 500; border-left: none !important; } #header ul.menu li ul ul li a:hover { text-decoration: underline !important; } #header ul.menu li ul ul li a:before { display: none !important; } #header ul.menu li ul ul li a:after { display: none !important; } /* Search */ #header .search svg { width: auto; height: 30px; margin-right: 30px; } /* Cart */ #header .ajax_cart { width: 50px; height: 50px; background: url(images/icon-box.svg) no-repeat center; background-size: auto 100%; position: relative; } #header .ajax_cart .count { width: auto; min-width: 26px; height: 26px; left: 50%; top: -7px; font-size: 14px; font-weight: 700; text-align: center; color: white; line-height: 22px; background: var(--color-green); border: 2px solid #4c5566; display: inline-block; position: absolute; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); -webkit-border-radius: 23px; -moz-border-radius: 23px; border-radius: 23px; } /* RWD button */ #header .rwd_button { width: 50px; height: 50px; right: 20px; background: var(--color-rogue-pink); position: absolute; z-index: 2; cursor: pointer; } #header .rwd_button .burg { width: 30px; height: 2px; left: 10px; top: calc(50% - 1px); background: white; display: block; position: absolute; -moz-transition: 0.2s; -o-transition: 0.2s; -webkit-transition: 0.2s; transition: 0.2s; } #header .rwd_button .burg:before, #header .rwd_button .burg:after { width: 30px; height: 2px; background: white; position: absolute; content: ''; -moz-transition: 0.2s; -o-transition: 0.2s; -webkit-transition: 0.2s; transition: 0.2s; } #header .rwd_button .burg:before { top: -8px; left: 0; } #header .rwd_button .burg:after { top: 8px; right: 0; } body.rwd_menu__opened #header .rwd_button .burg { background: transparent; } body.rwd_menu__opened #header .rwd_button .burg:before { top: 0; -webkit-transform: rotate(45deg); } body.rwd_menu__opened #header .rwd_button .burg:after { top: 0; -webkit-transform: rotate(-45deg); } /* Header has bottom border */ body.single-product #header:after, body.page-template-flexible-content #header:after { width: 100%; height: 1px; left: 0; bottom: 0; background: #dbdde0; position: absolute; content: ''; } /* --------------------- ANNOUNCEMENTS --------------------- */ .announcements { height: 50px; margin-top: -50px; margin-bottom: 50px; background: var(--color-silver); border-bottom: 1px solid #dbdde0; } .announcements .slick-list, .announcements .slick-track, .announcements .slick-slide { height: 100%; } .announcements .slick-slide { font-size: 16px; font-weight: 700; color: #3c424e; display: flex; align-items: center; justify-content: center; } .announcements .slick-slide a { color: #3c424e; display: flex; align-items: center; justify-content: center; } .announcements .slick-slide img { width: auto; height: 20px; margin-right: 10px; display: block; } body.home .announcements { margin-top: 0; margin-bottom: 0; border-top: 1px solid #dbdde0; border-bottom: none; } /* -------------- SLIDER -------------- */ #slider { height: 580px; background: var(--color-dark-2); position: relative; } #slider .slick-list, #slider .slick-track, #slider .slick-slide { height: 100%; } #slider .slick-slide { background-repeat: no-repeat; background-position: left center; background-size: cover; /*background-size: calc(((100% - 1280px) /2) + 1280px) auto;*/ position: relative; } #slider .slick-slide .diamond.diamond_1 { width: 190px; height: 70%; left: 0; bottom: 0; background: rgba(43 191 177 / 80%); position: absolute; content: ''; transform: skewX(-26deg); -moz-transform: skewX(-26deg); -webkit-transform: skewX(-26deg); } #slider .slick-slide .diamond.diamond_2 { width: calc(((100% - 1280px) /2) + 400px); height: 170px; right: 0; bottom: 40px; background: rgba(197 15 98 / 80%); position: absolute; content: ''; transform: skewX(26deg); -moz-transform: skewX(26deg); -webkit-transform: skewX(26deg); } /* Dots */ #slider ul.slick-dots { width: calc((100% - 1280px) /2); height: 100%; right: 0; top: 0; padding-bottom: 40px; padding-right: calc((100% - 1280px) /2); background: var(--color-dark); display: flex; align-items: end; justify-content: end; position: absolute; z-index: 0; list-style: none; } #slider ul.slick-dots:before { width: 300px; height: 100%; left: -160px; top: 0; background: var(--color-dark); position: absolute; content: ''; z-index: -1; transform: skewX(-26deg); -moz-transform: skewX(-26deg); -webkit-transform: skewX(-26deg); } #slider ul.slick-dots li { margin-left: 10px; } #slider ul.slick-dots li button { width: 20px; height: 20px; font-size: 0; background: white; cursor: pointer; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } #slider ul.slick-dots li.slick-active button { background: var(--color-green); } /* -------------- WHY US -------------- */ #why_us { margin: 50px 0; } #why_us .why_us_wrap { display: flex; } #why_us .why_us_wrap .point { font-size: 18px; font-weight: 700; color: #3c424e; line-height: 20px; display: flex; align-items: center; flex-grow: 1; flex-basis: 0; } #why_us .why_us_wrap .point .icon { width: 60px; height: 60px; margin-right: 20px; background-color: var(--color-green); background-repeat: no-repeat; background-position: center; background-size: auto 40px; position: relative; } #why_us .why_us_wrap .point .icon:before { left: -25px; top: -25px; bottom: -25px; right: -25px; background: url(images/dot.png) repeat left top; position: absolute; content: ''; z-index: -1; } /* ------------------ CATEGORIES ------------------ */ #categories { margin: 100px 0; } #categories .categories_title { margin-bottom: 30px; font-size: 40px; font-weight: 700; color: #3c424e; line-height: 100%; } #categories .categories_text { max-width: 600px; margin: 0 auto 40px; font-size: 17px; font-weight: 700; color: #3c424e; line-height: 25px; } #categories .categories_wrap { margin-left: -15px; margin-right: 15px; display: flex; } #categories .categories_wrap .category { width: calc(33.33333333333% - 30px); margin: 30px 15px 0; text-decoration: none !important; color: white; background-color: var(--color-dark); background-repeat: no-repeat; background-position: center; background-size: cover; position: relative; } #categories .categories_wrap .category:nth-child(-n+3) { margin-top: 0; } #categories .categories_wrap .category:before { padding-top: 74%; display: block; content: ''; } #categories .categories_wrap .category .cover { width: 100%; height: 100%; left: 0; top: 0; padding: 0 40px 40px; background: rgba(60 66 78 / 40%); display: flex; align-content: end; position: absolute; z-index: 0; overflow: hidden; } #categories .categories_wrap .category .cover:before { width: 100%; height: 100%; right: -100%; top: 0; background: url(images/bgr-trapeze.png) no-repeat right center; background-size: auto 100%; position: absolute; content: ''; z-index: -1; opacity: 80%; } #categories .categories_wrap .category:hover .cover:before { right: 0; } #categories .categories_wrap .category .category_title { width: 100%; margin-bottom: 20px; padding-bottom: 20px; font-size: 25px; font-weight: 700; line-height: 120%; border-bottom: 2px solid white; } #categories .categories_wrap .category .view_category { font-size: 14px; font-weight: 700; line-height: 100%; } /* ------------------------- FRONPAGE PRODUCTS ------------------------- */ .frontpage_products { margin: 100px 0; } .frontpage_products .section_title { margin-bottom: 30px; font-size: 40px; font-weight: 700; color: #3c424e; line-height: 100%; } /* ------------ BLOG ------------ */ #blog { margin-top: 100px; margin-bottom: -100px; padding-bottom: 200px; background: var(--color-silver); border-top: 1px solid #dbdde0; } #blog .inner { padding-top: 70px; } #blog .section_title { margin-bottom: 30px; font-size: 40px; font-weight: 700; color: #3c424e; line-height: 100%; } .blog_wrap { margin-left: -15px; margin-right: -15px; display: flex; } .blog_wrap .blog_post { width: calc(33.3333333333% - 30px); margin: 50px 15px 0; background: white; border: 1px solid #dbdde0; } .blog_wrap .blog_post:nth-child(-n+3) { margin-top: 0; } .blog_wrap .blog_post a.thumbnail { margin-left: -1px; margin-top: -1px; margin-right: -1px; display: block; } .blog_wrap .blog_post a.thumbnail img { width: 100%; height: auto; display: block; } .blog_wrap .blog_post .entry { padding: 20px; } .blog_wrap .blog_post .entry h3 { margin-bottom: 10px; } .blog_wrap .blog_post .entry h3 a { font-size: 22px; font-weight: 700; text-decoration: none !important; color: #3c424e !important; line-height: 100%; display: inline-block; } .blog_wrap .blog_post .entry h3 a:hover { text-decoration: underline !important; } .blog_wrap .blog_post .entry .excerpt { margin-bottom: 20px; font-size: 14px; line-height: 20px; } .blog_wrap .blog_post .entry .excerpt p:last-child { margin-bottom: 0 !important; } /* -------------------------------- DO YOU HAVE ANY QUESTION -------------------------------- */ #have_any_questions { height: 320px; color: white; background: var(--color-dark); position: relative; } #have_any_questions .have_any_questions_wrap { height: 100%; display: flex; position: relative; } #have_any_questions .have_any_questions_wrap:before { width: 100%; height: 30px; left: 0; bottom: 0; background: white; position: absolute; content: ''; } #have_any_questions .have_any_questions_wrap .wrap_left { width: 50%; height: 100%; padding-left: calc((100% - 1280px) /2); padding-bottom: 30px; display: flex; align-content: center; } #have_any_questions .have_any_questions_wrap .wrap_left p { margin-bottom: 20px; } #have_any_questions .have_any_questions_wrap .wrap_left p:last-child { margin-bottom: 0; } #have_any_questions .have_any_questions_wrap .wrap_left .have_any_questions_title { width: 100%; margin-bottom: 20px; font-size: 40px; font-weight: 700; line-height: 100%; } #have_any_questions .have_any_questions_wrap .wrap_left .have_any_questions_text { width: 100%; } #have_any_questions .have_any_questions_wrap .wrap_right { width: 50%; height: 100%; position: relative; } #have_any_questions .have_any_questions_wrap .wrap_right:before { width: 240px; height: 240px; left: 6%; bottom: 30px; background: var(--color-green); position: absolute; content: ''; transform: skewX(-26deg); -moz-transform: skewX(-26deg); -webkit-transform: skewX(-26deg); } #have_any_questions .have_any_questions_wrap .wrap_right .image_wrap { height: 100%; left: 12%; background-color: #292d35; position: relative; overflow: hidden; transform: skewX(-26deg); -moz-transform: skewX(-26deg); -webkit-transform: skewX(-26deg); } #have_any_questions .have_any_questions_wrap .wrap_right .image_wrap .image { width: 100%; height: 100%; left: 0; top: 0; background-repeat: no-repeat; background-position: center; background-size: cover; position: absolute; transform: skewX(26deg) scale(120%); -moz-transform: skewX(26deg) scale(120%); -webkit-transform: skewX(26deg) scale(120%); } /* ---------------------- BEFORE CONTENT ---------------------- */ #before_content { height: 120px; margin-bottom: 50px; background: var(--color-dark); } #before_content .before_content_wrap { height: 100%; display: flex; } #before_content .before_content_wrap .wrap_left { width: 50%; height: 100%; padding-left: calc((100% - 1280px) /2); display: flex; align-items: center; position: relative; } #before_content .before_content_wrap .wrap_left:after { width: 100px; height: 100%; right: -30px; top: 0; background: var(--color-dark); position: absolute; z-index: 5; content: ''; transform: skewX(-26deg); -moz-transform: skewX(-26deg); -webkit-transform: skewX(-26deg); } #before_content .before_content_wrap .wrap_left .rank-math-breadcrumb { font-size: 15px; font-weight: 700; color: white; line-height: 16px; } #before_content .before_content_wrap .wrap_left .rank-math-breadcrumb a { font-weight: 400; text-decoration: underline; color: white; } #before_content .before_content_wrap .wrap_left .rank-math-breadcrumb a:hover { text-decoration: none; } #before_content .before_content_wrap .wrap_left .rank-math-breadcrumb .separator { font-weight: 400; } #before_content .before_content_wrap .wrap_right { width: 50%; height: 100%; background-repeat: no-repeat; background-position: right center; background-size: cover; position: relative; z-index: 1; } #before_content .before_content_wrap .wrap_right .trapeze_1 { width: 150px; height: 90px; left: 0; bottom: 0; background: rgba(43 191 177 / 80%); position: absolute; content: ''; transform: skewX(-26deg); -moz-transform: skewX(-26deg); -webkit-transform: skewX(-26deg); } #before_content .before_content_wrap .wrap_right .trapeze_2 { width: 400px; height: 50px; right: -50px; bottom: 0; background: rgba(197 15 98 / 80%); position: absolute; content: ''; transform: skewX(26deg); -moz-transform: skewX(26deg); -webkit-transform: skewX(26deg); } body.page-template-flexible-content .rank-math-breadcrumb { margin-bottom: -50px; padding-top: 50px; font-size: 15px; font-weight: 700; text-align: center; } body.page-template-flexible-content .rank-math-breadcrumb a { font-weight: 400; text-decoration: underline; } body.page-template-flexible-content .rank-math-breadcrumb a:hover { text-decoration: none; } body.page-template-flexible-content .rank-math-breadcrumb .separator { font-weight: 400; } /* --------------- CONTENT --------------- */ #container { padding-bottom: 150px; } body.home #container { padding-bottom: 100px; } #content_with_sidebar { display: flex; } #content { flex: 1; } #content h1 { margin-bottom: 30px; font-size: 50px; font-weight: 400; text-transform: uppercase; line-height: 100%; } #content h2 { margin-bottom: 20px; font-size: 40px; font-weight: 700; line-height: 100%; } #content h3 { margin-bottom: 20px; font-size: 25px; font-weight: 700; color: var(--color-rogue-pink); line-height: 100%; } #content p { margin-bottom: 20px; } #content a { text-decoration: underline; color: #3c424e; } #content a:hover { text-decoration: none; } #content img { max-width: 100%; height: auto; display: block; } #content ul { margin-left: 30px; margin-bottom: 20px; } #content ol { margin-left: 30px; margin-bottom: 20px; } /* Term description */ #content .term-description { margin-bottom: 30px; padding: 20px; font-size: 16px; background: var(--color-silver); border-radius: 10px; } #content .term-description p:last-child { margin-bottom: 0 !important; } /* Contact */ #content .contact_wrap { margin-bottom: 30px; display: flex; } #content .contact_wrap .wrap_left { width: 50%; padding-right: 50px; } #content .contact_wrap .wrap_right { width: 50%; } #content .contact_wrap .social_media { display: flex; } #content .contact_wrap .social_media a { width: 60px; height: 60px; margin-right: 10px; font-size: 0; background-color: var(--color-green); background-repeat: no-repeat; background-position: center; background-size: auto 24px; } #content .contact_wrap .social_media a:hover { background-color: var(--color-rogue-pink); } #content .contact_wrap .social_media a.facebook { background-image: url(images/icon-facebook-white.svg); } #content .contact_wrap .social_media a.instagram { background-image: url(images/icon-instagram-white.svg); } #content .contact_wrap .social_media a.youtube { background-image: url(images/icon-youtube-white.svg); } /* Map */ #rrwestor_map { height: 500px; } #content .open_sidebar { width: 100%; height: 50px; margin-bottom: 30px; font-weight: 500; color: white; background: var(--color-rogue-pink); display: flex; align-items: center; justify-content: center; cursor: pointer; } #content .open_sidebar:hover { background: var(--color-dark); } #content .open_sidebar img { width: auto; height: 20px; display: block; } /* Doors wrapper */ .doors_wrap { margin-left: -10px; margin-right: -10px; display: flex; justify-content: center; } .doors_wrap .door { width: calc(33.3333333333% - 20px); margin: 30px 10px 0; } .doors_wrap .door .thumbnail { margin-top: 0; display: block; } .doors_wrap .door .thumbnail img { width: 100%; height: auto; display: block; } .doors_wrap .door h3 { background: var(--color-dark); } .doors_wrap .door h3 a { padding: 10px; font-size: 18px; font-weight: 700; text-decoration: none !important; color: white !important; display: block; } #sidebar .doors_wrap { margin-left: 0; margin-right: 0; display: block; } #sidebar .doors_wrap .door { width: 100%; margin: 0 0 20px; } /* Iframe wrapper */ .iframe_wrapper { height: 0; margin-bottom: 30px; padding-bottom: 56.25%; padding-top: 25px; position: relative; } .iframe_wrapper iframe { width: 100%; height: 100%; left: 0; top: 0; position: absolute; } /* Flexible content */ .flexible_content .paragraph { margin: 70px 0; font-weight: 400; } .flexible_content .paragraph .title { margin: 20px 0; font-size: 50px; font-weight: 700; line-height: 100%; } .flexible_content .fullwidth_image { height: 600px; color: white; background-color: #292d35; background-repeat: no-repeat; background-position: center; background-size: cover; position: relative; } .flexible_content .fullwidth_image .cover { height: 100%; background: -moz-linear-gradient(left, rgba(41,45,53,0) 0%, rgba(41,45,53,0.8) 50%, rgba(41,45,53,0.8) 100%); background: -webkit-linear-gradient(left, rgba(41,45,53,0) 0%,rgba(41,45,53,0.8) 50%,rgba(41,45,53,0.8) 100%); background: linear-gradient(to right, rgba(41,45,53,0) 0%,rgba(41,45,53,0.8) 50%,rgba(41,45,53,0.8) 100%); } .flexible_content .fullwidth_image .cover .inner { height: 100%; display: flex; justify-content: end; } .flexible_content .fullwidth_image .cover .text { width: 50%; height: 100%; display: flex; align-items: center; align-content: center; } .flexible_content .fullwidth_image .cover .text p { width: 100%; } .flexible_content .fullwidth_image .cover .text p:last-child { margin-bottom: 0 !important; } .flexible_content .fullwidth_image .cover .text .title { margin: 20px 0; font-size: 40px; font-weight: 700; line-height: 100%; } .flexible_content .usp { margin: 70px 0; } .flexible_content .usp .usp_wrap { display: flex; } .flexible_content .usp .usp_wrap .item { padding: 0 30px; font-size: 16px; font-weight: 700; line-height: 20px; flex-grow: 1; flex-basis: 0; } .flexible_content .usp .usp_wrap .item img { width: auto; height: 80px !important; margin: 0 auto 20px; display: block; } .flexible_content .image_text { margin: 70px 0; } .flexible_content .image_text p:last-child { margin-bottom: 0 !important; } .flexible_content .image_text .image_text_wrap { display: flex; } .flexible_content .image_text .image_text_wrap .wrap_left { width: 50%; position: relative; } .flexible_content .image_text .image_text_wrap .wrap_left .image { height: 100%; background-repeat: no-repeat; background-position: center; background-size: cover; } .flexible_content .image_text .image_text_wrap .wrap_right { width: 50%; padding: 70px 0 70px 50px; } .flexible_content .image_text.has_background { padding: 70px 0; } .flexible_content .image_text.inverse .image_text_wrap .wrap_left { order: 2; } .flexible_content .image_text.inverse .image_text_wrap .wrap_right { order: 1; padding: 70px 50px 70px 0; } /* Gallery */ #content ul.gallery { margin-left: -10px !important; margin-right: -10px; display: flex; list-style: none; } #content ul.gallery li { width: calc(20% - 20px); margin: 20px 10px 0; } #content ul.gallery li:nth-child(-n+5) { margin-top: 0; } #content ul.gallery li a { display: block; outline: 3px solid transparent; outline-offset: 2px; border-radius: 2px; } #content ul.gallery li a:hover { outline-color: var(--color-rogue-pink); } #content ul.gallery li img { width: 100%; height: auto; display: block; } #content .galleries .gallery_container { margin-bottom: 50px; padding-bottom: 50px; border-bottom: 1px solid var(--color-gray); } #content .galleries .gallery_container:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: none; } #content .galleries .gallery_container ul { margin-bottom: 0 !important; } /* --------------- SIDEBAR --------------- */ #sidebar { width: 300px; padding-right: 30px; } #sidebar .widget { margin-bottom: 50px; } #sidebar .widget .widget_title { margin-bottom: 10px; font-size: 20px; font-weight: 700; color: var(--color-rogue-pink); line-height: 100%; } /* Close sidebar */ #sidebar .close_sidebar { width: 100%; height: 50px; left: 0; top: 0; font-weight: 500; color: white; background: var(--color-rogue-pink); display: flex; align-items: center; justify-content: center; position: absolute; cursor: pointer; } #sidebar .close_sidebar:hover { background: var(--color-dark); } #sidebar .close_sidebar.active { background: var(--color-dark); } /* Filter */ .irs-line-mid, .irs-line-left, .irs-line-right, .irs-bar, .irs-bar-edge, .irs-slider { background-image: url(images/sprite-skin-nice.png) !important; } .woof_container_inner h4 { font-size: 15px; font-weight: 700; color: #3c424e; line-height: 50px; display: block; position: relative; } .woof_container_inner ul.woof_list li { margin: 0 !important; padding: 0 !important; } .woof_container_inner ul.woof_list li label { margin: 0 !important; padding: 0 !important; font-size: 15px !important; font-weight: 500 !important; } .woof_container_inner ul.woof_list li input[type=checkbox] { margin-right: 5px !important; } .woof_childs_list_opener { display: inline-flex !important; } .woof_childs_list_opener span.woof_is_closed { background: url(images/icon-plus.svg) no-repeat center !important; background-size: auto 12px !important; } .woof_childs_list_opener span.woof_is_opened { background: url(images/icon-minus.svg) no-repeat center !important; background-size: auto 12px !important; } .woof_products_top_panel_ul { font-size: 15px !important; } .woof_products_top_panel { z-index: 8 !important; } .woof_products_top_panel li span, .woof_products_top_panel2 li span { padding-right: 25px !important; background: url(images/icon-delete-circle.svg) no-repeat right center !important; background-size: auto 16px !important; } .woof_info_popup { left: 50% !important; top: 50% !important; text-align: center !important; background-color: rgba(41 45 53 / 90%) !important; -webkit-border-radius: 0 !important; -moz-border-radius: 0 !important; border-radius: 0 !important; -webkit-box-shadow: none !important; -moz-box-shadow: none !important; box-shadow: none !important; -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%); } .woof_reset_button_2 { height: 30px; padding: 0 10px; font-size: 14px; font-weight: 700; color: white; line-height: 30px; background: var(--color-rogue-pink); cursor: pointer; } .woof_reset_button_2:hover { background: #292d35; } /* Price filter */ #sidebar .widget.widget_price_filter .screen-reader-text { display: none; } #sidebar .widget.widget_price_filter .price_slider_amount { margin-top: 10px; display: flex; } #sidebar .widget.widget_price_filter .price_slider_amount .button { width: 100%; height: 40px; line-height: 40px; order: 2; } #sidebar .widget.widget_price_filter .price_slider_amount .price_label { width: 100%; margin-bottom: 10px; font-size: 16px; font-weight: 700; text-align: center; order: 1; } /* Categories */ #sidebar ul.product-categories { list-style: none; } #sidebar ul.product-categories li.cat-item ul { display: none; } #sidebar ul.product-categories li { font-size: 16px; color: var(--color-purple); } #sidebar ul.product-categories li a { color: var(--color-purple); } #sidebar ul.product-categories li a:hover { text-decoration: underline; color: var(--color-dark); } #sidebar ul.product-categories li.current-cat > a { font-weight: 700; color: var(--color-dark); } #sidebar ul.product-categories li.current-cat ul { margin-left: 20px; margin-bottom: 10px; display: block; list-style: disc; } #sidebar ul.product-categories li.current-cat ul li a { font-size: 15px; } #sidebar ul.product-categories li.current-cat ul li .count { display: none; } #sidebar ul.woocommerce-widget-layered-nav-list { list-style: none; } #sidebar ul.woocommerce-widget-layered-nav-list li { font-size: 16px; color: var(--color-purple); } #sidebar ul.woocommerce-widget-layered-nav-list li a { color: var(--color-purple); } #sidebar ul.woocommerce-widget-layered-nav-list li a:hover { text-decoration: underline; color: var(--color-dark); } /* --------------- FOOTER --------------- */ #footer { color: white; background: var(--color-dark); background-image: url(images/bgr_footer.webp); background-image: -webkit-image-set(url(images/bgr_footer.webp) 1x); background-image: image-set(url(images/bgr-footer.png) 1x); background-position: right top; background-repeat: no-repeat; background-size: auto 90%; border-top: 10px solid var(--color-rogue-pink); } /* Footer top */ #footer .footer_top { display: flex; } #footer .footer_top .wrap_left { width: 50%; position: relative; } #footer .footer_top .wrap_left .image_wrap { height: calc(100% + 100px); top: -100px; left: -14%; background-color: #292d35; background-repeat: no-repeat; background-position: center; background-size: cover; position: relative; overflow: hidden; transform: skewX(-26deg); -moz-transform: skewX(-26deg); -webkit-transform: skewX(-26deg); } #footer .footer_top .wrap_left .image_wrap:before { width: 90px; height: 250px; bottom: 0; right: 0; background: rgba(41 189 176 / 80%); position: absolute; content: ''; z-index: 1; } #footer .footer_top .wrap_left .image_wrap .image { width: calc(100% + 50px); height: 100%; left: 0; top: 0; background: url(images/bgr-footer-2.jpg) no-repeat center; background-size: cover; position: absolute; transform: skewX(26deg) scale(120%); -moz-transform: skewX(26deg) scale(120%); -webkit-transform: skewX(26deg) scale(120%); } #footer .footer_top .wrap_right { width: 50%; padding-top: 100px; padding-bottom: 100px; padding-right: calc((100% - 1280px) /2); } #footer .footer_top .wrap_right p { margin-bottom: 20px; } #footer .footer_top .wrap_right p:last-child { margin-bottom: 0; } #footer .footer_top .wrap_right .aboutus_title { margin-bottom: 30px; font-size: 40px; font-weight: 700; color: white; line-height: 100%; } /* Footer bottom */ #footer .footer_center { padding: 50px 0; font-size: 15px; font-weight: 700; position: relative; } #footer .footer_center:after { width: calc((100% - 1280px) /2); top: 0; right: 0; bottom: -20px; background: #292d35; position: absolute; content: ''; } #footer .footer_center a { color: #c4c6cc; } #footer .footer_center p { margin-bottom: 20px; } #footer .footer_center p:last-child { margin-bottom: 0; } #footer .footer_center .footer_center_wrap { display: flex; } #footer .footer_center .footer_center_wrap .wrap_left { width: 33.3333333333%; } #footer .footer_center .footer_center_wrap .wrap_left .logo { margin-bottom: 20px; display: inline-block; } #footer .footer_center .footer_center_wrap .wrap_left .logo img { width: auto; height: 60px; display: block; } #footer .footer_center .footer_center_wrap .wrap_left .contact { color: #c4c6cc; } #footer .footer_center .footer_center_wrap .wrap_left .contact a { text-decoration: underline; } #footer .footer_center .footer_center_wrap .wrap_left .contact strong { color: white; } #footer .footer_center .footer_center_wrap .wrap_left.pages { display: flex; } #footer .footer_center .footer_center_wrap .wrap_left.pages ul { width: 50%; list-style: none; } #footer .footer_center .footer_center_wrap .wrap_left.pages ul li { line-height: 40px; } #footer .footer_center .footer_center_wrap .wrap_left.pages ul li a { color: white; line-height: 20px; display: inline-block; } #footer .footer_center .footer_center_wrap .wrap_left.pages ul li a:hover { color: #c4c6cc; } #footer .footer_center .footer_center_wrap .wrap_left.social_media { display: flex; justify-content: end; position: relative; z-index: 0; } #footer .footer_center .footer_center_wrap .wrap_left.social_media:before { width: calc(100% + 100px); top: -50px; left: 0; bottom: -70px; background: #292d35; position: absolute; z-index: -1; content: ''; transform: skewX(-26deg); -moz-transform: skewX(-26deg); -webkit-transform: skewX(-26deg); } #footer .footer_center .footer_center_wrap .wrap_left.social_media .social_media_title { width: 100%; font-size: 26px; font-weight: 700; text-align: right; line-height: 100%; } #footer .footer_center .footer_center_wrap .wrap_left.social_media .social_media_icons { width: 100%; max-width: 300px; display: flex; justify-content: space-between; } #footer .footer_center .footer_center_wrap .wrap_left.social_media .social_media_icons a { padding-top: 70px; position: relative; z-index: 2; } #footer .footer_center .footer_center_wrap .wrap_left.social_media .social_media_icons a:before { width: 60px; height: 60px; left: calc(50% - 30px); top: 0; background-color: var(--color-green); background-repeat: no-repeat; background-position: center; background-size: auto 24px; position: absolute; content: ''; } #footer .footer_center .footer_center_wrap .wrap_left.social_media .social_media_icons a:hover:before { background-color: var(--color-rogue-pink); } #footer .footer_center .footer_center_wrap .wrap_left.social_media .social_media_icons a.facebook:before { background-image: url(images/icon-facebook-white.svg); } #footer .footer_center .footer_center_wrap .wrap_left.social_media .social_media_icons a.instagram:before { background-image: url(images/icon-instagram-white.svg); } #footer .footer_center .footer_center_wrap .wrap_left.social_media .social_media_icons a.youtube:before { background-image: url(images/icon-youtube-white.svg); } /* Footer bottom */ #footer .footer_bottom { padding: 30px 0; font-size: 14px; color: var(--color-dark); line-height: 20px; background: white; } #footer .footer_bottom img { width: auto; height: 30px; display: block; } #footer .footer_bottom .footer_bottom_wrap { display: flex; align-items: center; justify-content: space-between; } /* -------------- BARION -------------- */ #barion { padding: 10px 0; background: white; } /* ----------- RWD ----------- */ @media only screen and (max-width: 1440px) { /* DISPLAY: None */ .hide_in_1440 { display: none !important; } /* SLIDER */ #slider { height: 500px; } } @media only screen and (max-width: 1280px) { /* DISPLAY: None */ .hide_in_1280 { display: none !important; } /* DEFAULT */ .p_l_20 { padding-left: 20px; } .p_r_20 { padding-right: 20px; } /* BAR */ #top_bar .top_bar_wrap .wrap_right .profile a { padding-right: 20px; } /* HEADER: Logo */ #header .logo { margin-right: 20px; padding-right: 20px; } #header .logo img { height: 50px; } /* HEADER: Menu */ #header ul.menu li { margin-right: 20px; } #header ul.menu li a { font-size: 14px; } #header ul.menu li ul { width: 400px; } #header ul.menu li ul li a { font-size: 17px; } /* SLIDER */ #slider { height: 450px; } #slider .slick-slide { background-position: center; background-size: cover; } /* SLIDER: Dots */ #slider ul.slick-dots:before { left: -20px; } /* SLIDER: Dots */ #slider ul.slick-dots { right: 20px; } /* CATEGORIES */ #categories .categories_wrap { margin-left: -10px; margin-right: -10px; } #categories .categories_wrap .category { width: calc(33.33333333333% - 20px); margin: 20px 10px 0; } #categories .categories_wrap .category .cover { padding: 0 20px 20px; } #categories .categories_wrap .category .category_title { font-size: 22px; } /* BLOG */ .blog_wrap { margin-left: -10px; margin-right: -10px; } .blog_wrap .blog_post { width: calc(33.3333333333% - 20px); margin: 50px 10px 0; } /* BEFORE CONTENT */ #before_content .before_content_wrap .wrap_left { padding-left: 20px; } } @media only screen and (max-width: 960px) { /* DISPLAY: None */ .hide_in_960 { display: none !important; } /* DISPLAY: Block */ .show_in_960 { display: block !important; } .show_in_960_flex { display: flex !important; } /* HEADER */ #header { height: 100px; } #header .inner { padding-right: 100px; } /* HEADER: Logo */ #header .logo { margin-right: 0; padding-right: 0; border-right: none; } /* ANNOUNCEMENTS */ .announcements { margin-top: -30px; margin-bottom: 30px; } /* WHY US */ #why_us .why_us_wrap .point { padding: 0 10px; text-align: center; display: block; } #why_us .why_us_wrap .point .icon { margin: 0 auto 20px; } /* CATEGORIES */ #categories { margin: 75px 0; } #categories .categories_title { font-size: 35px; } /* FRONPAGE PRODUCTS */ .frontpage_products { margin: 75px 0; } .frontpage_products .section_title { font-size: 35px; } /* BLOG */ #blog { margin-top: 75px; margin-bottom: 0; padding-bottom: 75px; } #blog .inner { padding-top: 75px; } #blog .section_title { font-size: 35px; } /* DO YOU HAVE ANY QUESTION */ #have_any_questions { height: 350px; } #have_any_questions .have_any_questions_wrap .wrap_left .have_any_questions_title { font-size: 35px; } /* BEFORE CONTENT */ #before_content { margin-bottom: 30px; } /* CONTAINER */ #container { padding-bottom: 50px; } body.home #container { padding-bottom: 50px; } body.page-template-contact #container { padding-bottom: 0; } /* CONTENT */ #content h1 { font-size: 45px; } /* CONTENT: Contact */ #content .contact_wrap .wrap_left { width: 100%; margin-bottom: 50px; padding-right: 0; } #content .contact_wrap .wrap_right { width: 100%; } /* CONTENT: Flexible content */ .flexible_content .paragraph { margin: 50px 0; } .flexible_content .paragraph .title { font-size: 45px; } .flexible_content .fullwidth_image { height: 550px; } .flexible_content .usp { margin: 50px 0; } .flexible_content .image_text { margin: 50px 0; } .flexible_content .image_text .image_text_wrap .wrap_right { width: 50%; padding: 50px 0 50px 50px; } .flexible_content .image_text.has_background { padding: 50px 0; } .flexible_content .image_text.inverse .image_text_wrap .wrap_right { padding: 50px 50px 50px 0; } /* CONTENT */ #content ul.gallery li { width: calc(25% - 20px); } #content ul.gallery li:nth-child(5) { margin-top: 20px; } /* SIDEBAR */ #sidebar { height: 100%; left: -100%; top: 0; padding: 70px 20px 0; background: white; border-right: 1px solid var(--color-gray); position: fixed; z-index: 99; overflow: auto; } body.opened_sidebar #sidebar { left: 0; } /* FOOTER: Footer top */ #footer .footer_top .wrap_right { width: 100%; padding: 75px 20px; } #footer .footer_top .wrap_right .aboutus_title { font-size: 35px; } /* FOOTER: Footer bottom */ #footer .footer_center { padding: 0; } #footer .footer_center .footer_center_wrap .wrap_left { width: 50%; } #footer .footer_center .footer_center_wrap .wrap_left.social_media { width: calc(100% + 40px); margin: 50px -20px 0; padding: 20px; background: #292d35; justify-content: center; } #footer .footer_center .footer_center_wrap .wrap_left.social_media:before { display: none; } #footer .footer_center .footer_center_wrap .wrap_left.social_media .social_media_title { margin-bottom: 20px; text-align: center; } } @media only screen and (max-width: 768px) { /* SLIDER */ #slider { height: 400px; } #slider .slick-slide .diamond.diamond_1 { width: 100px; height: 50%; left: -20px; } /* CATEGORIES */ #categories { margin: 50px 0; } #categories .categories_title { font-size: 30px; } #categories .categories_wrap { margin-left: 0; margin-right: 0; } #categories .categories_wrap .category { width: 100%; margin: 20px 0 0; } #categories .categories_wrap .category:nth-child(2) { margin-top: 20px; } #categories .categories_wrap .category:nth-child(3) { margin-top: 20px; } #categories .categories_wrap .category:before { padding-top: 60%; } /* FRONPAGE PRODUCTS */ .frontpage_products { margin: 50px 0; } .frontpage_products .section_title { font-size: 30px; } /* BLOG */ #blog { margin-top: 50px; padding-bottom: 50px; } #blog .inner { padding-top: 50px; } #blog .section_title { font-size: 30px; } .blog_wrap .blog_post { width: calc(50% - 30px); } .blog_wrap .blog_post:nth-child(3) { margin-top: 50px; } body.home .blog_wrap .blog_post:nth-child(3) { display: none !important; } /* DO YOU HAVE ANY QUESTION */ #have_any_questions { height: auto; } #have_any_questions .have_any_questions_wrap .wrap_left { width: 100%; padding-top: 30px; } #have_any_questions .have_any_questions_wrap .wrap_left .have_any_questions_title { font-size: 30px; } #have_any_questions .have_any_questions_wrap .wrap_right { width: 100%; height: 300px; } #have_any_questions .have_any_questions_wrap .wrap_right:before { left: 0; } /* BEFORE CONTENT */ #before_content .before_content_wrap .wrap_left { width: 75%; } #before_content .before_content_wrap .wrap_right { width: 25%; } /* CONTENT */ #content h1 { font-size: 5vw; } /* CONTENT: Map */ #rrwestor_map { height: 450px; } /* CONTENT: Flexible content */ .flexible_content .paragraph .title { font-size: 40px; } .flexible_content .fullwidth_image { height: auto; } .flexible_content .fullwidth_image .cover { background: rgba(41 45 53 / 80%); } .flexible_content .fullwidth_image .cover .text { width: 100%; min-height: 300px; padding: 50px 0; } .flexible_content .usp .usp_wrap .item { width: 33.3333333333%; padding: 20px; font-size: 15px; flex-grow: inherit; flex-basis: auto; } .flexible_content .usp .usp_wrap .item img { height: 60px !important; } .flexible_content .image_text .image_text_wrap .wrap_left { width: 100%; } .flexible_content .image_text .image_text_wrap .wrap_left .image { height: auto; } .flexible_content .image_text .image_text_wrap .wrap_left .image:before { padding-top: 50%; display: block; content: ''; } .flexible_content .image_text .image_text_wrap .wrap_right { width: 100%; padding: 20px 0; } .flexible_content .image_text.has_background { padding: 20px 0; } .flexible_content .image_text.inverse .image_text_wrap .wrap_left { order: 1; } .flexible_content .image_text.inverse .image_text_wrap .wrap_right { order: 2; padding: 20px 0; } /* CONTENT: Gallery */ #content ul.gallery li { width: calc(33.3333333333% - 20px); } #content ul.gallery li:nth-child(4) { margin-top: 20px; } /* FOOTER: Footer top */ #footer .footer_top .wrap_right { padding: 50px 20px; } #footer .footer_top .wrap_right .aboutus_title { font-size: 30px; } /* FOOTER: Footer bottom */ #footer .footer_center .footer_center_wrap .wrap_left.pages ul { width: 100%; } /* FOOTER: Footer bottom */ #footer .footer_bottom img { width: auto; max-width: 100%; height: auto; margin: auto; } #footer .footer_bottom .footer_bottom_wrap { justify-content: center; } #footer .footer_bottom .footer_bottom_wrap .wrap_left { width: 100%; margin-bottom: 20px; text-align: center; } } @media only screen and (max-width: 640px) { /* DISPLAY: None */ .hide_in_640 { display: none !important; } /* MODAL */ .fancybox-container .modal_added_to_cart h3 { padding: 20px 20px 0; font-size: 20px; } .fancybox-container .modal_added_to_cart .ordered_product { padding: 0 20px 20px; } .fancybox-container .modal_added_to_cart .thumbnail { width: 100px; height: 100px; } .fancybox-container .modal_added_to_cart .datas { width: calc(100% - 100px); } .fancybox-container .modal_added_to_cart .datas h4 { font-size: 16px; } /* SLIDER */ #slider { height: 350px; } /* BLOG */ .blog_wrap { max-width: 480px; margin-left: auto; margin-right: auto; } .blog_wrap .blog_post { width: 100%; margin: 30px 0 0; } .blog_wrap .blog_post:nth-child(2) { margin-top: 30px; } body.home .blog_wrap .blog_post:nth-child(3) { display: block !important } /* BEFORE CONTENT */ #before_content { height: auto; } #before_content .before_content_wrap .wrap_left { width: 100%; padding: 20px; } /* CONTENT */ #content h1 { font-size: 6vw; } /* CONTENT: Flexible content */ .flexible_content .paragraph .title { font-size: 35px; } /* Footer bottom */ #footer .footer_center .footer_center_wrap .wrap_left { width: 100%; } #footer .footer_center .footer_center_wrap .wrap_left.pages { margin-top: 50px; } } @media only screen and (max-width: 480px) { /* DISPLAY: None */ .hide_in_480 { display: none !important; } /* DISPLAY: Block */ .show_in_480 { display: block !important; } /* DEFAULT */ .button:not(.single_add_to_cart_button) { width: 100%; height: auto; padding: 15px 20px !important; text-align: center; line-height: 20px; } img.alignleft, img.alignright { width: 50%; } /* MODAL */ .fancybox-container .modal_added_to_cart .datas h4 { font-size: 15px; } /* MODAL: Search */ .fancybox-container .modal_search { padding: 20px; } /* RWD NAV */ #rwd_menu .rwd_menu_wrap { width: calc(100% - 20px); } /* ANNOUNCEMENTS */ .announcements .slick-slide { font-size: 13px; } .announcements .slick-slide img { margin-right: 5px; } /* SLIDER */ #slider { height: 300px; } #slider .slick-slide .diamond.diamond_1 { width: 70px; height: 30%; } /* WHY US */ #why_us .why_us_wrap .point { width: 33.3333333333%; font-size: 13px; line-height: 16px; } #why_us .why_us_wrap .point .icon:before { left: -20px; top: -20px; bottom: -20px; right: -20px; } /* BEFORE CONTENT */ #before_content .before_content_wrap .wrap_left .rank-math-breadcrumb { font-size: 13px; } /* CONTENT */ #content h1 { font-size: 7vw; } /* CONTENT: Gallery */ #content ul.gallery li { width: calc(50% - 20px); } #content ul.gallery li:nth-child(3) { margin-top: 20px; } /* CONTENT: Map */ #rrwestor_map { height: 400px; } /* CONTENT: Flexible content */ .flexible_content .paragraph .title { font-size: 30px; } /* CONTENT: Flexible content */ .flexible_content .usp .usp_wrap .item { width: 50%; font-size: 14px; } .flexible_content .usp .usp_wrap .item img { height: 50px !important; } /* SIDEBAR: Filter */ .woof_info_popup { font-size: 18px !important; } } @media only screen and (max-width: 375px) { /* HEADER: Logo */ #header .logo img { height: 30px; } } @media only screen and (max-width: 320px) { }