* {
margin:0 auto;
padding:0;
font-family: Montserrat;
font-size: 16px;
}

#laminirovannay .product{line-height:30px;}
#laminirovannay .product .name_product{font-size:18px;}

.A img{width:120px;
margin:0 20px;}
#buttonCheckboxes label{padding:10px 17px;}
#buttonCheckboxes{gap:20px;}

.container {
            max-width: 100%;
            margin: auto;
            padding: 20px;
            background-color: white;
            border-radius: 8px;
            box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
	grid-column-start:2;
        }
        h1 {
           text-align: center;
    color: #3967ac;
    grid-column-start: 2;
    font-family: "Rubik Dirt", system-ui;
    font-size: 38px;
    font-style: normal;

        }
        h2 {
            color: #125ca6;
        }
        p {
            margin-bottom: 15px;
			width:90%
        }
        .highlight {
            font-weight: bold;
            color: #e74c3c; /* Акцентный цвет */
        }

.cart__num {
  position: absolute;
  background-color: #d62240;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-size: 18px;
  font-weight: 500;
  top: -5px;
  right: -5px;
}

html {
/*background: linear-gradient(270deg, #f3f6f8, #166fbc94);*/
}
#load-more{grid-column-start:2;
width:250px;
height:50px;
background:#2862a5;
color:white;}
.products {
  display: block;
}
#order-form{
	display:grid;
	grid-template-columns: 270px;
	gap:20px;
	grid-column-start: 3;
}
.header-form
{Padding: 20px;
    font-size: 22px;
    margin: -20px auto;
    background: #2862a5;
    color: white;}

#form-style{width:240px;
padding:10px;
margin: 10px;
border: solid 1px;}

#order-form input{
	 border-bottom: solid 1px;
    border-top: none;
    border-left: none;
    border-right: none;
	height:60px;
}
#order-form button
{width:200px;
height:60px;
background:#125ca66b;
	color:white;
	font-size:18px;
}

.product {
 line-height:50px;
    display: grid;  
	grid-template-areas: "d d d d d d d d"
        "f f f f h h h h"
        "i i i i i i i i"
        "b b b b b b b b";
}

.A { grid-area: f;}

.B {grid-area: i;
width:100%;
line-height:normal;
padding:15px;}
.B p{height:90px;}
.R{grid-area:h;
line-height:20px;}

#C {grid-area: b;}
.D {grid-area: d;}

.product h3 {
  margin-top: 0;
  grid-area:A;
}

.product .price {
  color: #f00;
  font-weight: bold;
}

.product .add-to-cart {
  background-color: #125ca6;
  color: #fff;
  border: none;
  padding: 10px 15px;
  cursor: pointer;
	border-radius:5px;
}

