:root {
	--fstx: clamp(14px, 4vw, 20px);
	--fstx2: clamp(14px, 4vw, 17px);
	--wc: 1280px;
	--ots: 100px;
	--lnht: 1.4em;
	--otstx: 20px;
	--otsart: 28px;
	--clrtx: #1d1d1d;
	--clrtx2: #5E5E5E;
	--clrbrdr: #aeaeae;
	--clrbrdr2: #e1c030;
	--contots: calc(50% - (var(--wc)/2));
	--fnfm: 'Roboto', sans-serif;
	--clrbdy: #ffffff;
	--brdr: 40px;
	--brdrmin: 10px;
	--clrakc: #fdd838;
	--clrakchvr: #ffed9e;
	--clrfon1: #efefef;
	--clrfon2: #d8d8d8;
	--shdw: 0 0 7px 0 #efefef;
	--gridots: 20px;
}


/*bazovie nastroiki*/
html {scroll-behavior: smooth;height: 100%;width: 100%;}
body {font-family: var(--fnfm);background: var(--clrbdy);color: var(--clrtx);height: 100%;width: 100%;}
* {margin: 0px;padding: 0px;}
p {font-size: 18px;margin: 0 0 22px 0;line-height: 144%;}
@media (min-width: 482px) and (max-width: 768px) {p {font-size: 17px;margin: 0 0 19px;}}
@media (min-width: 426px) and (max-width: 481px) {p {font-size: calc(3vw + 4px);}}
@media screen and (max-width: 425px) {p {font-size: 4.5vw;margin: 0 0 18px;}}
a {text-decoration: underline;color: #1d1d1d;}
a:hover {text-decoration: none;}
input, textarea, button {outline: none; resize: none; border: none; font-family: var(--fnfm); font-weight: 400; font-size: 16px;}
select {border: none; font-family: var(--fnfm); font-weight: 400; font-size: 16px;}
.inpt-stl {border: 1px solid var(--clrfon2);height: 42px;border-radius: var(--brdrmin);padding: 0 18px;box-sizing: border-box;background: #ffffff;}
.slct-stl {border: 1px solid var(--clrfon2);height: 42px;border-radius: var(--brdrmin);padding: 0 17px;box-sizing: border-box;outline: none;cursor: pointer;background: #ffffff;}
.txtr-stl {border: 1px solid #e1c030;border-radius: 10px;padding: 13px 18px;box-sizing: border-box;outline: none;background: #ffffff;}
.lbl-box {border: 1px solid #e1c030; border-radius: 10px; padding: 12px 17px; box-sizing: border-box; display: flex; flex-direction: column; gap: 7px;background: #fff;}
.lbl-box:empty {display:none;}
.lbl-stl {display: flex;align-items: center;cursor: pointer;gap: 10px;}
.chckbx-stl {-webkit-appearance: none;-moz-appearance: none;width: 22px;height: 22px;border: 1px solid #e1c030;border-radius: 4px;position:relative;cursor: pointer;background: #ffffff;display: block;margin: 0 auto;}
.chckbx-stl:after {content: '';position: absolute;display: block;width: calc(100% - 6px);height: calc(100% - 6px);border-radius: 2px;background: #fdd838;opacity: 0;transform: translate(-50%, -50%);left: 50%;top: 50%;}
.chckbx-stl:checked:after {opacity: 1;}
.chckbx-stl:checked+span {font-weight: 500;}
.chckbx-stl[disabled] {opacity: 0.5;}
.rd-stl {-webkit-appearance: none;-moz-appearance: none;width: 20px;height: 20px;border: 1px solid #e1c030;border-radius: 34px;position:relative;cursor: pointer;background: #ffffff;}
.rd-stl:after {content: '';position: absolute;display: block;width: calc(100% - 6px);height: calc(100% - 6px);border-radius: 12px;background: #fdd838;opacity: 0;transform: translate(-50%, -50%);left: 50%;top: 50%;}
.rd-stl:checked:after {opacity: 1;}
.rd-stl:checked+span {font-weight: 500;}
.rd-stl[disabled] {opacity: 0.5;}
.svgicon {fill: var(--clrbrdr);cursor: pointer;display: block;height: auto;}
.svgicon:hover {fill:#e2c030;}
/*bazovie nastroiki end*/


/* swiper */
.swiper-container {overflow: hidden;}
.swiper-wrapper {display: flex;}
.swiper-slide {flex-shrink: 0;}
/* swiper end */


/* artcont */
.artcont {width: 1000px;margin: 0 auto;max-width: 100%;}
/* artcont end */


/* buttons */
.btn-yllw {background: var(--clrakc);border: 1px solid var(--clrbrdr2);border-radius: 12px;box-sizing: border-box;color: #000;height: 42px;padding: 0 33px;font-weight: 500;cursor:pointer;transition:0.2s;display: inline-flex;align-items: center;justify-content: center;flex-shrink: 0;text-align: center;text-decoration: none;}
.btn-yllw:hover {background: var(--clrakchvr);}
/* buttons end */


/* window  */
.window {width: 100%;height: 100%;display: flex;position: relative;}
.window__menu {flex-shrink: 0;}
.window__punkt {height: 60px;width: 60px;display: none;align-items: center;justify-content: center;border-right: 1px solid var(--clrbrdr);box-sizing: border-box;margin: 0 14px 0 0;flex-shrink: 0;}
.window__punkt-icon {}
.window__pole {width: 100%;display: flex;flex-direction: column;min-width: 0px;}
.window__header {background: var(--clrfon1);height: 60px;flex-shrink: 0;display: flex;align-items: center;padding: 0 19px;/* border-bottom: 1px solid var(--clrbrdr); */box-sizing: border-box;}
.window__title {font-size: 24px;font-weight: 500;}
.window__polz {margin: 0 0 0 auto; position: relative;}
.window__polz-name {height: 40px;background: var(--clrfon2);display: flex;align-items: center;justify-content: center;padding: 0 18px;border-radius: 10px;font-weight: 500;cursor: pointer;/* border: 1px solid var(--clrbrdr); */}
.window__polz-pop {position: absolute;top: 0px;background: var(--clrbdy);border: 1px solid var(--clrbrdr);padding: 12px 15px;right: 0px;border-radius: 10px;visibility: hidden;opacity: 0;transition: 0.2s;display: flex;flex-direction: column;grid-gap: 3px;}
.window__polz-name:hover + .window__polz-pop, .window__polz-pop:hover {top: calc(100% + 2px); visibility: visible; opacity: 1;}
.window__polz-elem {text-decoration: underline; cursor: pointer;}
.window__polz-elem:hover {text-decoration: none;}
.window__polz-text {color: var(--clrtx);font-weight: 500;}
.window__content {height: 100%;box-sizing: border-box;overflow: auto;padding: 30px;background: var(--clrbdy);max-width: 100%;}

@media screen and (max-width: 900px) {
.window__punkt {display: flex;}
.window__punkt-icon {width: 31px; transition: 0.2s; fill: #615315; display: block;}
.window__header {padding: 0 10px 0 0;}
.window__title {overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-size: 19px; margin: 0 8px 0 0;}
.window__polz-name {font-size: 15px; padding: 0 13px;}
.window__content {padding: 20px 12px;}
}
/* window  end */


/* menu  */
.menu {display: flex;flex-direction: column;background: var(--clrfon2);transition: 0.2s;box-sizing: border-box;overflow: auto;height: 100%;}
.menu__punkt {display: flex;align-items: center;height: 60px;padding: 0px 18px;font-size: 19px;text-decoration: none;/* border-bottom: 1px solid var(--clrbdy); */cursor: pointer;box-sizing: border-box;}
.menu__punkt:not(.menu__punkt-active):hover {background: var(--clrakchvr);}
.menu__punkt-active {background: var(--clrakc);}
.menu__punkt-active .menu__icon {fill: #000000;}
.menu__icon {width: 31px;transition: 0.2s;fill: var(--clrtx);}
.menu__name {margin: 0px; font-size: 0px; transition: 0.2s;}
.menu-active {}
.menu-active .menu__icon {width: 25px;}
.menu-active .menu__name {margin: 0 31px 0 12px; font-size: 17px;}
.menu-active .menu__punkt {}

@media screen and (max-width: 900px) {
.menu {position: absolute; left: -85px;}
.menu-active {left: 0px;}
}
/* menu  end */




/* vhod  */
.vhod {display: flex;align-items: center;justify-content: center;height: 100%;width: 100%;}
.vhod__container {max-width: 240px;}
.vhod__zag {font-size: 25px;font-weight: 500;margin: 0 0 14px;text-align: center;}
.vhod__login {}
.vhod__input {margin: 0 0 10px; width: 100%;}
.vhod__pass {margin: 0 0 15px;}
.vhod__but {width: 100%; box-sizing: border-box;}
/* vhod  end */


/* errorsef */
.errorsef {display: flex; align-items: center; justify-content: center; height: 100%; width: 100%; flex-direction: column;}
.errorsef h1 {margin: 0 0 14px; font-size: 70px; color: #828282;}
.errorsef h2 {}
/* errorsef end */


/* elements  */
.elements {display: grid; grid-template-columns: repeat(6 ,1fr); grid-gap: 20px;}
.element {background: #e7e7e7;border-radius: 12px;overflow: hidden;text-decoration: none;border: 1px solid #e3e3e3;display: flex;flex-direction: column;}
.element:hover {border-color: #e1c030;}
.element__img {max-width: 100%; aspect-ratio: 16 / 9; object-fit: cover;}
.element__data {padding: 15px 18px 19px;display: flex;flex-direction: column;height: 100%;}
.element__name {font-size: 18px;margin: 0 0 13px;flex: auto;}
.element__info {display: flex; align-items: center; justify-content: space-between;}
.element__date {}
.element__polz {}
.element__params {display: flex; align-items: center; font-size: 14px; color: #6b6b6b;}
.element__params svg {width: 18px; display: block; margin: 0 7px 0 0; fill: #6b6b6b; flex-shrink: 0;}
.element__add {display: flex; align-items: center; justify-content: center; font-size: 210px; cursor: pointer; padding: 40px 0;}
.element__add svg {height: auto; width: 130px; fill: #cbcbcb;}

@media (min-width: 1400px) and (max-width: 1600px) {
.elements {grid-template-columns: repeat(5 ,1fr);}
}
@media (min-width: 993px) and (max-width: 1400px) {
.elements {grid-template-columns: repeat(4 ,1fr);}
}
@media (min-width: 769px) and (max-width: 1100px) {
.elements {grid-template-columns: 1fr 1fr 1fr; grid-gap: 11px;}
}
@media (min-width: 482px) and (max-width: 768px) {
.elements {grid-template-columns: 1fr 1fr; grid-gap: 10px;}
.element__data {padding: 15px 15px 18px;}
.element__name {font-size: 17px;}
}
@media screen and (max-width: 481px) {
.elements {grid-template-columns: 1fr 1fr; grid-gap: 11px;}
.element__data {padding: 13px 13px 12px;}
.element__name {font-size: 14px; margin: 0px;}
.element__info {display: none;}
}
/* elements  end */


/* block  */
.block {}
.block__title {font-size: 38px; margin: 0 0 40px;}
.block__info {display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #c8c8c8; padding: 0 10px 7px; margin: 0 0 40px; grid-gap: 30px;}
.block__params {display: flex; align-items: center; color: #8b8b8b; font-size: 15px;}
.block__params svg {width: 18px; max-height: 18px; display: block; margin: 0 9px 0 0; fill: #8b8b8b;}
.block__info .block__params:first-child {margin: 0 auto 0 0;}
.block__params-name {}
.block__data {}
.block__user {}
.block__write {cursor: pointer;}
.block__write:hover {text-decoration:underline;}
.block__del {cursor: pointer;}
.block__del:hover {text-decoration:underline;}
.block__img {max-width: 100%; image-rendering: optimizequality; display: block; margin: 0 0 50px;}
.block__opis {margin: 0 0 50px;}
.block__code {background: #e8e8e8; margin: 0 0 10px; padding: 19px 23px; border-radius: 12px; position: relative;}
.block__code-txtar {width: 100%; background: #e8e8e8; margin: 0 0 5px;}
.block__html {display: flex; flex-direction: column;}
.block__code-ident {position: absolute; right: 16px; top: 12px; color: #bcbcbc; font-size: 19px; font-weight: 600;}
.block__css {}
.block__js {}
.block__php {}
.block__copy {position: absolute; background: #ccffcc82; border: 1px solid #00CC00; width: 100%; height: 100%; left: 0px; top: 0px; border-radius: 12px; display: flex; align-items: center; justify-content: center; opacity: 0; transition: 0.2s; cursor: pointer;}
.block__code:hover .block__copy {opacity: 1;}
.block__copy svg {width: auto; fill: #00cc0080; display: block; max-height: 60%; height: 100px;}

@media screen and (max-width: 700px) {
.block__title {font-size: 28px; margin: 0 0 28px;}
.block__info {grid-gap: 16px;}
.block__img {margin: 0 0 36px;}
.block__del .block__params-name {display: none;}
.block__del svg {margin: 0px;}
.block__write .block__params-name {display: none;}
.block__write svg {margin: 0px;}
.block__opis {margin: 0 0 36px;}
}
/* block  end */


/* addblck  */
.addblck {display: flex; flex-direction: column; align-items: stretch;}
.addblck__input {margin: 0 0 40px;}
.addblck__textarea {margin: 0 0 12px; height: 140px;}
.addblck__file {margin: 0 0 40px; display: flex; align-items: center;}
.addblck__file-img {max-width: 100%; border-radius: 14px; display: block;}
.addblck__file-input {width: 0; height: 0; display: block;}
.addblck__file-but {border-radius: 12px 0 0 12px;}
.addblck__file-name {flex: auto; display: flex; align-items: center; border-radius: 0 10px 10px 0; margin: 0 0 0 -1px;}
/* addblck  end */


/* prfls  */
.prfls {display: grid; grid-template-columns: 2fr 3fr; grid-gap: 30px;}
.prfls__box {border: 1px solid #e3e3e3; border-radius: 12px; padding: 30px 30px; background: #fff; box-sizing: border-box;}
.prfls__ttl {font-size: 20px; font-weight: 500; text-align: center; margin: 37px 0px 21px;}
.prfls__ttl:first-child {margin-top:0px;}
.prfls__data {display: flex; align-items: center; margin: 0 0 12px;}
.prfls__znc {width: 170px;flex-shrink: 0;}
.prfls__inpt {height: 37px;}
.prfls__val {}
.prfls__btn {margin: 0 auto; width: 180px; display: flex;}
.prfls .tblstl__td>input {text-align: center;}

@media screen and (max-width: 992px) {
.prfls {grid-template-columns: 1fr;grid-gap: 12px;}
.prfls__box {min-width: 0px;padding: 30px 20px;}
.prfls__ttl { }
.prfls__ttl:first-child { }
.prfls__data { }
.prfls__znc {width: 150px;}
.prfls__inpt {min-width: 0px;}
.prfls__val { }
.prfls__btn { }
.prfls .tblstl__td>input { }
}
/* prfls  end */


/* tblstl  */
.tblstl {border-collapse: collapse;display: inline-block;overflow: auto;max-width: 100%;}
.tblstl__tr-zag {}
.tblstl__tr {}
.tblstl-action .tblstl__tr {cursor: pointer;}
.tblstl-action .tblstl__tr:hover {background: var(--clrakchvr);}
.tblstl__tr-slct {background: var(--clrakc) !important;}
.tblstl__th, .tblstl__td {padding: 10px 17px;border: 1px solid var(--clrfon2);}
.tblstl__th {background: var(--clrfon1);white-space: nowrap;cursor: pointer;}
.tblstl__td {text-align: center;}
.tblstl__tr-upd .tblstl__td[data-upd-pole] {padding: 3px;}
.tblstl__upd-input {height: 33px;width: 100%;text-align: inherit;border-radius: 4px;}
.tblstl__td-dshred {background: #ffc4c4;}
.tblstl__td-dshylw {background: #ffed9e;}
.tblstl__td-but {padding: 0 10px;height: 32px;font-size: 15px;}
.tblstl__inptstl {height: 35px; padding: 0 11px; min-width: 0px;}
.tblstl__td-lft {text-align: left;}
.tblstl__td-mini {font-size: 15px;}
.tblstl__href {text-decoration: none;}
.tblstl__href:hover {text-decoration: underline;}
.tblstl__plus {}
.tblstl__stng {display: flex; align-items: center; gap: 16px;}
.tblstl__stng svg {height: auto; width: 24px;}
.tblstl__add {display: flex; flex-direction: column; align-items: center; position: relative; padding: 10px 0 13px;}
.tblstl__add>* {max-width: 290px;width: 100%;margin: 0 0 8px;}
.tblstl__add-box {display: flex;align-items: center;gap: 9px;justify-content: center;}
.tblstl__add-box-name {}
.tblstl__add-close {position: absolute;top: 6px;right: 0px;width: 18px;}
.tblstl__add-title {font-size: 20px; font-weight: 500; margin: 0 0 12px;}
.tblstl__add-input {}
.tblstl__add-select {}
.tblstl__add-lblbox {}
.tblstl__add-btn {margin: 0px;}
.tblstl__add-check {}
.tblstl__add-pole {height: 42px; border-radius: var(--brdrmin); background: var(--clrfon1); align-items: center; display: flex; white-space: nowrap; padding: 0 18px; box-sizing: border-box; gap: 18px;}
.tblstl__add-ptxt {display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;overflow: hidden;color: var(--clrtx2);}
.tblstl__add-pcopy {width: 18px; height: auto; flex-shrink: 0;}

.js-addbut {display: none;}
.js-addbut-active {display: inline-flex;}
.js-addform {display: none;}
.js-addform-active {display: table-row;}
/* tblstl  end */


/* action  */
.action {display: flex; align-items: center; gap: 12px; margin: 0 0 23px;}
.action__search {}
.action__but {padding: 0 24px;}
.action__dop {border-left: 1px solid var(--clrfon2); padding: 0 0 0 12px; display: flex; gap: 12px;}
/* action  end */


/* glavn  */
.glavn {display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 20px;}
.glavn__elem {background: var(--clrfon1);border-radius: var(--brdrmin);padding: 30px;display: flex;flex-direction: column;align-items: center;text-decoration: none;cursor: pointer;}
.glavn__elem:hover {background: var(--clrakchvr);}
.glavn__ttl {font-size: 22px; font-weight: 500; margin: 0 0 2px;}
.glavn__count {font-size: 100px; box-sizing: border-box; font-weight: 500;}
.glavn__error {background: var(--clrbdy);min-width: 63%;font-size: 17px;padding: 10px 10px;box-sizing: border-box;border: 1px solid var(--clrfon2);border-radius: var(--brdrmin);text-align: center;}
.glavn__elem-atent .glavn__error {border-color: #ffacac;background: #ffd9d9;}
.glavn__elem-atent .glavn__error span {}
.glavn__error span {font-weight: 700;}
.glavn__elem-atent {}
/* glavn  end */
