:root { --orange: #ff6600; --red: #ee2b2c; --text-color: #000000; --grey: #666666; --dark-grey: #353535; --in-basket: #ffd700; --brown: #52352c; --orange2: #db1928; --blue: #0369a1; --d: 2500ms; --angle: 90deg; --gradX: 10%; --gradY: 50%; --c1: rgba(255,128,0, 1); --c2: rgba(255,128,0, 0.1); --border: #A8A8A8; --btn-yellow: #ffd700; --green: #3f9d3d; --black: #000000; --white: #ffffff; --cyan: #109e81; --cyan-03: #379d8003; --cyan-08: #379d8008; --cyan-20: #379d8020; } h1,h2,h3,h4,h5,h6 {font-weight:unset;font-size:unset;padding:unset;margin:unset} html {height:100%; position:relative; font-size:1rem;font-family: "Arial", sans-serif;} body {margin:0;padding:0;;;background-color:#EFEFEF;background-image: url('/img/background.webp');background-position: top;background-size: cover;background-repeat: no-repeat } img {max-width:100%;height:auto} .container {max-width:1500px;width:100%;margin:0 auto;position: relative} .header {position: relative; width: 100%; min-height: 50px;top:0;z-index: 12;background-color: var(--orange);} .header.absolute {position: absolute} .header-phone a{text-decoration: none;color:var(--text-color)} .menu-squares{position: absolute;top:1px;right:20px;display: grid;grid-template-columns: 1fr 1fr 1fr;justify-content: center;align-items: center;z-index: 9;cursor: pointer;z-index:12} .menu-squares .sq{position: relative;width: 7px;height: 7px;background-color: var(--text-color);border-radius: 2px;margin: 4px;pointer-events: none;} .menu-squares i{color:var(--text-color);font-size: 2rem} .menu-start { position: relative;top:30px;z-index: 10} .menu-start ul { display: flex; list-style: none; height: 100%; align-items: center; justify-content: center;padding:0;margin:0} .menu-start li a{color:var(--text-color);text-decoration: none;margin: 0px} .nav-container {flex-basis: 100%;height:80px;position: relative} .dropdown-content {margin: auto;display:grid;justify-content: center;grid-template-columns: 1fr;} .drop:hover { background-color:white;} .drop:hover + .nav-hover-container { visibility:visible; opacity:1;} .drop-li:hover > .drop { background-color:#ff7f29;color:white;font-weight:bold} .drop-li.hovered { background-color:#ff7f29;color:white;font-weight:bold} .nav-container.hovered { background-color:#ff7f29;color:white;font-weight:bold} .drop-li:hover > .nav-hover-container { visibility:visible; opacity:1;} .nav-hover-container { display:block;transition:all 0.3s;;visibility:hidden; opacity:0;position: absolute;width:100%;;background-color:#ff7f29;;top:100%;} .dropdown-icon-link {padding: 15px 10px;color:white; text-decoration: none;font-size:1.2rem;cursor:pointer; align-items: center;} .dropdown-icon-link:hover {font-weight:bold} .dropdown-title {text-align: center} nav {display:block;position: relative;background-color:var(--orange);min-height:50px;top:0px;z-index: 11} nav .nav-container{display:flex;margin: auto;max-width:1500px;justify-content: space-between;align-items: center;height:60px;position: relative} nav .nav-item{color:var(--black);text-align: center;display: flex; align-items: center; justify-content: center;cursor:pointer;font-size:0.9rem;text-decoration: none;font-weight:600;padding: 0 20px;} nav .nav-item:hover {text-decoration: underline} nav .nav-item.btn-nav-category:hover {text-decoration: none} nav .nav-item.btn-nav-category{color:black;background-color:var(--white);padding:8px 5px; border-radius:5px;display: flex;flex-basis:250px} nav .nav-item.btn-nav-category span {flex-basis: 100%} nav .nav-item.btn-nav-category i.fa-bars {flex-basis: 10%} nav .nav-item.btn-nav-category i.fa-chevron-down {flex-basis: 10%} nav .nav-item.btn-free-dlv {background-color:#004ED3;color:var(--white);padding:10px;border-radius:5px;font-size:0.8rem} .user-nav-container { display: flex;grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;justify-content: center;align-items: center;} .user-nav-item2 {flex-basis: 100% ;padding: 0px 20px; text-decoration: none;color: var(--white);font-size:1.2rem;min-height: 50px; display: flex; justify-content: center; align-items: center;} .user-nav-item {flex-basis: 100% ;padding: 0px 0px; text-decoration: none;color: white;font-size:1.2rem;cursor:pointer;min-height: 50px; display: flex; justify-content: center; align-items: center;height:80px} .user-nav-item.active {background-color: white;color:RGBA(255,255,255,0.9);} .user-nav-item:hover {background-color: #ff7f29;color:white;font-weight:bold} .user-nav-item i{margin-right:10px} .logo {position:relative;display:inline-block;z-index: 10;} .logo img{max-width:250px} .logo a{font-size:2rem;color:var(--white);;text-decoration: none} .logo a span{color:var(--orange)} .grid-logo {display:grid;grid-template-columns: 1fr 2fr 1fr 1fr 1fr 1fr;padding: 0px 0 0 0; position: relative;background-color: var(--black);justify-content: center;align-items: center} input[name="search"] {border: 2px solid var(--cyan); border-radius: 5px 0 0 5px; padding: 10px 10px; width: 90%; font-size: 0.9rem; color: var(--text-color);} .btn-search {display:inline-block;background-color:var(--cyan);color:white;padding:10.8px 20px;font-size:1rem;;cursor: pointe;font-weight:500} .search-container {display: flex; justify-content: center; align-items: center;} .grid-logo i {color:var(--orange);font-size: 1.2rem;} .nav-top .top-text {color:var(--white);font-size:1rem} .header-phone {position: relative;color:var(--text-color);grid-gap: 10px;} .header-point {position: relative;color:var(--text-color);grid-gap: 10px;} .header-mail {position: relative;color:var(--text-color);grid-gap: 10px;justify-content: center} .header-login {position: relative;color:var(--text-color);grid-gap: 10px;justify-content: center} .basket-icon {position: absolute; top: 15px; right: 20px;} .basket-icon i{font-size:1.5rem;color:var(--white)} .basketCount {position: absolute; top: -10px; left: -10px; background-color: var(--orange); color: black; display: flex; justify-content: center; align-items: center; width: 20px; height: 20px; border-radius: 50%; font-size: 0.7rem;} .wcag_container {display: flex; justify-content: center; align-items: center; grid-gap: 10px;height:100%} .wcag_container .btn-font-size{border: 1px solid #666;padding: 3px 5px;border-radius: 3px;display: flex;justify-content:center;align-items: center;font-weight: bold;cursor: pointer;color:var(--white)} .wcag_container .btn-size-normal{font-size: 0.8rem;} .wcag_container .btn-size-bigger{font-size: 0.9rem;} .wcag_container .btn-size-biggest{font-size: 1rem;} .wcag_container .btn-contrast{cursor:pointer} .active-size {background-color:black;color:white} .language-box {position: relative;display: inline-block;z-index: 13;text-align: center;flex-basis: 20%} .language-box .text-white{color:white;font-size:1rem} .language-box .dropbtn { background-color: white; color: black;} .language-box .dropbtn-footer { background-color: transparent; color: var(--white); border: none; font-size: 1.2rem;width: 100%;} .language-box .dropbtn-footer:hover { background-color: #ff7f29; color: white; border: none; font-size: 1.2rem;width: 100%;} .language-box .dropbtn-footer i{ margin-right:10px} .language-box .dropdown-content-language { width: 200px;min-width:200px} .language-box header .container { } .dropdown-content-language { display: none; position: absolute; background-color: white; min-width: 380px;color:black; z-index: 1;right:0;box-shadow: 0 0 10px -4px black;border-radius: 10px;padding:20px;font-size: 1rem; text-align: left;z-index: 12} .show {display:block} .dropdown-content-language span { color: black; padding: 5px; text-decoration: none; display: block; cursor:pointer} .btn-lang.selected_lang {background-color: var(--grey);color:black;border-radius:5px} .btn-lang:hover {background-color: var(--grey);color:black;border-radius:5px} .nav-language-title {display:inline-block;padding:10px 0 10px 5px} .close-l-box {position: absolute; right: 10px; top: 4px;} .close-l-box i{font-size:1.2rem} .btn-lang img {padding:0 10px 0 0;vertical-align: middle} .slider_container {position: relative;;background-color: #072527} /* .slider_container .sliderBoxAppla {position: absolute;top:0;width:100%;height:100%;left:0;z-index: 2} .slider_container .sliderBoxAppla::after {position: absolute;width:100%;height:100%;content:"";background-image:url('/img/slider_appla.png');background-position: left top;background-size: contain;background-repeat: no-repeat;z-index: 1;top:0} */ .slider {position: relative;max-width:100%;margin:0 0 0 auto;color:black;line-height:0} .slider .slider-container {} .slider .slider-box-3 {display: grid !important; grid-template-columns: 54% 46%; grid-gap: 10px; width: calc(100% - 10px) !important; margin: 0 auto;} .slider .slider-box-3 img{max-width:100%} .slider .box-1{grid-row: 1/2 span;} .slider .sliderBox {;height:500px;background-position: center;background-repeat: no-repeat;background-size: cover;position:relative} .slider .sliderBoxContainer {position: relative;max-width:1500px; margin:8% auto 10px auto;z-index: 20;line-height: 100%} .slider .sliderBox .sliderTitle {font-size: 1.1rem; margin-bottom: 0px;color:var(--white)} .slider .sliderBox .sliderText1 {font-size: 4rem; margin-bottom: 20px; font-weight: 600;color: var(--white);line-height: 100%} .slider .sliderBox .sliderText2 {font-size: 1.6rem; margin-bottom: 0px; font-weight: 100;color:var(--white);line-height: 100%} .slider .sliderBox .sliderText3 {font-size: 2rem; color: var(--white); font-weight: 500;margin-top:10px} .slider .sliderBox .sliderText4 {font-size: 1.1rem; color: var(--white); font-weight: 500;margin-top:10px} .slider .sliderBox .sliderBtn {background-color:var(--cyan);color:white;;padding:10px 20px; ;font-size:1.2rem;display: inline-block;text-decoration: none;margin-top:30px} .slider .sliderBox .sliderBtn:hover {font-weight: bold} .slider .sliderBox .sliderBtnSlider {position: absolute;width:100%;height:100%;left:0;top:0} .slider .prev {position: absolute; left: 10px; top: calc(50% - 20px); z-index: 9; color: var(--white);} .slider .next {position: absolute; right: 10px; top: calc(50% - 20px); z-index: 9; color: var(--white);} .dashboard {position: relative;margin:20px auto } .dashboard .dashboard-box {margin-top:-100px;background-color:var(--white);padding:20px;min-height:210px;position: relative} .dashboard-box-title{font-size:2rem;font-weight:normal;text-align: left;margin-bottom:20px;color:black} .dashboard .dashboard-box-info {display:flex;justify-content: flex-start;align-items: flex-start;grid-gap:30px;min-height: 120px;} .dashboard img {max-height:100px} .dashboard .box-value {color:black;font-size:2.0rem;font-weight:bold;text-decoration: none} .dashboard .grid-inst-dash {display: grid; grid-template-columns: 70px 1fr ; grid-gap: 0 10px;align-items: center} .dashboard .grid-inst-dash a{text-align: center} .dashboard .grid-inst-dash .box-value{font-size:2.7rem} .dashboard .icon-container{position: absolute;top:20px;right:10px;width:60px} .dashboard .progress-info {font-size:0.8rem} .dashboard .progress-container {position: absolute;top:0;right:-60%;width: 90%;} .dashboard .progress-bar-container {width: 100%;height: 15px;background-color: transparent; border-radius: 8px; position: relative; overflow: hidden;border:1px solid black;padding:2px} .dashboard .progressAdd {margin-top:50px} .progress-bar { height: 100%; width: 0; text-align: center; line-height: 10px; color: white; border-radius: 8px;background-image: linear-gradient(90deg, #379d80 10px, transparent 0px); /*background-color: #4caf50;*/ background-size: 12px 100%;} .progress-text { position: relative; color: black;text-align: center;font-size:1rem} .btn-history-payoff {display: inline-block;font-size: 0.8rem;text-align: center;padding: 7px 20px;color: darkcyan;border: 1px solid darkcyan;cursor: pointer;position: relative;font-weight: normal;text-decoration: none;} .btn-history-payoff:hover { background-color: darkcyan;color:white} .progres-info-text {color:var(--cyan);margin-top:10px;} .grid-dashboad {display: grid; grid-template-columns: 1fr 1fr 1fr; justify-content: flex-start; align-items: flex-start; grid-gap: 20px;} .last-status-container {background-color:var(--white);padding:20px;} .supervisor-data {background-color:var(--white);padding:20px;border-radius:20px} .supervisor-data .supervisor-title{font-size:1.4rem;font-weight:bold;;margin-bottom:20px;color:var(--grey)} .supervisor-data span{font-weight:bold} .supervisor-data .supervisor-item{margin-bottom:8px} .news-container .title{font-size: 2.2rem; font-weight: bold; text-align: left; margin-bottom: 20px; color: black;} .news-container .news-title a{font-size:2rem;;margin-bottom:20px;color:black;text-decoration: none} .news-container .news-text {font-size:1rem;font-weight:normal;color:var(--grey);} .news-container .news-box {margin-bottom:20px;display: grid;grid-template-columns: 140px 1fr;grid-gap:20px} .news-container .news-foto{width: 140px; height: 100px; background-size: cover; background-repeat: no-repeat; background-position: center; margin: 0 20px 20px 0;} .news-container {background-color:var(--white);padding:20px;grid-column: 1/2 span;} .last-status-container .title{font-size:1.4rem;font-weight:bold;;margin-bottom:20px;color:black} .last-status-container .stats-name{font-size:1rem;font-weight:normal;;color:black;text-decoration: none;padding-right:10%} .last-status-container .stats-text {font-size:1.2rem;font-weight:normal;color:black;} .last-status-container .stats-box {margin-bottom:20px} .contact_container {position: relative;;background-color: var(--white);padding:20px 0} .contact {position: relative;max-width:1100px; margin:20px auto 0 auto} .contact .grid-contact {display: grid; grid-template-columns: 30% calc(70% - 50px); justify-content:flex-start; align-items: flex-start;grid-gap:0 50px ;} .contact .grid-contact-icon {display: grid; grid-template-columns: 20% 80%; justify-content: flex-start; align-items: center; margin-bottom:10px;border-bottom:1px solid #cecece; padding-bottom:10px} .contact .grid-contact-icon i {font-size:1.2rem;color:#616161} .contact .contact-right {background-color:#ebebeb;padding:20px} .contact .section-title {font-size:1.2rem;font-weight:bold;margin-bottom:10px} .form-input {position: relative;margin:10px 0;color:#cecece;font-size:0.9rem} .form-label {position: absolute;top: 50%; transform: translateY(-50%);left:10px;transition: all 0.2s;} .form-input input::placeholder { color: transparent;} .form-input input{ padding: 10px;width:calc(100% - 20px);border:1px solid var(--cyan);font-size:0.9rem} .form-input input:focus{ border:2px solid var(--cyan) !important;box-shadow:unset} .form-input input:placeholder-shown ~ .form-label{position: absolute;top: 50%; transform: translateY(-50%);left:10px;transition: all 0.2s; } .form-input input:not(:placeholder-shown) ~ .form-label{ position: absolute; top: 0; display: block; transition:all 0.2s; color: black; background-color: var(--white); padding: 0 5px; border-radius: 5px;font-size:0.8rem} .form-input input:focus ~ .form-label { position: absolute; top: 0; display: block; transition:all 0.2s; color: black; background-color: var(--white); padding: 0 5px; border-radius: 5px;font-size:0.8rem} .grid-form { display: grid;grid-template-columns: 1fr 1fr;justify-content: flex-start;align-items: flex-start;grid-gap:0 20px } .form-input input[name="agree"] {width:20px} .form-input input[name="agree"].required {border:1px solid red} .form-input .requiredCheckbox {border:1px solid red} .form-input span {color:black} .form-input select { width:100%} .form-input select::placeholder { color: transparent;} .form-input select{ padding:10px;} .form-input select:focus{ border:2px solid #00e42e !important;box-shadow:unset} .form-input select:placeholder-shown ~ .form-label{position: absolute;top: 50%; transform: translateY(-50%);left:10px;transition: all 0.2s; } .form-input select:not(:placeholder-shown) ~ .form-label{ position: absolute; top: 0; display: block; transition:all 0.2s; color: black; background-color: white; padding: 0 5px; border-radius: 5px;font-size:0.8rem} .form-input select:focus ~ .form-label { position: absolute; top: 0; display: block; transition:all 0.2s; color: black; background-color: white; padding: 0 5px; border-radius: 5px;font-size:0.8rem} .flex label {left:80px} .form-input textarea{width:calc(100% - 5px);height:200px;border-radius:5px;border:1px solid var(--border)} .form-input label{font-size:1.0rem;color:#cecece;font-family: "Arial"} .form-input textarea::placeholder{font-size:1.0rem;color:#cecece;font-family: "Arial"} .form-input textarea:focus-visible{outline: 2px solid #00e42e;} .form-input select{width:calc(100% - 0px);border:1px solid var(--border);padding:10px 6px;;background-color:white;font-size: 0.9rem;} .form-input select.phone_prefix {display: inline-block; width: 70px; margin-right: 5px;} .inst_name_icon {position: absolute;background-color:var(--cyan);padding:5px;border-radius:8px;left:8px;top:10px;width:30px;height:30px} .inst_name_icon img{max-width:100%} .step_1 .form-input input:placeholder-shown ~ .form-label{;left:60px;} .step_1 .form-input input{padding:20px 10px 20px 60px;width: calc(100% - 70px);} .step_1 .form-input select:placeholder-shown ~ .form-label{;left:60px;} .step_1 .form-input select{padding:20px 10px 20px 60px;width:100%;} .step_2 .form-input input:placeholder-shown ~ .form-label{;left:60px;} .step_2 .form-input input{padding:20px 10px 20px 60px;width: calc(100% - 70px);} .step_2 .form-input .selectDist::after{position: absolute;content:'\f077';width:20px;height:20px;right:10px;top:10px;color:var(--cyan);font-family: "Font Awesome 6 Free"; font-weight: 900; } .step_2 .form-input .selectDist::before{position: absolute;content:'\f107';width:20px;height:20px;right:10px;bottom:10px;color:var(--cyan);font-family: "Font Awesome 6 Free"; font-weight: 900; } .step_3 .form-input input{padding:20px 10px 20px 60px;width: calc(100% - 70px);} .step_3 .file-input { display: none; } .step_3 .btn-load-invoice {position: relative;background-color:transparent;color:var(--cyan);border:2px solid var(--cyan);padding:20px 20px; cursor:pointer;text-decoration: none;font-weight:bold;display:block} .step_3 .btn-load-invoice:hover {position: relative;background-color:var(--cyan);color:white;border:2px solid var(--cyan);padding:20px 20px; cursor:pointer;text-decoration: none;font-weight:bold;display:block} .step_3 .btn-load-invoice i {font-size:1.2rem} .step_3 .btn-load-invoice:hover { } .step_3 .form-input input:placeholder-shown ~ .form-label{;left:60px;} .step_3 .btn-load-preview {position: relative;background-color:transparent;color:var(--cyan);border:2px solid var(--cyan);padding:20px 20px;cursor:pointer;text-decoration: none;font-weight:bold;display:block} .step_3 .btn-load-preview:hover {position: relative;background-color:var(--cyan);border:2px solid var(--cyan);color:white;padding:20px 20px; ;cursor:pointer;text-decoration: none;font-weight:bold;display:block} .step_3 .btn-load-preview i {font-size:1.2rem} .step_3 .btn-load-preview:hover { } .contact-title{font-weight:600} .contact-text{font-weight:400;font-size:0.9rem;margin-top:5px} .btn-send{width: 200px; background-color: var(--orange); text-align: center; padding: 10px; border-radius: 5px; margin: 0 0 0 auto;} .id_aggre{position: absolute; top: 25px; left: 7px; background-color: white; color: red; padding: 0px 10px; font-size: 0.8rem;} .banners_container {position: relative;;background-color: transparent} .banners.banners_category {position: relative;max-width:1500px; margin:25px auto 25px auto} .banners {position: relative;max-width:100%;margin:0 0 0 auto;color:black;} .banners .bannersBox {;height:230px;background-position: center;background-repeat: no-repeat;background-size: cover;padding:20px;border-radius:10px} .banners .bannersBoxContainer {position:relative;z-index:1;height:100%} .banners .bannersBox .bannersTitle {font-size: 1.1rem; margin-bottom: 20px;color:white} .banners .bannersBox .bannersText1 {font-size: 2.6rem; margin-bottom: 0px; font-weight: 900;color:white} .banners .bannersBox .bannersText2 {font-size: 2.6rem; margin-bottom: 0px; font-weight: 900;color:var(--orange)} .banners .bannersBox .bannersText3 {font-size: 1.5rem; color: var(--white); font-weight: 700;position: absolute;bottom:20px} .banners .bannersBox .bannersBtn {background-color:var(--orange);color:white;padding:10px 20px; border-radius:5px;font-size:1.2rem;display: inline-block;text-decoration: none;margin-top:30px;} .banners .bannersBox{ position: relative} .banners .size50{ display: grid; grid-template-columns: 1fr 1fr; justify-content: center; align-items: center; grid-gap: 20px;} .banners .size33{ display: grid; grid-template-columns: 1fr 1fr 1fr; justify-content: center; align-items: center; grid-gap: 20px;} .banners .size25{ display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; justify-content: center; align-items: center; grid-gap: 20px;} .banners .size20{ display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr; justify-content: center; align-items: center; grid-gap: 20px;} .banners .size100{ display: grid; grid-template-columns: 1fr ; justify-content: center; align-items: center; grid-gap: 20px;} .section-category {max-width:1500px;margin:50px auto;background-color:white;padding:20px 0;} .section-category .title{font-size:1.2rem;text-align: center;font-weight:bold} .section-category .category-grid{display: grid;grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;grid-gap:10px;padding:10px} .section-category .category-item{display:block;padding:10px;border-radius:5px} .section-category .category-item .icon{font-size:3rem;text-align: center;min-height:91px} .section-category .category-item .name{font-size:1rem;text-align: center} .section-category .category-item .icon img{max-height:80px} .categoryImg {max-width:50%} .section-products-module {max-width:1500px;margin:50px auto;background-color:white;padding:20px 0;position: relative;border-radius: 5px;} .section-products-module .section-title{font-size:1.2rem;font-weight:bold;text-align: center;margin-bottom:20px} .section-products-module .section-title span{color:var(--orange)} .section-products-module .section-items{display: flex;justify-content: center;align-items: center;;} .section-products-module .products-module{border:1px solid #cecece;text-decoration: none;padding-bottom:10px;border-radius:5px} .section-products-module .products-module-foto {padding:20px;min-height:170px;text-align: center} .section-products-module .products-module-foto img{max-width:100%;max-height:170px;} .section-products-module .products-module-title {min-height:85px;padding:0 10px;-webkit-line-clamp: 3; -webkit-box-orient: vertical; display: -webkit-box;color:black;font-weight:600;margin-bottom:10px } .section-products-module .products-module-content {text-align: left} .section-products-module .products-module-price {text-align: left;color: var(--orange); font-size: 1.2rem;font-weight: bold;text-decoration: none;padding:0 10px} .section-products-module .btn-item-details {background-color:var(--orange);color:white;font-weight:bold;text-align: center;width:calc(100% - 40px);padding:10px;display:inline-block;margin-left:10px;border-radius:5px;margin-top:10px} .section-products-module .slick-slide {margin: 0 10px;} .section-products-module .slick-list { margin: 0 -10px; } .section-products-module .slick-slider { width:95% ;margin:0 auto} .section-products-module .slick-slide img { display: inline-block;} .line-thru {color:black;font-size:0.8rem;text-decoration-line: line-through;margin-right:10px} .section-news-module {max-width:1500px;margin:50px auto;background-color:white;padding:20px 0;position: relative;border-radius: 5px;} .section-news-module .section-title{font-size:1.2rem;font-weight:bold;text-align: center;margin-bottom:20px} .section-news-module .section-title span{color:var(--orange)} .section-news-module .section-items-news{display: flex;justify-content: center;align-items:flex-start;;grid-gap:20px;padding:0 20px} .section-news-module .news-module{flex-basis: 100%; border:1px solid #cecece;text-decoration: none;padding-bottom:10px;border-radius:5px} .section-news-module .news-module-foto {padding:20px;min-height:170px;text-align: center;background-position: center;background-size: cover;background-repeat: no-repeat} .section-news-module .news-module-foto img{max-width:100%;max-height:170px;} .section-news-module .news-module-title {min-height:40px;padding:0 10px;-webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box;color:black;font-weight:600;margin-bottom:10px } .section-news-module .news-module-short {color:black;font-weight:300;margin-bottom:10px ;min-height:40px;padding:0 10px} .section-news-module .news-module-content {text-align: left} .section-news-module .btn-item-details {background-color:var(--orange);color:white;font-weight:bold;text-align: center;width:calc(100% - 40px);padding:10px;display:inline-block;margin-left:10px;border-radius:5px;margin-top:10px} .news .section-items-news {display:grid;grid-template-columns: 1fr;justify-content: flex-start;align-items: flex-start;grid-gap:20px;border-bottom:1px solid #cecece;margin-bottom:10px; padding-bottom:10px} .news .section-items-news-list {display:grid;grid-template-columns: 200px 1fr;justify-content: flex-start;align-items: flex-start;grid-gap:20px;border-bottom:1px solid #cecece;margin-bottom:10px; padding-bottom:10px} .news .news-module-foto {min-height:150px;background-position: center;background-size: cover;background-repeat: no-repeat} .news .btn-item-details {background-color:var(--orange);color:white;font-weight:bold;text-align: center;width:200px;padding:10px;display:inline-block;border-radius:5px;margin-top:10px;text-decoration: none} .news .news-module-title {font-weight:bold;font-size:1.2rem;margin-bottom:10px} .news .section-title{font-size:1.2rem;font-weight:bold;margin:20px 0} .products .container {max-width:1500px;margin:20px auto;background-color:white;padding:20px;position: relative;} .products .section-items-products {display:grid;grid-template-columns: 200px auto;justify-content: flex-start;align-items: flex-start;grid-gap:20px;border-bottom:1px solid #cecece;margin-bottom:10px; padding-bottom:10px} .products .products-module-foto {min-height:150px;background-position: center;background-size: cover;background-repeat: no-repeat} .products .btn-item-details {background-color:var(--orange);color:white;font-weight:bold;text-align: center;width:200px;padding:10px;display:inline-block;border-radius:5px;margin-top:10px;text-decoration: none} .products .products-module-title {font-weight:bold;font-size:1.2rem;margin-bottom:10px} .products .section-title{font-size:1.2rem;font-weight:bold;margin:20px 0} .red-text {color:red;font-weight:bold;} .gm-ui-hover-effect { outline: none !important; box-shadow: none !important; border: none !important; } .gm-ui-hover-effect > span { background: black !important; } .workshop_details {display:grid;grid-template-columns: 30% 70%;grid-gap:20px;justify-content: flex-start;align-items: flex-start;padding:20px 0} .prevItem, .nextItem { display: inline-block;color: black;cursor: pointer;z-index: 9;position: absolute; top: 45%; background-color: white; border-radius: 50%; box-shadow: 0 0 29px -4px #b6a7a7; padding: 10px;} .prevItem {left:-20px;} .nextItem {right: -20px;} .btn-yellow-std {display: inline-block;text-align: center;padding: 8px 20px;color: black;background-color: var(--btn-yellow);border-radius: 5px;cursor: pointer;min-width: 100px; position: relative;font-size: 0.8rem;} .btn-yellow-std:hover {background-color:var(--btn-yellow);color:black;} .btn-orange-ghost{display:inline-block; text-align: center;padding:8px 15px; color:orange; border-radius:5px;cursor:pointer;position:relative; border:1px solid orange;font-size:1rem;font-weight:normal} .btn-orange-ghost:hover { } .btn-black-small{display:inline-block; color:black; cursor:pointer;position:relative; font-weight:normal;text-decoration: none} .btn-black{display:inline-block; color:black; cursor:pointer;position:relative; font-size:1rem;font-weight:normal;text-decoration: none} .btn-black:hover { } .btn-cyan-ghost-small {display: inline-block;font-size: 0.8rem;text-align: center;padding: 7px 0px;color: var(--cyan);border-radius: 5px;border: 1px solid var(--cyan);cursor: pointer;min-width: 150px;max-width:200px; width:100%;position: relative;font-weight: normal;text-decoration: none;} .btn-cyan-ghost-small:hover { background-color: var(--cyan);color:white} .btn-red-ghost-small {display: inline-block;font-size: 0.8rem;text-align: center;padding: 7px 0px;color: var(--red);border-radius: 5px;border: 1px solid var(--red);cursor: pointer;min-width: 150px;max-width:200px; width:100%;position: relative;font-weight: normal;text-decoration: none;} .btn-red-ghost-small:hover { background-color: var(--red);color:white} .logon {height: 90%;padding:20px} .login.recov-container {max-width:60%} .login .title {padding:10px; font-size:1.5rem;font-weight:bold; text-align: center} .login .form-input {margin:15px 0 } .login input {border: 1px solid #cecece; padding: 10px; font-size: 1.2rem; color: #333; width: calc(100% - 20px);} .login .form-content {max-width: 80%; margin: 0 auto;padding:20px} .login .login-remember {position: relative;left: 45%;text-align: left;} .login .login-remember label{text-align: left;margin-left:10px;font-size:0.8rem;} .login .remember-me {width:auto} .login .login-buttons {text-align: left} /*.login div {text-align: right;}*/ .login .login-info {font-size:0.8rem; ; margin-top:20px} .login .register-info {position:relative; padding:10px; border-radius:10px; border:3px solid var(--cyan); width:100%; text-align: center} .login .register-info a{font-size:1rem} .login .steps-box { position: relative; perspective: 1000;display: block;width: 100%;height: 100%;top: 0;} .login .logon-steps { transform-style: preserve-3d; transition: all ease-in-out 0.4s;height:100%} .login .changeToPass { transform: rotateY(180deg); } .login .changeToPass2 { transform: rotateY(0deg) !important; z-index:4 } .login .logon-step-one { position: absolute; width: 100%; height: 100%; backface-visibility: hidden;} .login .logon-step-two{transform: rotateY(180deg); position: absolute; width: 100%; height: 100%; backface-visibility: hidden;z-index:3} .login .logon-step-two-email{transform: rotateY(180deg); position: absolute; width: 100%; height: 100%; backface-visibility: hidden;z-index:3} .login .logon-step-three{transform: rotateY(180deg); position: absolute; width: 100%; height: 100%; backface-visibility: hidden;z-index:2} .login .login-container-left {display: block;position: relative;height: 100%;width:100%;margin: 0 0 0 auto;} .login .login-email-box {width: 58%;position: relative;display: inline-block;border-radius: 5px;border: 1px solid darkgray;} .login .login-phone-box {width: 100%;position: relative;display: inline-block;border-radius: 5px;border: 1px solid darkgray;} .login .login-sms-box {width: 100%;position: relative;display: inline-block;border-radius: 5px;border: 1px solid darkgray;} .login .viewPass {position:absolute;right: 10px; top: 10px; font-size:1.5rem;z-index:99;cursor:pointer;color:var(--cyan)} .login #a_login img {max-width: 100%} .login .btn-text-blue {color:var(--cyan);font-size:1rem;text-decoration: none} .login .btn-text-black {color:black;} .login .viewPass:hover {color:black;} .login .remember-me-box label {padding-left:0;font-size: 0.8rem;;width:100%;text-align: right} .login .remember-me-box label input{width:30px; margin:0; padding:0;display:inline-block} .grid-login { display: grid; grid-template-columns: 28% 70%; align-items: flex-start;grid-gap:2%} .btn-login {background-color: var(--cyan); border: none; padding: 10px 20px; color: white; font-size: 1.0rem; min-width: 250px;margin-top:15px;cursor: pointer} .grid-log-reg {display:grid;grid-template-columns: 1fr 1fr; grid-gap:20px;width:80%; margin:0 auto} .btn-title-log {padding: 10px; font-size: 1.5rem; font-weight: bold; position: relative;display:inline-block;cursor:pointer} .btn-title-log.active::after {content:"";position: absolute;bottom:0;width:100%;height:2px;background-color: var(--cyan);left:0;transition: all 0.5s;} .btn-title-reg {padding: 10px; font-size: 1.5rem; font-weight: bold;text-align: right;display:inline-block;cursor:pointer;position: relative} .btn-title-reg.active::after {content:"";position: absolute;bottom:0;width:100%;height:2px;background-color: var(--cyan);left:0;transition: all 0.5s;} /* .login .form-input {position: relative;margin:15px 0;color:#cecece} .login .form-label {position: absolute;top: 50%; transform: translateY(-50%);left:10px;transition: all 0.2s;} .login .form-input input::placeholder { color: transparent;} .login .form-input input{ padding:10px;border-radius: 5px;} .login .form-input input:focus{ border:2px solid #00e42e !important;box-shadow:unset} .login .form-input input:placeholder-shown ~ .form-label{position: absolute;top: 50%; transform: translateY(-50%);left:10px;transition: all 0.2s; } .login .form-input input:not(:placeholder-shown) ~ .form-label{ position: absolute; top: 0; display: block; transition:all 0.2s; color: black; background-color: white; padding: 0 5px; border-radius: 5px;font-size:0.8rem} .login .form-input input:focus ~ .form-label { position: absolute; top: 0; display: block; transition:all 0.2s; color: black; background-color: white; padding: 0 5px; border-radius: 5px;font-size:0.8rem} */ .section-products-list {width:1400px; margin:20px auto;background-color:white;padding:50px;position: relative} .section-products-list .logo-solar {position: absolute;top:45px;right:40px} .section-products-list .type-text {position: relative;padding:20px 25% 20px 0;font-size:1.2rem;line-height: 150%;} .section-products-list .nav-settings {margin-top:30px} .grid-product {} .product-img img{max-width:100%} .products-list-container {display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1fr;justify-content: flex-start;align-items: center;grid-gap:50px;width:90%} .btn-title {color:black;font-size:1.0rem;font-weight: normal;text-decoration: none} .btn-title:hover {color:var(--orange)} .products-list-name {font-size:4rem;margin:0;font-weight:500} .section-products-list .nav-settings {display:block;} .section-products-list .nav-box.active::after {content:"";position: absolute;bottom:0;width:100%;height:2px;background-color: var(--cyan);left:0;transition: all 0.5s;} .section-products-list .nav-box {display:inline-block; padding:10px 0 ;color:black;font-size:1.6rem;text-align: center;position: relative;cursor:pointer;margin-right:50px;font-weight: bold} .section-products-list .nav-box::after {content:"";position: absolute;bottom:0;width:0%;height:2px;background-color: var(--cyan);left:0;transition: all 0.5s;} .section-products-list .nav-box:hover::after {content:"";position: absolute;bottom:0;width:100%;height:2px;background-color: var(--cyan);left:0} .section-products-list .sec {text-align: center} .section-products-list .sec img{max-height:200px;max-width:100%} .register {height: 90%;padding:20px} .register .form-input{margin:15px 0} .register .title {padding:10px ; font-size:1.5rem;font-weight:bold; text-align: center } .register input {border:1px solid #cecece; padding:10px; font-size:1.2rem; color: #333;;width:calc(100% - 20px)} .register .form-content {max-width: 80%; margin: 0 auto;padding:20px} .register p {margin:0; padding:0;position:relative} .register .input-loader {position:absolute;display:none;text-align: left;top:15px;right:20px} .register .input-loader img {max-width:30px;} .register .checker {position: relative;text-align: left;} .register .checker label{margin-right:5%} .register .check-login-info {display:none; position:relative; font-size:0.8rem;} .register .check-email-info {display:none; position:relative; font-size:0.8rem; text-align: left;margin-left: 0%; color: green;} .register .pass-strong {display: none;position: relative;margin-left: 0%;font-size: 0.6rem;text-align: left;} #strength_score {display:inline-block;position:relative; font-size:0.6rem; } .register .error-info {position:relative; color:red;; font-size:0.8rem;display: block; } .register .newsletter {position: relative;text-align: right;margin:10px 0} .register .newsletter label{text-align: left; width:auto; margin-left:10px;font-size:0.8rem;} .register .subscribe-newsletter {width:auto} .register .register-info {font-size:0.8rem; ; margin-top:20px;text-align:right} .register .btn-check {font-size:0.8rem; ; position:absolute; right:10px; background-color:gray; color:white;top: 27%;padding: 8px;border-radius: 10px;cursor:pointer} .register .btn-check:hover {background-color:var(--light-blue)} .register .r_ok {background-color:var(--user)} .register .r_no {background-color:var(--red)} .register .r_no:hover {background-color:var(--red); cursor:unset} .register .r_ok:hover {background-color:var(--user); cursor:unset} .register .viewPass {position:absolute;right: 10px; top: 10px; font-size:1.5rem;z-index:9;cursor:pointer} .register .recomended {color:black;font-size:1.0rem;font-weight: bold; cursor:pointer} .register .register-buttons {text-align: left;margin-top:20px} .btn-register {background-color: var(--cyan); border: none; padding: 10px 20px; color: white; font-size: 1.0rem; min-width: 250px;cursor:pointer} .register .regulation-check {width:20px;height:20px} .register .regulation {display:grid;grid-template-columns: 20px 1fr;grid-gap:20px;border-top:1px solid #cecece;padding-top:5px; margin-top:5px;font-size:0.9rem} .register .regulation label {width:100%;text-align: left} .register .regulation .btn-text-blue {font-size: 0.9rem} .register .progress-bar {width: 100%;height: 5px;background-color: #eee;border-radius: 5px;margin-bottom: 15px;overflow: hidden;background-image: linear-gradient(90deg, #b3b3b3 10px, transparent 0px);} .register .progress {height: 100%;width: 0%;transition: width 0.3s;} .red { background-color: red; } .orange { background-color: orange; } .yellow { background-color: gold; } .green { background-color: var(--cyan); background-image: linear-gradient(90deg, var(--cyan) 10px, transparent 0px);} .register ul {list-style: none;padding: 0;} .register li {margin-bottom: 5px;color: #888;display: inline;margin-right:4px} .register li.valid {color: green;font-weight: nomal;} .register #passwordRules {font-size:0.55rem} /* .register .form-input {position: relative;margin:15px 0;color:#cecece} .register .form-label {position: absolute;top: 50%; transform: translateY(-50%);left:10px;transition: all 0.2s;} .register .form-input input::placeholder { color: transparent;} .register .form-input input{ padding:10px;border-radius: 5px;} .register .form-input input:focus{ border:2px solid #00e42e !important;box-shadow:unset} .register .form-input input:placeholder-shown ~ .form-label{position: absolute;top: 50%; transform: translateY(-50%);left:10px;transition: all 0.2s; } .register .form-input input:not(:placeholder-shown) ~ .form-label{ position: absolute; top: 0; display: block; transition:all 0.2s; color: black; background-color: white; padding: 0 5px; border-radius: 5px;font-size:0.8rem} .register .form-input input:focus ~ .form-label { position: absolute; top: 0; display: block; transition:all 0.2s; color: black; background-color: white; padding: 0 5px; border-radius: 5px;font-size:0.8rem} */ .steps {max-width:50%;margin:0 auto 50px auto} .step-container {display: flex;justify-content: space-between;position: relative;} .step-container .stepper-item {display: flex;flex-direction: column;align-items: center; position: relative;width:100%;cursor:pointer} .step-counter {width: 30px;height: 30px;border-radius: 50%;background-color: #ddd;display: flex;justify-content: center;align-items: center;font-weight: bold;color: white;transition:all 0.3s;padding:8px} .step-container .stepper-item.active .step-counter { background-color: #c7c7c7;} .step-container .stepper-item.completed .step-counter { background-color: #109e81;} .step-container .stepper-item.active .step-counter { background-color: #109e81;} .step-container .stepper-item:not(.active):not(.completed) .step-counter { background-color: #109e81;} .step-container .stepper-item.completed:nth-child(1) .step-counter::before{ background-color: #109e81;} .step-counter::before {content: "";position: absolute;top: 33%;left: 60%;width: 80%;height: 2px;background-color: #ddd;z-index: 1;} .step-container .step-name {color:#109e81;margin-top:5px} .step-container .stepper-item.grey-icon .step-counter {background-color:#ddd !important} .step-container .stepper-item.blocked .step-counter {background-color:#ddd !important} .step-container .stepper-item.blocked .step-name {color:grey !important} .step-container .stepper-item.grey-icon .step-name {color:grey !important} /* Linie widoczne tylko dla dwóch pierwszych kroków */ .stepper-item:nth-child(1) .step-counter::before, .stepper-item:nth-child(2) .step-counter::before { content: ""; position: absolute; top: 33%; left: 60%; width: 80%; height: 2px; background-color: #ddd; z-index: 1; } /* Usunięcie linii dla 3. kroku i dalszych */ .stepper-item:nth-child(n+3) .step-counter::before { content: none; } .steps.container {margin:0px auto;position: relative;background-color:var(--white);padding:50px 0} .steps .section-title {font-size: 2rem; text-align: center; margin: 20px 0;} .steps .section-subtitle {font-size: 1.2rem; text-align: center; margin: 10px;} .steps .grid-account-type {display:flex;justify-content: center;align-items: center;grid-gap:20px;margin:50px 0} .steps .account-box {flex-basis: 100%;max-width:300px;border:1px solid #cecece;padding:15px 10px; border-radius:10px;text-align: center;cursor: pointer} .steps .account-box span{display:block;color:#363636;font-size:0.9rem;} .steps .account-box.active {border:1px solid var(--orange);outline:3px solid var(--orange);} .steps .btn-next {display:inline-block;padding:10px 30px;background-color:#c2c2c2;color:black;border-radius:5px;font-size:1.2rem;border:none;;cursor: pointer;text-decoration: none} .steps .btn-next.active {background-color:var(--orange)} .steps #form_steps {width:40%;margin:50px auto} .btn-container {text-align: center;} .steps .form-input input:placeholder-shown ~ .form-label[for="phone"] {left: 75px;} .btn-container-step-3 {display:flex;justify-content: center;align-items: center;grid-gap:10px;max-width:900px; margin:0 auto} .btn-container-step-3 > button {flex-basis: 100%} .btn-container-step-3 > a {flex-basis: 100%} .btn-add-elem {display:block;padding:10px 30px;background-color:var(--orange);color:black;border-radius:5px;font-size:1rem;border:none;;cursor: pointer;text-decoration: none;margin:0 auto;width:300px} .btn-orders-details {width: 100%; position: relative; color: var(--orange); display: block; text-align: right; font-weight: bold; margin-top: 0px;text-decoration: none} .confirm.container {margin:50px auto;} .confirm .title {padding:10px 10px 10px 20px; font-size:1.5rem;font-weight:bold; text-align: center } .info-container {width:50%; margin:0 auto;padding:50px 0 } .error {background-color:#FDCDCE; color:black; display:block;border-radius: 10px; } .error div {border-bottom:1px solid white; display:block; padding:20px} .correct {background-color:var(--dark-green); color:black; display:block;border-radius: 10px; } .correct div {border-bottom:1px solid white; display:block; padding:20px} .forgot-container {width:400px; margin:0 auto} .forgot-container input[name='phone'] {padding:10px 15px} .forgot-form .title {text-align: center} .forgot-form .text-medium {text-align: center} .forgot-email-box { width: 100%; position: relative; display: inline-block; border: 1px solid darkgray;border-radius: 5px;} .btn-orange-small {display: inline-block;text-align: center;padding: 8px 20px;color: black;background-color: var(--orange);border-radius: 5px;cursor: pointer;min-width: 100px;position: relative;text-decoration: none;font-weight:normal;box-sizing: border-box;border:none} .btn-orange-small:hover {background-color: #ffb13f;} #pagination {list-style: none;padding:0;margin:0;position: relative;padding: 16px;} #pagination li {display:inline-block; background-color:#696c74; color:white; padding:8px 10px;cursor: pointer} #pagination .active {background-color:red} .product_details {background-color: white} .product-grid {display: grid;grid-template-columns: calc(45% - 20px) 55%; justify-content: flex-start;align-items: flex-start;grid-gap:20px} .product-images {border-right:1px solid #cecece;text-align: center} .product-images img{width:100%} .product-details {position: relative;margin-top:20px} .product-category {color:var(--dark-grey);font-size:0.9rem} .product-title {color:var(--black);font-size:2rem} .product-rate {margin:10px 0 } .product-rate i {color:var(--orange);} .product-price {color:var(--orange);font-weight:500;font-size:2rem;margin:30px 0 } .product-params {margin:30px 0 10px 0 } .product-weight {margin:10px 0 10px 0 } .product_details .propose-offer-container {display:flex;grid-gap:20px 10px; margin-bottom: 1rem;flex-wrap: wrap;} .product_details .po-img {display:block;flex-basis: calc(33% - 8px);background-position: center; background-size: cover; background-repeat: no-repeat;border:1px solid #cecece} .product_details .po-img-box {display:block;width: 100%; height: 120px; background-size: contain;background-repeat: no-repeat;background-position: center;} .product_details .po-link {color: black;text-decoration: none;min-width:50px;} .product_details .po-text {margin-top:5px;position: relative;display: block;min-height:50px} .product_details .show-all-propose {display: block; max-width: unset; margin-top: 20px; position: relative;} .product_details .price-cs {font-weight: bold} .product_details .relatedType {border:1px solid #cecece;display:flex;justify-content: center;align-items: center;height:50px;padding:0 5px} .product_details .input-group-prepend {display:inline-block} .product_details .qty_input {width:50px;background-color:white; text-align: center;border:1px solid #cecece;padding: 10px 0;} .product_details .btn-number {background-color:var(--btn-yellow);color:black; font-size:1rem;text-align: center;padding:10px 10px;cursor:pointer;border: none;} .product_details input[type="number"] { -moz-appearance: textfield;} .product_details .payment_info img{max-width:150px } .product_details .dlv_info img{max-width:100px } .product_details .dlv_grid_logo{display:grid;grid-template-columns:1fr 1fr;justify-content: flex-start;align-items: center} .gallery_container {position: relative;;background-color: var(--orange);font-family: "Bahnschrift";} .gallery_container .title {color:white;text-align: center;padding:50px 0 ;font-size:1.6rem} .gallery .prevGallery {position: absolute; left: 10px; top: calc(50% - 20px); z-index: 9999; color: var(--orange);background-color: white;border-radius:10px;padding:5px;cursor:pointer} .gallery .prevGallery i,.gallery .nextGallery i{font-size:3rem} .gallery .nextGallery {position: absolute; right: 10px; top: calc(50% - 20px); z-index: 9999; color: var(--orange);background-color: white;border-radius:10px;;padding:5px;cursor:pointer} .gallery .galleryBox {;height:300px;background-position: center;background-repeat: no-repeat;background-size: cover;position:relative;border-radius:20px} .gallery .aGallery {;position:relative;} .gallery .gallery-container {padding:0 0 100px 0;width:calc(100% - 125px);margin:0 auto} .gallery .slick-slide { margin: 0 27px; } .gallery .slick-list { margin: 0 -27px; } .offer-accessories {background-color: white;max-width: 1500px; width: 100%; margin: 20px auto; position: relative;} .offer-accessories .accessories_container{padding:20px} .offer-accessories .title{font-weight:bold;font-size:1.2rem} .offer-accessories .accessories-offer-grid{display:flex;justify-content: flex-start;align-items: flex-start;grid-gap:20px} .offer-accessories .accessories-offer-grid .po-img{flex-basis: 20%;} .offer-accessories .accessories-offer-grid .po-img-box{height:220px;background-repeat: no-repeat;background-size:contain;border-radius:10px} .offer-accessories .po-link{text-decoration: none;colo:black} .offer-accessories .po-text{color:black;min-height:60px;padding:0 10px;display:block} .offer-accessories .price-cs{text-align: left; color: var(--orange); font-size: 1.2rem; font-weight: bold; padding: 10px ;} .offer-accessories .po-img{border:1px solid #cecece;border-radius:10px} .offer-attrib {background-color: white;max-width: 1500px; width: 100%; margin: 20px auto; position: relative;} .offer-attrib .attrib_container{padding:20px} .offer-attrib .title{font-weight:bold;font-size:1.2rem} .offer-attrib .attribName{position: relative;padding-left:20px} .offer-attrib .attribName::after{position: absolute;width:10px; height:10px; content:'\f00c';top:0px;left:0; font-family:"Font Awesome 6 Free";font-weight: 900;} .offer-attrib .attrib-offer-grid{position: relative} .btn-download {font-size:1rem;margin:5px 0;color:var(--black) ;text-decoration: none;padding:5px 0;display: block} .btn-download:hover {color:var(--orange) } .poducts-details-nav {background-color: white;max-width: 1500px; width: 100%; margin: 20px auto 0 auto; position: relative;padding-top:10px;border-bottom: 1px solid #e6e6e6;} .poducts-details-nav .grid-details-nav{display:grid;grid-template-columns: 1fr 1fr;max-width:400px;margin:0 auto} .poducts-details-nav .grid-details-nav .btnNav{text-align: center;font-weight:bold;font-size:1.2rem;cursor:pointer} .poducts-details-nav .grid-details-nav .btnNav:hover{} .poducts-details-nav .grid-details-nav .btnNav.active{border-bottom:3px solid var(--orange);padding-bottom:10px;margin-bottom:0px} .product-description {padding:20px} .product-description .title{font-weight:bold;font-size:1.2rem} .product-description h1{font-weight:bold;font-size:1.2rem} .product-description h2{font-weight:bold;font-size:1.0rem} .product-description h3{font-weight:normal;font-size:1.0rem} .product-description h4{font-weight:normal;font-size:1.0rem} .product-description h6{font-weight:normal;font-size:0.9rem} .product_description_container {background-color: white;max-width: 1500px; width: 100%; margin: 0 auto 20px auto; position: relative;} .product_details .basketInfo {width:calc(100% - 20px);} .invoices {margin:20px auto 30px auto;background-color: white;padding:20px} .invoices .invoices-list-elem {display: grid;grid-template-columns:1fr 1fr 1fr 1fr;font-size: 0.8rem;padding: 10px;background-color: white;;align-items: flex-start;position: relative;border-bottom:1px solid #cecece} .invoices .section-title {font-size:1rem;font-weight:bold;color:var(--text-color);margin-bottom: 5px; padding-bottom: 5px;position: relative} .invoices .btn-download-invoice {text-decoration: none; background-color:var(--orange);color:white;width:200px; padding:5px 20px; border-radius:5px} .invoices .invoices-btn {text-align: right} .invoices .btn-download-invoice {text-decoration: none; background-color:var(--orange);color:white;width:200px; padding:5px 20px; border-radius:5px} .zoomed-image {position: absolute;top: 10%;left: 50%;width: 300px;height: 300px;background-repeat: no-repeat;background-size: 500%;display: none;border:1px solid #cecece;z-index: 10} .settings .grid-user-settings{display:grid; grid-template-columns: 1fr 1fr 1fr;align-items: self-start; grid-gap:50px} .settings .form-user-container {width: 1500px; margin: 0 auto; position: relative;background-color:white;padding:20px} .settings .form-user-container input{width:calc(100% - 20px);border:1px solid var(--cyan);padding:10px;} .settings .form-user-container select{width:calc(100% - 0px);border:1px solid var(--cyan);padding:10px 6px;;background-color:white;font-size: 1rem;} .settings .form-user-container textarea{width:calc(100% - 40px);border:1px solid var(--border);padding:5px;;min-height:100px;} .settings .form-user-container .checkbox{display:block;margin-top:10px} .settings .form-user-container .checkbox.hide{display:none} .settings .form-user-container input[type=checkbox]{width:25px;height:25px;border:1px solid var(--border);margin-right:10px;display: inline-block;} .settings .form-user-container input[type=radio]{width:25px;height:20px;border:1px solid var(--border);margin-left:10px;margin-bottom: 10px;top: 3px;position: relative;} .settings .form-user-container .title{font-size: 2rem; margin: 0 0 20px 0;} .settings .form-user-container .section-title{font-weight:bold} .settings .form-user-container .section-info{font-size: 0.9rem; margin-top:10px;} .settings .grid-b-r {border-right: 1px solid #cecece; margin-right: 0px; padding-right: 50px;} .settings input[name="email_code"] {border-radius:5px;padding:10px} .settings .section-info-cyan {color:var(--cyan)} /* .settings .form-input {position: relative;margin:10px 0;color:#cecece} .settings .form-label {position: absolute;top: 50%; transform: translateY(-50%);left:10px;transition: all 0.2s;} .settings .form-input input::placeholder { color: transparent;} .settings .form-input input{ padding:10px;border-radius: 5px;} .settings .form-input input:focus{ border:2px solid #00e42e !important;box-shadow:unset} .settings .form-input input:placeholder-shown ~ .form-label{position: absolute;top: 50%; transform: translateY(-50%);left:10px;transition: all 0.2s; } .settings .form-input input:not(:placeholder-shown) ~ .form-label{ position: absolute; top: 0; display: block; transition:all 0.2s; color: black; background-color: white; padding: 0 5px; border-radius: 5px;font-size:0.8rem} .settings .form-input input:focus ~ .form-label { position: absolute; top: 0; display: block; transition:all 0.2s; color: black; background-color: white; padding: 0 5px; border-radius: 5px;font-size:0.8rem} .form-input select { width:100%} .form-input select::placeholder { color: transparent;} .form-input select{ padding:10px;border-radius: 5px;} .form-input select:focus{ border:2px solid #00e42e !important;box-shadow:unset} .form-input select:placeholder-shown ~ .form-label{position: absolute;top: 50%; transform: translateY(-50%);left:10px;transition: all 0.2s; } .form-input select:not(:placeholder-shown) ~ .form-label{ position: absolute; top: 0; display: block; transition:all 0.2s; color: black; background-color: white; padding: 0 5px; border-radius: 5px;font-size:0.8rem} .form-input select:focus ~ .form-label { position: absolute; top: 0; display: block; transition:all 0.2s; color: black; background-color: white; padding: 0 5px; border-radius: 5px;font-size:0.8rem} */ .settings .userDataOK {color:green;font-weight:bold;font-size:0.8rem;border-top: 1px solid #cecece; margin-top: 20px; padding-top: 10px;} .settings .userDataNO {color:red;font-weight:bold;font-size:0.8rem;;border-top: 1px solid #cecece; margin-top: 20px; padding-top: 10px;} .settings select.phone_prefix {display: inline-block; width: 70px; margin-right: 5px;} .settings .flex label {left:80px} .settings input[name="sms_code"] {padding: 10px; border-radius: 5px;} .settings .sms-flex {display:flex;justify-content: flex-start;align-items: center;grid-gap:20px} .settings .email-flex {display:flex;justify-content: flex-start;align-items: center;grid-gap:20px} .settings .hideSms {display:none} .settings .hideEmail {display:none} .settings input#add-check.required {outline:2px solid red !important} .settings .additional-chceck.required {outline:none;border:none !important} .settings .additional-chceck.required::after {position: relative;content:'Pole wymagane';display:block;color:red} .settings .nav-settings {display:block;} .settings .nav-box.active::after {content:"";position: absolute;bottom:0;width:100%;height:2px;background-color: var(--cyan);left:0;transition: all 0.5s;} .settings .nav-box {display:inline-block; padding:10px 0 ;color:black;font-size:1.2rem;text-align: center;position: relative;cursor:pointer;margin-right:30px} .settings .nav-box::after {content:"";position: absolute;bottom:0;width:0%;height:2px;background-color: var(--cyan);left:0;transition: all 0.5s;} .settings .nav-box:hover::after {content:"";position: absolute;bottom:0;width:100%;height:2px;background-color: var(--cyan);left:0} .settings .foot_note {font-size:0.7rem;color:black} .payoffs {position: relative;} .payoffs .title{font-size: 2rem; margin: 0 0 20px 0;} .payoffs .payoffs-container {width: 1500px; margin: 20px auto; position: relative;background-color:white;padding:20px;border-radius: 10px} .payoffs-list-elem {display:grid;grid-template-columns: 30% 20% 20% 20% 10%;justify-content: flex-start;align-items: center;padding:5px} .payoffs-list-elem:nth-child(even) {background-color:#EFEFEF} .btn-add-payoffs {position: absolute;right:10px;top:10px;background-color:var(--orange);color:black;padding:10px 20px; border-radius:5px;cursor:pointer;text-decoration: none} .payoff-modal-container {width:100%;margin:0 auto;max-height: 60vh; overflow-y: auto; min-height: 200px;} .payoff-modal-header-grid {display:grid;grid-template-columns: 1fr 1fr 1fr 1fr;justify-content: flex-start;align-items: flex-start;grid-gap:20px;font-weight: bold;text-align: left;background-color: #E6E6E6;padding:5px} .payoff-modal-item-grid {display:grid;grid-template-columns: 1fr 1fr 1fr 1fr;justify-content: flex-start;align-items: center;grid-gap:20px;text-align: left;padding:5px;margin-bottom:5px} .payoff-modal-item-grid {background-color:#d7ece6;} .btn-details-inst-payoff {color:black; font-weight: normal} .payoff-modal-sum-grid {display:grid;grid-template-columns:1fr 1fr 1fr 1fr;justify-content: flex-start;align-items: flex-start;grid-gap:20px;font-weight: bold;text-align: left;padding:5px} .btn-confirm-selected-payoff {position: relative;top:10px;background-color:var(--cyan);color:white;padding:10px 20px;cursor:pointer;text-decoration: none;margin:0 auto;text-align: center;display: inline-block;min-width:250px} .iconInfo i {color:var(--cyan);} .box-width-70 {width: 70%; margin: 20px auto; position: relative;background-color:white;padding:20px;border-radius: 10px} .box-width-40 {width: 43%; margin: 0px auto; position: relative;background-color:white;padding:20px;border-radius: 10px} .removeSection {position: absolute;top:0;right:0; background-colo:white;border:1px solid red;color:red;padding:5px 10px;border-radius:5px;font-size:0.8rem;cursor:pointer} .bonus-saldo {position: relative; bottom: 0; text-align: center; background-color: white; padding: 20px; box-shadow: 0px -10px 25px -27px black; width: calc(100% + 0px); margin-left: -20px;} .bonus-saldo-all {position: sticky; bottom: 0; text-align: center; background-color: white; padding: 20px 20px 10px 20px; box-shadow: 0px -10px 25px -27px black; width: calc(100% + 0px); margin-left: -20px;} .bonus-saldo-all span{font-weight:bold;color:var(--orange);font-size: 2rem;} .bonus-saldo-section {padding:20px 0 ;} .bonus-saldo-small-info {text-align: center;font-size:0.8rem;padding-bottom:50px} .installations-wraper {position: relative;width: 100%; } .installations-wraper .token{font-size:0.8rem;text-align: center;color:grey;position: absolute; right: 10px; top: 10px;} .installations-wraper .title{font-size: 4rem; margin: 0 0 20px 0;;position: relative} .installations-wraper .title.text-left{font-size: 2rem; margin: 0 0 20px 0;;position: relative} .installations-wraper .section-title{font-size: 1.2rem; margin:20px 0;text-align: center;} .installations-wraper .installations-container {width: 1400px; margin: 20px auto; position: relative;background-color:white;padding:50px;} .installations-wraper .form-container {text-align: center;max-width:600px;width:100%;margin:0 auto} .installations-wraper .section-info {text-align: left;} .installations {position: relative;width: 100%; } .installations .token{font-size:0.8rem;text-align: center;color:grey;position: absolute; right: 10px; top: 10px;} .installations .title{font-size: 4rem; margin: 0 0 20px 0;;position: relative} .installations .title.text-left{font-size: 2rem; margin: 0 0 20px 0;;position: relative} .installations .section-title{font-size: 1.2rem; margin:20px 0;text-align: center;} .installations .installations-container {width: 1400px; margin: 20px auto; position: relative;background-color:white;padding:50px;} .installations .form-container {text-align: center;max-width:600px;width:100%;margin:0 auto} .installations .section-info {text-align: left;} .installations-list-elem {display:grid;grid-template-columns: 5% 20% 15% 15% 17% 13% 10% 5%;justify-content: flex-start;align-items: center;padding:10px 5px} .installations-list-elem:nth-of-type(even) {background-color:#EFEFEF} .btn-add-installation {position: relative;right:0px;top:0px;color:var(--cyan);border:1px solid var(--cyan);padding:10px 20px; cursor:pointer;text-decoration: none;display: inline-block;} .btn-add-installation:hover {background-color:var(--cyan);color:white} .btn-add-payoff {position: relative;border:1px solid var(--orange);color:var(--cyan);padding:5px 10px; cursor:pointer;text-decoration: none;display:block;text-align: center} .btn-add-payoff:hover {background-color:var(--cyan);color:white;border:1px solid var(--cyan);} .btn-add-payoff-all {position: relative;background-color:var(--cyan);color:white;padding: 10px 20px; cursor:pointer;text-decoration: none;display: inline-block} .btn-add-payoff-add {position: relative;border:1px solid var(--orange);color:var(--cyan);padding:5px 10px; cursor:pointer;text-decoration: none;display:block;text-align: center;} .btn-add-payoff-inst {position: relative;background-color:var(--cyan);color:white;padding: 10px 20px 10px 4px; cursor:pointer;text-decoration: none;display: inline-block;font-weight: bold} .btn-add-payoff-all {position: relative;background-color:var(--cyan);color:white;padding:10px; ;cursor:pointer;text-decoration: none;display: inline-block;font-weight: bold} .btn-select-all {position: relative;color:white;padding: 0 10px ; cursor:pointer;text-decoration: none;display: inline-block} .btn-select-single {position: relative;padding: 0 10px; cursor:pointer;text-decoration: none;display: inline-block} .btn-select-all input{border:none;border-radius:0} .btn-container-bonus {background-color:var(--cyan);display:inline-block} .iconInfo {color:var(--cyan);margin-top:10px} .installations-list-load .btn-remove i {color:red} .installations-list-load {position: relative} .installations-products-load {display:grid;grid-template-columns: calc(45% - 50px) 15% 20% 20% 50px;justify-content: flex-start;align-items: center} .installations-images-load {display:flex;justify-content: flex-start;align-items: flex-start;grid-gap:10px;flex-wrap: wrap;} .installations-images-load .box-images {display:block;flex-basis: 31%;position: relative} .installations-images-load .btn-remove-images {position: absolute;top:-5px;right:-5px;cursor:pointer;background-color: white; padding: 2px; border-radius: 50%;} .installations-images-load .btn-remove-images i{color:red} .installations-invoices-load {display:block;position: relative; border: 1px solid #cecece; border-radius: 5px; padding: 10px;} .installations-invoices-load .box-invoices {display:grid;grid-template-columns: 90% 10%;justify-content: flex-start;align-items: flex-start;position: relative} .installations-invoices-load .box-invoices a{color:black;text-decoration: none;text-align: left} .installations-invoices-load .btn-remove-invoices {position: relative;;cursor:pointer;} .installations-invoices-load .btn-remove-invoices i{color:red} .installations-invoices-load .title-invoice{font-size:0.9rem;text-align: left;margin-bottom:10px } .instDetailsHeader {display: grid; grid-template-columns: 100px 3fr 200px 1fr;justify-content: flex-start;align-items: flex-start;;padding:5px;font-weight: bold;background-color: #E6E6E6} .instDetailsItems {display: grid; grid-template-columns: 100px 3fr 200px 1fr;justify-content: flex-start;align-items: flex-start;;padding:5px;font-weight: normal} .instDetailsItems:nth-child(odd) {background-color:#EDEDED} .archiveInfo {display: grid; grid-template-columns: 200px 1fr;justify-content: flex-start;align-items: flex-start;;padding:5px} .archiveBonusInfo {display: grid; grid-template-columns: 3fr 5fr;justify-content: flex-start;align-items: flex-start;padding:5px;grid-gap:0 20px} .archiveElemens {display: grid; grid-template-columns: 200px 1fr;justify-content: flex-start;align-items: flex-start;padding:5px} .archiveElementsHeader {display: grid; grid-template-columns: 2fr 1fr 5fr ;justify-content: flex-start;align-items: flex-start;font-weight: bold;grid-gap:10px;} .archiveElementsItems {display: grid; grid-template-columns: 2fr 1fr 5fr ;justify-content: flex-start;align-items: flex-start;padding:5px;grid-gap:10px} .formInfo {background-color: #B80093;color:white;padding:5px} .archiveBonusInfo {;padding:5px} .archiveBonusSum {;color:var(--orange);padding:5px} .grid-inst-details {display: grid; grid-template-columns: 200px 1fr;justify-content: flex-start;align-items: flex-start;;} .totalBonusSum {background-color: #359e80;color:white;display:inline-block;padding:10px;font-size:1.6rem;font-weight:bold} .search-container {display:grid;grid-template-columns: 80% 20%;max-width:600px; width:100%;margin:0 auto 20px auto} .btn-search-dist {background-color:var(--cyan);color:white;padding:10px 20px;cursor: pointer;font-weight: bold} .bonus .bonus-container {width: 1500px; margin: 20px auto; position: relative;background-color:white;padding:20px;} .bonus .title{font-size: 2rem; margin: 0 0 20px 0;} .bonus .bonus-list-header {display:grid;grid-template-columns: 30px 18% 15% calc(23% - 30px) 12% 17% 15%;justify-content: flex-start;align-items: center;font-weight: bold; border-bottom:1px solid #cecece ;margin-bottom:10px; padding-bottom:10px;width: 100%;font-size:1rem} .bonus .bonus-list-elem {display:grid;grid-template-columns:50px calc(30% - 50px) 30% 30% 10%;justify-content: flex-start;align-items: center;padding:10px 0;font-size:1rem;} .btn-installation-details {padding:5px 10px; color:var(--cyan);border:1px solid var(--cyan);text-align: center;cursor:pointer;display:block;text-decoration: none} .btn-installation-details:hover {background-color: var(--cyan);color:white} .btn-bonus-details {padding:5px 10px; color:var(--cyan);border:1px solid var(--cyan);text-align: center;cursor:pointer;display:block;text-decoration: none} .btn-bonus-details:hover {background-color: var(--cyan);color:white} .btn-bonus-details-add {padding:5px 10px; color:var(--cyan);border:1px solid var(--cyan);text-align: center;cursor:pointer} .btn-bonus-details-add:hover {background-color: var(--cyan);color:white} .bb-bonus-details {border-bottom:1px solid var(--cyan)} .bonus .bonus-list-header-add {display:grid;grid-template-columns:30px 20% calc(45% - 30px) 20% 15%;justify-content: flex-start;align-items: center;font-weight: bold; border-bottom:1px solid #cecece ;margin-bottom:10px; padding-bottom:10px;width: 100%;;font-size:1rem} .bonus .bonus-list-elem-add {display:grid;grid-template-columns: 30px 20% calc(45% - 30px) 20% 15%;justify-content: flex-start;align-items: center;padding:5px 0;font-size:1rem} .bonus .bonus-list-elem-add:nth-child(odd) {background-color:#EFEFEF} .bonus-add-details span{font-weight:bold} .bonus-add-details {background-color:var(--cyan-20);padding:10px 0 10px 50px;margin: 20px 0 0 0 } .bonus-add-details-text {;padding:10px 10px 10px 50px;margin-bottom:20px} .btn-inst-details {color:black;text-decoration: none;word-wrap: break-word} .dlv-order-bonus {color:var(--orange)} .bonus-list-grid {display:grid;grid-template-columns: calc(80% - 20px) 20%;justify-content: center;align-items: center} .bonus-list-grid-details {display:grid;grid-template-columns: 258px calc(80% - 298px) 20%;justify-content: flex-end;align-items: flex-end;position: relative} .bonus-list-grid-details bb{border-borom:1px solid var(--cyan)} .installation-list-grid {display:grid;grid-template-columns: calc(80% - 20px) 20%;justify-content: center;align-items: center} .installation-list-grid-details {display:grid;grid-template-columns: 258px calc(80% - 298px) 20%;justify-content: flex-end;align-items: flex-end} .installation-list-grid-details bb{border-borom:1px solid var(--cyan)} .installation-list-elem {display:grid;grid-template-columns:50px calc(30% - 50px) 30% 30% 10%;justify-content: flex-start;align-items: center;padding:10px 0;font-size:1rem;} /*.load-bonus_details {height:0;overflow: hidden}*/ .inst-details-grid {display: grid; grid-template-columns: 2fr 2fr 5fr; justify-content: flex-start; align-items: center; padding: 10px 0; font-size: 1rem;} .details-section-one {background-color:#f9fcfb} .details-section-two {background-color:#eff7f5} .details-section-three {background-color:#d7ece6} .fomularzTitle {font-size:1.2rem;font-weight:bold} .bb-cyan {border-bottom:1px solid var(--cyan);padding-bottom:10px;margin-bottom:10px} .bt-cyan {border-top:1px solid var(--cyan);padding-top:10px;margin-top:10px} .gallery-image-link {color:var(--cyan);text-decoration: none} span.form-control-character-count {display: inline;padding: .2em .6em .3em;font-size: 75%;font-weight: bold;line-height: 1;color: #fff;text-align: center;white-space: nowrap;vertical-align: baseline;border-radius: .25em; background-color: var(--blue); position: absolute;right: 10px;top: -5px;} aspan.form-control-character-count:hover,aspan.form-control-character-count:focus { color: #fff; text-decoration: none; cursor: pointer;} span.form-control-character-count:empty { display: none;} .btn span.form-control-character-count { position: relative; top: -1px;} span.form-control-character-count[href]:hover,span.form-control-character-count[href]:focus { background-color: #31b0d5;} span#charCount{ color:white} .grid-element-inst {display:grid;grid-template-columns:30px calc(75% - 50px) 10% 15%;justify-content: flex-start;align-items: flex-start;grid-gap:10px} .grid-type-elements-container {display:flex;justify-content: center;align-items: center;grid-gap:10px;flex-wrap: nowrap;margin-bottom: 20px} .grid-type-elements-container div{flex-basis: 300px;} .grid-type-elements-container .show-elements {border:1px solid #cecece;padding:10px;cursor:pointer} .grid-type-elements-container .show-elements.selected {background-color:var(--cyan);color:white} .bonus-sum-section {background-color:var(--blue);color:white;display:inline-block;padding:5px 10px;border-radius:5px;} .filterContainerInst {position: relative;display:grid;grid-template-columns: 1fr 1fr 300px;justify-content: flex-start;align-items: flex-end;float: right;top:-40px;;font-size:0.8em;grid-gap:20px} .filterContainerInst select{flex-basis: 300px;width:100%;background-color: transparent;border:1px solid var(--cyan);padding:5px;color:var(--cyan)} .filterContainerInst select option{background-color: transparent;color:black} .filterContainerInst .filter-item-select{flex-basis: 100%;} .status-icon {width:30px;position: absolute;left:-40px} .status-icon img {max-width:100%} .dlv-order-status {position: relative} .checkPopup {position: absolute; left: 20%; top: 0;} .filterContainer {position: relative;display:flex;justify-content: flex-start;align-items: flex-start;float: right;top:-40px;width:300px;font-size:0.8em} .filterContainer.fcAdd {width:35%;} .filterContainer input{background-color: transparent;border:1px solid #cecece;padding:5px;border-radius:5px} .filterContainer select{flex-basis: 100%;width:100%;background-color: transparent;border:1px solid var(--cyan);padding:5px;color:var(--cyan)} .filterContainer select option{background-color: transparent;color:black} .filterContainer .btn-filter{flex-basis: 20%;background-color: blue;color:white;padding:5px 10px;border-radius:5px;cursor:pointer} .filterContainer .btn-filter-add{flex-basis: 20%;background-color: blue;color:white;padding:5px 10px;border-radius:5px;cursor:pointer} .filterContainer .filter-item-input{flex-basis: 100%;} .filterContainer .filter-item-select{flex-basis: 100%;} #uploadBtn {position: relative;background-color:var(--cyan);color:white;padding:5px 10px; cursor:pointer;text-decoration: none;text-align: center;width: 200px; border: none; margin: 10px 0;font-weight:bold} .uploadBtnInvoice {position: relative;background-color:var(--cyan);color:black;padding:5px 10px; cursor:pointer;text-decoration: none;text-align: center;width: 200px; border: none; margin: 10px 0;} .btn-select-supervisors {position: absolute;right:-1px;top:0px;background-color:var(--cyan);color:black;padding:9.2px 20px; cursor:pointer;text-decoration: none} .btn-select-distributor {position: absolute;width:100%;height:100%;left:0;top:0;cursor:pointer} .btn-select {position: relative;background-color:var(--cyan);color:white;padding:5px 10px; cursor:pointer;text-decoration: none;text-align: center;font-weight: bold} .modal-distributor .nav-settings {display: grid; margin-bottom: 20px; grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;align-items: center} .modal-distributor .nav-box.active::after {content:"";position: absolute;bottom:0;width:100%;height:2px;background-color: var(--cyan);left:0;transition: all 0.5s;} .modal-distributor .nav-box {display:inline-block; padding:10px 0 ;color:black;font-size:1.6rem;text-align: center;position: relative;cursor:pointer;margin-right:40px;font-weight: bold} .modal-distributor .nav-box::after {content:"";position: absolute;bottom:0;width:0%;height:2px;background-color: var(--cyan);left:0;transition: all 0.5s;} .modal-distributor .nav-box:hover::after {content:"";position: absolute;bottom:0;width:100%;height:2px;background-color: var(--cyan);left:0} .modal-distributor .sec {text-align: left} .modal-distributor .sec img{max-height:200px;max-width:100%} .dist-select-grid {display:grid;grid-template-columns:30% 20% 20% 20% 10%;justify-content: flex-start;align-items: flex-start;text-align: left;padding:5px 0;border-bottom:1px solid #cecece} .modal-distributor .modal-content {width:60%;} .modal-distributor .modal-tresc {padding:0 20px} .modal-supervisors .modal-content {width:60%;} .modal-supervisors .modal-tresc {padding:20px} .fal-select-grid {display:grid;grid-template-columns: 50px calc(60% - 50px) 15% 15% 10%;justify-content: flex-start;align-items: center;text-align: left;padding:5px 0;border-bottom:1px solid #cecece;} .fal-select-grid img {max-width:80%} .modal-elements .modal-content {width:80%;} .btn-select-elements {position: relative;background-color:transparent;color:var(--cyan);padding:20px 20px;cursor:pointer;text-decoration: none;font-weight:bold;border:2px solid var(--cyan)} .btn-select-elements:hover {position: relative;background-color:var(--cyan);color:white;padding:20px 20px; cursor:pointer;text-decoration: none;font-weight:bold;border:2px solid var(--cyan)} .btn-select-elements i {font-size:1.2rem;} .elem-select-grid-header {display:grid;grid-template-columns: 80px calc(55% - 180px) 20% 15% 10% ;justify-content: flex-start;align-items: center;text-align: left;padding:5px 0;border-bottom:1px solid #cecece;font-size:0.9rem;grid-gap:20px} .elem-select-grid {display:grid;grid-template-columns: 80px calc(55% - 180px) 20% 15% 10% ;justify-content: flex-start;align-items: center;text-align: left;padding:5px 0;border-bottom:1px solid #cecece;font-size:0.9rem;grid-gap:20px} .elem-select-grid img {max-width:50px} .elem-select-grid.selected {background-color:#FFF8EE} .input-group-prepend {display:inline-block} .qty_input {width:50px;background-color:white; text-align: center;border:1px solid #cecece;padding: 5px 0;} .btn-number {background-color:var(--cyan);color:white; font-size:1rem;text-align: center;padding:5px 10px;cursor:pointer;border: none;} input[type="number"] { -moz-appearance: textfield;} .modal-falownik .modal-content {width:60%;} .modal-falownik .modal-tresc {padding:0 20px} .product-link {text-decoration: none;color:black;} .product-link:hover {text-decoration: underline;color:black;} .bat-select-grid {display:grid;grid-template-columns: 50px calc(60% - 50px) 15% 15% 10%;justify-content: flex-start;align-items: center;text-align: left;padding:5px 0;border-bottom:1px solid #cecece;} .bat-select-grid img {max-width:80%} .modal-battery .modal-content {width:60%;} .modal-battery .modal-tresc {padding:0 20px} .pv-select-grid {display:grid;grid-template-columns: 50px calc(60% - 50px) 15% 15% 10%;justify-content: flex-start;align-items: center;text-align: left;padding:5px 0;border-bottom:1px solid #cecece;} .pv-select-grid img {max-width:80%} .modal-pv .modal-content {width:60%;} .modal-pv .modal-tresc {padding:0 20px} .btn-popup {z-index:10;cursor:pointer} .btn-popup i{color:var(--orange);} .btn-popup-ok {z-index:10;cursor:pointer} .btn-popup-ok i{color:var(--green);} .btn-remove i{color:var(--cyan);} .btn-send-sms {display: inline-block;text-align: center;padding: 10px 20px;color: white;background-color: #667cd1;border-radius: 10px;cursor: pointer;min-width: 100px;position: relative;font-size:1rem;text-decoration: none} .btn-send-sms:hover {background-color:#00b9b9;color:white;} .btn-send-email {display: inline-block;text-align: center;padding: 10px 20px;color: white;background-color: #667cd1;border-radius: 10px;cursor: pointer;min-width: 100px;position: relative;font-size:1rem;text-decoration: none} .btn-send-email:hover {background-color:#00b9b9;color:white;} input:focus { outline: none !important; box-shadow: 0 0 10px #719ECE; } .pass-strong {display: none;position: relative;font-size: 0.7rem;text-align: left;} #strength_score {display:inline-block;position:relative; font-size:0.6rem; } .required {border:2px solid red !important} input.invoiceField.required {border:2px solid red !important} .error_info { position: absolute; top: -9px; right: 10px; background-color: white; color: red; padding: 0px 10px; font-size: 0.8rem;} .distr .error_info { position: absolute; top: -9px; right: 110px; background-color: white; color: red; padding: 0px 10px; font-size: 0.8rem;} .suprv .error_info { position: absolute; top: -9px; right: 110px; background-color: white; color: red; padding: 0px 10px; font-size: 0.8rem;} .btn-back {display:inline-block;padding:10px 30px;background-color:#c2c2c2;color:white;font-size:1.2rem;border:none;text-align: center;text-decoration: none} .btn-not-data {display:inline-block;padding:10px 30px;background-color:#444;color:white;border-radius:10px;font-size:1.2rem;border:none} .btn-grey {display:inline-block;padding:10px 30px;background-color:grey;color:white;font-size:1rem;border:none;cursor:pointer;text-align: center} .btn-green {display:inline-block;padding:10px 30px;background-color:green;color:white;font-size:1rem;border:none;cursor:pointer;text-align: center} .btn-save {display:inline-block;background-color: transparent;padding:10px 30px;border:1px solid var(--cyan);color:var(--cyan);font-size:1.2rem;cursor:pointer} .btn-save:hover {background-color: var(--cyan);color:white} .btn-save-pass {display:inline-block;background-color: transparent;padding:10px 30px;border:1px solid var(--cyan);color:var(--cyan);font-size:1.2rem;cursor:pointer} .btn-save-pass:hover {background-color: var(--cyan);color:white} .btn-next {display:inline-block;background-color: transparent;padding:10px 30px;border:1px solid green;color:green;font-size:1.2rem;cursor:pointer} .btn-accept {width:100%;display:block;padding:10px 50px;background-color:var(--cyan);color:white;;font-size:1.2rem;border:none;cursor:pointer} .btn-save.disabled {background-color:#c2c2c2} .btn-gus {background-color: var(--cyan); display: inline-block; ; color: white; padding: 11px 10px; position: absolute; right: -1px;top:0px; cursor: pointer;} .btn-save[disabled] {background-color:grey} #message {position:fixed;top:-150px;left: 50%; transform: translate(-50%); max-width: 600px; background-color:var(--cyan); border-radius:10px;opacity:1;box-shadow: 0px 0px 65px -5px black;z-index: 999} #message .text{color:white;font-size:1rem; padding:30px 50px;line-height:200%;text-align: center} .btn-add-section { border:none; display: block; font-size: 1rem; text-align: center; padding: 20px 10px; color: var(--blue); background-color:transparent;border:2px solid var(--blue); cursor: pointer; position: relative; font-weight: bold; text-decoration: none; min-width: 100px; box-sizing: unset; margin: 10px 0; width: calc(100% - 20px);} .btn-add-section:hover { border:none; display: block; font-size: 1rem; text-align: center; padding: 20px 10px; color: white; background-color: var(--blue); border:2px solid var(--blue); cursor: pointer; position: relative; font-weight: bold; text-decoration: none; min-width: 100px; box-sizing: unset; margin: 10px 0; width: calc(100% - 20px);} .btn-add-section i {font-size:1.2rem} .btn-cyan-small { border:none; display: inline-block; font-size: 0.8rem; text-align: center; padding: 8px 10px; color: white; border-radius: 5px; background-color: var(--cyan); cursor: pointer; position: relative; font-weight: normal; text-decoration: none; min-width: 100px; box-sizing: unset; margin: 10px 0; max-width: 200px; width: calc(100% - 20px);} .btn-red-small {display:inline-block; text-align: center;padding:7px 20px; color: var(--red); border:2px solid var(--red);border-radius:5px;cursor:pointer;min-width:100px;position:relative;font-size:0.8rem} .btn-red-small:hover { background-color: var(--red);color:white} .btn-cyan { color: var(--cyan); position: relative; text-decoration: none} .btn-red {text-align: center;padding:10px 30px; color: white; background-color: var(--red);border-radius:10px;cursor:pointer;position:relative;font-size:1rem} .btn-red-small:hover { } .btn-remove-inst { ;cursor:pointer;padding:0 5px;position: absolute;left:10px;top:8px} .btn-remove-inst i{ color: var(--cyan);font-size:1rem} .address {margin:20px auto 30px auto;background-color: white;padding:20px} .address .grid-pickup { display: grid; grid-template-columns: auto minmax(60px , 150px) minmax(60px , 150px); align-items: center; grid-gap: 10px; padding: 5px 0 5px 0;} .address .section-title {font-size:1rem;font-weight:bold;color:var(--text-color);margin-bottom: 5px; padding-bottom: 5px;position: relative} .address .btn-text{display:block;border-bottom:1px solid #cecece;padding:15px 20px;} .address .addShipping{z-index: 9;position: absolute;top: 20px;right: 20px;cursor:pointer} .address .section-title{margin:0 0 20px 0 } .address .form-input input{width:calc(100% - 20px);border:1px solid var(--border);padding:5px;} .address .form-input select{width:calc(100% - 30px);border:1px solid var(--border);padding:6px;;background-color:white;font-size: 1rem;} /* .address .form-input {position: relative;margin:10px 0;color:#cecece} .address .form-label {position: absolute;top: 50%; transform: translateY(-50%);left:10px;transition: all 0.2s;} .address .form-input input::placeholder { color: transparent;} .address .form-input input{ padding:10px;border-radius: 5px;} .address .form-input input:focus{ border:2px solid #00e42e !important;box-shadow:unset} .address .form-input input:placeholder-shown ~ .form-label{position: absolute;top: 50%; transform: translateY(-50%);left:10px;transition: all 0.2s; } .address .form-input input:not(:placeholder-shown) ~ .form-label{ position: absolute; top: 0; display: block; transition:all 0.2s; color: black; background-color: white; padding: 0 5px; border-radius: 5px;font-size:0.8rem} .address .form-input input:focus ~ .form-label { position: absolute; top: 0; display: block; transition:all 0.2s; color: black; background-color: white; padding: 0 5px; border-radius: 5px;font-size:0.8rem} .address .form-input select { width:100%} .address .form-input select::placeholder { color: transparent;} .address .form-input select{ padding:10px;border-radius: 5px;} .address .form-input select:focus{ border:2px solid #00e42e !important;box-shadow:unset} .address .form-input select:placeholder-shown ~ .form-label{position: absolute;top: 50%; transform: translateY(-50%);left:10px;transition: all 0.2s; } .address .form-input select:not(:placeholder-shown) ~ .form-label{ position: absolute; top: 0; display: block; transition:all 0.2s; color: black; background-color: white; padding: 0 5px; border-radius: 5px;font-size:0.8rem} .address .form-input select:focus ~ .form-label { position: absolute; top: 0; display: block; transition:all 0.2s; color: black; background-color: white; padding: 0 5px; border-radius: 5px;font-size:0.8rem} .address select.phone_prefix {display: inline-block; width: 70px; margin-right: 5px;} .address .flex label {left:80px !important} */ .address .defaultDlv {position: absolute;background-color:var(--orange);color:white;padding:5px 10px; border-radius:5px;top:-25%;right:0} .address .elem-dni {position: relative} .orders {margin:20px auto 30px auto;background-color: white;padding:20px} .orders .ordered-list-elem {display: grid;grid-template-columns:40% 12% 12% 12% 12% 12%;font-size: 0.8rem;padding: 10px;background-color: white;;align-items: flex-start;position: relative;border-bottom:1px solid #cecece} .orders .grid-order {display: grid; grid-template-columns: 100px 1fr;} .orders .priceSmall {font-weight:bold} .orders img {max-height:50px} .orders .section-title {font-size:1rem;font-weight:bold;color:var(--text-color);margin-bottom: 5px; padding-bottom: 5px;position: relative} .orders .ordered-list-elem.canceled {background-color: #f7e4e4;} .order-details {margin:20px auto 30px auto;background-color: white;padding:20px} .order-details .title {font-weight:bold;margin:10px 0 } .order-details .grid-details {display: grid; grid-template-columns: 1fr 1fr;} .order-details .ordered-list-elem {display: grid;grid-template-columns:40% 12% 12% 12% 12% 12%;font-size: 0.8rem;padding: 10px;background-color: white;;align-items: flex-start;position: relative;border-bottom:1px solid #cecece} .order-details .grid-order-header {display: grid; grid-template-columns: 150px calc(65% - 350px) 15% 10% 10% 200px; font-weight:bold;background-color:#eaeaea;padding:5px 10px} .order-details .grid-order {display: grid; grid-template-columns:150px calc(65% - 350px) 15% 10% 10% 200px;padding:5px 10px;border-bottom:1px solid #cecece;align-items: center} .order-details .priceSmall {font-weight:bold} .order-details img {max-height:50px} .order-details .status1 {background-color:green;color:white;padding:5px 10px; border-radius:5px;position: relative;min-height: 15px; max-width: 100px;} .order-details .status1::before {content:'OPŁACONE';position: absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content: center;align-items: center;font-size:0.8rem} .order-details .status2 {background-color:orange;color:white;padding:5px 10px; border-radius:5px;position: relative;min-height: 15px; max-width: 100px;} .order-details .status2::before {content:'PRZETWAŻANE';position: absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content: center;align-items: center;font-size:0.8rem} .order-details .status3 {background-color:red;color:white;padding:5px 10px; border-radius:5px;position: relative;min-height: 15px; max-width: 100px;} .order-details .status3::before {content:'ANULOWANE';position: absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content: center;align-items: center;font-size:0.8rem} select[name="reason"] {width:calc(100% - 30px);border:1px solid var(--border);padding:6px;;background-color:white;font-size: 1rem;border-radius: 5px;} .rabatInfo {background-color:#8CFAA6;color:black;padding:3px 5px;border-radius:5px;display:inline-block} .cart .cart-left {background-color:white;padding:20px} .cart .cart-right {background-color:white;padding:20px} .cart-all-remove {text-align:center; color:#008080; cursor:pointer;display:inline-block;padding:5px 10px;font-weight:bold} .cart-all-remove:hover {color:var(--red) } .cart .cart-title {font-size: 1rem;font-weight: bold;color: var(--text-color);padding: 10px 0;} .cart .basket_product_grid {display: grid; grid-template-columns:70px calc(55% - 140px) 25% 20% 70px;border-bottom:1px solid #cecece;padding:10px 0 ;align-items: center;position: relative} .cart .grid-cart {display:grid;grid-template-columns: 75% calc(25% - 20px) ;justify-content: flex-start;align-items: flex-start;grid-gap: 20px;} .cart .input-group-prepend {display:inline-block} .cart .qty_input {width:50px;background-color:white; text-align: center;border:1px solid #cecece;padding: 5px 0;} .cart .btn-number {background-color:var(--btn-yellow);color:black; font-size:1rem;text-align: center;padding:5px 10px;cursor:pointer;border: none;} .cart input[type="number"] { -moz-appearance: textfield;} .cart .cart_price {display: block; font-weight: bold; color: var(--orange);} .cart .price_cj {font-size: 0.8rem;margin-top:10px} .cart .cart-right .title {font-weight:bold;font-size: 1.2rem;margin-bottom:20px} .cart .priceInfo {margin-bottom:10px;} .cart .priceFullInfo {background-color:#cecece;padding:20px;position: relative;left:-20px;width:calc(100% + 0px);margin-bottom:0} .cart .form-input input{width:calc(100% - 20px);border:1px solid var(--border);padding:5px;} .cart .form-input select{width:calc(100% - 30px);border:1px solid var(--border);padding:8.5px 10px;;background-color:white;font-size: 1rem;} /* .cart .form-input {position: relative;margin:10px 0;color:#cecece} .cart .form-label {position: absolute;top: 50%; transform: translateY(-50%);left:10px;transition: all 0.2s;} .cart .form-input input::placeholder { color: transparent;} .cart .form-input input{ padding:10px;border-radius: 5px;} .cart .form-input input:focus{ border:2px solid #00e42e !important;box-shadow:unset} .cart .form-input input:placeholder-shown ~ .form-label{position: absolute;top: 50%; transform: translateY(-50%);left:10px;transition: all 0.2s; } .cart .form-input input:not(:placeholder-shown) ~ .form-label{ position: absolute; top: 0; display: block; transition:all 0.2s; color: black; background-color: white; padding: 0 5px; border-radius: 5px;font-size:0.8rem} .cart .form-input input:focus ~ .form-label { position: absolute; top: 0; display: block; transition:all 0.2s; color: black; background-color: white; padding: 0 5px; border-radius: 5px;font-size:0.8rem} .cart .form-input select { width:100%} .cart .form-input select::placeholder { color: transparent;} .cart .form-input select{ padding:8.5px 10px;;border-radius: 5px;} .cart .form-input select:focus{ border:2px solid #00e42e !important;box-shadow:unset} .cart .form-input select:placeholder-shown ~ .form-label{position: absolute;top: 50%; transform: translateY(-50%);left:10px;transition: all 0.2s; } .cart .form-input select:not(:placeholder-shown) ~ .form-label{ position: absolute; top: 0; display: block; transition:all 0.2s; color: black; background-color: white; padding: 0 5px; border-radius: 5px;font-size:0.8rem} .cart .form-input select:focus ~ .form-label { position: absolute; top: 0; display: block; transition:all 0.2s; color: black; background-color: white; padding: 0 5px; border-radius: 5px;font-size:0.8rem} .cart select.phone_prefix {display: inline-block; width: 70px; margin-right: 5px;} .cart select.company_phone_prefix {display: inline-block; width: 70px; margin-right: 5px;} .cart .flex label {left:80px !important} */ .cart .btn-delivery-address-book { right:20px; top:13px;display: inline-block; font-size: 0.8rem; text-align: center; color: var(--cyan); cursor: pointer; position: absolute;} .cart .btn-copy-address-book { right:0; top:13px;display: inline-block; font-size: 0.8rem; text-align: center; color: var(--cyan); cursor: pointer; position: absolute;} .btn-product-link { display: block; font-size: 1rem; text-align: left; color: var(--cyan); cursor: pointer; position: relative;text-decoration: none;font-weight:500} .cart .delivery-section {position: relative;border-top: 10px solid #EFEFEF; width: 100%; left: -20px; padding: 0 20px;} .cart .cart-remove {cursor:pointer} .cart .form-input-checkbox {display:inline-block} .cart .form-label-checkbox {display:inline-block} .cart .btn-rabat {position: absolute; background-color: #bcf7c8; padding: 9px 5px; border-radius: 5px; right: -1px; top: 0;color:black;cursor: pointer} .cart .rabatPriceInfo {background-color:#bcf7c8;color:black;padding:20px;left: -20px; width: calc(100% + 0px);position: relative} .cart .rabatSectionPayment {background-color:#cecece;color:black;padding:20px;left: -20px; width: calc(100% + 0px);position: relative} .cart .rabatError {color:red} .cart .payment_info img{max-width:150px } .cart .dlv_info img{max-width:100px } .cart .dlv_grid_logo{display:grid;grid-template-columns:1fr 1fr;justify-content: flex-start;align-items: center} .cart .payments-grid {display:grid;grid-template-columns: 1fr 1fr;justify-content: flex-start;align-items: center;grid-gap:10px;margin-top:20px} .cart .btn-payments-type {outline:2px solid #8a8a8a;padding:5px 10px;border-radius:5px;color:#8a8a8a;font-size:0.9rem;text-align: center;cursor:pointer} .cart .btn-payments-type.active {outline:0;background-color:var(--cyan);color:white} .cart .free-dlv-info.active {background-color: #6be407;} .cart .free-dlv-info {background-color: #959595; width: calc(100% + 30px); left: -20px; position: relative; border-radius: 0 0 5px 5px; padding: 5px;} .cart .free-dlv-left {display:inline;font-weight:bold} .cart .grid-paczkomat { display: grid; grid-template-columns: 250px 1fr;margin-bottom:10px;justify-content: flex-start; align-items: center;} .cart .grid-paczkomat .btn-cyan-small{ margin:0} .cart .id_paczkomat2 { width: calc(100% - 12px ); padding: 7px; border: 1px solid #dedede;border-radius:5px} .cart .basketLogin {margin:10px 0; padding-top:20px !important} .cart .cart-delivery {background-color:white;} .cart .delivery-options {display:grid;grid-template-columns: 40px 1fr 100px;justify-content: flex-start;align-items: flex-start;padding:20px; border-radius:10px;margin:10px 0;border:1px solid #cecece;cursor:pointer} .cart .delivery-options .dlvSelected {display: none} .cart .delivery-options.active .dlvNotSelected {display: none} .cart .delivery-options.active .dlvSelected {display: grid;} .cart .delivery-options.active { outline:2px solid green} .cart .btn-container {text-align: right;float:right;margin-top:3px} .cart.headCart {} .cart .payment-options {display:grid;grid-template-columns: 40px 1fr 100px;justify-content: flex-start;align-items: flex-start;padding:20px; border-radius:10px;margin:10px 0;border:1px solid #cecece;cursor:pointer} .cart .payment-options .paymentSelected {display: none} .cart .payment-options.active .paymentNotSelected {display: none} .cart .payment-options.active .paymentSelected {display: grid;} .cart .payment-options.active { outline:2px solid green} .cart .outlineTop {border-top: 10px solid #EFEFEF; width: 100%; left: -20px; padding: 0 20px;position: relative} .cart .note-section {position: relative;} .cart .note-section input{width:20px;margin:0 10px 10px 0 } .cart .note-section textarea{height:100px;width:100%;border:1px solid #cecece;border-radius:10px} .cart .note-section .form-input{color:black} .cart-check-email {padding:0 20px} .cart-check-email .btn-blue{background-color: #075FBA;color:white;padding:8px 10px;text-align: center;border-radius:5px;text-decoration: none} .cart-check-email .grid-2t{grid-gap:20px} input[disabled] { background-color: #f1f1f1;} input[readonly] { background-color: #f1f1f1;} .btn-payment {background-color: var(--orange); color: white; text-align: center; border-radius: 10px; padding: 20px; font-size: 1.2em; margin-top: 20px;} .btn-payment-login {display:block;background-color: var(--orange); color: white; text-align: center; border-radius: 10px; padding: 10px; font-size: 1em; margin-top: 20px;cursor:pointer} .btn-payment-no-login {display:block;border:1px solid var(--orange); color: var(--orange); text-align: center; border-radius: 10px; padding: 10px; font-size: 1em; margin-top: 20px;cursor:pointer} .modal-basket-login {padding:0 20px} .dlv-modal {display:none;z-index: 1000;position: fixed;left: 0;top: 0;width: 100%;height: 100%; background-color: rgba(0, 0, 0, 0.5);} .dlv-modal .slider_dlv{position: fixed;width: 40%;background-color: white;top: 0;left: 0;margin: 0 auto;z-index: 12;top: 50%;left: 50%;transform: translate(-50%, -50%);padding:20px;border-radius:15px;padding-bottom: 53px;} .dlv-modal .close-modal-delivery-sending { position: absolute; top: -2px; right: 0px; font-size: 2rem;} .dlv-modal .close-modal-delivery-address { position: absolute; top: -2px; right: 0px; font-size: 2rem;} .dlv-modal .select-modal-delivery { position: absolute; bottom: 0; background-color: white; z-index: 16; width: calc(100% - 40px); text-align: center;} .dlv-modal .modal-delivery-scroll { max-height: 55vh; overflow: auto; padding-right: 5px;} .dlv-modal .box-dlv { border: 1px solid #cecece; padding: 10px; padding-bottom: 10px; height: 100%; border-radius: 10px; cursor: pointer; position: relative; padding-bottom: 10px; margin-bottom: 10px;} .dlv-modal .box-dlv.selected { border: 3px solid var(--green);} .dlv-modal .dlvDefaultCart.active { background-color: var(--green); color: white;} .dlv-modal .dlvDefaultCart { width: calc(100% + 20px); left: -10px; position: relative; top: -10px; border-radius: 6px 6px 0 0; text-align: center; padding: 0px 0 3px 0; font-size: 0.8rem; height: 21px;} .dlv-modal.show-modal {display:block} .section-offer-box {position: relative;text-align: center;padding-bottom:100px;margin-bottom:200px} .section-offer-box .section-box{margin:0 auto;width:80%;display:flex;flex-wrap: wrap; grid-gap: 50px 0;margin-top:100px} .section-offer-box .section-title{;position: relative;font-size: 4rem; color: white;display:inline-block} .section-offer-box .section-title span {color:var(--red)} .section-offer-box .section-title::after{content:'';position:absolute;bottom:-110px;left:50%;right:50%;width:100%;height:100%;max-width:80%;background-image: url('/img/claw.png');background-repeat: no-repeat;background-size: contain;transform: translate(-50%, -50%);} .section-offer-box .offer-box-item{position: relative;} .section-offer-box .offer-box-foto{position: relative; max-height:150px;z-index: 10 } .section-offer-box .offer-box-content{position: relative;} .section-offer-box .offer-box-title{position:relative;color:white;font-size:2.2rem;font-weight:bold;margin-bottom:10px;text-align: center} .section-offer-box .offer-box{flex-basis: auto;position: relative;min-width: 20%;text-decoration: none;color:white} .section-offer-box .offer-box img{max-height:125px;z-index: 11;position: relative;transition: all 0.3s;} .section-offer-box .offer-box::after {content:'';position:absolute;bottom:-110px;left:50%;right:50%;width:100%;height:100%;max-width:70%;background-image: url('/img/menu-shine.png');background-repeat: no-repeat;background-size: contain;transform: translate(-50%, -50%);z-index: -1;opacity: 0.2;} .section-offer-box .offer-box-item:hover > .offer-box-foto img{transform: scale(1.2)} .section-offer-details {position: relative;text-align: center;padding-bottom:100px} .section-offer-details .section-title{position: relative;font-size: 4rem; color: white;display:inline-block} .section-offer-details .section-title span {color:var(--red)} .section-offer-details .section-title::after{content:'';position:absolute;bottom:-110px;left:50%;right:50%;width:100%;height:100%;max-width:80%;background-image: url('/img/claw.png');background-repeat: no-repeat;background-size: contain;transform: translate(-50%, -50%);min-width: 550px;} .section-offer-details .offer-details-container {width:70%;margin:50px auto 0 auto;padding:50px;background-color:black} .section-offer-details .offer-details-grid {display:grid;grid-template-columns: 20% calc(65% - 60px) 15%;justify-content: center;align-items: center;grid-gap:30px;border-bottom: 1px solid #ffffff40;} .section-offer-details .offer-details-name {color:var(--orange);text-align: left;font-size:2.5rem} .section-offer-details .offer-details-subname {color:white;text-align: left;font-size:1.5rem} .section-offer-details .offer-details-price {font-size: 3rem; color: var(--red);} .section-map #map {width: 100%; height: 90vh; } .section-footer {position: relative;padding:50px 0;background-color: #cecece; color: black;margin-top:50px} .section-footer img{max-width:300px;margin-bottom:20px} .section-footer .footer-container{position: relative;max-width:80%;margin:0 auto;display:block;text-align: center;} .section-offer-box-nav {position: relative;margin-bottom:30px} .section-offer-box-nav .offer-box-nav{display: flex; justify-content: center; align-items: center;flex-basis: 100%;height:100px;background-color: black;text-decoration: none;overflow: hidden;position: relative; border: 2px solid black; } .section-offer-box-nav .offer-box-item-nav{position: relative;height:60%;width:60%;background-position: center;background-size: contain;background-repeat: no-repeat;transition: all 0.3s;} .section-offer-box-nav .section-box-nav{display:flex;justify-content: flex-start;align-items: center;grid-gap: 0 10px;} .section-offer-box-nav .offer-box-title-nav{display:flex;width:100%;height:100%;justify-content: center;align-items: center;color:white;text-decoration: none;z-index: 2;position: absolute;transition: all 0.3s;top:0} .section-offer-box-nav .offer-box-title-nav h3{text-decoration: none} .section-offer-box-nav .offer-box-item-nav::before{position: absolute;content:"";width:100%;height:100%;top:0;left:0;background-color:RGB(0,0,0,0.4);z-index: 1;transition: all 0.3s;} .section-offer-box-nav .offer-box-nav:hover > .offer-box-title-nav{top:-100px} .section-offer-box-nav .offer-box-nav:hover .offer-box-item-nav::before {background-color:RGB(0,0,0,0.0)} .section-offer-box-nav .offer-box-nav:hover .offer-box-item-nav {transform: scale(1.4)} .section-offer-box-nav .offer-box-nav:hover {border-image: conic-gradient(from var(--angle), var(--c2), var(--c1) 0.1turn, var(--c1) 0.15turn, var(--c2) 0.25turn) 30;animation: borderRotate var(--d) linear infinite forwards;background-color:#121212} .blue-icon {color:#099bd7} .gold-icon {color:#d77409} .green-icon {color:#2ab537} .text-yellow {color:var(--orange);} .text-red {color:var(--red);} .btn-blue-normal {font-size:2em; background-color:#0B74AE;color:white;padding:5px 20px;display: inline-block;font-weight:bold} .footer-content {background-color:white;} /* .footer-content .language-box {position: absolute;display: inline-block;right: 20px;top: 10px;z-index: 13;text-align: left;} .footer-content .dropbtn { background-color: white; color: black;} .footer-content .dropbtn-footer { background-color: white; color: black;} .footer-content .dropdown-content-language { width: 200px;min-width:200px} */ .footer-content header .container { width: 100%;} footer {background-color:#444444;padding:10px 0 ;min-height:100px;margin-top:30px} footer .countries {border-bottom:1px solid #cecece; padding-bottom:5px} footer .countries ul {list-style:none; padding:0; margin:0; display: flex; justify-content: center;align-items: center} footer .countries li {display:inline;padding: 5px 10px;} footer .footer-logo img {max-width:50%} footer .footer-text {color:#fff; text-align: left; padding-top:50px} footer ul {list-style:none;padding:0;margin:0} footer .footer-offer {display: inline-flex;justify-content: space-between;} footer .footer-link {color:#b1b1b1; text-decoration:none;font-size:0.8rem;position:relative} footer .footer-link:hover {color:var(--orange); text-decoration:underline;} footer .footer-offer-title {color:#b1b1b1; font-weight:700} footer .text-center {text-align:center; font-size:0.8rem; color:#cecece; padding:10px 0 } footer .menu-container {display: flex;justify-content: center;width: 90%;margin: 0 auto;margin-top:30px;grid-gap:50px} footer h3 {font-size:0.8rem; color:white; font-weight:bold;text-decoration:none} footer .footer-box {position:relative;flex-basis: 100%} footer .footer-box a {text-decoration:none;} footer .footer-grid-grey {display:grid;grid-template-columns: 300px 1fr;grid-gap:20px;justify-content: flex-start;align-items: flex-start} footer .footer-contact-box {margin-top: 30px;;font-size:0.8em} footer .footer-contact-box-text {color:white} footer .footer-contact-box .grid-20-80 {justify-content: center;align-items: center} footer .footer-contact-box i {font-size:2rem;color:var(--orange)} footer .footer-phone {color:white;font-weight:bold;font-size:1.2rem} footer .footer-phone .footer-link{color:var(--orange);font-size:1rem} footer .supervisor-text{color:white;font-size:0.8rem;line-height: 150%} .footer-menu {display:flex} .grid-20-80 {display:grid; grid-template-columns: 20% calc(80% - 20px);align-items: flex-start; } #mobile-footer {opacity: 0;visibility: hidden;width: 100%;height: 100vh;left: 0;top: 0;background-color: RGBA(0,0,0,0.9);color: #fff;z-index: 9;display: block;position: fixed;transition: opacity .35s, visibility .35s, height .35s;;overflow-x: hidden;overflow-y: auto} .open {opacity: 1 !important;visibility: visible !important;display: block !important;overflow: auto;} #mobile-footer .mobile-menu {margin-top:0px;padding-bottom:60px} .btn-expand-arrow-footer {display:none} .footer-new {position: absolute;font-size: 0.6rem;left: 15%;background-color: var(--orange);color: black;padding: 2px;border-radius: 3px;top: -80%;} .header-footer {display:grid; grid-template-columns: 10% 89%; align-items: center;padding:10px;grid-gap:1%} .header-footer img{max-width:120px} .header-footer-nav {margin:0; padding:10px 20px;text-decoration: none;color:black;display:block;border-right: 1px solid #cecece;} .header-footer-nav:hover {text-decoration:none;border-bottom:5px solid black;} .footer-grid {display:none !important} .footer section {margin: 20px 0;} .footer .offer-title {font-size: 1rem;font-weight: bold;color: var(--text-color);padding: 10px 0;} .footer .offer-category select {padding: 10px 10px;border: 1px solid #cecece;max-width: 300px;margin: 10px 0;width:90%} .footer .config-price select {padding: 10px 10px;border: 1px solid #cecece;max-width: 300px;margin: 10px 0;;width:90%} .footer .footer-calc input {padding: 10px 10px;border: 1px solid #cecece;width: 280px;margin: 10px 0;} .footer .footer-calc select {padding: 10px 10px;border: 1px solid #cecece;width: 300px;margin: 10px 0;} .footer .footer-calc .calculate {display:block;width: 300px;max-width:unset;padding:10px 0 } .footer .footer-calc .calculatedValue {display:block;margin:10px 0 ;padding:10px 0;} .footer-menu {margin-top:20px} .sub-header-footer {width:100%;max-width: 1500px; margin: 0 auto 20px auto;display:flex;text-align: center;margin-bottom: 5px;padding-bottom: 30px;position: relative} .sub-header-footer::after {content:"";position:absolute;left:0;bottom:0px;border-bottom: 3px solid gray;height:3px;width: calc(100vw - 8px); transform: translateX(-50vw); margin-left: 50%;} .sub-header-footer-2 {width:100%;display:block;color:black;text-align: left;margin-top:20px} .nav-footer-link {color:black;padding:10px 15px;text-decoration:none;font-size: 0.9rem;border-right: 1px solid #cecece;} .nav-footer-link:hover {border-bottom:3px solid black;margin-bottom:-3px} .nav-footer-link-2 {color:black;font-weight:bold;padding:10px 5px;text-decoration:none;border-bottom:1px solid black;font-size: 0.8rem;display:block;align-items: center;} .nav-footer-link-2:hover {border-bottom:5px solid black;text-decoration: none} .nav-footer-link-2:nth-child(n+6) {border-top:none} .nav-footer-link-2:nth-child(n+6) {border-top:none} .container-footer-right {padding-left:0px} .container-footer-right .i-popup {margin-left:3px} .nav-footer-link-3 {color:black;font-weight:bold;background-color:grey;padding:10px 5px;text-decoration:none;border-bottom:1px solid black;font-size: 0.8rem;border-top:1px solid white;display:block;align-items: center;} .nav-footer-link-3:hover {border-bottom:5px solid grey;text-decoration: none} .mob-nav-subfooter {} .onlyMob {display:none} .footer select {background-color:white;} .footer .promoTitleCompany{background-color: var(--company);color: white;padding: 10px;margin-bottom: 10px;} .footer .promoTitlePrivate{background-color: var(--user);color: white;padding: 10px;margin-bottom: 10px;} .active-fl {text-decoration: none; border-bottom: 5px solid black;} .active-fl2 {text-decoration: none; border-bottom: 5px solid black;} .social-box-icon {display:inline-block; padding:0 10px} .social-icon {color:white;} .social-icon i { font-size:1.5rem} .social-media {display: flex;justify-content: end;margin-top: 30px;} .social-icon:hover {color:var(--orange);} .currentCategory {background-color: #cecece; padding: 4px; border-radius: 5px;} .categoryBack {color:var(--orange);font-weight:bold;display:block} .elements .elements-title{position: relative;margin:20px 0 ;font-weight:bold;font-size:1.2rem} .elements .elements-content{margin:20px 0 50px 0 } .thumbnails {position: relative;background-color:#cecece;font-size:0.8rem} .thumbnails a{color:grey;text-decoration: none;font-size:0.8rem} .thumbnails-container {max-width:1500px;position: relative;margin:0 auto;text-align: left;padding:10px} .linearGradient::after {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: linear-gradient(to right, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0));; pointer-events: none;border-radius:10px} .linearGradientSlider::after {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: linear-gradient(to right, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0));; pointer-events: none;} .text-white-big {font-size:3rem; color:white;} .text-white-medium {font-size:2rem; color:white;} .text-white-normal {font-size:1rem; color:white;} .text-white-small {font-size:0.8rem; color:white;} .text-white-tiny {font-size:0.7rem; color:white;} .text-white-micro {font-size:0.6rem; color:white;} .text-big {font-size:4rem; } .text-medium {font-size:2.5rem;} .text-middle {font-size:2rem;} .text-normal {font-size:1rem;} .text-small {font-size:0.8rem; } .text-tiny {font-size:0.7rem;} .text-micro {font-size:0.6rem; } .font-big {font-size:3rem; } .font-medium {font-size:2rem;} .font-middle {font-size:1.5rem;} .font-normal {font-size:1rem;} .font-small {font-size:0.8rem; } .font-tiny {font-size:0.7rem;} .font-micro {font-size:0.6rem; } .text-1-2 {font-size:1.2rem; } .text-1-4 {font-size:1.4rem; } .text-1-6 {font-size:1.6rem; } .text-1-8 {font-size:1.8rem; } .t-100 {font-weight: 100} .t-200 {font-weight: 200} .t-300 {font-weight: 300} .t-500 {font-weight: 500} .t-700 {font-weight: 700} .t-900 {font-weight: 900} .text-italic {font-style: italic} .text-blue {color:#3d759c} .text-orange {color:var(--orange)} .text-quote {position: relative;} .text-quote::before {position: absolute;content: '“';width:60px;height:60px;left:-80px;top:-40px;font-size:5rem;color:var(--brown);font-weight: bold} .text-quote::after {position: absolute;content: '“';width:60px;height:60px;right:-80px;bottom:-40px;font-size:5rem;color:var(--brown);transform: rotate(180deg);font-weight: bold} .grid-2 {display:grid; grid-template-columns: 1fr 1fr ;align-items: flex-start;justify-content: flex-start} .grid-4 {display:grid; grid-template-columns: 1fr 1fr 1fr 1fr;align-items: flex-start;justify-content: flex-start} .grid-80-20 {display:grid; grid-template-columns: 90% 10%;align-items: center;justify-content: flex-start} .grid-gap-1 {grid-gap:10px} .grid-gap-2 {grid-gap:20px} .grid-gap-3 {grid-gap:30px} .grid-gap-4 {grid-gap:40px} .grid-gap-5 {grid-gap:50px} .grid-gap-0-2 {grid-gap:0 20px} .grid-3t {display:grid; grid-template-columns: 1fr 1fr 1fr;align-items: self-start; } .flex {display:flex} .grid {display:grid} .bb {border-bottom:1px solid var(--border);} .bt {border-top:1px solid var(--border);} .bt-w {border-top:1px solid white} .br {border-right:1px solid var(--border);} .mb-05 {margin-bottom:0.5rem} .mb-1 {margin-bottom:1rem} .ml-1 {margin-left:1rem } .ml-2 {margin-left:2rem} .ml-50 {margin-left:50px} .mb-20 {margin-bottom:20px} .mb-2 {margin-bottom:2rem} .mb-2-f {margin-bottom:2rem !important} .mr-2 {margin-right:2rem} .mr-1 {margin-right:1rem} .mb-3 {margin-bottom:3rem} .mb-4 {margin-bottom:4rem} .mb-5 {margin-bottom:5rem} .mb-6 {margin-bottom:6rem} .mb-8 {margin-bottom:8rem} .mt-03 {margin-top:0.3rem} .mt-1 {margin-top:1rem} .mt-10 {margin-top:10px} .mb-10 {margin-bottom:10px} .mt-2 {margin-top:2rem} .mt-3 {margin-top:3rem} .mt-4 {margin-top:4rem} .mt-5 {margin-top:5rem} .mt-6 {margin-top:6rem} .mt-8 {margin-top:8rem} .mt--10 {margin-top:-10px !important} .mt--9 {margin-top:-9px !important} .mt--5 {margin-top:-5px !important} .pb-03 {padding-bottom:3px} .pb-05 {padding-bottom:5px} .pb-06 {padding-bottom:6px} .pb-1 {padding-bottom:1rem} .pb-2 {padding-bottom:2rem} .pb-04 {padding-bottom:0.4rem} .pb-10 {padding-bottom:10px} .pb-20 {padding-bottom:20px} .pt-1 {padding-top:1rem} .pt-10 {padding-top:10px} .pl-1 {padding-left:1rem} .pl-2 {padding-left:2rem} .pl-10 {padding-left:10px} .pt-2 {padding-top:2rem} .pr-1 {padding-right:1rem} .pr-2 {padding-right:2rem} .pr-3 {padding-right:3rem} .pr-10 {padding-right:10px} .pr-50 {padding-right:50px} .pr-100 {padding-right:100px} .p1 {padding:1rem;} .p2 {padding:2rem;} .p5 {padding:5px;} .p10 {padding:10px;} .p20 {padding:20px;} .p30 {padding:30px;} .text-red {color:var(--red);font-weight:bold} .text-cyan {color:var(--cyan);font-weight:bold;text-decoration: none} .text-0-8 {font-size:0.8rem;} .text-1 {font-size:1rem;} .text-1-2 {font-size:1.2rem;} .text-1-4 {font-size:1.4rem;} .text-1-6 {font-size:1.6rem;} .disabled {background-color:#c2c2c2} .bold {font-weight:bold} .dark-grey-box {background-color:var(--dark-grey); color:white;border-radius:10px; padding:20px; } .hide {display:none} .hide-f {display:none !important} .text-center {text-align: center} .text-left {text-align: left} .text-right {text-align: right} .pr {position: relative} .oh {overflow: hidden} .lh-2 {line-height:200%} .w100 {width:100% !important} /* NEW */ .w50 {width:50% } /* NEW */ .w60 {width:60% } /* NEW */ .w70 {width:70% } /* NEW */ .w82 {width:82% } /* NEW */ .mw150 {min-width:150px} .db {display:block} .dib {display:inline-block} .btn-container-right {position: relative;text-align:right } .btn-container-center {position: relative;text-align:center} .ar {position:relative; margin-right:0;margin-left:auto} /* NEW */ .al {position:relative; text-align: left} /* NEW */ .link-orange {text-decoration:none;font-size:1rem;color:var(--orange);position: relative;display:block} .link-cyan {text-decoration:none;font-size:1rem;color:var(--cyan);position: relative;display:block} .link-orange:hover {text-decoration: underline} .link-text {text-decoration:none;font-size:0.8rem;color:var(--dark-grey);} .link-text:hover {text-decoration:underline;} .link-pdf {text-decoration:none;font-size:1rem;color:var(--orange);font-weight: bold} .link-pdf:hover {text-decoration:underline;} .auto-rows {grid-auto-rows: 1fr;align-items: unset} .h100 {height:100%;} .grid-cb {display:grid; grid-template-columns: 20% 80%; justify-content: center;align-items: center} .disabledBtn {background-color:grey !important;color:white !important} .disabledBtnFav {color:grey !important} .fr {float:right} .orange {color:orange} .dark-red {color:var(--red)} .emptyInfo {background-color: white;padding:20px} .backToTop {position: sticky;bottom: 20px;right: 0;background-color: white;border-radius: 50%;padding: 10px;box-shadow: 0px 0px 35px -10px black;left: 100%;display: inline-block;margin-bottom: 20px;} .backToTop:hover {color:var(--red);} .hideBack {display:none !important} .gr13 {grid-row:1/3} .gr12 {grid-row:1/2} .gc914 {grid-column:9/14} .gc913 {grid-column:9/13} .v-center {display:grid;align-items: center;height:100%} p {margin:0} .tar {text-align: right} .checkCont input[type="checkbox"],.checkCont input[type="radio"] { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0;} .mh60 {min-height:60px} .mh80 {min-height:80px} .mh100 {min-height:100px} .mh150 {min-height:150px} .mh200 {min-height:200px} .mh300 {min-height:300px} .mh500 {min-height:500px} .pt-0 {padding-top:0} .colorYellow {color:#ff9700} .colorGreen {color:#3f9d3d} .colorBlue {color:#056eb0} .va-c {align-items: center} .btn-text {text-decoration: none;color:var(--cyan);} .btn-text-white {text-decoration: none;color:var(--white);font-size:0.8rem} .btn-text-orange {text-decoration: none; color: #e05c0b; font-weight: bold;} .btn-text-cyan {text-decoration: none; color: var(--cyan); } .bg-white {background-color:white} .to-right {float:right} .grid-2t {display:grid; grid-template-columns: 1fr 1fr;align-items: start; } .showMob {display:none} .flex-basic-60 {flex-basis: 60%;position: relative} .checkCont {display: inline-block;position: relative;padding-left: 35px;margin-bottom:0;cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;} .checkmark { position: absolute; top: -1px; left: 0; height: 20px; width: 20px; background-color: white;border:2px solid #00aafb;border-radius:5px} .checkCont:hover >.checkmark { background-color: #DFDFDF;} .checkCont input:checked ~ .checkmark { background-color: #00aafb;} .checkCont .checkmark:after { content: ""; position: absolute; display: none;} .checkCont input:checked ~ .checkmark:after { display: block;} .checkCont .checkmark:after { left: 6px;top: 2px; width: 5px; height: 10px; border: solid white; border-width: 0 3px 3px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);} .btn-text-black-regular {text-decoration: none;color:var(--cyan);font-size:1rem;text-transform: lowercase; margin-top:10px;position: relative;display:block} .warning-box {padding:30px 20px 30px 85px;text-align: left;;position: relative;font-size:1rem;height:100%;display:flex;background-color: #cecece;} .warning-box .warning-icon{position: absolute;background-color: #cecece;height: 100%;width: 70px;top: 0;left: 5px; border-radius: 7px 0 0 7px;display: flex;justify-content: center;align-items: center;font-size: 2rem;color: white;} .warning-box .title{text-align: center;} .warning-box .v-center{color:white;font-size:1rem} .warning-box-span {grid-column: 2/2 span;} .loadeContainer {width:100%;min-height:100px; display: flex;align-items: center;justify-content: center} #nav-icon3 { width: 40px; height: 40px; position: relative; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; cursor: pointer; } #nav-icon3 span { display: block; position: absolute; height: 9px; width: 100%; background: #d3531a; border-radius: 9px; opacity: 1; left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out; } #nav-icon3 span:nth-child(1) { top: 0px; } #nav-icon3 span:nth-child(2),#nav-icon3 span:nth-child(3) { top: 18px; } #nav-icon3 span:nth-child(4) { top: 36px; } #nav-icon3.open span:nth-child(1) { top: 18px; width: 0%; left: 50%; } #nav-icon3.open span:nth-child(2) { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } #nav-icon3.open span:nth-child(3) { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); } #nav-icon3.open span:nth-child(4) { top: 18px; width: 0%; left: 50%; } @property --angle { syntax: ''; initial-value: 90deg; inherits: true; } @property --gradX { syntax: ''; initial-value: 50%; inherits: true; } @property --gradY { syntax: ''; initial-value: 0%; inherits: true; } @keyframes borderRotate { 100% { --angle: 420deg; } } @keyframes borderRadial { 20% { --gradX: 100%; --gradY: 50%; } 40% { --gradX: 100%; --gradY: 100%; } 60% { --gradX: 50%; --gradY: 100%; } 80% { --gradX: 0%; --gradY: 50%; } 100% { --gradX: 50%; --gradY: 0%; } } .dots-container {position: fixed;left: 0;top: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.5);opacity: 0;visibility: hidden;transform: scale(1.1);transition: visibility 0s linear 0.25s, opacity 0.25s 0s, transform 0.25s;z-index:9;} .show-dots {opacity: 1;visibility: visible;transform: scale(1.0);transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s;z-index:999} .dots-close {position:absolute;right:0;margin:20px;cursor: pointer;z-index:10;top:0} .dots-content {background-color: white; width: 30%; right: 0; position: absolute; height: calc(100% - 40px);padding:20px;overflow: auto;color:black} .dots-menu {text-align: center} .dots-title {font-size: 1.6rem;padding:20px 10px;border-bottom:1px solid #cecece;cursor:pointer;display: block;text-decoration: none;color:black;background-color: white} .dots-category {text-align: center;padding:10px 5px;background-color:var(--red);color:white;cursor:pointer;display: block;text-decoration: none;color:white} .dots-items {display:grid;grid-template-columns: 10% calc(80% - 50px) 10%;justify-content: flex-start;align-items: center;grid-gap:20px;cursor:pointer;color:white;border-bottom:1px solid white;text-decoration: none} .dots-img img{max-width:100%} .dots-items .dots-name{} .dots-category:hover {background-color:#cecece;color:black} .dots-title:hover {background-color:#cecece;color:black} .modal-category {position: fixed;left: 0;top: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.5);opacity: 0;visibility: hidden;transform: scale(1.1);transition: visibility 0s linear 0.25s, opacity 0.25s 0s, transform 0.25s;z-index:9;} .modal-category-content {background-color: white; width: 30%; max-width:400px; left: 0; position: absolute; height: calc(100% - 40px);padding:20px;overflow: auto;} .modal-category-close {position:absolute;right:0;margin:10px;cursor: pointer;z-index:10;top:0} .modal-category-close i {font-size:1.5rem} .modal-category-items {display:block;cursor:pointer;color:black;border-bottom:1px solid #d5d4d4;text-decoration: none;padding: 10px 0;} .show-modal-category {opacity: 1;visibility: visible;transform: scale(1.0);transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s;z-index:999} .modal {position: fixed;left: 0;top: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.5);opacity: 0;visibility: hidden;transform: scale(1.1);transition: visibility 0s linear 0.25s, opacity 0.25s 0s, transform 0.25s;z-index:9;} .close-button {position: absolute; right: 0; margin: 20px; text-align: center; cursor: pointer; z-index: 10; top: -20px; font-size: 5rem; color: var(--cyan);} .close-button:hover {} .close-button-bonus-info {position:absolute;right:0;margin:20px;width: 1.5rem;line-height: 1.5rem;text-align: center;cursor: pointer;border-radius: 0.25rem;background-color: #cecece;z-index:10;top:0} .close-button-bonus-info:hover {background-color: darkgray;} .show-modal {opacity: 1;visibility: visible;transform: scale(1.0);transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s;z-index:999} .show-modal.modal-i .info-ghost-box{padding: 10px 20px 10px 85px;font-size: 2rem;text-align: center;} .modal-content {width: 720px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-color: white; border-radius: 0.5rem; display: block} .modal-text { text-align: center; background-color: white; border-radius: 0.5rem;} .modal .powiadomienie { } .modal .modalScroll { max-height: 70vh; overflow: auto;height:75vh} .modal .msg-modal {text-align: left; padding:50px 20px 20px 20px;} .modal .msg-modal .temat_wiadomosci {margin-bottom:20px} .modal .title {font-weight:bold;font-size:1.2rem;margin:20px 0 } .modal-bonus-info .modal-content {width:400px} .modal-bonus-info .modal-tresc {text-align: left} .modal-bonus-info .title {font-weight: bold;font-size: 1.8rem; padding: 20px 0;background-color:#047857;border-radius:7px 7px 0 0 ;margin:0;color:white} .modal-bonus-info .title::after {position: absolute;width:20px; height:20px;content:'🎉';left:20px;font-size:4rem;top:0} .modal-bonus-info .bonus-title {font-weight: bold;font-size: 1.6rem; } .modal-bonus-info .bonus-value {font-weight: bold;font-size: 2.0rem; } .modal-bonus-info .bonus-info {font-weight: normal;font-size: 1rem; } .modal-bonus-info .close-button { margin: 20px; color: white; font-weight: bold; font-size: 3rem; background-color: transparent} .modal-bonus-info .close-button:hover { background-color: transparent} .modal-info .modal-content { background-color: #ffffffec; border-radius: 3rem; display: block} .modal-info .modal-text { background-color:transparent} .modal-info .title { background-color:transparent;position: relative;width: 90%; margin: 20px 0 20px auto; text-align: left;position: relative;padding-bottom: 20px;font-size: 3rem} .modal-info .title::after {content:"";position: absolute;bottom:0;width:100%;height:2px;background-color: var(--cyan);left:0;transition: all 0.5s;} .modal-info .tc {text-align: left;padding-left:73px} .modal-info .modal-tresc.tc.p2 {padding-top:0} #mobile { opacity: 0; visibility: hidden; width: 100vw; height: 100vh; left: 0; top: 0; background-color: RGBA(0,0,0,0.9); color: #fff; z-index: 99; display: none; position: fixed; transition: opacity .35s, visibility .35s, height .35s;} .open { opacity: 1 !important; visibility: visible !important; display: block !important; } #mobile .menu-item { font-size: 4vw; color: white; padding: 10px 5px 10px 40px; text-transform: uppercase; display: inline-block; text-decoration: none;} #mobile ul, #mobile li { list-style: none;} #mobile .mobile-menu { position: relative; width: 100%; text-align: left; margin-top: 10%; display: inline-block; z-index: 2; left: 0%;} #mobile ul, #mobile li { list-style: none; padding: 0; margin: 0; margin-top: 0px;} .nav-hover-container-mob { background-color: #333; color: white; } .nav-hover-container { display:block;transition:all 0.3s;;visibility:hidden; opacity:0;position: relative;width:100%;;background-color:#ff7f29;;top:0;} .dropdown-icon-link-mob { font-size: 4vw; color: white; padding: 5px 5px 5px 50px; text-transform: uppercase; letter-spacing: 0px; display: block; text-decoration: none; } .navSticky {position: fixed;top: 0;z-index: 99;background-color:white;width:100%;grid-gap: 1%;box-shadow: 0px 0px 10px 0px black;} .navSticky .headerSticky { display: flex; align-items: center; padding: 10px; grid-gap: 1%;;} .navSticky .btn-nav-sticky { display: inline-block;text-align: center;text-decoration: none;color: var(--blue2);font-size:0.8rem;width:100%;position: relative;cursor:pointer} .navSticky .btn-nav-sticky:hover { color: var(--blue2);} .navSticky .btn-nav-sticky i{ font-size: 1.2rem;width:100%} .navSticky .btn-nav-sticky i.rotateIcon{ transform: rotate(45deg);left: 5px;top: 5px;} .navSticky .btn-nav-sticky:hover i{ color: var(--blue);} .navSticky .hamburger-inner::before{top:-7px} .navSticky .hamburger-inner::after{top:7px} .navSticky .cart-item { top: 2px; left: unset;right:10%;width: 12px;height: 12px;font-size: 0.6rem;} .navSticky .hamburger-inner, .navSticky .hamburger-inner::before, .navSticky .hamburger-inner::after { width: 30px;} .navSticky .hamburger-box { width: 30px;height:15px} .navSticky .hamburger-1.nol { text-align: center;width:100%;top:0} .navSticky .hamburger-text { display:block; text-align: center;font-size:0.8rem;color: var(--text);} .hamburger-1.hamburger {display:none } .hamburger-1.hamburger.is-active {display:block !important} .priceHistory {cursor:pointer;margin-bottom:10px} .priceHistory:hover {text-decoration: underline} .modal-right .modal-content {width: 550px;position: absolute;top: 0;right: 0;background-color: white;display: block;height: 100%;left:unset;transform:unset;border-radius:0} .modal-right .title {font-size:1rem;font-weight:normal} .modal-right .titleOffer {font-size:1rem;font-weight:bold;padding:10px} .modal-right .subTitle {font-size:1rem;color:var(--orange);font-weight:bold} .modal-right .discount { border-radius: 5px; padding: 3px 5px; font-size: 0.8rem; display: inline-block; font-weight: bold;} .modal-right .oldPrice { display: inline-block; text-decoration: line-through; font-size: 0.8rem; color: gray; margin: 10px;} .modal-right .newPrice { color: var(--orange); font-size: 1.8rem; font-weight: bold;} .modal-right .promoBox { display: inline-block; min-width: 30%;border-radius: 5px;padding: 5px;} .modal-right .tresc { padding:20px} .modal-right .btn-icon i { position: absolute; left: 10%; font-size: 1.2rem; top: 10px;} .modal-right .btn-orange-small{ min-width:200px} .modal-right .powiadomienie{ overflow: unset} .modal-right .text-left{ overflow: auto;max-height: calc(-415px + 100vh);} .modal-info .btn-orange-small.btn-icon{ min-width:200px} .modal-info .btn-orange-small.btn-icon i { position: absolute; left: 10%; font-size: 1.2rem; top: 10px;} .show-modal-quqi {opacity: 1;visibility: visible;transform: scale(1.0);transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s;z-index:999} .quqi .modal-content {width: 100%;position: absolute;top: unset;left: 0;transform: unset;background-color: white;border-radius: 0;display: block;bottom: 0;} .quqi .modal-content .modal-text .title {font-size:1.5rem} .quqi .modal-content .modal-tresc {font-size:0.8rem} .quqi .settings-quqi {max-width: 50%; margin: 0 auto; text-align: left;} .quqi .title { padding: 10px 0;position:relative;left:unset;top:unset;color:unset} .quqi label {font-weight: bold} .quqi .quqi-btn-container {text-align: center;display: flex;align-items: center;justify-content:center;grid-gap: 30px;position: relative;margin: 20px 0;} .quqi .quqi-item {margin: 20px 0;} .quqi .checkCont { padding-left: 45px;} .footer-quqi .settings-quqi {width:100%;max-width:100%} .footer-quqi .title {font-weight: bold; font-size: 1.5rem;} .quqi .btn-orange-small{min-width:220px} .quqi .set-quqi{min-width:200px} .quqi .more-info-quqi{min-width:200px} .quqi .btn-quqi-set{padding: 7px 10px;font-size: 0.8rem;} .btn-orange-small {display: inline-block;text-align: center;padding: 8px 20px;color: black;background-color: #7CEA8D;cursor: pointer;min-width: 100px;position: relative;text-decoration: none;font-weight: normal;box-sizing: border-box;} .btn-cyan-small {display: inline-block;font-size: 0.8rem;text-align: center;padding: 8px 10px;color: white;background-color: #4682F5;cursor: pointer;position: relative;font-weight: normal;text-decoration: none;min-width: 100px;box-sizing: unset;margin: 10px 0;max-width: 200px;width: calc(100% - 20px);} .btn-cyan-ghost-small {display: inline-block;font-size: 0.8rem;text-align: center;padding: 7px 10px;color: #7a7979;border: 1px solid #7a7979;cursor: pointer;min-width: 150px;max-width: 200px;width: 100%;position: relative;font-weight: normal;text-decoration: none;} .btn-red-ghost-small {display: inline-block;font-size: 0.8rem;text-align: center;padding: 7px 10px;color: #c72f00;border: 1px solid #AA0000;cursor: pointer;min-width: 150px;max-width: 200px;width: 100%;position: relative;font-weight: normal;text-decoration: none;} .btn-orange {display: inline-block;text-align: center;padding: 11px 20px;color: var(--white);background-color: var(--cyan);;cursor: pointer;min-width: 100px;position: relative;text-decoration: none;font-weight: bold;box-sizing: border-box;} .btn-next {display: inline-block;text-align: center;padding: 11px 20px;color: var(--white);background-color: var(--cyan);cursor: pointer;min-width: 100px;position: absolute;text-decoration: none;font-weight: bold;box-sizing: border-box;right:20px;bottom:10px} .star { font-size: 10vh; cursor: pointer;color:#cecece} .one { color: rgb(255, 0, 0);} .two { color: rgb(255, 191, 0);} .three { color: rgb(164, 233, 95);} .four { color: rgb(5, 233, 83);} .five { color: rgb(24, 159, 14);} .textarea-rating {width: 500px; height: 100px;border-radius:5px;border:1px solid #cecece} .textarea-rating-produkt {border-radius: 5px; border: 1px solid #cecece; width: 90%; margin: 20px auto 0 auto; height: 100px; max-height: 100px; text-align: left;overflow-y: auto} .rate-star-bg {position:absolute;left:0;top:0;background-color:var(--cyan);z-index:0;height:18px} .rate-star-container {display:inline-block;position:relative;height:20px;width:100px;margin:0 10px 0 0} .rate-star-img {position:relative;z-index: 2} .rate-star-img img{max-width:100%;position: relative} .offer-rate {display: flex;} .grid-rate {display: grid;grid-template-columns: 30% 70%;justify-content: flex-start;align-items: flex-start} .grid-rate .star { font-size: 5vh;} .loadRating .modal-tresc {max-height:70vh;overflow-y:auto} .modal-show-rating .offer-rate {display: flex;justify-content: center} .loader {display:none} .loader {position: fixed;z-index: 9999;background-color: RGBA(255,255,255,0.5);width: 100%;height: 100%;text-align: center;display:none;top:0;left:0} .loader img {position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);transform: -webkit-translate(-50%, -50%); transform: -moz-translate(-50%, -50%); transform: -ms-translate(-50%, -50%);} .loader-container {position: fixed;top: 50%;left: 50%;transform: translate(-50%, -50%);transform: -webkit-translate(-50%, -50%); transform: -moz-translate(-50%, -50%); transform: -ms-translate(-50%, -50%);} /* HTML:
*/ #loader { width: 60px; aspect-ratio: 1; display: grid; grid: 50%/50%; color: var(--cyan); --_g: no-repeat linear-gradient(currentColor 0 0); background: var(--_g),var(--_g),var(--_g); background-size: 50.1% 50.1%; animation: l6-0 1.5s infinite steps(1) alternate, l6-0-0 3s infinite steps(1); } #loader::before { content: ""; background: currentColor; transform: perspective(150px) rotateY(0deg) rotateX(0deg); transform-origin: bottom right; animation: l6-1 1.5s infinite linear alternate; } @keyframes l6-0 { 0% {background-position: 0 100%,100% 100%,100% 0} 33% {background-position: 100% 100%,100% 100%,100% 0} 66% {background-position: 100% 0 ,100% 0 ,100% 0} } @keyframes l6-0-0 { 0% {transform: scaleX(1) rotate(0deg)} 50% {transform: scaleX(-1) rotate(-90deg)} } @keyframes l6-1 { 16.5%{transform:perspective(150px) rotateX(-90deg) rotateY(0deg) rotateX(0deg);background-color: var(--orange); } 33% {transform:perspective(150px) rotateX(-180deg) rotateY(0deg) rotateX(0deg)} 66% {transform:perspective(150px) rotateX(-180deg) rotateY(-180deg) rotateX(0deg)} 100% {transform:perspective(150px) rotateX(-180deg) rotateY(-180deg) rotateX(-180deg);background-color: var(--orange); } } .section-payment {max-width:1500px;margin:50px auto;background-color:white;padding:20px 0;} .section-payment .section-title{font-size:1.2rem;font-weight:bold;text-align: center;margin-bottom:20px} .section-payment .section-title span{color:var(--orange)} .section-payment .section-info {font-size:1rem;text-align: center;margin:50px 0} .section-payment .payment-link {text-align: center;margin:50px 0} .section-payment .btn-pay {display:none} .text-bold {font-weight:bold;} .category-nav {position: absolute; top: 50px; background-color: white; width: 100%; text-align: left; border-radius: 5px;transition: 0.3s all; } .category-nav-item {position: relative;display: flex; flex-basis: 200px;} .category-nav .nav-item {font-weight: normal;padding:10px 5px 10px 10px;text-align: left;align-items: flex-start;justify-content: flex-start} .category-nav i{color:#D2D2D2} .category-nav .category-nav-submenu {position: absolute;top:0;left: 150px;background-color: white; border-radius: 5px;width:200px;box-shadow: 0 0 15px -12px black} .category-nav .category-nav-menu {position: relative} .category-nav .subcategory-nav-menu {position: relative} .category-nav .subcategory-nav-submenu {position: absolute;top:0;left: 150px;background-color: white; border-radius: 5px;width:200px;box-shadow: 0 0 15px -12px black} .header-popup {background-color: white;height:50px; } .header-popup span {font-size:1.1rem} .header-popup .header-popup-container {display:flex;justify-content: center;align-items: center;font-size:-.9rem;color:var(--cyan);height: 100%;} .header-popup .close-popup-header {position: absolute;right:20px} .header-popup .close-popup-header i{font-size:2rem;} .summary-info {font-weight: bold} .adminSessionInfo {background-color: red;color:white;padding:10px 0;text-align: center} /* Dla Chrome, Safari, Edge, Opera */ input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; } /* Dla Firefox */ input[type=number] { -moz-appearance: textfield; } @media screen and (max-width : 1600px) { .slider .slider-box-container { width: 45%;} .slider .slider-box { min-height: 800px; } .slider .slider-title { font-size: 3.2vw;} .text-white-big { font-size: 2.5rem;} .text-white-medium { font-size: 1.5rem;} nav .nav-item { padding: 10px 15px;} .slider .slider-box-container {min-width: 400px;} .section-offer-box .section-box { width: 95%;} } @media screen and (max-width : 1440px) { nav .nav-item { padding: 10px 10px; } } @media screen and (max-width : 1360px) { nav .nav-item { padding: 10px 2px; } .header-point { right: 20%;} .slider .slider-title::after {bottom: -80px;} .slider .slider-box-container { width: 35%; top: 150px; margin-left: 0px;} .section-offer-box .offer-box img { max-width: 244px; } .section-about .about-flex { width: 95%; grid-gap:0 70px; } .section-about .section-text { font-size: 1.3rem;} .section-why-us .why-us-flex { width: 90%; grid-gap: 0 80px;} .section-why-us .why-us-title { font-size: 1.6rem;} .section-why-us .section-text { font-size: 1.2rem;} .section-big-box { margin-bottom: 200px; min-height: 700px; } .section-big-box .big-box-container { right: 2%;top:5%} .slider .slider-sub-title { font-size: 1.4rem;} .section-offer-details .offer-details-container { width: 90%;} .section-offer-box-nav .offer-box-nav { height: 70px;} .section-offer-box-nav .offer-box-title-nav { font-size: 0.6rem; } .section-offer-box .offer-box { min-width: 19%;} } @media screen and (max-width : 1200px) { nav .claim {display:none} } @media screen and (max-width : 720px) { body { background-size: 100% 170%;} .header-popup .header-popup-container { display: block;padding: 5px 50px 5px 5px;} .header-popup { height: auto;} .user-nav-item2 {display:none} nav {min-height:10px} .showMob { display: block;top:unset;bottom:0} .grid-nav-top {display:none} .grid-logo {display:block;} .header {height:auto;position: relative;margin-top:0px;} .container {max-width:100%;} nav {position: relative;top:0} nav .nav-container {display:none} .header-phone { top: 75px; left: 10%;} .header-phone img { max-width: 30px; max-height: 30px;} .header-point { display:none} .slick-list { max-width: 100%;} .showSubmenu { display: none; } .user-nav-item {display:none} .nav-hover-container { display:block;transition:all 0.3s;;visibility:visible; opacity:1;position: relative;width:100%;;background-color:transparent;;top:0;} .align-items-center.flex-col {display:none} .container-bg.sign-up::before { display:none} .container-bg.sign-in::before { display:none} body .contentOverflowHidden { overflow: unset; width: 100%; height:auto; position: relative; display: block; align-items: center; justify-content: center;} .form {width:calc(100% - 60px);margin:0 auto;} .register.form {width:calc(100% - 60px);margin:0 auto;} .login .form.sign-in {;margin:0 auto;} .btn-title-log { padding: 10px; font-size: 3.5vw;} .btn-title-reg { padding: 10px; font-size: 3.5vw;} .login.logon.bg-white.form {position: absolute; left: 20px;min-height: 300px;} .register.bg-white.form {position: absolute; left: 15px;min-height: 500px;} .rozwinMenu { background-color: var(--cyan); color: white; padding: 3px 10px; cursor: pointer; } .dropdown-icon-link-mob { font-size: 4vw; color: white; text-transform: uppercase; letter-spacing: 0px; } .form {transition:all 0.3s;;} .dropdown-title { text-align: left} .slider { max-width:100% } .slider .slider-title { font-size: 8vw; margin-top: 80px; } .slider .slider-title::after { bottom: -60px; } .slider .slider-sub-title { font-size: 1rem; } .slider .text-number { font-size: 1.4rem;} .slider .text-price { font-size: 2rem;} .slider .slider-box { min-height: 80vh; } .section-category .category-grid { grid-template-columns: 1fr 1fr; } .slider .sliderBox { height: 180px; } .slider .sliderBoxContainer { left: 10px; top: 20px;max-width: 90%;margin:0 auto} .slider .sliderBox .sliderTitle { font-size: 0.8rem;} .slider .sliderBox .sliderText1 { font-size: 1.2rem;margin-bottom:10px;margin-top:0;text-shadow: 0 0 2px black;} .slider .sliderBox .sliderText2 { font-size: 1.0rem;margin-bottom:10px;margin-top:0;text-shadow: 0 0 2px black;} .slider .sliderBox .sliderText3 { font-size: 1.2rem;margin-bottom:10px;margin-top:0} .slider .sliderBox { background-size: cover;position: relative;} .slider .sliderBox .sliderBtn { padding: 5px 20px; font-size: 0.9rem; margin-top: 10px;} .nextItem { right: 10px;} .prevItem { left: 10px;} .section-products-module .products-module-foto { padding: 20px; min-height: 120px; } .section-products-module .btn-item-details {font-size:0.7rem} .section-products-module .products-module-price { font-size: 1.0rem;} .navSticky .btn-nav-sticky { font-size: 0.6rem; } .search-container { width: 98%; margin: 0 auto 10px auto;} input[name="search"] { padding: 5px 5px 6px 5px; } .navSticky .btn-nav-sticky i {color:var(--orange);margin-bottom:5px} .grid-category {display:block} .btn-item-details { font-size: 0.7rem; } .products-list-title { font-size: 0.8rem;} .section-products-list .list-items { grid-template-columns: 49% 49%;grid-gap:10px} #pagination { padding:0;margin-top:10px} #pagination li{ margin-bottom:5px} footer .menu-container { display: grid;grid-template-columns: 1fr 1fr;} footer {padding-bottom:60px} .user-nav-container { justify-content: start;display: block} .nav-container {display: none} .dashboard .grid-3t { grid-template-columns: 1fr;} .dashboard .dashboard-box-title { font-size: 1.6rem;} .dashboard .box-value { font-size: 2.5rem;} .grid-dashboad { grid-template-columns: 1fr ;width: calc(100% - 20px);margin:0 auto} .dashboard.container { margin-top: -60px;} .dashboard .dashboard-box { margin-top: 0px;} .dashboard .dashboard-box-info { display: block;} .dashboard .progress-container { position: relative; top: 0; right: 0; width: 90%;} .dashboard .progressAdd { margin-top: 0px;} .dashboard .progres-info-text {display:none} .news-container .news-box { margin-bottom: 20px; display: grid; grid-template-columns: 1fr; grid-gap: 0px;} .last-status-container { width: calc(100% - 20px); } #lang a { color: white; text-decoration: none;} .open { visibility: visible !important;} #lang { display: block; position: relative; right: 0; left: 11%; margin-top:20px;max-width:80%} #lang .lang-box {display:inline;width:30px;margin-right:10px;font-size: 0} #lang .lang-box img {max-width:100%} .btn-lang {background-color: transparent;color:white;display:block;margin:5px 0;padding:5px } .btn-lang.selected_lang {background-color: white;color:black;display:block;padding:5px} .mobile-menu-box { max-height: 85vh; overflow-y: auto; } #mobile .close-hamburger-menu {position: fixed;right: 0;bottom: 65px;font-size: 1rem;cursor: pointer;z-index: 999;background-color: white;;width: calc(100% - 60px);left: 2.5%;text-align: center;padding: 10px 20px;border-radius: 5px;color:black} footer .footer-grid-grey { display: grid; grid-template-columns: 1fr 1fr;} .footer-box a {padding:5px 0;display:block} .login .grid-2 {display:block} .login label {width: 100%; text-align: center; margin-right: 0%;padding:0 5px} .login .login-email-box { width: 100%;} .logon { padding: 10px;} .login .title { padding-top: 0;} .login .form-content { padding: 0px;max-width:90%} .btn-login {width:100%} .btn-2 {margin-top:10px} .login .logon-step-one { position: relative;} .login .logon-step-two { } .login .logon-step-two-email { position: relative;} .installations .installations-container { width:calc(100% - 30px);padding:10px} .installations-wraper .installations-container { width:calc(100% - 30px);padding:10px} .installations-list {min-width:1400px;} .installations-list-load {overflow-y: scroll;max-width: calc(100% - 0px);} .filterContainer {position: relative;display:block;float: unset;top:0;width:100%;font-size:0.8em;margin-bottom:10px} .filterContainer input { width: 96%;} .filterContainer select { width: 100%; max-width: unset} .register {margin-top:20px;padding:10px} .register .checker label { margin-right: 0%; } .register input {width:calc(100% - 20px)} .filter-item-input {margin-bottom:7px} .btn-filter {padding:8px 20px !important; text-align: center;margin:10px auto} .bonus .bonus-container {width:calc(100% - 20px);padding:10px} .btn-add-installation {width: calc(100% - 42px); position: relative; display: block; margin: 0 auto; margin-top: 10px; right: unset; top: unset; margin-bottom: 10px} .bonus-list-load {overflow-y: scroll;max-width: calc(100% - 0px);} .bonus-list-elem {min-width:1000px;} .bonus-list-header {min-width:1000px;} .banners .bannersBox .bannersText1 { font-size: 8vw;} .banners .bannersBox .bannersText2 { font-size: 8vw;} .banners .bannersBox .bannersText3 { font-size: 8vw;} .banners .bannersBox { height: 200px;} .banners .size33 { grid-template-columns: 1fr;} .banners .size50 { grid-template-columns: 1fr;} .banners .size25 { grid-template-columns: 1fr;} .banners .size20 { grid-template-columns: 1fr;} .elements {padding:10px;width:calc(100% - 20px)} .fa-lock-alt {display:none !important} .register .viewPass { top: 10px;right:10px} .register .subscribe-newsletter { width: 30px; display: inline;} .btn-register {width:100%} .login .register-info {width:unset;text-align: left} .login .register-info a { font-size: 0.8rem; color: black;} .product-grid {display:block;padding:10px} .modal .grid-2 { display: block;} .btn-item-details { width: calc(100% - 20px);} .cart .grid-cart { display: block;} .cart .cart-left {padding:10px} .cart .cart_name {grid-column: 1/5 span;} .cart .cart_count {grid-column: 1/5 span;} .cart .cart_remove_item {position: absolute; top: 10px;right:10px;} .cart .cart-all-remove {position: absolute; right: 0; top: 4px;} .dots-content { width: 100%;padding:0;height:100%} .dashboard {padding:10px;width:calc(100% - 20px)} .dashboard .grid-3 {display:block;width: 100%;} .dashboard .dashboard-box {padding-right:0;border-right:none} .dashboard .dashboard-invoices-list-elem { display: grid; grid-template-columns: 1fr 1fr 131px; font-size: 0.8rem; padding: 10px 0;} .details .grid-2t {display:block} .details .grid-details {margin-bottom:10px} .details .btn-cyan-ghost-small {margin-bottom:10px} .details .grid-order-header{display:none} .details .grid-order { display: block;} .order-details { margin: 10px auto 0px auto;width:calc(100% - 40px)} .settings .form-user-container {max-width: 100%;width:calc(100% - 40px)} .settings .grid-user-settings {display:block} .settings .sms-flex {display:block} .settings .email-flex {display:block} .section-products-module .products-module-title { min-height: 60px;display:block} footer .menu-container {display:block} .footer.container section {padding:10px} .backToTop { bottom: 60px;k; left: 84%;} .modal-right .modal-content {width: 100%;} .section-products-list { width:calc(100% - 10px); margin:0; padding: 5px;} .products-list-name { font-size: 6vw; font-weight: 500;} .section-products-list .nav-settings {display:none} .section-products-list .logo-solar { position: absolute; top: 5px; right: 15px;width: 100px;} .products-list-container { display: grid; grid-template-columns: 1fr 1fr ; } .products .section-items-products { display: grid; grid-template-columns: 1fr;} .products .container { width:calc(100% - 10px); margin:0; padding: 5px;;} .products-module-content {padding:0 10px} .btn-container-bonus {width:100%} .installations { min-width: 1000px; } .container-bonus { overflow-y: scroll; max-width: calc(100% - 0px); } .filterContainerInst { grid-template-columns: 1fr;} .installations-wraper .title { font-size: 6vw;} .filterContainerInst { position: relative; display: block; float: unset; top: 0px;magin-bottom:10px} .filter-item-select {margin-bottom:10px} .steps { max-width: 100%; margin: 0 auto 30px auto;} .stepper-item:nth-child(1) .step-counter::before, .stepper-item:nth-child(2) .step-counter::before { content: ""; position: absolute; top: 33%; left: 71%; width: 65%;} .box-width-40 { width: 100%; margin: 0px auto; position: relative; background-color: white; padding: 0px; border-radius: 10px;} .modal-distributor .modal-content { width: 95%;} .modal-distributor .nav-settings { display:none} .modal-distributor .title { text-align: left;padding-left:10px} .close-button { position: absolute; right: 15px; margin: 0px; text-align: center; cursor: pointer; z-index: 10; top: -10px; font-size: 4rem; color: var(--cyan);} .search-container { display: grid; grid-template-columns: 60% 40%;} .btn-search-dist { padding: 6px 20px;} .modal-distributor .sec {font-size:0.8rem} .dist-select-grid { grid-template-columns: 20% 17% 25% 15% 20%;} .btn-select { padding: 5px 7px;} .bonus-saldo-all { width: calc(100% - 10px);} .bonus-saldo { width: calc(100% - 10px);} .modal-content { width: 95%;} .modal-info .title { font-size: 6vw;} .modal-info .tc { text-align: left; padding-left: 35px;} .grid-type-elements-container {display:none} .elem-select-grid-header {min-width:500px} .loadElements {min-width:500px} .settings .nav-box { font-size: 1.0rem;} .settings .grid-b-r { border-right: unset; margin-right: 0px; padding-right: 0px;} }