.product .add-to-cart:hover {
  background-color: #166fbccc;
}
.name_product{font-size:21px;
color:#166fbccc;}

/* Стили для секции корзины */
.cart {
  margin-top: 30px;
	grid-column-start:3;
	width:340px
}

.cart table {
  width: 100%;
  border-collapse: collapse;
}

.cart th 
 {width:50px;
  padding: 10px;
  border: 1px solid #ccc;
  text-align: center;
}

tbody input{width:40px}
.cart td {
  padding: 3px;
  border: 1px solid #ccc;
  text-align: center;
}

.cart .total {
  text-align: right;
  margin-top: 10px;
}

.cart .remove-item {
  background-color: #dc3545;
  color: #fff;
  border: none;
  padding: 5px 10px;
  cursor: pointer;
	width:80px;
}

.cart .remove-item:hover {
  background-color: #c82333;
}
// <uniquifier>: Use a unique and descriptive class name
// <weight>: Use a value from 100 to 900

.handjet-<uniquifier> {
  font-family: "Handjet", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:
    "ELGR" 1,
    "ELSH" 2;
}
.rubik-dirt-regular {
  font-family: "Rubik Dirt", system-ui;
  font-weight: 400;
  font-style: normal;
}
// <uniquifier>: Use a unique and descriptive class name
// <weight>: Use a value from 400 to 900

.tektur-<uniquifier> {
  font-family: "Tektur", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:
    "width" 100;
}
.spectral-sc-extralight {
  font-family: "Spectral SC", serif;
  font-weight: 200;
  font-style: normal;
}

.spectral-sc-light {
  font-family: "Spectral SC", serif;
  font-weight: 300;
  font-style: normal;
}

.spectral-sc-regular {
  font-family: "Spectral SC", serif;
  font-weight: 400;
  font-style: normal;
}

.spectral-sc-medium {
  font-family: "Spectral SC", serif;
  font-weight: 500;
  font-style: normal;
}

.spectral-sc-semibold {
  font-family: "Spectral SC", serif;
  font-weight: 600;
  font-style: normal;
}

.spectral-sc-bold {
  font-family: "Spectral SC", serif;
  font-weight: 700;
  font-style: normal;
}

.spectral-sc-extrabold {
  font-family: "Spectral SC", serif;
  font-weight: 800;
  font-style: normal;
}

.spectral-sc-extralight-italic {
  font-family: "Spectral SC", serif;
  font-weight: 200;
  font-style: italic;
}

.spectral-sc-light-italic {
  font-family: "Spectral SC", serif;
  font-weight: 300;
  font-style: italic;
}

.spectral-sc-regular-italic {
  font-family: "Spectral SC", serif;
  font-weight: 400;
  font-style: italic;
}

.spectral-sc-medium-italic {
  font-family: "Spectral SC", serif;
  font-weight: 500;
  font-style: italic;
}

.spectral-sc-semibold-italic {
  font-family: "Spectral SC", serif;
  font-weight: 600;
  font-style: italic;
}

.spectral-sc-bold-italic {
  font-family: "Spectral SC", serif;
  font-weight: 700;
  font-style: italic;
}

.spectral-sc-extrabold-italic {
  font-family: "Spectral SC", serif;
  font-weight: 800;
  font-style: italic;
}
.amatic-sc-regular {
  font-family: "Amatic SC", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.amatic-sc-bold {
  font-family: "Amatic SC", sans-serif;
  font-weight: 700;
  font-style: normal;
}
// <uniquifier>: Use a unique and descriptive class name
// <weight>: Use a value from 100 to 900

.noto-serif-<uniquifier> {
  font-family: "Noto Serif", serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
  font-variation-settings:
    "wdth" 100;
}
.lobster-regular {
  font-family: "Lobster", sans-serif;
  font-weight: 400;
  font-style: normal;
}
.pacifico-regular {
  font-family: "Pacifico", cursive;
  font-weight: 400;
  font-style: normal;
}
.roboto-thin {
  font-family: "Roboto", sans-serif;
  font-weight: 100;
  font-style: normal;
}

.roboto-light {
  font-family: "Roboto", sans-serif;
  font-weight: 300;
  font-style: normal;
}

.roboto-regular {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.roboto-medium {
  font-family: "Roboto", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.roboto-bold {
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-style: normal;
}

.roboto-black {
  font-family: "Roboto", sans-serif;
  font-weight: 900;
  font-style: normal;
}

.roboto-thin-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 100;
  font-style: italic;
}

.roboto-light-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 300;
  font-style: italic;
}

.roboto-regular-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  font-style: italic;
}

.roboto-medium-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 500;
  font-style: italic;
}

.roboto-bold-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-style: italic;
}

.roboto-black-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 900;
  font-style: italic;
}
// <uniquifier>: Use a unique and descriptive class name
// <weight>: Use a value from 100 to 900

.montserrat-<uniquifier> {
  font-family: "Montserrat", serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}

.text-inf{
	padding:0px 0px 20px 0px;
		margin:0 auto;
	width: 1000px;
}

#baner{
display:flex;
width:1000px;
}

