/* styles.css */



h1 {
    color: #91223D;
	font-size: 28px;
	font-weight: bold;
	font-family: "Times New Roman", Times, serif; 
}




h2{
	padding-top: 40px;
    margin: 0;
    font-size: 24px;
	font-weight: bold;
    font-family: "Times New Roman", Times, serif; 
    text-align: center;
    vertical-align: middle;
}
ul, li, a {
	font-size: 1.1em;
}
.moduletitle {
	color: #91223D;
	font-size: 28px;
	font-family: "Times New Roman", Times, serif; 
}

.link_title {
	color: #91223D;
	font-size: 28px;
	font-weight: bold;
	font-family: "Times New Roman", Times, serif; 
}

.module {
	margin: 10px 0 30px 0;
	background-color:#e0e0e0;
	padding: 10px
}
.moduletext {
	position: relative;
	margin: 10px 0 20px 0;
}
/*
.moduletext, p, img {
	display: inline-block;
	text-align: center;
	margin: auto;
	margin: 10px 0 10px 0;
}
*/
.imgcontent {
	display: block;
	border: 1px solid #ccc;
	border-width: 1px;
	max-width: 80%;
	height: auto;
	text-align: center;
	margin: auto; /* Центрирование изображения */
}

p { font-size: 20px; /* размер шрифта в единицах em */
    margin: 0;
    font-family: "Times New Roman", Times, serif; 
	text-align: left;
    vertical-align: middle;
}

.imgproduct, p {
	font-size: 20px;
	font-family: "Times New Roman", Times, serif;
	text-align: left;
}
.content_icons {
	vertical-align: middle;
}
.link_cat {
	font-size: 16px;
	display: inline-block;
	vertical-align: middle;
	margin-left: 8px;
}
.link_more {
	font-size: 16px;
	display: inline-block;
	vertical-align: middle;
}

.link_printer {
	font-size: 16px;
	display: inline-block;
	vertical-align: middle;
	margin-left: 8px;
}

