﻿@font-face { font-display: optional; font-family: 'Google Sans'; font-style: normal; font-weight: 400; src: url('fonts/google-sans-v67-cyrillic_latin-regular.woff2') format('woff2'), url('fonts/google-sans-v67-cyrillic_latin-regular.ttf') format('truetype'); }
@font-face { font-display: optional; font-family: 'Google Sans'; font-style: italic; font-weight: 400; src: url('fonts/google-sans-v67-cyrillic_latin-italic.woff2') format('woff2'), url('fonts/google-sans-v67-cyrillic_latin-italic.ttf') format('truetype'); }
@font-face { font-display: optional; font-family: 'Google Sans'; font-style: strong; font-weight: 500; src: url('fonts/google-sans-v67-cyrillic_latin-500.woff2') format('woff2'), url('fonts/google-sans-v67-cyrillic_latin-500.ttf') format('truetype'); }
@font-face { font-display: optional; font-family: 'Google Sans'; font-style: normal; font-weight: 600; src: url('fonts/google-sans-v67-cyrillic_latin-600.woff2') format('woff2'), url('fonts/google-sans-v67-cyrillic_latin-600.ttf') format('truetype'); }

* {box-sizing: border-box; margin: 0; padding: 0; font-family: 'Google Sans', sans-serif, Arial;}
html {font-size: 16px; max-width: 2560px; color: #2d2d2d;}
body {--content-max:100%; --mleft-min:300px; --mright-min:0px; display:grid; min-height:100vh; grid-template-columns:minmax(var(--mleft-min),1fr) minmax(0,var(--content-max)) minmax(var(--mright-min),1fr); grid-template-rows:auto 1fr auto; grid-template-areas:"zero zero zero" "mleft content mright" "mund mund mund"; padding:0; margin:0;}
body.content-wide {--content-max:1400px;}
body.content-tab {--content-max:100%;}
body.no-side-min {--mleft-min:0px; --mright-min:0px;}
body.no-side-tab {--mright-min:0px;}
main {display: block;}




a:link, a:visited { color: #1756AB; text-decoration: none;}

a:hover { color: #cc0052}
#alt {border: 1px solid #C0C0C0; padding: 2px; background-color: #FFFFFF}


b {font-weight: 500}
strong {font-weight: 500}
h1 {font-size: 32px; line-height: 1.5; font-weight: 500; margin-top: 0; color: #4285F4; }
h2 {font-size: 22px; line-height: 1.3; font-weight: 400; margin-top: 0; color: #CC0000; margin: 15px 0 10px 0; }
h3 {margin:10px 0 5px 0; color:#b70697; font-size: 18px; font-weight: 500; }
h4 {margin:10px 0 5px 0; color:#CC0000; font-size: 18px; font-weight: 500; }


/* GM */ 
.zero {grid-area:zero; position:sticky; display:grid; grid-template-columns:minmax(300px,1fr) minmax(0,1400px) minmax(200px,1fr); grid-template-areas:"diva divb divc"; min-height: 100px; z-index:5; top:0; width:100%; box-shadow: 0 0 10px 5px #E0EBFB; background-image:url('images/header.jpg'); background-repeat:repeat-x; background-color: white;}
.diva {grid-area:diva; display:grid; min-width:0; place-items:center;} /* n */
.divb {grid-area:divb; display:grid; min-width:0; grid-template-rows:auto 1fr;}
.divc {grid-area:divc; display:grid; min-width:0; place-content:center;}
.divbpad {display:flex; flex-wrap:wrap; align-self:end; align-items:center; justify-content:flex-start; gap:0 10px; min-width:0; padding: 5px 0 15px 0}
.divcpad {display:flex; flex-direction:column; align-items:flex-start; gap:10px; white-space:nowrap;}
.brandbar {display:flex; flex-direction:column; align-items:center;}
.logo {display:block;}
.logo img {display:block; width:160px; height:30px; object-fit: contain;}
.companynav {display:flex; align-self:start; justify-content:flex-start; gap:10px; min-width:0; padding:0;}
.contur {display:block; white-space:nowrap; background-color:#fff; padding:5px 8px 8px 8px; border-radius:0 0 10px 10px; font-size: 14px;}




.mlink {display:block; gap:10px; padding: 5px; margin:0; line-height:1; font-weight:500; text-align:center; border-bottom:2px solid transparent; white-space: nowrap;}
.mlink:hover, .mlinkact { color:#ff0066; border-bottom-color: #ff0066 }


.mleft {grid-area: mleft; display: table; padding: 20px 0; margin: 20px 0;  min-width:var(--mleft-min);} /* n */
.left {margin-inline: 0 auto; max-width: auto;} /* n */
.tesninq {}
:hover.tesninq {}
.tusninq {float: left;}
.llink {font-size: 100%; text-align: center; line-height: 200%; padding: 5px; border-radius: 4px; margin: 1px;}
:hover.llink {background: #b70697; color:#FFFFFF; }

a.llink.active   { background: #b70697; color:#FFFFFF; }

.llinkact { font-size: 100%;  text-align: center; padding: 5px; border-radius: 4px; line-height: 200%; background: linear-gradient(to left, #495aff 0%, #0acffe 100%); color:#FFFFFF }
:hover.llinkact { font-size: 100%;  text-align: center; padding: 5px; border-radius: 4px; line-height: 200%; background: linear-gradient(to right, #495aff 0%, #0acffe 100%); color:#FFFFFF }

.page-menu {display: flex; flex-wrap: wrap; gap: 10px; margin: 5px 0;}

.menu {display: flex; flex-wrap: wrap; gap: 5px; margin: 5px 0;}
.ullink { float: left;  border-bottom:1px dotted #006699; margin: 5px; padding: 5px;  }
:hover.ullink { box-shadow: 0px 0px 15px 1px rgba(34, 60, 80, 0.2); border-bottom:1px dotted #FF0066; margin: 5px; padding: 5px; }
a.ullink.active { box-shadow: 0px 0px 15px 1px rgba(34, 60, 80, 0.2); border-bottom:1px solid #FF0066; margin: 5px; padding: 5px; }


.rlink {border-bottom: 1px dotted #006699; padding: 5px; gap: 10 px;}
.rlink:hover {box-shadow: 0 0 15px 1px rgba(34, 60, 80, 0.2); border-bottom: 1px dotted #FF0066;}
a.rlink.active {box-shadow: 0 0 15px 1px rgba(34, 60, 80, 0.2); border-bottom: 1px solid #FF0066;}



.content {grid-area:content; min-width:0; margin: 20px 0; padding: 20px; line-height: 1.6; background-color: #fff;} /* n */
.content > p{max-width: 90ch; margin-bottom: 1.2em;}

.mright {grid-area:mright; min-width:var(--mright-min);} /* n */
.right {}
.rightl {}

.tabletka {overflow-x: auto; float: none; padding: 5px;}

.tabi	{border-collapse: collapse;}
.tc          { padding: 5px; border-bottom:1px dotted #C0C0C0; text-align: center; }
.ntc         { padding: 5px; border-bottom:1px dotted #C0C0C0; text-align: left; }
.tcl         { padding: 7px; text-align: left; background-color: white; color: #CC0000; }
.tcc         { padding: 5px; border:1px solid #C0C0C0; text-align: center; background-color: #F4F4F4; }
.tt          { border: 1px solid #FFFFFF; padding: 10px; font-weight: 500; background-color:#F4F4F4; }
.ttl         { font-weight: 500; border-bottom: 1px dotted #C0C0C0; padding: 7px;}
.ttll        { border-bottom: 1px dotted #C0C0C0; padding: 7px;}
.ttt         {font-weight: 500; border: 1px solid #C0C0C0; padding: 5px; background-color: #F4F4F4; }
.tkk 		{padding: 5px;}

.tab {border-collapse: collapse; font-size: 15px; overflow: hidden; box-shadow: 0px 0px 10px 0px rgba(34, 60, 80, 0.2); border-radius: 10px;}
.tab td:hover {background-color: #F4F4F4;}
.tab tr:hover td {background-color: #F4F4F4;}

.tab td:hover::after {background-color: #F4F4F4; content: ""; height: 10000px; left: 0; position: absolute;  top: -5000px; width: 100%; z-index: -1}
.tab td:hover::before {background-color: #F4F4F4; content: ""; height: 100%; left: -5000px; position: absolute;  top: 0; width: 10000px; z-index: -2}
.tab td, tr {position: relative;}
.tabo {border-collapse: collapse; font-size: 16px; margin-top: 5px; overflow: hidden; z-index: 1; border-radius: 5px}
tbody td:hover.tc {border-bottom: 1px solid #C0C0C0; color:#FFFFFF; background-color:#0099CC }

.ttm {border: 2px dotted #FFFFFF; padding: 10px; font-weight:500; background-color:#F4F4F4;}
.tcm {padding: 5px; border-bottom:1px dotted #C0C0C0; text-align: center}
.tcl {padding-top: 10px; padding-bottom: 2px; text-align: left}

/*n*/
.fortab {width:max-content; max-width:100%; margin: 15px 0; overflow-x:auto; overflow-y:auto; border-radius:10px; background-color:#e8f0fe; border:solid 1px #e8f0fe; -webkit-overflow-scrolling:touch;}
.fortab.full {width:100%;}
.fortab.full .gtab {width:100%;}

.gtab {border-collapse:collapse; background-color:#fff; font-size:14px;}
.gtab.tab16 {}
.gtab.tab16 tbody td {text-align: right; padding: 15px; font-size:16px;}

.gtab thead th:first-child {position:sticky; z-index:3; top:0; left:0; background-color:#f3f7fe;}
.gtab th.row-label {position:sticky; z-index:2; top:0; left:0; background-color:#f3f7fe; text-align:left;}
.gtab thead th {position:sticky; z-index:1; border:0; padding:8px; white-space:nowrap; text-align:center; background-color:#f3f7fe; top:0; left:0; white-space:normal; max-width:18ch;}
.gtab thead th:first-child {text-align:left;}

.gtab tfoot th {position:sticky; z-index:1; border:0; padding:8px; white-space:nowrap; text-align:center; background-color:#f3f7fe; top:0; left:0;}

.gtab tbody td, .gtab tbody th {border:0; padding:8px; white-space:nowrap; text-align:center;}
.gtab tbody tr > * {border-top:1px solid #e8f0fe;}

.gtab tbody td.cs {box-shadow: 0px 0px 8px -2px #9216A880 inset;}
.gtab tbody td.cm {box-shadow: 0px 0px 8px -2px #1F91DC80 inset;} 
.gtab tbody td.cp {box-shadow: 0px 0px 8px -2px #FF000080 inset;}

.gtab tbody .col-hover {background-color:#f8fafe;}
.gtab tbody td:hover, .gtab tbody th.row-label:hover {background-color:#e8f0fe; outline:1px solid #d2e3fc; outline-offset:-1px;}
.gtab tbody tr:hover, .gtab tbody tr:hover .col-hover {background-color:#f8fafe;}

.gtab tbody td:empty::before {content:"—"; color:#80868b;}
.gtab .row-repeat {color:transparent;}
.gtab tbody tr.group-start > * {border-top:2px solid #dadce0;}
.gtab tbody tr.group-start:first-child > * {border-top:0;}



.vtc {padding: 5px; border-bottom:1px dotted #C0C0C0; text-align: center; color:}
tbody td:hover.vtc {background: #9900CC; color:#FFFFFF}


/* ntab */
.ntab {border-collapse:collapse; border-spacing: 0px 0px; background-color: #fff; }
.ntab thead {border-bottom: solid 2px #e8f0fe; font-weight: 500; background-color:#efefff;}
.ntab th, .ntab td {padding: 8px; }
.ntab tbody td {}
.ntab tbody th {text-align: left; }
.ntab tr:nth-child(even) {background-color: #f3f7fe;}
.ntab tr {border-bottom: solid 1px #e8f0fe; }
.ntab tbody tr:hover {}
.ntab tbody tr > :first-child {}
.ntab thead tr > :last-child {} 
.ntab tbody td:empty::before {content:"—"; color:#80868b;}


.stab {display: flex; flex-wrap: wrap; gap: 30px; max-width: 900px;}
.stab > div {width: min-content;  max-width: 100%;}
.stab > div > p {overflow-wrap: break-word;}
.stab > div > p:first-child {font-weight: 500;}
.stab > div > p:last-child {font-size: 0.8rem;}


.toptc {padding-top: 15px; color:#CC0000; font-weight:500}
.pic         { padding-top: 10px; }
.scheme {display: flex; font-size: 14px; box-shadow: 0px 0px 15px 1px rgba(34, 60, 80, 0.2); padding: 5px; margin: 10px 0; max-width: 900px;}
.arman {}
.content, .arman { min-width:0;}
.arma {}

.navid {display:flex; flex-wrap:wrap; justify-content:flex-start; align-items:flex-start; gap:20px;}
.dvadiva {max-width:auto;}
.dvadiva img {display:block;}

.dvadivan {float: left;}

.livan {display:inline-block; vertical-align:middle; padding: 20px 0 20px 0;}
.livani {display:inline-block; vertical-align:middle; margin-right:10px;}
.livani img {display:block; border:0;}
.livanii {display:inline-block; vertical-align:middle; line-height:1.45;}

.livanii ul {margin:0; padding:0; list-style:none;}
.livanii li {margin:0 0 4px;}
.livanii li::before {content:"— ";}



.livaniii {display: inherit; vertical-align: inherit; background-color:#FFECD9; padding: 5px; border-radius: 4px}


.mlivan {display: inline-block; vertical-align: bottom;}
.mlivani {display: inherit; vertical-align: inherit;}

.utr {display: inline-block; vertical-align: top;}
.utri {display: inline-block; vertical-align: inherit; width: 220px; padding: 5px; border: 1px solid #C0C0C0; border-radius: 5px; margin: 2px;}


.nemeloch {float: none; display: table; box-shadow: 0px 0px 15px 1px rgba(34, 60, 80, 0.2); padding: 10px; margin-top: 10px; text-align: center;}
.meloch {justify-content: center; float: left; font-size: 10pt; padding: 10px; text-align: center; }
.achtung {padding: 10px; border: 2px dotted #FF0000; margin: 10px 0; max-width: 900px;}
.achtungo {display: table; padding: 10px; border: 4px dotted #FF0000; margin-bottom: 10px; margin-top: 10px; font-size:20px;}

/* tr:nth-child(even){background-color: #f2f2f2} */


.mrut {display: inline-flex; border:1px solid #FFFFFF; float: left; width: 150px; height: 150px; justify-content: center; text-align: center; align-items: center;  margin-left: 5px; }
:hover.mrut {border:1px solid #FFFFFF; border-radius: 10%; box-shadow: 0px 0px 15px 1px rgba(34, 60, 80, 0.2); }

.mruut {display: inline-block; border:1px solid #FFFFFF; float: left; justify-content: center; align-items: center; text-align: center; padding: 15px; margin: 5px; }
:hover.mruut {border:1px solid #FFFFFF; border-radius: 10%; box-shadow: 0px 0px 15px 1px rgba(34, 60, 80, 0.2); }


a.zav, a.zav:visited {display:inline-block; justify-self:start; padding:7px 14px; margin:5px; border:1px solid #cc0052; border-radius:18px; background-color:#cc0052; background-image:linear-gradient(110deg, transparent 0%, transparent 38%, rgba(255,255,255,.75) 48%, transparent 58%, transparent 100%); background-size:250% 100%; background-position:120% 0; color:#fff; font-size:16px; font-weight:600; line-height:1.1; letter-spacing:.2px; animation:zav-glare 15s ease-in-out .3s infinite; transition:color .2s, background-color .2s, border-color .2s, box-shadow .2s;}
a.zav:hover {color:#cc0052; background-color:#fff; border-color:#fff; box-shadow:0 0 100px #cc0052;}
@keyframes zav-glare {0% {background-position:120% 0;} 35% {background-position:-120% 0;} 100% {background-position:-120% 0;}}

.armash {display: flex; flex-wrap: wrap; align-items: flex-start;}
.razdel {flex: 0 0 100%; padding: 10px 0 5px 0; color: #666666;}
.razdel2 {flex: 0 0 100%; padding: 5px 0 5px 0; color: #666666; gap: 5px;}
.nofol {float: none;}

.ramka {border:1.5px solid #CCCCCC; padding:15px; border-radius: 20px; margin: 10px 0 10px 0; max-width: max-content;}
.ramka:hover {border:1.5px solid #b70697;}

.ramka a[href^="mailto:"] {color: #E1005A; font-size: 32px;}
.ramka > strong {font-weight: 400;}

.yama {border:1.5px solid #CCCCCC; padding:20px; border-radius: 20px; margin: 10px 0 10px 0; max-width: 600px;}
.yama:hover {border:1.5px solid #b70697;}


/* P */

.mund {grid-area:mund; display:grid; grid-template-columns:minmax(300px,1fr) minmax(0,1400px) minmax(0,1fr); padding:20px 0 20px 0; background-image:linear-gradient(to top, #f0f0f0 0%, white 10%);}
.mund > *{grid-column:2;}



.show {display: table-cell; cursor: pointer; background: #f0f0f0; color: #b70697; padding: 10px; text-align: center; vertical-align: middle;}
.hide {display: none; cursor: pointer; background: white; color: #b70697; padding: 10px; text-align: center; vertical-align: middle;}
.showme {display: none;}
.showlink {display: table;}


.ss {font-size: 24px; padding: 5px; }
a.ss {color: #ff0066}
a:hover.ss {color: #ffffff; background-color: #FF0066;}


/* pcard */
.pcard {margin: 5px; padding: 5px; width: 180px; height: 180px; box-shadow: 0 0 2px 0 rgba(34, 60, 80, 0.2); background-color: white; font-size: 14px; font-weight: 500;}
.pcard:hover {box-shadow: 0 0 15px 0 rgba(34, 60, 80, 0.2);}
.pcard-link {position: relative; display: flex; flex-direction: column; height: 100%;}
.pcard-img {height: 100px; display: flex; justify-content: center; align-items: flex-start;}
.pcard-img > img {display: block; width: 100px; height: 100px;}
.pcard-title {height: 80px; display: flex; justify-content: center; align-items: center; text-align: center;}
.pcard-tag {position: absolute; top: 0; right: 0; padding: 5px; background-color: rgb(255 255 255 / 80%);}

/* navbar */
.nav-toggle {display: none;}

.section-group {margin: 0;}
.section-menu-title {display: flex; align-items: center; gap: 10px; padding: 10px; border-radius: 0 20px 20px 0; font-weight: 400; cursor: pointer; user-select: none; list-style: none;}
.section-menu-title:hover {background: #f0f4fe;}
.section-menu-title::before {content: ""; width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(-45deg); transition: transform 0.2s ease; opacity: 0.75; flex: 0 0 auto;}
.section-group[open] > .section-menu-title::before {transform: rotate(45deg);}
.section-menu-title::-webkit-details-marker {display: none;}
.section-menu-title::marker {content: "";}

.section-subgroup {margin: 0;}
.section-subgroup > .section-menu-subtitle {display: flex; align-items: center; gap: 10px; padding: 10px 10px 10px 25px; border-radius: 0 20px 20px 0; font-weight: 500; font-size: 14px; cursor: pointer; user-select: none; list-style: none;}
.section-subgroup > .section-menu-subtitle:hover {background: #f0f4fe;}
.section-subgroup > .section-menu-subtitle::before {content: ""; width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(-45deg); transition: transform 0.2s ease; opacity: 0.75; flex: 0 0 auto;}
.section-subgroup[open] > .section-menu-subtitle::before {transform: rotate(45deg);}
.section-subgroup > .section-menu-subtitle::-webkit-details-marker {display: none;}
.section-subgroup > .section-menu-subtitle::marker {content: "";}

.section-menu {list-style: none; margin: 0; padding: 0;}
.section-menu li {margin: 0; padding: 0;}
.section-menu a {display: block; padding: 10px 10px 10px 45px; border-radius: 0 20px 20px 0; font-weight: 400; font-size: 14px; text-decoration: underline; text-decoration-color: #C9DDF8; text-decoration-thickness: 1px; text-underline-offset: 3px;}
.section-menu a:hover {background: #f5f5f5;}
.section-menu a.active {background: #f0f4fe;}
.section-menu-subtitle {padding: 5px 0 5px 30px; font-size: 14px;}



/* ya */
.site-search {display:flex; align-items:center; max-width:520px; width:100%; gap:8px; padding: 10px;}
.site-search-input {width:100%; min-width:0; height:46px; padding:0 14px; border:1px solid #dadce0; font-size:16px; line-height:46px; background:#fff; outline:none;}
.site-search-input:focus {border-color:#106ebe;}
.site-search-button {width:46px; height:46px; flex:0 0 46px; border:1px solid #dadce0; background-color:#f8f9fa; cursor:pointer; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19' height='19' viewBox='0 0 24 24' fill='none' stroke='%23106ebe' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-4.2-4.2'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:center;}
.site-search-button:hover {background-color:#fff; border-color:#106ebe;}




/* fordel */
.lll           { border-left: 1px solid #0099CC; border-right-width: 1px; border-top-width: 1px; 
               border-bottom-width: 1px }
.undol       { border-left-width: 1px; border-right-width: 1px; border-top-width: 1px; 
               border-bottom: 1px solid #0099CC; }
.lugol          { border-left: 1px solid #0099CC; border-right-width: 1px; border-top-width: 1px; 
               border-bottom: 1px solid #0099CC; }

.cookiebar {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2147483647;
	box-sizing: border-box;
	padding: 20px;
	background-color: #f0f4fe;
	display: flex;
	gap: 20px;
	align-items: center;
	justify-content: center;
	border-top: 1px solid rgba(255,255,255,.12);
}

.cookiebar__text {max-width: 980px;}
.cookiebar__link {color: #fff;}
.cookiebar__button {border: 1px solid #f0f4fe; border-radius: 10px; letter-spacing: 1px; background-color: #065089; color: #fff; padding: 10px; cursor: pointer; font: inherit; white-space: nowrap; }




@media (max-width: 800px)
{
body{grid-template-columns:1fr; grid-template-rows:auto; grid-template-areas: "zero" "mleft" "content" "mright" "mund"; }

.zero {position: relative; top: auto; grid-template-columns:1fr; grid-template-areas:"diva" "divb" "divc"; padding: 5px 0;} /* n */
.mund {grid-template-columns:1fr; text-align:center; } /* n */
.mund > *{grid-column:1;} /* n */
.diva {width: 100%;}
.divb {width: 100%; }
.divbpad {padding: 0; justify-content:center; }
.divc {width: 100%; }
.divcpad {text-align: center; }
.companynav {flex-wrap:wrap; justify-content:center; gap:0 10px;}
.content {margin: 10px 0; padding: 10px;} /* n */
.newpic {width: auto; height: 200px;}


.coin {float: left; }
.mrut {width: 150px; height: 150px;}
.tesninq {float: left;}
.content {grid-area:content; min-width:0; margin: 0; padding: 10px;} /* n */
.mleft {width: auto; padding: 5px; margin: 0;} /* n */
.left {max-width: 100%;} /* n */
.pic { width: 100%; height: auto; }
.navid {width: auto;}
.stab > div {width: 100%;}

.lalink {display: none;}

.cookiebar {align-items: flex-start; flex-direction: column; padding: 15px; }
.cookiebar__button {width: 100%;}

.pcard {width: 100%; height: auto; padding: 3px; margin: 3px 0;}
.pcard-link {flex-direction: row; align-items: center; gap: 10px;}
.pcard-img {flex: 0 0 40px; height: auto;}
.pcard-img > img {width: 40px; height: 40px;}
.pcard-title {height: auto; display: block; text-align: left;}
.pcard-tag {display: none;}

.nav-toggle {display: flex; justify-content: center; align-items: center; gap: 10px; width: fit-content; margin: 10px auto; padding: 15px; border: 0; border-radius: 20px; background: #f0f4fe; color: #000; font: inherit; cursor: pointer;}
.leftnavbar {display: none;}
.leftnavbar.is-open {display: block;}
.nav-toggle-icon {position: relative; display: inline-block; width: 22px; height: 18px; flex: 0 0 22px;}
.nav-toggle-icon::before, .nav-toggle-icon::after, .nav-toggle-icon span {content: ""; position: absolute; left: 0; width: 22px; height: 2px; border-radius: 2px; background: currentColor; transition: transform 0.2s ease, top 0.2s ease, opacity 0.2s ease;}
.nav-toggle-icon::before {top: 2px;}
.nav-toggle-icon span {top: 8px;}
.nav-toggle-icon::after {top: 14px;}
.nav-toggle.is-open .nav-toggle-icon::before {top: 8px; transform: rotate(45deg);}
.nav-toggle.is-open .nav-toggle-icon span {opacity: 0;}
.nav-toggle.is-open .nav-toggle-icon::after {top: 8px; transform: rotate(-45deg);}

.section-menu-title {padding: 10px; border-radius: 20px; background: #f6f6f6;}
.section-menu-subtitle {padding: 5px;}
.section-menu a {display: block; padding: 10px 40px 10px 40px; border-radius: 20px; font-weight:500;}

}


@media (max-width: 400px)
{
.pici { width: 100%; height: 100%; }
.tab {width: 100%;}
.rlink {}

}