#baner a img{
    width: 90%;
    margin: 0px 0px 30px 0px;
    height: 45px;	
}
a {color:#1377bd;}
a img {border: none;}

h2 {font-size: 30px;font-style:oblique;font-weight:normal;margin-bottom:20px;}
h3 {font-size: 18px;font-style:oblique;font-weight:normal;margin-bottom:20px;font-style: normal;}
h3:hover{color:#125ca6}

ul, ol {padding: 0 0 20px 20px;}
ul li {padding-top:10px;}


.down:after {
  margin-left: 8px;
  font-family: FontAwesome;
}

.title {
color:white;
display:inline-block;
margin-top:20px;
padding:15px 30px;
width:203px;
}

.gallery {
color:#96763d;
font-size:18px;
font-style:normal;
margin-bottom:15px;
}

body {
height:100%!important;
height: 850px;
min-height:  850px;
width:100%;
}

.cat
{    margin: 0px auto;
    font-style: normal;
    letter-spacing: 2px;
    border: none;
    font-family: "Rubik Dirt", system-ui;
    color: #125ca6;
    width: 1000px;
    padding: 0px;}
.cat2
{
    font-style: normal;
    letter-spacing: 2px;
    border: none;
    font-family: "Rubik Dirt", system-ui;
    color: #125ca6;
    margin: 0px;
padding:0px;}

#wrapper {
background:url("pic/fan.png") no-repeat scroll 50% 0% transparent;
min-height: 100%;
min-width: 980px;
height:auto!important;
width:100%;
}
#head {
    display: flex;
    margin: 0 auto;
    position: relative;
    width: 100%;
    background: url(https://spm.spb.ru/assets/images/natural-wooden-background-1-1.jpg);
	background-repeat: no-repeat;
    background-size: cover;
}

#head .rf-1
{

  background: url(/assets/images/gallery/fan2.png);
    width: 100%;
    background-repeat: no-repeat;
 background-position-x: right;
}

#logo{

    min-height: 100%;
	position: relative;
    overflow: hidden;
    height: 100px;
	filter:brightness(0.8);
	width:283px;
	object-fit:contain;
}

.head-s
{
    display: grid;
    grid-template-rows: 100px 70px 70px;
	position:relative;
	left:23%;
	margin-top:30px;
		
}

.head-s p
 {
    font-family: Montserrat;
    font-size: 25px;
    color: white;
    font-weight: 900;
	margin:0 auto;
	 padding: 0;
	 width:100%;
}

.head-s a{
	margin:0 0;
	font-style:normal;
}

#phone {
position: relative;
    left: -10%;
}

#phone span {
    font-size: 18px;
    color: #fff;
;}

#content {
margin: 0 auto;
width: 95%;
}

#inner {
position:relative;
display:grid;
grid-template-columns:150px 1120px 330px;
width:100%;
grid-template-rows: 45PX AUTO;
row-gap: 15px;
}

.ikon
{padding:15px;}



#inner-1 {
position:relative;
display:grid;
grid-template-columns:repeat(4, 1fr);
width:100%;
padding-right: 25px;
}

#inner-2
{
	margin:25px;
}

#inner-2 h4
   { font-size: 20px;
    margin-bottom: 20px;
color: #125ca6;}

#footer {
background: url('pic/body bg.png') 0 100% repeat-x;
height:500px;
margin-top:-500px;
width:100%;
}

#inner_foot {
margin:0 auto;
width:980px;
padding-top:460px;
}

#foot_left {
color: #9e8d6e;
display:inline-block;
float:left;
}

#foot_right {
color: #9e8d6e;
display: inline-block;
float:right;
}

#counter {
padding: 0 200px;
text-align:center;
}

#foot_right a {
color: #9e8d6e;  text-decoration:none
}

.clear {
clear:both;
}

.more {
bottom:10px;
position: absolute;
right:0;
}

