html{font-size: 14px;}
body{margin:0;padding:0;font-family:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";}
p,li{padding:0;margin:0;line-height:1.6;text-align:justify;}
div{box-sizing:border-box;}
a{color:#34552b;outline: none;text-decoration: underline;}
h1,h2,h3{margin:0;padding:0;}
h1{font-size:1.75rem;}
h2{font-size:1.5rem;}
h3{font-size:1.25rem;}
select,input,button{font-family:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";}
.table{}
.table .tr{display:flex;flex-flow:row wrap;}
.cc{display:flex;flex-flow:row wrap;justify-content:center;align-items:center;}

.body{}


.wrap{background:#f3f3f4;min-height:100vh;overflow:hidden;position: relative;}

/* контейнер который двигается */
.layout{display:flex;min-height:100vh;transition: transform .3s ease;}
/* main */
.mainbar{flex:1;display:flex;flex-direction:column;min-width:100%;}
/* закрыто (по умолчанию) */
.wrap.closed .layout{transform: translateX(-240px);}
/* открыто */
.wrap:not(.closed) .layout{transform: translateX(0);}	
/* sidebar */
.sidebar{width:240px;background:#2f4050;flex-shrink:0;}
.logo{background: #fff;box-shadow: -1px 0 0 0 #2f4050 inset;}
.logo a{padding:1rem 0;display: block}
.logo img{max-width:100%;display: block;margin:0 auto;aspect-ratio: 5/2;}

.menu{list-style: none;margin:0;padding:.5rem 0 0 0;}
.menu li{}
.menu li a{transition: 0.3s ease;text-decoration: none;color: #a7b1c2;padding: 1rem 1.5rem 1rem 1.5rem;font-weight: 500;display: flex;align-items: center;line-height: 1;}
.menu li a:hover{background:#293846;transition: 0.3s ease;color: #fff;}
.menu li span{}
.menu svg{width:1rem;height:1rem;margin-right:.75rem}

.header{background: #fff;border-bottom: 1px solid #e7eaec;padding:10px;height:60px;display: flex;align-items: center;flex-flow: row wrap;}
.main{flex:1;padding:.5rem;}

.page{}
.full__image{aspect-ratio: 3/2;}

.swiper-slide{}
.swiper-slide img{width:100%;height:100%;object-fit: cover;}

.footer{background: #292c2f;padding:.875rem 1rem;color:#fff;font-size: .875rem;}

@media (min-width: 800px) {
	html{font-size: 16px;}
	.wrap{overflow: visible;}
	.layout{transform: none !important;}
	.sidebar{position: relative;transform: none !important;}
	.mainbar{margin-left:0;transition: margin .3s ease;min-width: 0; /* ВАЖНО */}
	.wrap.closed .mainbar{margin-left:0;}
	.menuBtn{display:none;}

	
	.full__image{aspect-ratio: 4/1;}
}