.block_table {
	
}
.pagesactive{font-size:14px;color:#000;background-color:#d4913e; -webkit-border-radius: 2px; /* ??? ????????? ????????? webkit */
-moz-border-radius: 2px;	/* ??? ????????? ????????? Gecko */
border-radius: 2px;	/* CSS3 */font-weight:700;border:1px solid #444;padding:2px 4px;}
a.pages:link,a.pages:visited{color:#ccc;background-color:#364e95;-webkit-border-radius: 2px; /* ??? ????????? ????????? webkit */
-moz-border-radius: 2px;	/* ??? ????????? ????????? Gecko */
border-radius: 2px;	/* CSS3 */;text-decoration:none;border:1px solid #000;padding:2px 4px;}
a{outline:none;}
a { color: #91223D; text-decoration: none; } 
a:hover { color: #707070; text-decoration: none; }
a.pages:link,a.pages:visited{font-weight: bold;color:#ccc;background-color:#91223D;text-decoration:none;padding:4px 6px;}

html, body {
margin:0px; /*??? ??????? ???????? ???????? ???? ? ??????, ?.?. ????????? ???????? ?? ?? ??????? ????????????. */
padding:10px 0 10px 0;
/*text-align:center; /*??????????? ????? ?? ?????? ? ?????? ??????? ????????? */
	background: url(img/bgimg2222.png) repeat-x #f9f3f7;
	background-position:0 100%;
	background-attachment: fixed;
}

header{
	height: 560px;
	overflow: hidden;
	position:relative;
}

.header{
	/*background-color: rgb(240,240,240, 0.95);*/
	border-left: 1px solid #ccc; /* рамка */
	border-top: 1px solid #ccc; /* рамка */
	border-right: 1px solid #ccc; /* рамка */
	border-radius: 7px 7px 0 0;
	padding: 10px;
}

.logo {
	border: 1px solid #ccc;
	padding: 15px;
	background: -webkit-gradient(linear, left top, left bottom, from(#B15A8D), to(#34091C));
	width: 100px;
    height: 129px;
	margin: -8px 0 0 0;
	float: left;
	border-left:1px solid #3D3D3D;
	border-right:1px solid #3D3D3D;
	border-bottom:1px solid #3D3D3D;
	border-radius: 0 0 12px 12px;
	display: inline-block;
}

.logo:hover{
	margin: -12px 0 0 0;
	background: -webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#BFBFBF));
	border-top:1px solid #BFBFBF;
	border-left:1px solid #BFBFBF;
	border-right:1px solid #BFBFBF;
	border-radius: 0 0 12px 12px;
	padding: 22px 15px 15px 15px;
}

.menu-1{
	 position:relative;
}

ul.css-menu-1 {
	 list-style: none;
	 float: left;
	 position: absolute;
	 margin: 2px 0 5px 100px;
 }

 ul.css-menu-1 li {
	display: inline;
 }

 ul.css-menu-1 li a {
	 margin: 0 0 0 8px;
	 text-decoration: none;
	 background: -webkit-gradient(linear, left top, left bottom, from(#B15A8D), to(#34091C));
	 color: #fff;
	 font-size:18px;
	 font-weight: bold;
	 padding: 10px 14px 12px 14px;
	 border-left:1px solid #3D3D3D;
	 border-right:1px solid #3D3D3D;
	 border-bottom:1px solid #3D3D3D;
	 border-radius: 0 0 10px 10px;
 }

 ul.css-menu-1 li a:hover {
	 padding: 13px 14px 16px 14px;
	 font-weight: bold;
	 background: -webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#BFBFBF));
	 color: #91223D;
	 border-top:1px solid #BFBFBF;
	 border-left:1px solid #BFBFBF;
	 border-right:1px solid #BFBFBF;
	 border-radius: 0 0 10px 10px;
 }

 ul.css-menu-1 li a.selected {
	background: #364e95
 }

.header-text p{
	display: block;
	font-size: 22px;
	font-weight: bold;
    font-family: "Times New Roman", Times, serif; 
    text-align: center;
    vertical-align: middle;
	padding-top: 50px;
	width: calc(100% - 27%);
	margin: 0 auto;
	color: #A08D96;	
	text-shadow: #000 1px 1px 1px;
}

.wrapper {
	width: calc(100% - 24%);
	margin: 0 auto; /* Центрирование по горизонтали */
	margin-top: 23px;
	display: flex;
    flex-direction: column;
    min-height: 100vh; /* Занимает минимальную высоту окна просмотра */
	border-radius: 14px; /* закругление углов */
	border: 1px solid #ccc; /* рамка */
    padding: 10px;
	background-color: rgb(250,250,250, 0.45);
	position: relative;
}

.content {
    flex: 1;

}

.container {
    display: flex;
	margin-bottom: 20px;
	border: 1px solid #ccc; /* рамка */
}

.left-column {
    flex: 4;
    background-color: #f0f0f0;
	background-color: rgb(240,240,240, 0.95);
    padding: 20px;
}

.right-column {
    flex: 1;
    background-color: #e0e0e0;
    padding: 20px;
}

.footer-content{
	margin-top: 20px;
	background-color: rgb(240,240,240, 0.95);
	padding: 20px;
	border: 1px solid #ccc; /* рамка */
}

.cat-container{
    display: flex;
    flex-direction: row;
    /*flex-direction: row-reverse; */
    /*flex-direction: column; */
    /*flex-direction: column-reverse; */
}


.inner-div {
    height: 500px;
    width: 460px;
    margin: 15px;
    background-color: rgb(240,240,240, 0.95);
    padding: 10px;
	border: 1px solid #ccc; /* рамка */
  }

.inner-img{
	    width: 100%;
}

footer {
    background-color: #34091C;
    color: #fff;
    text-align: center;
	margin-top: 20px;
	padding: 20px;
	border: 1px solid #ccc; /* рамка */
	border-radius: 0 0 9px 9px;
}



.tabs {
    font-size: 0;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

.tabs > input[type="radio"] {
    display: none;
}

.tabs > div {
    display: none;
    border: 1px solid #e0e0e0;
    padding: 10px 10px;
    background-color: #fff;
}

#tab-btn-1:checked ~ #content-1,
#tab-btn-2:checked ~ #content-2,
#tab-btn-3:checked ~ #content-3 {
    display: block;
}

.tabs > label {
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    user-select: none;
    background-color: #f5f5f5;
    border: 1px solid #e0e0e0;
    padding: 2px 8px;
    font-size: 14px;
    line-height: 1.5;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out;
    cursor: pointer;
    position: relative;
    top: 1px;
	margin-right: 5px;
}

.tabs > label:not(:first-of-type) {
    border-left: 1px solid #e0e0e0;
}

.tabs > input[type="radio"]:checked + label {
    background-color: #fff;
    border-bottom: 1px solid #fff;
	margin-right: 5px;
	padding-bottom: 2px;
	z-index: 300;
}



#content-1 {
  position: relative;
  padding-bottom: 55.5%; /* задаёт высоту контейнера для 16:9 (если 4:3 — поставьте 75%) */
  height: 0;
  overflow: hidden;
}

#content-1 iframe {
  position: absolute;
  top: 5px;
  left: 5px;
  width: calc(100% - 10px);
  height: calc(100% - 10px);
  border-width: 0;
  outline-width: 0;
}

#content-2 {
  position: relative;
  padding-bottom: 55.5%; /* задаёт высоту контейнера для 16:9 (если 4:3 — поставьте 75%) */
  height: 0;
  overflow: hidden;
}

#content-2 iframe {
  position: absolute;
  top: 5px;
  left: 5px;
  width: calc(100% - 10px);
  height: calc(100% - 10px);
  border-width: 0;
  outline-width: 0;
}


/*-------------------------------------------------------------*/


#v_menu  {
    font-size:18px;
    color: #333;
}
#v_menu ul {
    list-style: none;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    border: none;
}

#v_menu li a {
    font-size:18px;
    font-weight: bold;
    display: block;
    padding: 10px 0px 12px 9px;
	margin: 0 0 12px -6px;
    text-decoration: none;
    width: 100%;
	border-top:1px solid #e0e0e0;
	border-left:1px solid #3D3D3D;
	border-right:1px solid #3D3D3D;
	border-bottom:1px solid #3D3D3D;
	background: -webkit-gradient(linear, left top, left bottom, from(#B15A8D), to(#34091C));
    color: #fff;
	border-radius: 0 0 10px 10px;
}

#v_menu li a:hover {
    font-size:18px;
    font-weight: bold;
	/*border-bottom: 1px solid #006699;
    color: #006699;*/
	background: -webkit-gradient(linear, left top, left bottom, from(#e0e0e0), to(#BFBFBF));
    color: #91223D;
	border-top:1px solid #e0e0e0;
	border-left:1px solid #BFBFBF;
	border-right:1px solid #BFBFBF;
	border-bottom:1px solid #3D3D3D;
	border-radius: 0 0 10px 10px;
}
/*-------------------------------------------------------------*/



.hidden-menu {
  display: block;
  position: fixed;
  list-style:none;
  padding: 50px 15px;
  margin: 0;
  box-sizing: border-box;
  width: 320px;
  background-color: #e0e0e0;
  height: 100%;
  top: 0;
  left: -340px;
  transition: left .3s;
  z-index: 920;
  -webkit-transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  border-right: solid 1px #afafaf;
  box-shadow: 5px 0 20px #555;
  
  overflow-y: auto; /* �������� ������������ ��������� */
    scrollbar-width: thin; /* ��� Firefox - ������ ��������� */
    scrollbar-color: #888 #e0e0e0; /* ��� Firefox - ���� �������� � ����� */
}

.hidden-menu li a {
    font-size:18px;
    font-weight: bold;
    display: block;
    padding: 10px 0px 12px 9px;
	margin: 0 0 12px -6px;
    text-decoration: none;
    width: 100%;
	border-top:1px solid #e0e0e0;
	border-left:1px solid #3D3D3D;
	border-right:1px solid #3D3D3D;
	border-bottom:1px solid #3D3D3D;
	background: -webkit-gradient(linear, left top, left bottom, from(#B15A8D), to(#34091C));
    color: #fff;
	border-radius: 0 0 10px 10px;
}

.hidden-menu li a:hover {
    font-size:18px;
    font-weight: bold;
	/*border-bottom: 1px solid #006699;
    color: #006699;*/
	background: -webkit-gradient(linear, left top, left bottom, from(#e0e0e0), to(#BFBFBF));
    color: #91223D;
	border-top:1px solid #e0e0e0;
	border-left:1px solid #BFBFBF;
	border-right:1px solid #BFBFBF;
	border-bottom:1px solid #3D3D3D;
	border-radius: 0 0 10px 10px;
}

.hidden-menu-ticker {
  display: none;
}

.btn-menu {
  color: #fff;
  background-color: #934672 ;
  padding: 7px;
  position: fixed;
  top: 5px;
  left: 10px;
  cursor: pointer;
  transition: left .23s;
  z-index: 950;
  width: 25px;
  -webkit-transform: translateZ(0);
  -webkit-backface-visibility: hidden;
}
.btn-menu span {
  display: block;
  height: 3px;
  background-color: #fff;
  margin: 5px 0 0;
  transition: all .1s linear .23s;
  position: relative;
}
.btn-menu span.first {
  margin-top: 0;
}

.hidden-menu-ticker:checked ~ .btn-menu {
  left: 250px;
}
.hidden-menu-ticker:checked ~ .hidden-menu {
  left: 0;
}
.hidden-menu-ticker:checked ~ .btn-menu span.first {
  -webkit-transform: rotate(45deg);
  top: 8px;
  
}
.hidden-menu-ticker:checked ~ .btn-menu span.second {
  opacity: 0;
}
.hidden-menu-ticker:checked ~ .btn-menu span.third {
  -webkit-transform: rotate(-45deg);
  top: -8px;    
}


.infoproduct {
	height: 462px; 
	max-width:340px;
	border: 1px solid #ccc;
	position: relative;
	background: #EFEFEF;
	padding:15px;
	margin: 5px;
	float:right;
	color:#434343;
}

.link_nav_content {
	margin: 0 0 10px 10px;
	font-size: 18px;
	font-weight: bold;
}

.block_moduletitle {
	margin: 0 0 8px 0;
	border-bottom: 2px solid #91223D;
	font-size: 22px;
	font-weight: bold;
	color: #91223D;
}

/*
			.gcat-container{
			display: grid;
			grid-template-columns: 30% 30% 30%;/*repeat(3, 1fr);*//*
			grid-gap: 1em;
			justify-content: center;
			}
			.ginner-div{
			max-width: 440px;
			background-color: rgb(240,240,240, 0.95);
			padding: 10px;
			border: 1px solid #ccc; /* рамка *//*
			
			}
			.ginner-img{
			max-width: 100%;
			}
*/
@media screen and (max-width: 1590px) {
.infoproduct { 
	max-width:724px;
	height: auto;
}
}

@media screen and (max-width: 1200px) {
.infoproduct { 
	max-width:350px;
	height: 462px;
}
}

@media screen and (max-width: 1090px) {
.infoproduct { 
	max-width:724px;
	height: auto;
}
}
			
			@media screen and (max-width: 1000px) {
	
				.wrapper {
					width: calc(100% - 10%);
					}
				.btn-menu{
					display:none;
					}
					
				.gcat-container{
				display: grid;	
				grid-gap: 1em;
				justify-content: center;
				grid-template-columns: repeat(2, 45%);
				}
				.ginner-div{
			    max-width: 560px;
				}
			}
			
			@media screen and (max-width: 500px) {
			   .wrapper {
				width: calc(100% - 5%);
				margin-top: 23px;
				}
				.gcat-container{
				display: grid;	
				grid-gap: 1em;
				justify-content: center;
				}
                .gcat-container{
				grid-template-columns: repeat(1, 90%);
				}
				.ginner-div{
			    max-width: 560px;
				}
			}








		/* Медиа-запросы */
@media screen and (max-width: 1940px) {

	.right-column {
		flex: none;
        padding: 20px;
        width: 290px;
		display: block;
		} 
   .btn-menu{
		display:none;
	    }	
}

		/* Медиа-запросы */
@media screen and (max-width: 1800px) {
	
	.wrapper {
		width: calc(100% - 15%);
		}
	
	.right-column {
		flex: none;
        padding: 20px;
        width: 290px;
		display: block;
		} 
   .btn-menu{
		display:none;
	    }	
}

@media screen and (max-width: 1600px) {
	
	.wrapper {
		width: calc(100% - 15%);
		}
    .btn-menu{
		display:none;
	    }	
}

@media screen and (max-width: 1400px) {
	
	.wrapper {
		width: calc(100% - 10%);
		}
    .btn-menu{
		display:none;
	    }	
}

@media screen and (max-width: 1200px) {
	
	.wrapper {
		width: calc(100% - 5%);
		margin-top: 23px;
		}
	.btn-menu{
		display: block;
	    }	
		 
	.right-column {
		flex: none;
		display: none;
		}		
}

@media screen and (max-width: 1000px) {

	.wrapper {
		width: calc(100% - 5%);
		margin-top: 23px;
		}
	.btn-menu{
		display: block;
	    }	
		 
	.right-column {
		flex: none;
		display: none;
		}

	header{
			height: 580px;
			overflow: hidden;
			position:relative;
		}

		.header{
			/*background-color: rgb(240,240,240, 0.95);*/
			border-left: 1px solid #ccc; /* рамка */
			border-top: 1px solid #ccc; /* рамка */
			border-right: 1px solid #ccc; /* рамка */
			border-radius: 7px 7px 0 0;
			padding: 10px;
			text-align: center;
			overflow: hidden;
			display: flex;
			justify-content: center;
			align-items: center;
			height: 250px;
		}

		a.logo {
			text-align: center;
			border: 1px solid #ccc;
			padding: 15px;
			background: -webkit-gradient(linear, left top, left bottom, from(#B15A8D), to(#34091C));
			width: 100px;
			height: 129px;
			margin: 0;
			border-left:1px solid #3D3D3D;
			border-right:1px solid #3D3D3D;
			border-bottom:1px solid #3D3D3D;
			border-radius: 0 0 12px 12px;
			display:blockblock;
			margin: 0 auto;
			z-index: 900;
		}

		a.logo:hover{
			margin: 0;
			background: -webkit-gradient(linear, left top, left bottom, from(#fafafa), to(#BFBFBF));
			border-top:1px solid #BFBFBF;
			border-left:1px solid #BFBFBF;
			border-right:1px solid #BFBFBF;
			border-radius: 0 0 12px 12px;
			padding: 15px;
		}
		.header-text p{
			display: block;
			font-size: 20px;
			font-weight: bold;
			font-family: sans-serif;
			text-align: center;
			vertical-align: middle;
			padding-top: 2px;
			width: calc(100% - 20%);
			margin: 0 auto;
			color: #A08D96;	
			text-shadow: #000 1px 1px 1px;
		}

		.menu-1{
			 position: absolute;
			 z-index: 920;
			 display: flex;
			justify-content: center;
			align-items: center;
			top:20px;
			left: -6px;
			width: 96%;
		}

		ul.css-menu-1 {
			 list-style: none;
			 position: absolute;
			 margin: 2px;
			 z-index: 920;
		 }
		ul.css-menu-1 li {
			display: inline;
		 }

		ul.css-menu-1 li a {
			 margin: 0 4px 0 4px;
			 text-decoration: none;
			 background: -webkit-gradient(linear, left top, left bottom, from(#B15A8D), to(#34091C));
			 color: #fff;
			 font-size:18px;
			 font-weight: bold;
			 padding: 10px 14px 12px 14px;
			 border-left:1px solid #3D3D3D;
			 border-right:1px solid #3D3D3D;
			 border-bottom:1px solid #3D3D3D;
			 border-radius: 0 0 10px 10px;
		 }
}



@media screen and (max-width: 970px) {
		
		.wrapper {
		width: calc(100% - 5%);
		margin-top: 23px;
		}

		.header{
			/*background-color: rgb(240,240,240, 0.95);*/
			border-left: 1px solid #ccc; /* рамка */
			border-top: 1px solid #ccc; /* рамка */
			border-right: 1px solid #ccc; /* рамка */
			border-radius: 7px 7px 0 0;
			padding: 10px;
			text-align: center;
			overflow: hidden;
			display: flex;
			justify-content: center;
			align-items: center;
			height: 150px;
		}
	
	.menu-1 {
		display: none;
	}
	.right-column {
		flex: none;
		display: none;
		}		
	 ul.css-menu-1 li {
		display: block;
	 }
}

@media screen and (max-width: 700px) {
	.wrapper {
		width: calc(100% - 5%);
		margin-top: 23px;
		}
	
	.menu-1 {
		display: none;
	}
	.right-column {
		flex: none;
		display: none;
		}
		.header-text p{
			display: block;
			font-size: 20px;
			font-weight: bold;
			font-family: sans-serif;
			text-align: center;
			vertical-align: middle;
			padding-top: 2px;
			width: calc(100% - 5%);
			margin: 0 auto;
			color: #A08D96;	
			text-shadow: #000 1px 1px 1px;
		}
.cat-container{
    display: flex;
    /*flex-direction: row;*/
    /*flex-direction: row-reverse; */
    flex-direction: column; 
    /*flex-direction: column-reverse; */
	text-align: center;
}
.inner-div {
    height: 500px;
    width: calc(100% - 10%);
    margin: 15px;
    background-color: rgb(240,240,240, 0.95);
    padding: 10px;
	border: 1px solid #ccc; /* рамка */
  }		

}