.panel h2 {color: #1679bd;}

.panel div {
height:100%;
}
.panel-img{
height: 100%;
	width: 57%;
background:none;
padding:0px;}

.panel-height
{
height:166px;
background-position:0 50%;
background-repeat:no-repeat;
}
.panel-height div
{
background-position:0 50%;
background-repeat:no-repeat;
}

.panel-height a:hover{color:#125ca6;font-weight:800;}
.h2 h3:hover{color:#125ca6;font-weight:800;}

#news {
display:block;
padding:0 25px 20px 0; 
overflow: hidden;    width: 100%;
}

.news {
display: inline-block;
padding: 0 20px;
width: 278px;
float: left
}

.news span, .news_blog span {
color:#11559E;
display:block;
font-weight:bold;
padding-bottom:10px;
}

.news a {color:#8b6c33;}

#capa{
	height:50px;
	width:50px;
}

.advantages{
	display:grid;
grid-template-columns:repeat(3, 1fr);
column-gap:10px;
	margin: 15px 0 15px 0 !important;
	padding:0px !important;
	row-gap:30px;
	background:aliceblue;
	
}

.advantages li
{display: flex;
    justify-content: center;
align-items: center;}

.news_blog {
display:block;
margin-bottom:20px;
}

#adress {
display: block;
float:left;
width:220px;
}

#contact_form {
padding-left: 320px;
padding-bottom:40px;
}

#adress h3,#contact_form h3, #adress span {
color: #11559e;
}
#adress span {font-weight:bold;margin-right:20px;}
#adress td, #contact_form td {
padding-bottom:20px;
}

#adress a {color:#926109;font-size:14px;}
#adress img {border:1px solid #926109;}
#eform {
background:url("pic/formfon.png") repeat-y scroll 0 0 transparent;
padding:0 40px;
position:relative;
width:430px;
}
#adress b {font-size:14px;}

#eform label, #adress b, #eform b {
color: #444444;
font-weight:bold;
}

#eform input, #eform textarea {
margin-left: 15px;
border: 1px solid #bcbcbc;
}

#captcha img {margin: 0 0 20px 15px;}

#eform input[type=submit] {
background:url("pic/button.png") no-repeat scroll 0 0 transparent;
border:medium none;
color:white;
cursor:pointer;
font-weight:bold;
height:22px;
padding:0 0 4px;
width:90px;
}

#eform .errors{margin-bottom:20px;}

#inner .h3{
	color: #11559e;
	font-size: 18px;
    font-style: oblique;
    font-weight: normal;
    margin-bottom: 20px;
}
 
.container {
    margin: 1rem;
    padding: 1.5rem;
    border: 1px solid #125ca6;
    border-radius: 0.375rem;
	width: 990px;
  }

  .tab {
    display: flex;
    flex-direction: column;
  }

  .tab-nav > input[type="radio"] {
    display: none;
  }

  .tab-content {
    display: none;
  }

  #content-1:has(~ .tab-nav > #tab-btn-1:checked),
  #content-2:has(~ .tab-nav > #tab-btn-2:checked),
  #content-3:has(~ .tab-nav > #tab-btn-3:checked),
  #content-4:has(~ .tab-nav > #tab-btn-4:checked),
#content-5:has(~ .tab-nav > #tab-btn-5:checked),
#content-6:has(~ .tab-nav > #tab-btn-6:checked),
#content-7:has(~ .tab-nav > #tab-btn-7:checked),
#content-8:has(~ .tab-nav > #tab-btn-8:checked)
{
    display: block;
  }

  .tab-nav {
    display: flex;
    flex-wrap: wrap;
    border-bottom: 1px solid #125ca6;
    margin: 0px 0px 20px 0px;
    order: -1;
  }

  .tab-nav > label {
    display: block;
    padding: 0.5rem 1rem;
    color: #000000;
    text-decoration: none;
    background: 0 0;
    border: 1px solid transparent;
    margin-bottom: -1px;
    border-top-left-radius: 0.375rem;
    border-top-right-radius: 0.375rem;
    -webkit-appearance: button;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
  }

  .tab-nav > label a {
    display: block;
    padding: 0.5rem 1rem;
    color: #000000;
    text-decoration: none;
    background: 0 0;
    border: 1px solid transparent;
    margin-bottom: -1px;
    border-top-left-radius: 0.375rem;
    border-top-right-radius: 0.375rem;
    -webkit-appearance: button;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out;
  }


  .tab-nav > input[type="radio"]:checked + label {
    color: #fff;
    background-color: #125ca6;
    border-color: #125ca6 #125ca6 #fff;
    cursor: default;
  }

  .tab-nav > input[type="radio"]:checked + label a{
    color: #fff;
    background-color: #125ca6;
    cursor: default;
  }


