@import url("all.css"); @font-face {font-display:fallback; font-family:agency; src:url(../fonts/Exo2.0-ExtraLight.otf)}
@font-face {font-display:fallback; font-family:exo; src:url(../fonts/exo2bold.ttf)}
 * {margin:0; padding:0; box-sizing:border-box}
body {color:#000; font-family:arial; font-size:16px}
a {text-decoration:none}
ul {list-style:none}
.clear {clear:both}
.cmt.metrika p{padding:10px 0}
#agree {
 position: fixed;
  background: #2d5728e0;
  padding: 20px;
  display: flex;
  color: #fff;
  align-items: center;
  bottom: 10px;
  left: 5%;
  border-radius: 30px;
  width: 500px;
  z-index: 10;
  line-height: 1.7;
  font-size: 90%;
}
#button-agree {
  padding: 10px 18px;
  color: #fff;
  text-decoration: none;
  text-align: center;
  background: #ff2e2e;
  border-radius: 30px;
  transition: 0.5s;
  border: none;
  align-self: center;
  cursor:pointer;
  margin: 0 10px;
}
#button-agree:hover{background:#dccf73;}
#agree a, #agree label{color: #b9b8b8;
  text-decoration: underline;}
#agree a:hover, #agree label:hover{color:#dccf73; text-decoration:none}
.cmt.metrika{padding:30px;background:#fff}
#header .logo img {width:85%}
.h-top {background:#2d5728; color:#fffdd0; margin:0; padding:7px; font-size:80%; text-align:center}
.h-top i {color:#dccf73; width:15px}
.h-top i:hover {color:#fff}
#header {padding:10px 5%; display:flex; justify-content:space-between; align-items:flex-start}
.h-r {display:flex; flex-direction:column; align-self:stretch; justify-content:center}
.h-r-center {display:flex; flex-basis:50%; align-self:stretch; justify-content:space-between}
.tel:hover {font-weight:bold}
.h-r p {margin:5px 0}
a.boton1 {background:#ff2e2e; border-radius:30px; color:#fff; display:block; font-weight:bold; margin-top:5px; padding:15px 20px; text-align:center; text-decoration:none; transition:all 0.3s}
 a.boton1:hover {background:linear-gradient(to bottom,#b57f2d,#f6cf5e)}
.tel {color:#2d5728; font-size:140%; margin:4px 0 7px 0}
.scrollup {background:url(../images/icon_top.png) no-repeat; bottom:50px; display:none; height:50px; opacity:0.3; outline:0; position:fixed; right:50px; text-indent:-9999px; width:50px}
.scrollup:hover {opacity:1}
.block4 {padding:50px 10%}
.block4 p {margin:15px 0}
.block4 h2 {color:#2d5728; font-family:exo; font-size:180%; text-align:center}
.shop {display:flex; flex-wrap:wrap; margin:50px -1%}
.sale i {margin-right:5px}
.shop .card {flex-basis:31.3%; margin:1%; box-shadow:0 3px 7px 0 rgba(0,0,0,0.07); display:flex; flex-direction:column; justify-content:space-between}
.shop.key .card {flex-basis:23%; border-top:4px solid #dccf73}
.price span.price {padding:20px 0; color:#2d5728; font-weight:bold; text-decoration:none}
.price span {color:#666; text-decoration:line-through}
.shop .card:hover {-webkit-box-shadow:0 5px 12px 4px rgba(9,9,9,0.1); -moz-box-shadow:0 5px 12px 4px rgba(9,9,9,0.1); box-shadow:0 5px 12px 4px rgba(9,9,9,0.1)}
.old_price {text-decoration:line-through}
.block_price p span {color:#ec5849}
.block_price p span.price {font-size:200%}
.price_1 {position:absolute; bottom:0; padding:10px 20px; color:#fff; background:#dccf72; left:5%; border-radius:4px 4px 0 0; font-weight:bold; text-shadow:1px 2px 2px #000; font-size:150%}
.shop img {width:100%; max-width:100%; max-height:100%}
.grey h3 {font-size:110%; color:#333; padding:20px 0; font-family:agency}
.grey {padding:0 20px}
.grey p {padding:20px 0; border-top:1px solid #666; color:#2d5728; font-weight:bold}
.hover-image-scale img {transition:1s; display:block}
.hover-image-scale img:hover {transform:scale(1.2)}
.hover-image-scale {display:inline-block; overflow:hidden; position:relative; width:100%}
.sale {position:absolute; top:0; padding:10px 20px; color:#fff; background:#ff2e2e; left:0}
#talltabs-black {background:#2d5728; width:100%; position:sticky; padding:0 5%; top:0; z-index:10; display:flex}
.top-menu {display:flex}
.top-menu li {position:relative}
.top-menu > li > a {font-family:agency; display:block; padding:18px; letter-spacing:1px; color:#fff; transition:.2s linear}
.top-menu > li > a:hover {background:#698e64}
.dropdown:after {content:"\f107"; font-family:'Font Awesome 5 Free','Font Awesome 5 Brands'; font-weight:900; margin-left:4px; vertical-align:middle}
.submenu {background:#f3f6f8; padding:25px 5%; position:absolute; top:100%; left:0; z-index:5; opacity:0; visibility:hidden; transform:translate3d(0,30px,0); transition:.5s ease-out; transform-origin:0 0}
.submenu {min-width:200px; padding:10px 0}
.top-menu > li:hover .submenu {opacity:1; visibility:visible; transform:translate3d(0,0,0)}
.submenu li {padding:0 18px}
.submenu li a {display:block; padding:5px 0; color:#333}
.submenu li a:hover {color:#2d5728}
.submenu > li > a:after {display:block; content:""; height:1px; width:0; background-color:#2d5728; transition:width 0.4s ease-in-out; margin:5px 0}
.submenu > li > a:hover:after,.submenu > li > a:focus:after {width:100%}
.menu-icon {cursor:pointer; display:none; height:30px; position:relative; width:30px; z-index:19}
.menu-icon-line {background:#ff2e2e; height:5px; position:relative; width:30px}
.menu-icon-line::before {background:#ff2e2e; content:""; height:5px; left:0; position:absolute; top:-10px; transition:transform 0.2s ease-in,top 0.2s linear 0.2s; width:30px}
.menu-icon-line::after {background:#ff2e2e; content:""; height:5px; left:0; position:absolute; transition:transform 0.2s ease-in,top 0.2s linear 0.2s; top:10px; width:30px}
.menu-icon.menu-icon-active .menu-icon-line {background-color:transparent}
.menu-icon.menu-icon-active .menu-icon-line::before {top:0; transform:rotate(45deg); transition:top 0.2s linear,transform 0.2s ease-in 0.2s}
.menu-icon.menu-icon-active .menu-icon-line::after {top:0; transform:rotate(-45deg); transition:top 0.2s linear,transform 0.2s ease-in 0.2s}
.mobile-nav .ul_menu {margin:15px}
 .mobile-nav__list li ul li {border-bottom:1px dashed #fff; padding-bottom:5px}
.mobile-nav {overflow-y:auto; background:#2d5728ed; display:block; height:100%; padding:20px 10px; position:fixed; right:-300px; top:0; transition:transform 0.4s ease-in; width:300px; z-index:9}
.mobile-nav--active {transform:translateX(-100%)}
.mobile-nav__list {margin:20px}
.mobile-nav__list li {margin-bottom:25px}
.mobile-nav__list li a {color:#fff}
.mobile-nav__list li a:hover {color:#dccf73}
::-webkit-input-placeholder {font-size:14px; color::#999; opacity:10; font-family:arial}
::-webkit-texarea-placeholder {font-size:14px; color::#999; opacity:10; font-family:arial}
::-moz-placeholder {font-size:14px; color::#999; opacity:10; font-family:arial}
:-moz-placeholder {font-size:14px; color::#999; opacity:10; font-family:arial}
:-ms-input-placeholder {font-size:14px; color:#999; opacity:10; font-family:arial}
:-ms-texarea-placeholder {font-size:14px; color:#999; opacity:10; font-family:arial}
:focus::-webkit-input-placeholder {opacity:0}
:focus::-moz-placeholder {opacity:0}
:focus:-moz-placeholder {opacity:0}
:focus:-ms-input-placeholder {opacity:0}
 #block1 {background:url(../images/bg2.jpg); background-size:cover}
#block1 h1 {font-size:380%; font-family:exo; max-width:62%}
 .prev-1 {padding:6% 10%; background:#2d57288c url(../images/pattern-header.png) no-repeat; background-position:bottom; color:#fff; display:flex; justify-content:space-between}
.forma {background:#dccf73c9; ; border-radius:5px; box-shadow:0 4px 12px rgba(0,0,0,0.2),0 10px 18px rgba(0,0,0,0.2); padding:20px; color:#000; max-width:350px}
.forma label {line-height:1}
.forma h2 {font-size:100%; font-weight:normal}
.form-at {width:100%; margin-top:15px; overflow:hidden; font-size:0; letter-spacing:0}
.validate-input-at,.no-validate-input-at {width:100%; position:relative; background-color:#fff; border-radius:2px; margin-bottom:20px}
.validate-input-at.w-50,.no-validate-input-at.w-50 {width:calc(50% - 10px); display:inline-block}
.validate-input-at.w-50:first-child,.no-validate-input-at.w-50:first-child {margin-right:20px}
.input-at {display:block; width:100%; background:transparent; color:#000}
input.input-at {height:50px; padding:0 20px 0 20px; font-size:16px; outline:none; border:none}
textarea.input-at {padding:18px 20px; font-size:16px; line-height:22px; outline:none; border:none; resize:none}
textarea.input-at:focus,input.input-at:focus {border-color:transparent}
.focus-input-at {position:absolute; display:block; width:calc(100% + 2px); height:calc(100% + 2px); top:-1px; left:-1px; pointer-events:none; border:1px solid #2d5728; border-radius:2px; visibility:hidden; opacity:0; transition:all 0.4s; transform:scaleX(1.1) scaleY(1.3)}
.input-at:focus + .focus-input-at {visibility:visible; opacity:1; transform:scale(1)}
.form-at-btn {background:#ff2e2e; border-radius:30px; color:#fff; display:block; font-weight:bold; text-align:center; position:relative; display:block; padding:0 40px; height:50px; font-size:14px; transition:all 0.4s; margin:0 auto; outline:none; border:none; cursor:pointer}
.form-at-btn:hover {background:linear-gradient(to bottom,#b57f2d,#f6cf5e)}
.form-at-btn[disabled] {opacity:.6; cursor:not-allowed}
.alert-validate::before {content:attr(data-validate); position:absolute; max-width:70%; background-color:#fff; border:1px solid #c80000; border-radius:2px; padding:4px 25px 4px 10px; top:50%; transform:translateY(-50%); right:12px; pointer-events:none; color:#c80000; font-size:13px; line-height:1.4; text-align:left; visibility:hidden; opacity:0; transition:opacity 0.4s}
.alert-validate::after {content:"\f129"; font-family:"FontAwesome"; display:block; position:absolute; color:#2d5728; font-size:18px; font-weight:bold; top:50%; transform:translateY(-50%); right:22px}
.alert-validate:hover:before {visibility:visible; opacity:1}
.error-at {color:red; padding:10px 0}
.success-at {color:#2d5728; font-size:28px; padding:20px 0; text-align:center}
.blur .success-at {color:#fff}
 .contact .success-at {color:#dccf73}
.form-at input[type=checkbox] {display:none}
.form-at input[type=checkbox] + label {display:block; position:relative; margin:0 0 20px 34px; font-size:13px; color:#333333}
.blur input[type=checkbox] + label {display:block; position:relative; margin:0 0 20px 34px; font-size:13px; color:#fff}
.form-at input[type=checkbox] + label:before {position:absolute; content:''; width:26px; height:26px; line-height:22px; left:-34px; border:1px solid #2d5728; border-radius:2px}
.blur input[type=checkbox] + label:before {position:absolute; content:''; width:26px; height:26px; line-height:22px; left:-34px; border:1px solid #fff; border-radius:2px; top:-5px}
.form-at a {color:#2d5728}
.form-at input[type=checkbox]:checked + label:before {content:'\2714'; color:#2d5728; font-size:14px; text-align:center; font-weight:bold; border:1px solid #2d5728}
.blur input[type=checkbox]:checked + label:before {content:'\2714'; color:#fff; font-size:14px; text-align:center; font-weight:bold; border:1px solid #fff}
.form-searh button {position:absolute; top:0; right:0; width:44px; height:44px; border:none; background:#2d5728; cursor:pointer; border-radius:50%}
.form-searh button::before {content:"\f064"; font-family:'Font Awesome 5 Free','Font Awesome 5 Brands'; font-weight:900; color:#fff}
.form-searh {position:relative; transition:all 1s; margin:12px 0 0}
.form-searh input {width:100%; outline:0; border:1px solid #fff; background:#f0e8e8; border-radius:20px; padding:15px 20px; min-width:250px}
.form-searh input:hover,.form-searh input:focus {border:1px solid #ccc; background:#fff}
.form-searh button:hover {background:#dccf73}
.sale_price span {color:#f2f1f0; text-decoration:line-through; font-size:90%; font-family:agency}
#section .bannerText p.sale_price {color:#dccf73; font-family:exo}
.bannerText .css-modal-checkbox {margin:0 auto; width:200px}
.oval-row {display:flex; flex-wrap:wrap}
input[type=sabmit] {-webkit-appearance:none}
.w50 {flex:0 0 50%}
iframe {width:100%; height:400px; border:none}
#section {overflow:hidden; margin:20px 10%; font-family:agency}
.action {color:#fff; font-size:120%; font-weight:bold}
#section .oval-row {flex-direction:row-reverse}
#section .bannerText p.snoska {font-size:90%; color:#bfb8b8; line-height:20px}
#section .bannerImage {background:url("../images/action-na-dosku-2-sorta.jpg"); background-size:cover; background-position:center center; background-color:#2d5728}
#section .bannerText {background-color:#2d5728; position:relative; z-index:1; padding:80px 40px; }
#section .bannerText .oval {position:absolute; background-color:#2d5728; top:-50%; right:0; box-shadow:20px 8px 16px rgba(0,0,0,0.2); border-radius:50%; z-index:-1; content:''}
#section .bannerText h2 {font-size:300%; color:#FFF; text-align:center; font-family:exo; letter-spacing:3px}
#section .bannerText p {font-size:26px; line-height:45px; color:#FFF; margin:30px 0; text-align:center}
#footer {background:url(../images/bg.jpg) no-repeat; background-size:cover; margin:100px 0 0 0; position:relative}
.footer-bottom {background:#1d0d04de; border-top:1px #fff dashed; color:#fff; font-size:80%; padding:10px 20px; text-align:center}
.footer {background:#1d0d04de url(../images/pattern-footer.png) no-repeat; background-position:top; padding:70px 10%; display:flex; justify-content:space-around; color:#fff}
.foot {flex-basis:33%; padding:50px 0 0 50px}
.foot.logo {text-align:center; padding:0}
.foot.logo h3 {padding:30px}
.foot.logo a {font-size:120%}
.foot ul {margin:20px 0 0}
.foot ul li {margin:15px 0}
.foot a:hover {color:#f2f1f0}
.foot a {color:#e6dd9a}
.icon img:hover {opacity:0.7}
.icon img {width:40px}
.foot ul.icon li {margin:0 8px; font-size:150%}
.icon {display:flex; justify-content:center}
.block3 .css-modal-checkbox {float:right; font-size:90%}
.block3_1 ul {margin-top:10px}
.block3_1 ul li {margin:40px 0; width:90%; border-radius:5px; font-size:100%; padding:30px; text-align:center}
.block3_1 ul li div {border-radius:5px; font-size:100%; padding:30px; text-align:center; font-family:agency; font-weight:bold}
.block3 {align-items:center; background:#fff url(../images/01.jpg) right no-repeat; padding:30px 10%; margin-top:50px; margin-top:50px; display:flex}
.block3 h2 {color:#2d5728; font-family:exo; font-size:220%; margin:30px 0}
.block3_1 p {font-size:110%; color:#333; margin:15px 0; line-height:1.6}
.block3_1 {padding-right:5%; flex-basis:50%}
.gold2 {background:#e6dd9a}
.gold1 {background:#dccf73}
.gold {background:#e9bf54}
.lb-album {display:flex; flex-wrap:wrap}
.lb-album li {flex-basis:48%; margin:1%}
.lb-album img,.images_category {--a:8deg; width:100%; aspect-ratio:1; border-radius:20px; transform:perspective(400px) rotate3d(var(--r,1,-1),0,calc(var(--i,1)*var(--a))); -webkit-mask:linear-gradient(135deg,#000c 40%,#000,#000c 60%) 100% 100%/250% 250%; transition:.4s; cursor:pointer}
.alt,.images_category {--r:1,1; -webkit-mask:linear-gradient(45deg,#000c 40%,#000,#000c 60%) 0 100%/250% 250%}
.lb-album img:hover,.images_category:hover {--i:-1; -webkit-mask-position:0 0}
.images_category {width:30%; margin:0 20px 20px 0; float:left }
.alt:hover {-webkit-mask-position:100% 0}
.main .block_6 {margin:50px 0 50px}
.description a {color:#2d5728}
.description a:hover {color:#666}
.description ul {counter-reset:li; margin:30px}
.description ul li {position:relative; border:2px solid #dccf73; background:#f8f3f3; padding:16px 20px 16px 28px; margin:12px 0 12px 40px; -webkit-transition-duration:0.3s; transition-duration:0.3s; font-size:105%; line-height:1.5}
.description li:hover {background:#fff; border:2px solid #2d5728}
.description li:before {line-height:32px; position:absolute; top:4px; left:-40px; width:40px; text-align:center; font-weight:bold; color:#FFF; background:#dccf73; counter-increment:li; content:counter(li); -webkit-transition-duration:0.2s; transition-duration:0.2s}
.description li:hover:before {width:46px; background:#2d5728}
.description li:after {position:absolute; left:0; top:4px; content:""; height:0; width:0; border:16px solid transparent; border-left-color:#dccf73; -webkit-transition-duration:0.2s; transition-duration:0.2s}
.description li:hover:after {margin-left:6px; border-left-color:#2d5728}
 .block5 {margin:0 10%; display:flex; justify-content:space-between; align-items:center}
.block5 div {flex-basis:48%}
.block5 h3 {font-family:exo; margin:15px auto; color:#2d5728; font-size:180%}
.block5 p.focus {font-size:120%; margin-top:15px; background:#ff2e2e; border-radius:5px; padding:10px 20px; color:#fff; line-height:1.4; text-align:center}
.block5 p {line-height:1.7; margin:10px}
.block5 h2 {color:#2d5728; font-family:agency; font-size:200%}
.title {background:url(../images/bg2.jpg) no-repeat; background-size:cover}
.title .prev-1 {padding:30px 5% 40px; font-size:120%}
.title h1 {color:#fff; font-family:exo}
.article {margin:100px 10%; border-top:1px solid #666; padding:30px 0}
.article .grid {flex-wrap:nowrap}
.article .grid figure {flex-basis:100%}
.article .grid figure h3 {font-size:140%; color:#fff; font-family:exo; padding:20px; text-shadow:-1px 0 black,0 1px black,1px 0 black,0 -1px black}
.article .grid figure p {font-size:85%}
.breadcrumb {display:flex; position:absolute; top:20px; left:0; background:#2d5728; padding:8px 10px; color:#fff}
.breadcrumb a,.wrapper .breadcrumb a {color:#dccf73; text-decoration:underline}
.breadcrumb a:hover,.wrapper .breadcrumb a:hover {color:fff; text-decoration:none}
.breadcrumb li:nth-last-child(1)::after {position:absolute; right:-44px; top:-8px; content:""; height:0; width:0; border:18px solid transparent; border-left-color:transparent; border-left-color:transparent; border-left-color:#2d5728; -webkit-transition-duration:0.2s; transition-duration:0.2s}
.breadcrumb li:nth-child(1) span {font-size:0}
.breadcrumb li {padding:0 5px; position:relative}
.title .prev-1 {display:block}
.block_6 .forma {max-width:100%}
.main .forma h2 {color:#fff}
.description {margin-top:100px}
.main {padding:100px 10% 0; position:relative}
.main p {line-height:1.7; margin:15px 0}
.forma.blur .form-at {display:flex; flex-wrap:wrap; justify-content:center; margin:20px -1.5%}
.forma.blur .form-at div {flex-basis:31%; margin:1%}
.block_6 {background:url(../images/pilovochnik1.jpg) no-repeat; background-size:auto; background-size:cover; margin:100px 10% 50px; font-size:150%; line-height:1.5; font-weight:bold; letter-spacing:1px; text-align:center; padding:5%}
.forma.blur label[for] {font-size:50%; text-align:left}
.forma.blur a {color:#dccf73}
.forma.blur a:hover {color:#fff}
.block_6.blur1 {background:url(../images/brus-1.jpg) no-repeat; background-size:cover}
.block_6.blur2 {background:url(../images/doska-1.jpg) no-repeat; background-size:cover}
.block_6.blur3 {background:url(../images/doska-2.jpg) no-repeat; background-size:cover}
.block_6.blur4 {background:url(../images/brus-1.jpg) no-repeat; background-size:cover}
.block_6 .blur {backdrop-filter:blur(5px); background:#2d582ac2; color:#fff; padding:5%}
.grid {display:flex; flex-wrap:wrap; margin:0 -2%}
.grid figure {position:relative; overflow:hidden; margin:2%; flex-basis:46%; cursor:pointer; background:#2d5728}
.grid figure img {position:relative; display:block; opacity:0.8; width:-webkit-calc(100% + 60px); width:calc(100% + 60px); opacity:0.9; -webkit-transition:opacity 0.35s,-webkit-transform 0.35s; transition:opacity 0.35s,transform 0.35s; -webkit-transform:translate3d(-30px,0,0) scale(1.12); transform:translate3d(-30px,0,0) scale(1.12); -webkit-backface-visibility:hidden; backface-visibility:hidden}
.grid figure figcaption {color:#fff; -webkit-backface-visibility:hidden; backface-visibility:hidden}
.grid figure figcaption::before,.grid figure figcaption::after {pointer-events:none}
.grid figure figcaption,.grid figure figcaption > a {position:absolute; top:0; left:0; width:100%; height:100%}
.grid figure figcaption > a {z-index:1000; text-indent:200%; white-space:nowrap; font-size:0; opacity:0}
.grid figure p {letter-spacing:1px}
figure.effect-milo:hover img {-webkit-transform:translate3d(0,0,0) scale(1); transform:translate3d(0,0,0) scale(1)}
figure.effect-milo h2 {padding:5%; font-size:200%; font-family:exo; color:#fff; text-shadow:-1px 0 black,0 1px black,1px 0 black,0 -1px black}
.article .grid figure p {font-size:80%; overflow:hidden; line-height:1.3em; height:3.9em}
figure.effect-milo .text {backdrop-filter:blur(5px); background:#2d582ac2; position:absolute; bottom:0; margin:0; padding:20px}
.text i {position:absolute; right:15px; bottom:22px; font-size:120%}
.text i:hover {color:#dccf73}
.text span {color:#dccf73}
.text p {margin:10px 0 0 0}
.pagination {text-align:center; display:flex; align-content:center; justify-content:center; margin:25px 0 0 0; font-size:110%}
.currrent {width:30px; height:30px; background:#dccf73; color:#fff; display:flex; align-items:center; justify-content:center; border-radius:50%}
.pagination a:hover {background:#2d5728; color:#fff; border-radius:50%}
.pagination a {color:#2d5728; margin:0 5px; width:30px; height:30px; display:flex; align-items:center; justify-content:center}
label[for] {cursor:pointer}
 input[type="checkbox"] {display:none}
 .lightbox,.grids {width:100%; position:fixed; top:0; left:0}
 .lightbox {z-index:1; min-height:100%; overflow:auto; -webkit-transform:scale(0); -ms-transform:scale(0); transform:scale(0); -webkit-transition:-webkit-transform .5s ease-out; transition:transform .5s ease-out}
.lightbox img {position:fixed; top:50%; left:50%; max-width:96%; max-height:96%; -webkit-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); transform:translate(-50%,-50%); box-shadow:0 2px 8px rgba(0,0,0,0.25)}
input[type="checkbox"]:checked + .lightbox {-webkit-transform:scale(1); -ms-transform:scale(1); transform:scale(1)}
 input[type="checkbox"]:checked ~ .grid {opacity:.125}
 .grids {display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:flex; -webkit-flex-wrap:wrap; -ms-flex-wrap:wrap; flex-wrap:wrap; -webkit-box-align:start; -webkit-align-items:flex-start; -ms-flex-align:start; align-items:flex-start; -webkit-align-content:flex-start; -ms-flex-line-pack:start; align-content:flex-start; z-index:0; height:100%; padding:30px 0; overflow:auto; text-align:center; -webkit-transition:opacity .75s; transition:opacity .75s; position:relative}
.grids .grid-item {width:24%; margin:0.5%; opacity:.75; -webkit-transition:opacity .5s; transition:opacity .5s}
.grids .grid-item:hover {opacity:1}
.grids img {max-width:100%; max-height:100%; box-shadow:0 2px 8px rgba(0,0,0,0.25)}
.faq ol {list-style:none; color:#ff2e2e; font-size:140%}
.main p.datas {position:absolute; right:0; top:0; background:#2d5728; padding:5px 10px; margin:0; color:#fff; font-style:italic; font-size:95%; line-height:1}
.faq a {color:#2d5728; text-decoration:underline}
.faq a:hover {color:#666}
.faq {display:flex; flex-wrap:wrap; text-align:center}
.faq .card {flex-basis:46%; position:relative; box-shadow:0 14px 28px rgba(0,0,0,0.25),0 10px 10px rgba(0,0,0,0.22); border-radius:10px; margin:2%; padding:40px 20px}
.faq .card:before {content:"\f10e"; font-family:'Font Awesome 5 Free','Font Awesome 5 Brands'; font-weight:900; color:#dccf73; font-size:400%; position:absolute; top:0; left:-30px}
.contacts {display:flex}
.contact {flex-basis:50%; padding:5%}
.info {background:#dccf73}
.contact.info ul:nth-child(3) {border:0}
.contact.forma {background:#2d5728; color:#fff; max-width:100%; border-radius:0}
.info ul {margin:20px 0; text-align:center; border-bottom:1px solid #fff; font-size:120%; font-family:agency}
.info.rekvizit ul {font-family:arial; text-align:left; font-size:90%; border:none; margin:0}
.info ul li {margin:10px 0; line-height:1.4}
.info i {color:#fff; font-size:350%}
.contact .form-at input[type="checkbox"]:checked + label::before {content:'\2714'; color:#fff; font-size:14px; text-align:center; font-weight:bold; border:1px solid #fff}
.contact .form-at input[type="checkbox"] + label {color:#fff}
.contact .form-at a {text-decoration:underline; color:#fff}
.contact .form-at a:hover {text-decoration:none}
.work {text-align:center}
.work p {line-height:1.5}
.work i {font-size:400%}
.resp-tab {margin:50px 0; border:none; border-collapse:collapse; width:100%}
.resp-tab td:nth-child(1) {display:flex; align-items:center; text-align:left}
.resp-tab th:nth-child(3),.resp-tab th:nth-child(2) {text-align:center}
.resp-tab td:nth-child(3),.resp-tab td:nth-child(4) {width:20%; padding:0 20px}
.resp-tab td {text-align:center }
.resp-tab span.green {display:none }
.resp-tab th {text-align:left; padding:10px; background:#2d5728; color:#fff}
.resp-tab h3 {font-size:100%; margin-left:10px}
.resp-tab tr {z-index:1; position:relative}
.resp-tab tr:nth-child(even) {background:#f8f3f3}
.resp-tab tr:not(.thead):hover {box-shadow:0 0 5px #000; -webkit-box-shadow:0 0 5px #000; z-index:2}
.resp-tab .price span {text-decoration:line-through; font-size:90%; color:#ff2e2e}
.resp-tab img {width:100px; margin:10px}
.table {border-collapse:collapse; width:100%}
.table th,.table td {border:1px solid #2d5728; padding:10px; text-align:left}
.cursive {color:#25170d; font-style:italic}
.main h2 {font-family:agency; color:#2d5728}
.main0 p img,.main5 p img {float:left; margin:0 20px 20px 0; width:35%}
.wrapper a {color:#2d5728}
.wrapper a:hover {color:#666}
.category {display:flex; justify-content:space-between; margin:0 -2% 50px}
.category .card {margin:2%; padding:2%; flex-basis:25%}
.category .card a {color:#fff; font-family:exo; font-size:120%}
.category .card p:hover {background:#dccf73}
.category .card p {background:#2d5728ab; backdrop-filter:blur(5px); margin:0; line-height:1; padding:20px; height:100%; width:100%; text-align:center; display:flex; align-items:center; justify-content:center}
.category .card:nth-child(1) {background:url(../images/brus-obreznoy.jpg) no-repeat; background-size:cover}
.category .card:nth-child(2) {background:url(../images/doska-obreznaya.jpg) no-repeat; background-size:cover}
.category .card:nth-child(3) {background:url(../images/doska-neobreznaya.jpg) no-repeat; background-size:cover}
.category .card:nth-child(4) {background:url(../images/bruski.jpg) no-repeat; background-size:cover}
.shop.key {margin:0 -1%}
#css-modal-checkbox, #css-modal-box {display:none}
.css-modal-checkbox {background:#ff2e2e; border-radius:30px; color:#fff; display:block; font-weight:bold; margin-top:5px; padding:15px 20px; text-align:center; text-decoration:none; transition:all 0.3s}
.css-modal-checkbox:hover {background:linear-gradient(to bottom,#b57f2d,#f6cf5e)}
#css-modal-checkbox + .cmc, #css-modal-box + .cmc {
    display: none;
} 
#css-modal-checkbox:checked + .cmc, #css-modal-box:checked + .cmc {display:flex; align-items:center; justify-content:center; z-index:50; position:fixed; left:0; top:0; 
width:100%; height:100%; animation:bg 0.5s ease; background:#2d572891}
#css-modal-box:checked + .cmc .cmt {
    padding: 20px;
    width:70%;
    transition: 0.5s;
   border-radius: 5px;
   background: #fff;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2), 0 16px 20px rgba(0,0,0,0.2);
    overflow: auto;
    animation: scale 0.5s ease;
}
 #css-modal-checkbox:checked + .cmc .cmt {width:35%; 
 max-width:600px; 
 max-height:70%; 
 transition:0.5s; 
 border-radius:5px; background:#FFF; 
 box-shadow:0 4px 12px rgba(0,0,0,0.2),0 16px 20px rgba(0,0,0,0.2); 
 text-align:center; overflow:auto; animation:scale 0.5s ease}
.css-modal-close {position:absolute; z-index:10; top:20px; right:20px; transform:rotate(45deg); animation:move 0.5s ease; cursor:pointer; color:#ff2e2e; font-size:400%}
 @keyframes scale {0% {transform:scale(0)}
 100% {transform:scale(1)}
}
@keyframes move {0% {right:-80px}
 100% {right:20px}
}
@keyframes bg {0% {background:rgba(51,122,183,0)}
 100% {background:rgba(51,122,183,0.7)}
}
.cmt .forma {border-radius:none; box-shadow:0; padding:25px; max-width:100%}
.cmt .form-at {margin:0}
.cmt textarea.input-at {min-height:auto}
.flex {display:flex; align-items:flex-start; justify-content:space-between}
.flex .card {flex-basis:30%; box-shadow:0 3px 7px 0 rgba(0,0,0,0.07); border-top:4px solid #dccf73}
.servis {flex-basis:20%; text-align:center; font-size:80%}
.servis img {width:30%}
.flex .card img {width:100%}
.description.product {margin:30px 0}
.description.product h3 {font-family:agency; margin:20px 0}
.hh h4 {color:#2d5728; font-size:150%; font-family:exo}
.hh {border-top:3px solid #2d5728; display:flex; padding:20px 0}
span.red {color:red; text-decoration:none; font-size:120%}
.tovar .css-modal-checkbox {float:left}
.description.art {margin:0;clear:both}
.main.staty img {margin:20px 20px 20px 0; width:35%; float:left}
.description.art h2 {clear:both}
.tovar {margin:0 5%}
.tegi ul {display:flex; flex-wrap:wrap}
.tegi ul li {background:#2d5728; margin:1%; padding:9px 15px; border-radius:5px}
.tegi p {font-style:italic}
.tegi li a {color:#dccf73; font-family:agency; font-weight:bold}
.tegi li a:hover {color:#fff}
.gallery_article {padding:0 10%}
@media screen and (max-width:1400px) {.article .grid figure h3 {font-size:120%}
.article .grid figure p {font-size:80%}
}
@media screen and (max-width:1200px) {.prev-1 {padding:6% 5%}
.block5 {align-items:flex-start}
.main .text p {line-height:1.2}
}
@media screen and (max-width:1100px) {#block1 h1 {font-size:340%}
 #header {font-size:90%}
 .form-searh input {min-width:200px}
.article .grid {font-size:90%}
.article .grid figure h3,figure.effect-milo .text {padding:10px}
.block_6 .blur {padding:5%}
.images_category {width:40%}
.main0 img,.main5 img,.main.staty img {width:40%}
figure.effect-milo h2 {font-size:150%}
}
@media screen and (max-width:1000px) {.flex {flex-wrap:wrap}
.servis {flex-basis:100%; display:flex; justify-content:space-between; margin:50px 0}
.block3_1:nth-child(2) {padding:0}
.block3_1 ul li {width:100%}
.article .grid figure:nth-child(3) {display:none}
.grids .grid-item {width:32.3%}
 .faq .card {flex-basis:44%; margin:3%}
 .grid {margin:0 -7%}
 .grid figure p {font-size:90%}
}
@media screen and (max-width:900px) {.forma.blur .form-at div {flex-basis:100%; margin:10px 0}
.forma.blur .form-at div.validate-input-at.z-50 {width:calc(50% - 10px); flex-basis:auto; display:inline-block}
.forma.blur .form-at div.validate-input-at.z-50:first-child {margin-right:20px}
.forma.blur .form-at div.validate-input-at.z-50:last-child-child {margin-top:20px; width:100%; flex-basis:auto}
.tovar {flex-basis:55%}
.flex .card {flex-basis:35%}
.h-r p {display:none}
.h-r.searh,.h-r.zvonok {margin:2% 0}
.h-r-center {flex-basis:35%; flex-direction:column}
#header .logo img {width:70%}
.top-menu > li > a {padding:18px 12px}
.form-searh {margin:0}
.prev-1 {padding:6% 10%; flex-direction:column}
#block1 h1,#block1 .forma {max-width:100%}
#block1 .forma {margin:30px 0}
.validate-input-at.z-50,.no-validate-input-at.z-50 {width:calc(50% - 10px); display:inline-block}
.forma.blur .form-at {flex-wrap:wrap}
.forma.blur .form-at-btn {margin:5% auto}
.forma.blur .validate-input-at {margin:0}
.validate-input-at.z-50:first-child,.no-validate-input-at.z-50:first-child {margin-right:20px}
.shop .card {flex-basis:48%}
.block3 h2 {font-size:180%}
.block3 {background-size:55%}
.shop.key .card {flex-basis:31%}
.block5 {flex-direction:column}
.block5 div {flex-basis:100%; margin:30px 0 0}
.block5 h3 {font-size:150%}
.block_6 {margin:50px 10% 50px; font-size:120%; line-height:1.2}
.title h1 {font-size:180%}
.category {flex-wrap:wrap}
.category .card {margin:2%; flex-basis:46%}
.breadcrumb li:nth-child(1) {font-size:0}
.breadcrumb li:nth-child(1) span {font-size:15px}
.article .grid figure p {font-size:80%; overflow:hidden; line-height:1.3em; height:3.9em}
.contacts {flex-direction:column}
.info ul {display:flex; text-align:left}
.info ul li:nth-child(1) {flex-basis:20%}
.info ul li:nth-child(2) {flex-basis:80%}
}
@media screen and (max-width:850px) {.block3 {flex-direction:column; background:none}
.block3_1 ul {display:flex}
.faq {display:block}
.grid figure p {overflow:hidden; line-height:1.4em; height:4.2em}
.main .text p {line-height:1.4}
.text i {top:5px}
#css-modal-checkbox:checked + .cmc .cmt {width:50%}
}
@media screen and (max-width:767px) {.tovar {flex-basis:45%}
.flex .card {flex-basis:45%}
#css-modal-checkbox:checked + .cmc .cmt {width:70%}
 figure.effect-milo h2 {font-size:120%}
#talltabs-black {display:none}
 #section .oval-row {display:block}
 #section .bannerText {padding:0 40px 60px 40px}
 .alert-validate::before {visibility:visible; opacity:1}
.mobile-nav {width:320px; right:-320px}
.menu-icon {display:flex; top:60px; position:fixed; right:0}
#block1 h1 {font-size:280%; line-height:1}
#block1 {background:url(../images/bg2-p.jpg); background-size:auto; background-size:cover}
.shop.key .card {flex-basis:46%}
.description ul {margin:30px 0 30px -40px}
.breadcrumb a,.wrapper .breadcrumb a {color:#285424}
.breadcrumb {color:#222}
.breadcrumb {background:none}
.breadcrumb li:nth-last-child(1)::after {position:relative; content:""; height:0; width:0; border:none}
.breadcrumb li:nth-child(1) {display:block; font-size:100%}
.breadcrumb li:nth-child(1) span {font-size:0}
.main0 img,.main5 img,.main.staty img {width:50%}
.resp-tab {font-size:90%}
.resp-tab tr th:nth-child(2),.resp-tab tr td:nth-child(2) {display:none}
}
@media (max-width:650px) {.forma.blur .form-at div.validate-input-at.z-50 {width:100%}
.forma.blur .form-at div.validate-input-at.z-50:first-child {margin:1%}
.forma.blur .form-at div.validate-input-at.z-50:last-child-child {margin:1%}
.article .grid figure:nth-child(3) {display:block}
.article .grid {font-size:100%; flex-wrap:wrap}
.shop.key .card {margin:2%}
#header .logo img {width:100%}
 .h-r.logo {flex-basis:20%}
 .shop .card {flex-basis:100%; margin:2% 0 }
 .block3_1 ul {display:flex; flex-wrap:wrap}
.block3 {align-items:center; background:#fff url(../images/01.jpg) bottom right no-repeat}
.block3_1 ul li {margin:10px 0}
.title h1 {font-size:140%}
.foot {flex-basis:50%; padding:0}
.foot.logo {flex-basis:100%}
.footer {flex-wrap:wrap}
.grids .grid-item {width:49%}
.info ul {text-align:center; flex-direction:column}
}
@media (max-width:600px) {#css-modal-checkbox:checked + .cmc .cmt {width:90%}
.resp-tab {font-size:100%}
.resp-tab thead {display:none}
 .resp-tab tr {display:flex; flex-direction:row; flex-wrap:wrap; margin-bottom:30px; border:1px solid #d5cece}
 .resp-tab td {margin:0 -1px -1px 0; padding-top:0; position:relative; width:100%; text-align:left }
 .resp-tab td span.green {display:inline-block; text-decoration:none; font-size:100%; color:#000 }
.resp-tab td:nth-child(3),.resp-tab td:nth-child(4) {width:50%; padding:20px}
#agree {
  bottom: 30px;
  width: 80%;
  font-size: 80%;
}
}
@media (max-width:550px) {.info {background:none}
.info i {color:#dccf73}
.flex {flex-direction:column}
.grid figure {flex-basis:100%}
.grid figure p {overflow:auto; height:auto}
figure.effect-milo h2 {font-size:140%}
.forma.blur .validate-input-at {margin:2%}
.main0 p img,.main5 p img,.main.staty img {width:100%}
.validate-input-at.z-50,.no-validate-input-at.z-50 {width:100%}
 #block1 h1 {font-size:240%}
#header {flex-wrap:wrap}
.form-searh button::before {content:"\f002"}
.h-r.zvonok {display:none}
#header div:nth-child(2) {order:3; flex-basis:100%}
 .tel {margin:4px 15px 7px 0}
 .shop.key .card {flex-basis:100%}
.images_category {width:100%; float:none; margin:20px 0}
.main h2 {padding:30px 0}
}
@media (max-width:475px) {.servis {flex-direction:column; text-align:left}
.servis li {display:flex; color:#2d5728; font-weight:bold; align-items:center}
.servis img {margin-right:20px}
.breadcrumb {flex-wrap:wrap}
.h-top span {display:none}
 #block1 h1 {font-size:200%}
 .category .card {padding:4%; flex-basis:100%}
.foot {flex-basis:100%}
.description ul {margin:30px 0}
#agree {

flex-direction: column;}
#button-agree {
  margin: 20px 0 0;
}
}
@media (max-width:350px) {.article .grid figure {display:none}
}