/* Theme Name: Laumar Theme URI: https://laumar.hu Description: A Laumar Hungary (KORLEAND Kft.) weboldalának alapértelmezett sablonja. Author: Digitalform Author URI: https://digitalform.hu Version: 1.0 */ *{ margin: 0; padding: 0; border: 0; text-decoration: none; list-style: none; } *, *:after, *::before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } body { font-family: 'Barlow', sans-serif; font-size: 19px; overflow-x: hidden; } li { list-style-type: none; } h1, h2, h3, h4, h5 { font-weight: normal; } button, input, select, textarea { font-family: 'Barlow', sans-serif; font-size: 19px; outline: none; -webkit-appearance: none; border-radius: 0; } select { height: 50px; } input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { opacity: 1; } img.alignleft { margin: 0 20px 5px 0; float: left; } img.alignright { margin: 0 0 5px 20px; float: right; } hr { height: 30px; border-top: 1px solid #e0dcd6; } .left { float: left; } .right { float: right; } .clear { clear: both; } .inner { max-width: 1440px; margin: auto; position: relative; } .inner_960 { max-width: 960px; } .inner_640 { max-width: 640px; } .hide { display: none !important; } .p_20 { padding: 20px; } .p_30 { padding: 30px; } .b_r_50p { -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } .special_offer { height: 180px; margin-bottom: 30px; display: none; } .vertical_middle { top: 50%; position: relative; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .required, .red { color: #d91828; } .skin { background-color: #fff4f4; } .skin.skin_has_flower { background-image: url(images/bgr_flower.png); background-repeat: no-repeat; background-position: left center; } .button { height: 50px; padding: 0 30px; font-size: 19px; text-decoration: none !important; color: white !important; line-height: 50px; background-color: #ff7062; -webkit-border-radius: 25px; -moz-border-radius: 25px; border-radius: 25px; 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: #213043; } .button:disabled { color: white !important; background-color: #ccc; } /* .button.button_red { background-color: #ff7062; } .button.button_red:hover { background-color: #213043; } */ .button.shake { animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both; -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); backface-visibility: hidden; perspective: 1000px; } /* Font */ .center { text-align: center; } /*.sec_font, .main_title, .product .summary h1, .meta ul li { font-family: 'PT Serif', serif; } */ .sec_font, .main_title, .product .summary h1, .meta ul li { font-family: 'DM Serif Text', serif; } .uppercase { text-transform: uppercase; } /* Animation */ .anim, .modal:before, .play:before { -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; } /* Col */ .row { width: 100%; font-size: 0; } .row > .col { font-size: 19px; vertical-align: top; display: inline-block; } .row .col_50 { width: 50%; } .row .col_33 { width: 33.3333333333%; } .row .col_25 { width: 25%; } .row .col_20 { width: 20%; } .row .col_16 { width: 16.6666666666%; } .row .col_14 { width: 14.28%; } .row.row_table { display: table; table-layout: fixed; } .row.row_table > .col { display: table-cell; } /* 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; -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 { width: 10px; height: 10px; left: 4px; top: 4px; text-align: center; background: #ff7062; position: relative; border-radius: 8px; display: block; content: ''; } input[type="checkbox"]:checked:before { width: 10px; height: 10px; left: 4px; top: 4px; text-align: center; background: #ff7062; position: relative; display: block; content: ''; } .stamped-carousel-scroll { height: 600px !important; } /* ------------- MODAL ------------- */ .white_modal .modal_wrapper { margin: 10px auto; position: relative; } .white_modal .modal_wrapper img { max-width: 100%; height: auto; display: block; } .white_modal .modal_wrapper .mfp-close { background: #ff7062 url(images/icon_close_white.svg) no-repeat center; background-size: auto 20px; opacity: 1 !important; cursor: pointer; } .white_modal .modal_wrapper .mfp-close:hover { -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); transform: rotate(90deg); } .white_modal .modal_wrapper .mfp-close:active { top: 0 !important; } /* -------------------------- GO TO TESTIMONIALS -------------------------- */ #go_to_testimonials { width: 100vh; height: 100px; top: 0; bottom: 0; left: 0; margin: auto; text-align: center; position: fixed; z-index: 10; -webkit-transform-origin: 0 50%; -moz-transform-origin: 0 50%; -webkit-transform: rotate(-90deg) translate(-50%, 50%); -moz-transform: rotate(-90deg) translate(-50%, 50%); } #go_to_testimonials a { height: 40px; padding: 0 50px 0 10px; color: white; line-height: 40px; background: #ff7062; display: inline-block; position: relative; } #go_to_testimonials a:hover { background-color: #213043; } #go_to_testimonials a:after { width: 30px; height: 30px; right: 10px; top: 5px; background: url(images/icon_testimonials_white.svg) no-repeat center; background-size: auto 24px; position: absolute; content: ''; -webkit-transform: rotate(90deg); -moz-transform: rotate(90deg); transform: rotate(90deg); } /* --------------- RWD NAV --------------- */ #rwd_menu { margin-left: -50px; margin-right: -50px; padding: 30px; background: #e9eff5; border-bottom: 1px solid #86a2c4; display: none; position: relative; z-index: 10; } #rwd_menu p { margin-bottom: 20px; } #rwd_menu ul { height: auto !important; margin-bottom: 30px; } #rwd_menu ul li { margin: 0 !important; display: block !important; } #rwd_menu ul li a { padding: 5px 0; font-size: 30px !important; font-weight: 700; color: #1d1d1b; display: inline-block !important; } /* Phone */ #rwd_menu .phone { height: 50px; margin-left: 30px; padding-left: 60px; font-size: 18px; color: #2c2e35; line-height: 50px !important; display: inline-block; position: relative; } #rwd_menu .phone:hover { text-decoration: underline; } #rwd_menu .phone:before { width: 50px; height: 50px; left: 0; top: 0; background: #213043 url(images/icon_phone_white.svg) no-repeat center; background-size: auto 20px; position: absolute; content: ''; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } /* --------------- TOP BAR --------------- */ #top_bar { height: 40px; color: white; background: #86a2c4; } #top_bar .inner { height: 100%; } #top_bar .usps { height: 100%; font-size: 0; } #top_bar .usps .usp { width: auto !important; height: 100%; margin: 0 10px; padding: 0 0 0 40px !important; font-size: 16px !important; vertical-align: top; line-height: 40px; display: inline-block; } #top_bar .usps .usp .icon { width: 40px !important; height: 40px !important; left: 0; top: 0; margin: 0 !important; background-color: transparent !important; background-size: auto 24px !important; position: absolute; } /* ----------- USP ----------- */ .usps { font-size: 0; text-align: center; } .usps .usp { width: 25%; padding: 0 50px; font-size: 20px; vertical-align: top; display: inline-block; position: relative; } .usps .usp .icon { width: 80px; height: 80px; margin: 0 auto 10px; background-color: #fff4f4; background-repeat: no-repeat; background-position: center; background-size: auto 50px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; } .usps_in_cart { padding-bottom: 30px; } .usps_in_cart .usps .usp { font-size: 18px; } .patika { margin: 20px -20px 0; padding: 10px; font-size: 20px; font-weight: 900; font-style: italic; color: white; background: #86a2c4; } .patika img { width: auto; height: 40px; margin-right: 10px; vertical-align: top; display: inline-block; } .patika span { height: 40px; vertical-align: top; line-height: 40px; display: inline-block; } /* --------------- HEADER --------------- */ #header { width: 100%; height: 140px; padding-left: 100px; padding-right: 100px; z-index: 101; position: absolute; } #header .inner { max-width: none; height: 100%; } /* Logo */ #header .logo { width: 312px; height: 50px; left: 0; display: block; position: absolute; } #header .logo img { width: auto; height: 100%; display: block; } /* Action buttons */ #header .action_buttons { height: 50px; margin-left: 10px; } #header .action_buttons a { margin-left: 15px; padding: 0 20px; font-size: 19px; color: white; line-height: 50px; display: block; } #header .action_buttons a:hover { text-decoration: underline; } /* Menu */ #header ul.menu { height: 30px; font-size: 0; } #header ul.menu li { height: 100%; margin-left: 20px; vertical-align: top; display: inline-block; } #header ul.menu li a { height: 100%; font-size: 19px; color: #1d1d1b; line-height: 30px; display: block; } #header ul.menu li a:hover { text-decoration: underline; color: #ff7062; } /* Phone */ #header .phone { height: 50px; margin-left: 30px; padding-left: 60px; font-size: 22px; font-weight: 700; color: #2c2e35; line-height: 22px; position: relative; } #header .phone:hover { text-decoration: underline; } #header .phone:before { width: 50px; height: 50px; left: 0; top: 0; background: #213043 url(images/icon_phone_white.svg) no-repeat center; background-size: auto 20px; position: absolute; content: ''; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } #header .phone small { font-weight: normal; display: block; } /* Ajax cart */ #header .ajax_cart { width: 60px; height: 60px; margin-left: 30px; background: white url(images/icon_cart.svg) no-repeat center; background-size: auto 24px; -moz-box-shadow: 0 0 20px rgba(78,111,151,0.2); -webkit-box-shadow: 0 0 20px rgba(78,111,151,0.2); box-shadow: 0 0 20px rgba(78,111,151,0.2); } #header .ajax_cart:hover { -moz-box-shadow: 0 0 20px rgba(78,111,151,0.5); -webkit-box-shadow: 0 0 20px rgba(78,111,151,0.5); box-shadow: 0 0 20px rgba(78,111,151,0.5); } #header .ajax_cart .count { min-width: 26px; height: 26px; left: 40px; top: -7px; padding: 0 5px; font-size: 14px; text-align: center; color: white; line-height: 26px; background: #86a2c4; position: absolute; -webkit-border-radius: 13px; -moz-border-radius: 13px; border-radius: 13px; } /* RWD button */ #header .rwd_button { width: 50px; height: 50px; margin-left: 15px; font-size: 30px; background: white; border: 2px solid #2c2e35; position: relative; z-index: 2; cursor: pointer; } #header .rwd_button span { width: 100%; left: 0; top: 110%; font-size: 12px; text-align: center; line-height: 14px; position: absolute; } #header .rwd_button .burg { width: 30px; height: 2px; left: 8px; top: 23px; background: #2c2e35; display: block; position: relative; -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: #2c2e35; 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 { background: #ff7062; border-color: #ff7062; } body.rwd_menu__opened #header .rwd_button .burg { background: transparent; } body.rwd_menu__opened #header .rwd_button .burg:before { top: 0; background: white; -webkit-transform: rotate(45deg); } body.rwd_menu__opened #header .rwd_button .burg:after { top: 0; background: white; -webkit-transform: rotate(-45deg); } /* Fixed header */ body.fixed_header #header { height: 100px; top: 0; background: white; position: fixed; -moz-box-shadow: 0 0 20px rgba(0,0,0,0.3); -webkit-box-shadow: 0 0 20px rgba(0,0,0,0.3); box-shadow: 0 0 20px rgba(0,0,0,0.3); } /* -------------- SLIDER -------------- */ #slider { padding: 50px 0; background: url(images/bgr_slider.png) no-repeat right top; background-size: contain; } #slider .inner { height: 100%; } #slider .iframe_wrapper { height: 0; padding-bottom: 56.25%; padding-top: 25px; position: relative; } #slider .iframe_wrapper iframe { width: 100%; height: 100%; left: 0; top: 0; position: absolute; -moz-box-shadow: 0 30px 50px rgba(3,13,25,0.2); -webkit-box-shadow: 0 30px 50px rgba(3,13,25,0.2); box-shadow: 0 30px 50px rgba(3,13,25,0.2); } #slider .row .col_text { width: 45%; padding: 0 50px 0 0; vertical-align: middle; } #slider .row .col_text .title { font-size: 48px; color: #1d1d1b; line-height: 1.2; } #slider .row .col_text .title span { border-bottom: 2px solid #ff7062; display: inline-block; } #slider .row .col_text .subtitle { margin-bottom: 20px; padding-left: 15px; font-size: 14px; font-weight: 700; color: #1d1d1b; line-height: 18px; border-left: 5px solid #ff7062; } #slider .row .col_text .text { margin-top: 30px; font-size: 19px; color: #777; line-height: 30px; } #slider .row .col_text .button { margin-top: 30px; } #slider .row .col_video { width: 55%; position: relative; } #slider .row .col_video .alt_button { margin-top: 30px; text-align: center; } /* -------------------- BEFORE AFTER -------------------- */ #before_after { padding: 70px 0; border-top: 1px solid #e9eaed; } #before_after .text { font-size: 19px; color: #777; line-height: 30px; } #before_after .row { margin-bottom: 30px; } #before_after .col_carousel { position: relative; } #before_after .col_carousel:before { width: 107px; height: 123px; left: -70px; top: -25px; background: url(images/dots.png) no-repeat left top; position: absolute; content: ''; } #before_after .col_carousel .slick-slider { padding: 5px 5px 47px 5px; background: white; position: relative; -moz-box-shadow: 0 30px 50px rgba(0,0,0,0.2); -webkit-box-shadow: 0 30px 50px rgba(0,0,0,0.2); box-shadow: 0 30px 50px rgba(0,0,0,0.2); outline: none; } /* #before_after .col_carousel .slick-slider:before, #before_after .col_carousel .slick-slider:after { height: 40px; left: 30px; bottom: 30px; padding: 0 20px; font-size: 16px; font-weight: 700; text-transform: uppercase; color: #1d1d1b; line-height: 40px; background: white; position: absolute; content: 'Előtte'; z-index: 10; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; } #before_after .col_carousel .slick-slider:after { left: auto; right: 30px; content: 'Utána'; } */ #before_after .col_carousel .slick-arrow { width: 50%; width: calc(50% - 6px); height: 40px; left: 5px; bottom: 5px; text-indent: -9999px; background: #ff7062 url(images/icon_arrow_left_white.svg) no-repeat center; background-size: auto 24px; position: absolute; cursor: pointer; } #before_after .col_carousel .slick-arrow.slick-next { left: auto; right: 5px; background-image: url(images/icon_arrow_right_white.svg); } #before_after .col_carousel .carousel_instruction_text { margin-top: 20px; font-size: 15px; line-height: 20px; } #before_after .col_carousel .slick-list, #before_after .col_carousel .slick-track, #before_after .col_carousel .slick-slide { height: 100%; max-height: 442px; position: relative; z-index: 1; outline: none; } #before_after .col_carousel .slick-slide img { width: 100%; height: auto; display: block; } #before_after .col_text { padding-bottom: 30px; vertical-align: middle; } #before_after .col_text .wrapper { max-width: 500px; margin: auto; } #before_after .col_text .text { margin-top: 20px; } #before_after .col_text .text p { margin-bottom: 10px; } #before_after .col_text .text p:last-child { margin-bottom: 0; } /* ---------------------- YOUTUBE VIDEOS ---------------------- */ #youtube_videos { margin-bottom: 50px; } #youtube_videos .main_title { margin-bottom: 30px; } /* -------------------- HOW IT WORKS -------------------- */ #how_it_works { padding: 70px 0; background: #ccd9e9 url(images/woman.png) no-repeat right center; background-size: contain; position: relative; } #how_it_works:before { width: 107px; height: 123px; right: calc(((100% - 1400px) /2) - 110px); bottom: -75px; background: url(images/dots.png) no-repeat left top; position: absolute; content: ''; } #how_it_works a { text-decoration: underline; color: #000; } #how_it_works a:hover { text-decoration: none; } #how_it_works .main_title { margin-bottom: 30px; } #how_it_works .col_text { padding-right: 50px; } #how_it_works .col_text ul { margin-bottom: 30px; } #how_it_works .col_text ul li { margin-bottom: 14px; padding-left: 40px; position: relative; } #how_it_works .col_text ul li:last-child { margin-bottom: 0; } #how_it_works .col_text ul li:before { width: 30px; height: 30px; left: 0; top: -4px; font-size: 17px; text-align: center; color: #ccd9e9; line-height: 30px; background: #213043; position: absolute; content: '✔'; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } #how_it_works .col_image img { width: auto; height: 100%; max-height: 100%; margin: auto; display: block; } /* -------------- USPS 2 -------------- */ #usps_2 { padding: 70px 0; } #usps_2 .usps .usp { width: 16.6666666666%; } #usps_2 .usps .usp .icon { background-color: #ecd1d1 !important; } /* ------------------- INGRADIENTS ------------------- */ #ingredients { padding-bottom: 70px; } #ingredients a { text-decoration: underline; color: #000; } #ingredients a:hover { text-decoration: none; } #ingredients .inner { padding-top: 70px; border-top: 1px solid #ff7062; } #ingredients .main_title { margin-bottom: 30px; } #ingredients .ingredients { margin-left: -15px; margin-right: -15px; font-size: 0; } #ingredients .ingredients .ingredient { width: 20%; padding-left: 15px; padding-right: 15px; vertical-align: top; display: inline-block; } #ingredients .ingredients .ingredient .thumbnail { height: 160px; margin-bottom: 20px; background-color: #213043; background-repeat: no-repeat; background-position: center; background-size: cover; } #ingredients .ingredients .ingredient .title { margin-bottom: 10px; font-size: 20px; color: #1d1d1b; line-height: 1; } #ingredients .ingredients .ingredient .text { font-size: 18px; color: #1d1d1b; line-height: 26px; } #ingredients .accordions { margin-top: 50px; } #ingredients .accordions .accordion_header { color: #ff7062 !important; background-color: #FFCAC5 !important; } #ingredients .accordions .accordion_header.active { color: #1d1d1b !important; background-color: white !important; } /* --------------------------- SATISFIED CUSTOMERS --------------------------- */ #satisfied_customers { padding: 70px 0; } #satisfied_customers .main_title { margin-bottom: 30px; } #satisfied_customers .subtitle { margin-bottom: 20px; margin-top: -20px; font-size: 15px; } #satisfied_customers .satisfied_customers_carousel_wrapper { position: relative; } #satisfied_customers .satisfied_customers_carousel_wrapper .navigation { width: calc(20% + 300px); height: 70px; left: 50%; top: 50%; position: absolute; z-index: 10; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } #satisfied_customers .satisfied_customers_carousel_wrapper .arrow { width: 70px; height: 100%; left: 0; top: 0; background: #ff7062 url(images/icon_arrow_left_white.svg) no-repeat center; background-size: auto 30px; position: absolute; cursor: pointer; } #satisfied_customers .satisfied_customers_carousel_wrapper .arrow:hover { background-color: #213043; } #satisfied_customers .satisfied_customers_carousel_wrapper .arrow.next { left: auto; right: 0; background-image: url(images/icon_arrow_right_white.svg); } #satisfied_customers .slick-slider .slick-slide { position: relative; } #satisfied_customers .slick-slider .slick-slide img { width: 100%; height: auto; position: relative; z-index: 1; } #satisfied_customers .slick-slider .slick-slide .cover { width: 100%; height: 100%; left: 0; top: 0; background: rgba(33,48,67,0.6); position: absolute; z-index: 2; } #satisfied_customers .slick-slider .slick-slide.slick-current .cover { opacity: 0; } /* ------------- USAGE ------------- */ #usage { padding: 70px; } #usage .main_title { margin-bottom: 30px; } #usage .row .col_text { width: 50%; padding-right: 50px; } #usage .row .col_text p { margin-bottom: 30px; } #usage .row .col_text ul { margin-bottom: 30px; } #usage .row .col_text ul li { margin-bottom: 14px; padding-left: 40px; position: relative; counter-increment: my-counter; } #usage .row .col_text ul li:last-child { margin-bottom: 0; } #usage .row .col_text ul li:before { width: 30px; height: 30px; left: 0; top: -4px; font-size: 17px; text-align: center; color: white; line-height: 30px; background: #86a2c4; position: absolute; counter-increment: section; content: counter(my-counter); -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } #usage .row .col_video { width: 50%; position: relative; } #usage .row .col_video .iframe_wrapper { height: 0; padding-bottom: 56.25%; padding-top: 25px; position: relative; } #usage .row .col_video .iframe_wrapper iframe { width: 100%; height: 100%; left: 0; top: 0; position: absolute; -moz-box-shadow: 0 30px 50px rgba(3,13,25,0.2); -webkit-box-shadow: 0 30px 50px rgba(3,13,25,0.2); box-shadow: 0 30px 50px rgba(3,13,25,0.2); } #usage .row .col_video .alt_button { margin-top: 20px; text-align: center; } /* ---------------------------------- 30 DAY MONEY BACK GARANTEE ---------------------------------- */ #money_back_guarantee{ padding: 50px 0; background: #f1f5f9; } #money_back_guarantee .row { max-width: 1200px; margin: auto; } #money_back_guarantee .row .col_logo { width: 300px; padding: 20px 0; border-right: 1px dotted #213043; } #money_back_guarantee .row .col_logo img { margin: auto; display: block; } #money_back_guarantee .row .col_text { padding-left: 70px; font-size: 18px; vertical-align: middle; line-height: 26px; } #money_back_guarantee .row .col_text .main_title { margin-bottom: 10px; font-size: 40px !important; } /* ------------------- THE PRODUCT ------------------- */ #the_product { padding: 50px 0; } #the_product .countdown_text { padding: 10px 15px; font-size: 16px; line-height: 20px; background: #fff4f4; border-left: 5px solid #ff706; } /* ----------------- INSTAGRAM ----------------- */ #instagram { background: #213043; } #instagram .col_text { width: calc(((100% - 1400px) / 2) + 350px); height: 100%; padding-left: calc((100% - 1400px) / 2); padding-top: 30px; vertical-align: top; display: inline-block; } #instagram .col_text .main_title { font-size: 30px !important; color: white; line-height: 1 !important; } #instagram .col_images { width: calc(((100% - 1400px) / 2) + 1050px); vertical-align: top; display: inline-block; } #instagram .col_images ul { font-size: 0; } #instagram .col_images ul li { width: 16.6666666666%; vertical-align: top; display: inline-block; } #instagram .col_images ul li img { width: 100%; height: auto; display: block; } /* ----------- FAQ ----------- */ #faq { padding: 70px 0; } #faq .main_title { margin-bottom: 30px; } .accordions { max-width: 700px; margin: auto; } .accordions .accordion { margin-bottom: 10px; } .accordions .accordion_header { padding: 12px 50px 12px 20px; font-size: 18px; color: #213043; line-height: 20px; background: #fff4f4; position: relative; cursor: pointer; } .accordions .accordion_header.active { font-weight: 700; background: white; } .accordions .accordion_header:after { width: 20px; height: 20px; right: 20px; top: 50%; margin-top: -10px; background: url(images/icon_plus.svg) no-repeat center; background-size: auto 100%; position: absolute; content: ''; } .accordions .accordion_header.active:after { background-image: url(images/icon_minus.svg); } .accordions .accordion_content { padding: 20px; font-size: 17px; color: #777; line-height: 25px; display: none; } /* -------------------- ABOUT LAUMAR -------------------- */ #about_laumar { padding: 70px 0; } #about_laumar .row .col_images { position: relative; z-index: 2; } #about_laumar .row .col_images .image { background-repeat: no-repeat; background-position: center; background-size: cover; position: absolute; } #about_laumar .row .col_images .image_1 { width: calc(100% - 110px); left: 0; top: 100px; bottom: 100px; } #about_laumar .row .col_images .image_2 { width: 220px; height: 270px; right: 0; bottom: 80px; } #about_laumar .row .col_text { padding: 130px 0; background: #fff4f4; position: relative; z-index: 1; } #about_laumar .row .col_text:before { width: 50%; height: 100%; left: -50%; top: 0; background: #fff4f4; position: absolute; content: ''; } #about_laumar .row .col_text:after { width: 107px; height: 123px; right: -40px; bottom: 70px; background: url(images/dots.png) no-repeat left top; position: absolute; content: ''; } #about_laumar .row .col_text .main_title { max-width: 450px; margin: 0 auto 30px; } #about_laumar .row .col_text .text { max-width: 450px; margin: auto; } #about_laumar .row .col_text .text p { margin-bottom: 20px; font-size: 18px; color: #213043; line-height: 26px; } #about_laumar .row .col_text .text p:last-child { margin-bottom: 0; } /* --------------- CONTACT --------------- */ #contact .main_title { margin-bottom: 20px; } #contact .row {} #contact .row .col.col_contact_data { padding-right: 100px; } #contact .contact_field { margin-bottom: 20px; } #contact .contact_field span { margin-bottom: 10px; font-size: 16px; font-weight: 500; color: #777; display: block; } #contact .contact_field a { color: #213043; } #contact .contact_field a:hover { text-decoration: underline; } #contact .contact_field .has_icon { margin-bottom: 10px; padding-left: 30px; font-size: 20px; font-weight: 500; color: #213043; background-repeat: no-repeat; background-position: left center; background-size: auto 16px; display: block; } #contact .contact_field .has_icon.email { background-image: url(images/icon_envelope.svg); } #contact .contact_field .has_icon.address { background-image: url(images/icon_marker.svg); } #contact .contact_field .has_icon.phone { background-image: url(images/icon_phone.svg); } #contact .contact_field.info_box { font-size: 16px; color: #777; } #contact .join_us { padding-top: 40px; font-size: 17px; border-top: 3px solid #e9eaed; } #contact .join_us .button { margin-right: 20px; } #contact .join_us .join_us_text { margin-top: 20px; display: block; } /* ---------------------- BEFORE CONTENT ---------------------- */ #before_content { margin-bottom: 30px; padding: 10px 0; font-size: 15px; font-weight: 700; color: #1d1d1b; line-height: 20px; background: #fff4f4; } #before_content a { font-weight: normal; text-decoration: underline; color: #1d1d1b; } #before_content a:hover { text-decoration: none; } #before_content .fb-like { right: 0; top: 0; position: absolute; } /* ----------------- CONTAINER ----------------- */ #container { padding-top: 140px; } body.home { padding-top: 0; } body.page-template-landing #container { padding-top: 20px; } #container .main_title { font-size: 50px; color: #1d1d1b; line-height: 1; } #container .main_title.small { font-size: 30px; } /* Content */ #content { padding-bottom: 50px; } #content h1 { margin-bottom: 30px; font-size: 50px; color: #213043; line-height: 1; } #content h2 { margin-bottom: 20px; font-size: 30px; font-weight: 700; color: #ff7062; line-height: 1; } #content h3 { margin-bottom: 10px; font-size: 25px; font-weight: 700; color: #ff7062; line-height: 1; } #content p { margin-bottom: 20px; } #content a { text-decoration: underline; color: #000; } #content a:hover { text-decoration: none; } #content img { max-width: 100%; height: auto; } /* List */ #content ul { margin-bottom: 20px; margin-left: 20px; } #content ul li { list-style: disc; } /* Blog archive */ #content .blog_archive { margin-left: -20px; margin-right: -20px; font-size: 0; } #content .blog_archive article { width: 33.3333333333%; margin-bottom: 40px; padding-left: 20px; padding-right: 20px; vertical-align: top; display: inline-block; } #content .blog_archive article .thumbnail { margin-bottom: 20px; position: relative; } #content .blog_archive article .thumbnail img { width: 100%; height: auto; position: relative; z-index: 1; } #content .blog_archive article .thumbnail .datetime { height: 40px; left: 0; bottom: 0; padding: 0 20px; font-size: 16px; color: white; line-height: 40px; background: #ff7062; position: absolute; z-index: 2; } #content .blog_archive article .entry h3 { margin-bottom: 10px; } #content .blog_archive article .entry h3 a { font-size: 25px; text-decoration: none; color: #1d1d1b; line-height: 30px; } #content .blog_archive article .entry .excerpt { margin-bottom: 10px; font-size: 16px; color: #777; line-height: 25px; } #content .blog_archive article .entry .excerpt p { margin-bottom: 0 !important; } #content .blog_archive article .entry .read_more { font-size: 17px; font-weight: 700; text-decoration: underline; color: #1d1d1b; } #content .blog_archive article .entry .read_more:hover { text-decoration: none; } /* Iframe wrapper */ #content .iframe_wrapper { height: 0; margin-bottom: 30px; padding-bottom: 56.25%; padding-top: 25px; position: relative; } #content .iframe_wrapper iframe { width: 100%; height: 100%; left: 0; top: 0; position: absolute; } /* -------------- FOOTER -------------- */ #footer { font-size: 17px; color: white; background: #213043; } /* Footer top */ #footer .footer_top { padding: 70px 0; } #footer .footer_top .logos { margin-bottom: 50px; } #footer .footer_top .logos img { width: auto; height: 30px; margin: 0 10px; display: inline-block; } #footer .footer_top ul { font-size: 0; } #footer .footer_top ul li { margin: 0 10px; vertical-align: top; display: inline-block; } #footer .footer_top ul li a { font-size: 17px; color: white; line-height: 20px; } #footer .footer_top ul li a:hover { text-decoration: underline; } #footer .footer_top .contact { margin-top: 50px; } #footer .footer_top .contact a { color: white; } #footer .footer_top .contact p { margin-bottom: 10px; } #footer .footer_top .contact p:last-child { margin-bottom: 0; } /* Footer center */ #footer .footer_center { height: 20px; line-height: 20px; position: relative; } #footer .footer_center:before { width: 100%; height: 1px; left: 0; top: 50%; background: rgba(255,255,255,0.15); position: absolute; content: ''; z-index: 1; } #footer .footer_center span { height: 20px; padding: 0 20px; background: #213043; display: inline-block; position: relative; z-index: 2; } #footer .footer_center a { width: 50px; height: 50px; right: 100px; top: -15px; padding-top: 14px; background: white; position: absolute; z-index: 3; } #footer .footer_center a:hover { background: #86a2c4; } #footer .footer_center a svg { width: 16px; height: auto; fill: #86a2c4; } #footer .footer_center a:hover svg { fill: white; } /* Footer bottom */ #footer .footer_bottom { padding: 50px 0; font-size: 0; } #footer .footer_bottom a { width: 50px; height: 50px; margin: 0 5px; vertical-align: top; background-repeat: no-repeat; background-position: center; background-size: auto 20px; border: 1px solid rgba(134,162,196,0.4); display: inline-block; } #footer .footer_bottom a:hover { background-color: #86a2c4; } #footer .footer_bottom a.instagram { background-image: url(images/icon_instagram_white.svg); } #footer .footer_bottom a.facebook { background-image: url(images/icon_facebook_white.svg); } #footer .footer_bottom a.youtube-channel { background-image: url(images/icon_youtube_white.svg); background-size: auto 26px; } /* -------------- BARION -------------- */ #barion { padding: 10px 0; font-size: 16px; color: #777; line-height: 20px; } #barion img { max-width: 100%; height: auto; margin: auto; display: block; } /* ----------------- KEYFRAMES ----------------- */ @keyframes shake { 10%, 90% { -webkit-transform: translate3d(-2px, 0, 0); -ms-transform: translate3d(-2px, 0, 0); transform: translate3d(-2px, 0, 0); } 20%, 80% { -webkit-transform: translate3d(4px, 0, 0); -ms-transform: translate3d(4px, 0, 0); transform: translate3d(4px, 0, 0); } 30%, 50%, 70% { -webkit-transform: translate3d(-8px, 0, 0); -ms-transform: translate3d(-8px, 0, 0); transform: translate3d(-8px, 0, 0); } 40%, 60% { -webkit-transform: translate3d(8px, 0, 0); -ms-transform: translate3d(8px, 0, 0); transform: translate3d(8px, 0, 0); } } /* ------------------ RWD DESIGN ------------------ */ @media only screen and (max-width: 1600px) { /* HEADER */ #header { padding-left: 50px; padding-right: 50px; } /* HEADER: Logo */ #header .logo { width: 250px; height: 40px; } /* HEADER: Menu */ #header ul.menu li { margin-left: 15px; } #header ul.menu li a { font-size: 18px; } } @media only screen and (max-width: 1440px) { /* DISPLAY: None */ .hide_in_1440 { display: none !important; } /* DISPLAY: Block */ .show_in_1440 { display: block !important; } /* DEFAULT */ .p_l_30 { padding-left: 30px; } .p_r_30 { padding-right: 30px; } /* DEFAULT: Col */ .row > .col { font-size: 18px; } /* USP */ .usps .usp { font-size: 18px; line-height: 26px; } /* HEADER */ #header { height: 120px; padding-left: 30px; padding-right: 30px; background: white; } /* HEADER: Menu */ #header ul.menu li { margin-left: 10px; } /* SLIDER */ #slider .row .col_text { width: 50%; padding: 0 30px 0 0; } #slider .row .col_text .title { font-size: 40px; } #slider .row .col_text .text { margin-top: 20px; font-size: 18px; line-height: 26px; } #slider .row .col_video { width: 50%; } /* BEFORE AFTER */ #before_after .text { font-size: 18px; line-height: 26px; } /* USPS 2 */ #usps_2 .usps .usp { padding: 0 20px; font-size: 18px; } /* SATISFIED CUSTOMERS */ #satisfied_customers .satisfied_customers_carousel_wrapper .navigation { width: calc(33.3333333333% + 260px); height: 60px; } #satisfied_customers .satisfied_customers_carousel_wrapper .arrow { width: 60px; height: 60px; background-size: auto 20px; } /* INSTAGRAM */ #instagram .col_text .main_title { font-size: 25px !important; } #instagram .col_images ul li { width: 20%; display: none; } #instagram .col_images ul li:nth-child(-n+5) { display: inline-block; } /* ABOUT LAUMAR */ #about_laumar .row .col_text .main_title { max-width: 500px; } #about_laumar .row .col_text .text { max-width: 500px; } /* BEFORE CONTENT */ #before_content .fb-like { right: 20px; } /* CONTAINER */ #container { padding-top: 120px; } #container .main_title { font-size: 40px; } } @media only screen and (max-width: 1200px) { /* DISPLAY: None */ .hide_in_1200 { display: none !important; } /* DISPLAY: Block */ .show_in_1200 { display: block !important; } /* TOP BAR */ #top_bar .usps .usp.alt_usp { display: inline-block !important; } #top_bar .usps .main_usp { display: none !important; } /* HEADER */ #header { height: 100px; } /* HEADER: Action buttons */ #header .action_buttons a.buy_now { width: 50px; color: #2c2e35 !important; line-height: 23px; background-color: white !important; background-image: url(images/icon_cream.svg); background-repeat: no-repeat; background-position: center; background-size: auto 30px; border: 2px solid #2c2e35; position: relative; } #header .action_buttons a.buy_now span { width: 100%; left: -10px; top: 110%; font-size: 12px; text-align: center; color: #2c2e35 !important; line-height: 14px; position: absolute; } /* HEADER: Ajax cart */ #header .ajax_cart { width: 50px; height: 50px; margin-left: 20px; border: 2px solid #2c2e35; -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } #header .ajax_cart:hover { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } #header .ajax_cart .count { display: none !important; } #header .ajax_cart span { width: 100%; left: 0; top: 110%; font-size: 12px; text-align: center; color: #2c2e35 !important; line-height: 14px; position: absolute; } /* HEADER: Go to testimonials */ #header .go_to_testimonials_mobile { width: 50px; height: 50px; margin-left: 20px; background: url(images/icon_testimonials.svg) no-repeat center; background-size: auto 30px; border: 2px solid #2c2e35; position: relative; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } #header .go_to_testimonials_mobile:hover { -moz-box-shadow: none; -webkit-box-shadow: none; box-shadow: none; } #header .go_to_testimonials_mobile span { width: 100%; left: -8px; top: 110%; font-size: 12px; text-align: center; color: #2c2e35 !important; line-height: 14px; position: absolute; } /* BEFORE AFTER */ #before_after .row { margin-bottom: 0; display: block; } #before_after .row .col { display: block; } #before_after .row .col.col_carousel { width: 100%; max-width: 640px; margin-left: auto; margin-right: auto; } #before_after .row .col.col_text { width: 100%; padding-top: 30px; } #before_after .row .col.col_text .wrapper { max-width: none; } /* HOW IT WORKS */ #how_it_works .col_image img { max-height: 400px; } /* USPS 2 */ #usps_2 .usps .usp { width: 33.3333333333%; margin-bottom: 20px; } #usps_2 .usps .usp:nth-last-child(1), #usps_2 .usps .usp:nth-last-child(2), #usps_2 .usps .usp:nth-last-child(3) { margin-bottom: 0; } #usps_2 .usps .usp .icon { background-color: #ecd1d1 !important; } /* 30 DAY MONEY BACK GARANTEE */ #money_back_guarantee .row .col_text .main_title { font-size: 24px !important; } /* INGRADIENTS */ #ingredients .ingredients { width: 100%; max-width: 730px; margin-left: auto; margin-right: auto; } #ingredients .ingredients .ingredient { width: 50%; margin-bottom: 20px; } /* INSTAGRAM */ #instagram .col_text .main_title { font-size: 18px !important; } #instagram .col_images ul li { width: 25%; display: none !important; } #instagram .col_images ul li:nth-child(-n+4) { display: inline-block !important; } /* CONTAINER */ #container { padding-top: 100px; } #container .main_title { font-size: 30px; } } @media only screen and (max-width: 960px) { /* DISPLAY: None */ .hide_in_960, .usps_in_cart { display: none !important; } /* DISPLAY: Block */ .show_in_960 { display: block !important; } /* DEFAULT */ .p_l_30 { padding-left: 20px; } .p_r_30 { padding-right: 20px; } /* HEADER */ #header { height: 80px; padding-left: 20px; padding-right: 20px; } #header .inner { padding-left: 0; padding-right: 0; } /* HEADER: Action buttons */ #header .action_buttons { margin-top: -10px; } /* HEADER: Ajax cart */ #header .ajax_cart { margin-top: -10px; } /* HEADER: RWD button */ #header .rwd_button { margin-top: -10px; } /* HEADER: Fixed header */ body.fixed_header #header { height: 80px; } /* HEADER: Ajax cart */ #header .ajax_cart { line-height: 23px; } #header .ajax_cart span { top: 105%; } /* SLIDER */ #slider .row { display: block; } #slider .row .col_text { width: 100%; padding: 0 0 30px 0; display: block; } #slider .row .col_video { width: 100%; display: block; } /* USP */ .main_usps { margin-bottom: 30px; top: 0 !important; } .main_usps .usps .usp { width: 33.3333333333%; padding: 0 20px; } /* HOW IT WORKS */ #how_it_works { padding: 50px 0; background-image: none; } #how_it_works:before { display: none; } #how_it_works .row { display: block; } #how_it_works .col_text { width: 100%; padding-right: 0; } #how_it_works .col_imag { width: 30%; } #how_it_works .col_image img { max-width: 100%; max-height: 400px; } /* INGRADIENTS */ #ingredients { padding-bottom: 50px; } #ingredients .inner { padding-top: 50px; } /* USAGE */ #usage { padding: 50px 0; } #usage .row { display: block; } #usage .row .col_text { width: 100%; margin-bottom: 30px; padding-right: 0; display: block; } #usage .row .col_video { width: 100%; display: block; } /* INSTAGRAM */ #instagram .col_text { display: none; } #instagram .col_images { width: 100%; } /* FAQ */ #faq { padding: 50px 0; } /* ABOUT LAUMAR */ #about_laumar { padding: 50px 0; } #about_laumar .row { display: block; } #about_laumar .row .col_images { width: 100%; height: 400px; display: block; } #about_laumar .row .col_images .image_1 { width: 100%; top: 0; bottom: 0; } #about_laumar .row .col_images .image_2 { right: 20px; top: -20px; bottom: auto; } #about_laumar .row .col_text { width: 100%; padding: 30px 20px; display: block; } #about_laumar .row .col_text:before { display: none; } #about_laumar .row .col_text:after { display: none; } #about_laumar .row .col_text .main_title { max-width: none; margin: 0 auto 30px; } #about_laumar .row .col_text .text { max-width: none; } /* CONTACT */ #contact .row .col.col_contact_data { width: 100%; max-width: 700px; margin: 0 auto 30px; padding-right: 0; display: block; } #contact .row .col.col_contact_form { width: 100%; max-width: 700px; margin: auto; display: block; } /* CONTAINER */ #container { padding-top: 80px; } /* CONTENT: Blog archive */ #content .blog_archive article { width: 50%; } /* FOOTER: Footer top */ #footer .footer_top { padding: 50px 0; } } @media only screen and (max-width: 768px) { /* DISPLAY: None */ .hide_in_768 { display: none !important; } /* SLIDER */ #slider .row .col_text .title { font-size: 30px; } /* HOW IT WORKS */ #how_it_works { padding: 30px 0; } /* INGRADIENTS */ #ingredients { padding-bottom: 30px; } #ingredients .inner { padding-top: 30px; } /* USAGE */ #usage { padding: 30px 0; } /* 30 DAY MONEY BACK GARANTEE */ #money_back_guarantee{ padding: 30px 0; } #money_back_guarantee .row { display: block; } #money_back_guarantee .row .col_logo { width: 100%; margin-bottom: 30px; padding: 0; border-right: none; display: block; } #money_back_guarantee .row .col_text { width: 100%; padding-left: 0; display: block; } /* INSTAGRAM */ #instagram .col_images ul li { width: 33.3333333333%; display: none !important; } #instagram .col_images ul li:nth-child(-n+4) { display: none !important; } #instagram .col_images ul li:nth-child(-n+3) { display: inline-block !important; } /* FAQ */ #faq { padding: 30px 0; } /* CONTENT */ #content h1 { font-size: 40px; } /* FOOTER: Footer top */ #footer .footer_top { padding: 30px 0; } } @media only screen and (max-width: 640px) { /* DISPLAY: None */ .hide_in_640 { display: none !important; } .show_in_640 { display: block !important; } /* #place_order { display: none; } button#place_order_2 { color: white !important; background: #359d35 !important; }*/ /* STAMPED.IO */ .stamped-widget-drawer { display: none !important; } /* TOP BAR */ #top_bar .inner { padding-left: 10px !important; padding-right: 10px !important; } /* HEADER: Logo */ #header .logo { width: 190px; height: 30px; } /* USP */ .main_usps .usps .usp { padding: 0 10px; font-size: 16px; line-height: 20px; } .main_usps .usps .usp .icon { width: 60px; height: 60px; background-size: auto 32px; } /* HOW IT WORKS */ #how_it_works .col_text { width: 100%; display: block; } /* USPS 2 */ #usps_2 .usps .usp { width: 50%; margin-bottom: 20px !important; padding: 0 10px; } #usps_2 .usps .usp:nth-last-child(1), #usps_2 .usps .usp:nth-last-child(2) { margin-bottom: 0 !important; } /* INGRADIENTS */ #ingredients .ingredients .ingredient { width: 100%; padding-left: 0; padding-right: 0; display: block; } #ingredients .accordions { margin-top: 30px; } /* CONTENT */ #content h1 { font-size: 30px; } /* CONTENT: Blog archive */ #content .blog_archive { width: 100%; max-width: 480px; margin-left: auto; margin-right: auto; } #content .blog_archive article { width: 100%; margin-bottom: 30px; padding-left: 0; padding-right: 0; display: block; } /* FOOTER: Footer top */ #footer .footer_top ul li { margin: 10px 0; display: block; } } @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 { width: 100%; text-align: center; display: block; } /* TOP BAR */ #top_bar .usps .usp.alt_usp .title { font-size: 14px !important; } /* SLIDER */ #slider { padding-top: 20px; } #slider .row .col_text .title { font-size: 26px; line-height: 30px; } #slider .row .col_text .title span { display: inline-block; } /* HEADER: Logo */ #header .logo { width: 125px; height: 20px; } /* SLIDER */ #slider .row .col_text .button { width: 100%; text-align: center; display: block; } /* USP */ .main_usps .usps .usp { font-size: 11px; line-height: 14px; } /* HOW IT WORKS */ #how_it_works .col_text .button { width: 100%; text-align: center; display: block; } /* FOOTER: Footer top */ #contact .join_us .button { width: 100%; text-align: center; display: block; } /* FLIPCLOCK */ .clock { zoom: 0.6; } } @media only screen and (max-width: 320px) { /* TOP BAR */ #top_bar .usps .usp.alt_usp .title { font-size: 11px !important; } /* HEADER: Logo */ #header .logo { width: 90px; height: 14px; } /* USP */ .main_usps .usps .usp { padding: 0 5px; font-size: 11px; line-height: 14px; } /* SATISFIED CUSTOMERS */ #satisfied_customers .satisfied_customers_carousel_wrapper .navigation { width: 100%; height: 50px; left: 0; top: auto; bottom: -60px; -webkit-transform: translate(0); -ms-transform: translate(0); transform: translate(0); } #satisfied_customers .satisfied_customers_carousel_wrapper .arrow { width: 50px; height: 50px; } /* FLIPCLOCK */ .clock { zoom: 0.5; } } div.youtube { background-color: #000; margin-bottom: 30px; position: relative; padding-top: 56.25%; overflow: hidden; cursor: pointer; } .youtube img { width: 100%; top: -16.82%; left: 0; position: absolute; } table.shop_table.cart tbody tr td.product-quantity::before { display: inline-block !important; } .woocommerce button[name="update_cart"], .woocommerce input[name="update_cart"], .woocommerce .coupon { display: none !important; } .woocommerce-info:empty { display: none !important; } .posts-grid { display: flex; flex-wrap: wrap; gap: 30px; justify-content: space-between; } .post-box { background: #fff; border: 1px solid #ddd; border-radius: 8px; padding: 10px; width: calc(33% - 20px); /* 3 poszt egy sorban */ box-sizing: border-box; transition: box-shadow 0.3s; } .post-box:hover { box-shadow: 0 4px 15px rgba(0,0,0,0.1); } .post-thumbnail img { width: 100%; height: auto; border-radius: 5px; margin-bottom: 15px; } .post-title { font-size: 1.2rem; margin-bottom: 10px; } .post-excerpt { font-size: 0.95rem; margin-bottom: 15px; } .read-more { display: inline-block; padding: 8px 15px; background: #ff7062; color: #fff; border-radius: 4px; text-decoration: none; font-weight: 500; } /* Responsive: 2 poszt tabletre, 1 poszt mobilra */ @media (max-width: 992px) { .post-box { width: calc(50% - 15px); } } @media (max-width: 600px) { .post-box { width: 100%; } }