.panesl-2{display:flex;}*/


.containers{
  padding: 5px; 
	display:flex;
	flex-wrap: wrap;
	width: 820px;
}
	
.continents-wrap {
  float:left;
  width:20%;
  margin:0 5% 0 0;
  padding:0;
}		
.flowers-wrap {
  float:left;
  width:100%;
  margin:0 5% 0 0;
  padding:0;
  position:relative;
  grid-column-start:1
}
.flowers-wrap p{
	margin:10px 0px;
}
.flowers {
float: left;
width: 100%;
grid-column-start: 2;
}


.flowers .flower {
     float: left;
    width: 350px;
    height: 350px;
    line-height: 68px;
    background: #eee;
    margin: 5px 10px;
    position: relative;
}

#buttonCheckboxes form input[type="checkbox"] {
    display: none;
}

form label {
    display: inline-block;
    background-color: white;
    color: black;
    padding: 10px 20px;
    border-radius: 5px;
    border: 1px solid #ccc;
    cursor: pointer;
    transition: background-color 0.3s, color 0.3s;
	font-size:20px;
}

form input{margin:10px;}
form div{font-size:20px;}

@media only screen and (max-width:1710px) and (min-width:1535px){
	.flowers .flower {
    float: left;
    width: 300px;
    height: 390px;
    line-height: 68px;
    background: #eee;
    margin: 5px 10px;
    position: relative;
}
	#inner {grid-template-columns: 100px 970px 330px;}
	.B p{height:132px;}
}

@media only screen and (max-width:1534px) and (min-width:1440px){
  #logo 
  {
  height:80px;
  width: 233px;
} 
	.B p{display:none}
  .topmenu > li > a 
  {
  height: 40px;
    line-height: 40px;  
  }
  .topmenu
{
  margin-bottom:20px;
}
  *{
    font-size:14px;
  }
	#laminirovannay .product .A img{
		width:240px;
	height:117px;
	}
  .head-s
  {
  grid-template-rows: 80px 50px 50px;
    left: 23%;
    margin-top: 10px;
  }
  .head-s p
  {font-size: 20px;}
  #phone span {
    font-size: 15px;}
  
  #head .rf-1{
    background-position-x: 420px;
    height: 190px;
	  background-size: contain;}
		.flowers .flower {
    float: left;
    width: 300px;
    height: 390px;
    line-height: 68px;
    background: #eee;
    margin: 5px 10px;
    position: relative;
}
	#inner {
		grid-template-columns: 100px 960px 280px;}

.flowers .flower {
    float: left;
    width: 300px;
    height: 390px;
    line-height: 68px;
    background: #eee;
    margin: 5px 10px;
    position: relative;
}
h1{font-size:28px;}
.product{grid-template-areas:
        "d d d d d d d d"
        "f f f f f f f f"
        "h h h h h h h h"
        "b b b b b b b b";
}
.name_product{font-size:18px;}
.flowers .flower {
    float: left;
    width: 300px;
    height: 290px;
    line-height: 68px;
    background: #eee;
    margin: 5px 10px;
    position: relative;
}
.R {
    grid-area: h;
    line-height: 20px;
	margin: 12px;}
.header-form {
    Padding: 15px;
    font-size: 18px;
    margin: -20px auto;
    background: #2862a5;
    color: white;
}
}
@media only screen and (max-width:1439px) and (min-width:1140px){
  #logo 
  {
  height:80px;
  width: 233px;
} 
	.B p{display:none}
  .topmenu > li > a 
  {
  height: 40px;
    line-height: 40px;  
  }
  .topmenu
{
  margin-bottom:20px;
}
  *{
    font-size:14px;
  }
  .head-s
  {
  grid-template-rows: 80px 50px 50px;
    left: 23%;
    margin-top: 10px;
  }
  .head-s p
  {font-size: 20px;}
  #phone span {
    font-size: 15px;}
  
  #head .rf-1{
    background-position-x: 420px;
    height: 190px;
	  background-size: contain;}
		.flowers .flower {
    float: left;
    width: 300px;
    height: 390px;
    line-height: 68px;
    background: #eee;
    margin: 5px 10px;
    position: relative;
}
	#inner {
		grid-template-columns: 
			90px 735px 250px;}

.flowers .flower {
    float: left;
    width: 300px;
    height: 390px;
    line-height: 68px;
    background: #eee;
    margin: 5px 10px;
    position: relative;
}
h1{font-size:28px;}
.product{grid-template-areas:
        "d d d d d d d d"
        "f f f f f f f f"
        "h h h h h h h h"
        "b b b b b b b b";
}
.name_product{font-size:14px;
font-weight:bolder;
	color:#125ca6;}
	
	#laminirovannay .product .name_product {
    font-size: 14px;
}
	
.flowers .flower {
    float: left;
    width: 225px;
    height: 290px;
    line-height: 68px;
    background: #eee;
    margin: 5px 10px;
    position: relative;
}
.R {
    grid-area: h;
    line-height: 20px;
	margin: 12px;}
.header-form {
    Padding: 15px;
    font-size: 18px;
    margin: -20px auto;
    background: #2862a5;
    color: white;
}
	#buttonCheckboxes label{padding:5px;}
	.A img {width:110px;}
	form label {
	font-size:18px;}
	
	  #laminirovannay .product .A img {
        width: 160px;
        height: 100px;
		margin: 0 30px;
    }
}
@media only screen and (max-width:1139px) and (min-width:800px){
  #logo 
  {
  height:80px;
  width: 233px;
} 
	.B p{display:none}
  .topmenu > li > a 
  {
  height: 40px;
    line-height: 40px;  
  }
  .topmenu
{
  margin-bottom:20px;
}
  *{
    font-size:10px;
  }
  .head-s
  {
  grid-template-rows: 80px 50px 50px;
    left: 23%;
    margin-top: 10px;
  }
  .head-s p
  {font-size: 20px;}
  #phone span {
    font-size: 15px;}
  
  #head .rf-1{
    background-position-x: 420px;
    height: 190px;
	  background-size: contain;}
		.flowers .flower {
    float: left;
    width: 300px;
    height: 390px;
    line-height: 68px;
    background: #eee;
    margin: 5px 10px;
    position: relative;
}
	#inner {
		grid-template-columns: 
			70px 420px 170px;}

.flowers .flower {
    float: left;
    width: 130px;
    height: 190px;
    line-height: 68px;
    background: #eee;
    margin: 5px 5px;
    position: relative;
}
h1{font-size:20px;}
.product{grid-template-areas:
        "d d d d d d d d"
        "f f f f f f f f"
        "h h h h h h h h"
        "b b b b b b b b";
	       margin: 0 0 0 9px;
           row-gap: 8px;
    
    
}
.name_product {
        font-size: 12px;
        font-weight: bolder;
        color: #125ca6;
        line-height: 21px;
    }
#laminirovannay .product .name_product {
    font-size: 10px;
}
.R {
    grid-area: h;
    line-height: 17px;
	margin: 12px;
	display:none;}
.header-form {
    Padding: 15px;
    font-size: 16px;
    margin: -20px auto;
    background: #2862a5;
    color: white;
}
	#buttonCheckboxes label{padding:3px;
font-size:12px;}
	.A img {width:90px;}
	form label {
	font-size:18px;}
	
	#laminirovannay .product .A img {
        width: 100px;
        height: 78px;
		margin:0 8px;
    }
	
	form div{font-size:14px;}
	.cart {
    margin-top: 30px;
    grid-column-start: 3;
    width: 230px;
}
	#buttonCheckboxes{gap:5px;}
}