/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html{
line-height:1.15;
-webkit-text-size-adjust:100%
}
body{
margin:0
}
main{
display:block
}
h1{
font-size:2em;
margin:.67em 0
}
hr{
box-sizing:content-box;
height:0;
overflow:visible
}
pre{
font-family:monospace,monospace;
font-size:1em
}
a{
background-color:transparent
}
abbr[title]{
border-bottom:none;
text-decoration:underline;
-webkit-text-decoration:underline dotted;
text-decoration:underline dotted
}
b,strong{
font-weight:bolder
}
code,kbd,samp{
font-family:monospace,monospace;
font-size:1em
}
small{
font-size:80%
}
sub,sup{
font-size:75%;
line-height:0;
position:relative;
vertical-align:baseline
}
sub{
bottom:-.25em
}
sup{
top:-.5em
}
img{
border-style:none
}
button,input,optgroup,select,textarea{
font-family:inherit;
font-size:100%;
line-height:1.15;
margin:0;
padding:0
}
button,input{
overflow:visible
}
button,select{
text-transform:none
}
button,[type=button],[type=reset],[type=submit]{
-webkit-appearance:button
}
button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{
border-style:none;
padding:0
}
button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{
outline:1px dotted ButtonText
}
fieldset{
padding:.35em .75em .625em
}
legend{
box-sizing:border-box;
color:inherit;
display:table;
max-width:100%;
padding:0;
white-space:normal
}
progress{
vertical-align:baseline
}
textarea{
overflow:auto
}
[type=checkbox],[type=radio]{
box-sizing:border-box;
padding:0
}
[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{
height:auto
}
[type=search]{
-webkit-appearance:textfield;
outline-offset:-2px
}
[type=search]::-webkit-search-decoration{
-webkit-appearance:none
}
::-webkit-file-upload-button{
-webkit-appearance:button;
font:inherit
}
details{
display:block
}
summary{
display:list-item
}
template{
display:none
}
[hidden]{
display:none
}
a,a:visited{
text-decoration:none
}
ul{
padding:0;
margin:0
}
ul li{
list-style:none
}
a{
color:inherit
}
*{
box-sizing:border-box
}
input,select,textarea{
outline-color:inherit
}
input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill:active{
-webkit-text-fill-color:inherit;
-webkit-transition:background-color 10000s ease-in-out 10000s;
transition:background-color 10000s ease-in-out 10000s
}
button{
border:none;
background:none;
cursor:pointer
}
@font-face{
font-family:Inter;
src:local("Inter Regular"),local("Inter-Regular"),url(../fonts/Inter-Regular.woff2) format("woff2"),url(../fonts/Inter-Regular.woff) format("woff"),url(../fonts/Inter-Regular.ttf) format("truetype");
font-weight:400;
font-style:normal;
font-display:swap
}
@font-face{
font-family:Inter;
src:local("Inter Extra Light"),local("Inter-ExtraLight"),url(../fonts/Inter-ExtraLight.woff2) format("woff2"),url(../fonts/Inter-ExtraLight.woff) format("woff"),url(../fonts/Inter-ExtraLight.ttf) format("truetype");
font-weight:200;
font-style:normal;
font-display:swap
}
@font-face{
font-family:Inter;
src:local("Inter Medium"),local("Inter-Medium"),url(../fonts/Inter-Medium.woff2) format("woff2"),url(../fonts/Inter-Medium.woff) format("woff"),url(../fonts/Inter-Medium.ttf) format("truetype");
font-weight:500;
font-style:normal;
font-display:swap
}
@font-face{
font-family:Inter;
src:local("Inter Light"),local("Inter-Light"),url(../fonts/Inter-Light.woff2) format("woff2"),url(../fonts/Inter-Light.woff) format("woff"),url(../fonts/Inter-Light.ttf) format("truetype");
font-weight:300;
font-style:normal;
font-display:swap
}
@font-face{
font-family:Inter;
src:local("Inter Bold"),local("Inter-Bold"),url(../fonts/Inter-Bold.woff2) format("woff2"),url(../fonts/Inter-Bold.woff) format("woff"),url(../fonts/Inter-Bold.ttf) format("truetype");
font-weight:700;
font-style:normal;
font-display:swap
}
@font-face{
font-family:Inter;
src:local("Inter Thin"),local("Inter-Thin"),url(../fonts/Inter-Thin.woff2) format("woff2"),url(../fonts/Inter-Thin.woff) format("woff"),url(../fonts/Inter-Thin.ttf) format("truetype");
font-weight:100;
font-style:normal;
font-display:swap
}
:root{
--transition: all .3s ease-in-out;
--base-font: "Inter", sans-serif;
--white-color: #fff;
--black-color: #000;
--grad-color-1: #15a6ff;
--grad-color-2: #343afe;
--gradient: linear-gradient( 135deg, var(--grad-color-1) 0%, var(--grad-color-2) 100% );
--accent-color: #0074ff;
--accent-color-hover: #005BC8;
--green-color: #09bf80;
--light-theme-bg: #f5f5f5;
--dark-theme-bg: #0d0d34;
--error-color: #ff3f3f;
--disabled-color: #cccccc;
--bg-color: var(--light-theme-bg);
--text-color: var(--black-color);
--content-width: 1440px
}
.container{
box-sizing:border-box;
margin-right:auto;
margin-left:auto;
width:100%;
max-width:var(--content-width);
padding-right:20px;
padding-left:20px
}
@media (max-width: 576px){
.container{
padding-right:15px;
padding-left:15px
}

}
body{
font-size:16px;
font-family:var(--base-font);
font-weight:300;
font-style:normal;
color:var(--text-color);
line-height:1.25;
letter-spacing:0;
background-color:var(--bg-color);
overflow-x:hidden;
transition:color .3s ease-in-out,background-color .3s ease-in-out
}
body.dark{
--bg-color: var(--dark-theme-bg);
--text-color: var(--white-color)
}
main{
display:flex;
flex-direction:column;
min-height:100vh
}
a,button,input{
transition:var(--transition)
}
.hidden{
display:none!important
}
input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{
-webkit-appearance:none
}
input[type=number],input[type=number]:hover,input[type=number]:focus{
-webkit-appearance:none;
appearance:none;
-moz-appearance:textfield
}
.title__text{
font-weight:700;
color:var(--black-color);
margin:0;
padding:0
}
.text-center{
text-align:center
}
.error-massenge{
display:block;
font-size:16px;
font-weight:300;
color:var(--error-color);
margin-top:8px
}
.switcher-wrap{
display:flex;
align-items:center;
height:20px;
gap:6px
}
.switcher-icon{
width:19px;
height:20px;
cursor:pointer;
color:var(--white-color)
}
.switcher-icon path{
transition:.2s
}
body.dark .switcher-icon{
color:#ffe03f
}
.switcher{
display:inline-block;
height:10px;
position:relative;
-webkit-user-select:none;
-moz-user-select:none;
user-select:none
}
.switcher__input{
display:block;
width:0;
height:0;
position:absolute;
z-index:-1;
opacity:0
}
.switcher__input:checked+.switcher__switch{
background:#ffe03f
}
.switcher__input:checked+.switcher__switch:before{
transform:translate(10px)
}
.switcher__switch{
position:relative;
display:inline-block;
box-sizing:border-box;
width:20px;
height:10px;
border-radius:25%/50%;
vertical-align:top;
transition:.2s;
background:#fff
}
.switcher__switch:before{
content:"";
position:absolute;
top:calc(50% - 3px);
left:2px;
display:inline-block;
width:6px;
height:6px;
border-radius:50%;
background:var(--accent-color);
transition:.2s;
transform:translate(0)
}
.switcher__switch:hover{
cursor:pointer;
border-color:#0000004d
}
.btn{
display:flex;
align-items:center;
justify-content:center;
width:100%;
max-width:320px;
min-height:60px;
background-color:var(--accent-color);
color:var(--white-color);
font-weight:500;
font-size:20px;
border-radius:20px;
padding:10px 20px
}
.btn:hover{
background-color:var(--accent-color-hover)
}
.btn:disabled{
opacity:.8;
pointer-events:none
}
.white-btn{
display:flex;
align-items:center;
justify-content:center;
box-sizing:border-box;
background-color:transparent;
color:var(--white-color);
font-weight:500;
text-align:center;
border:1px solid var(--white-color);
border-radius:20px;
width:100%;
max-width:320px;
padding:10px 20px
}
.white-btn:hover{
background-color:var(--white-color);
color:var(--black-color)
}
.white-btn:disabled{
opacity:.8;
pointer-events:none
}
.checkbox-container{
display:flex;
flex-direction:row;
gap:10px;
align-items:center
}
.checkbox-container__text{
font-size:16px;
font-weight:300;
margin:0;
padding:0
}
.checkbox-container label{
cursor:pointer
}
.checkbox-container__checkbox{
width:18px;
height:18px;
margin:0;
padding:0
}
.checkbox{
position:relative;
display:block;
border:1px solid black;
background:var(--light-theme-bg);
width:18px;
height:18px;
flex-shrink:0;
cursor:pointer;
border-radius:5px
}
.checkbox input{
position:absolute;
z-index:-1;
opacity:0
}
.checkbox span{
position:absolute;
width:12px;
height:10px;
top:3px;
left:2px;
background:url(../img/icons/check.svg) no-repeat;
background-size:cover;
opacity:0;
transition:all .2s ease-in-out
}
@media (hover: hover) and (pointer: fine){
.checkbox input:not(:disabled)+span:hover{
opacity:.5
}

}
.checkbox input:checked+span{
opacity:1
}
.checkbox.error{
border-color:var(--error-color)
}
.search__container{
position:relative;
display:flex;
flex-direction:row;
gap:24px;
padding-right:88px
}
@media (max-width: 991px){
.search__container{
flex-wrap:wrap
}

}
@media (max-width: 768px){
.search__container{
padding-right:0
}

}
@media (max-width: 576px){
.search__container{
align-items:center;
justify-content:center;
gap:16px
}

}
.search__container .table-form__filter{
width:auto
}
@media (max-width: 576px){
.search__container .table-form__filter{
width:100%;
order:-1
}

}
.search__container .sorting{
position:absolute;
top:0;
right:0
}
.search__container-input{
width:100%;
max-width:380px;
height:56px;
margin:0;
padding:0 20px;
background-color:var(--white-color);
border-radius:20px;
display:flex;
flex-direction:row;
justify-content:space-between;
align-items:center;
position:relative
}
@media (max-width: 768px){
.search__container-input{
max-width:none;
width:100%;
margin-right:80px
}

}
@media (max-width: 576px){
.search__container-input{
order:-2;
margin-right:0
}

}
.search__container-input .input{
width:100%;
height:56px;
margin:0;
padding:0;
background-color:var(--white-color);
border:none;
font-size:18px;
font-weight:300;
color:var(--dark-theme-bg);
outline:none
}
.search__container-input .btn{
width:32px;
height:32px;
background:url(../img/icons/filter_dis.svg) no-repeat;
background-size:cover;
margin:0;
padding:0;
min-height:0
}
.search__container-input .btn:hover{
background:url(../img/icons/filter_en.svg) no-repeat
}
.search__container-input .btn-active{
background:url(../img/icons/filter_en.svg)
}
.search__container-input .filter__container{
width:100%;
max-width:400px;
margin:0;
padding:12px;
background-color:var(--white-color);
color:var(--black-color);
border-radius:20px;
display:flex;
flex-direction:column;
position:absolute;
left:0;
bottom:-150px;
z-index:1;
box-shadow:0 4px 8px #00000040;
gap:12px;
visibility:hidden;
opacity:0
}
@media (max-width: 576px){
.search__container-input .filter__container{
max-width:none
}

}
.search__container-input .filter__container .p{
font-size:16px;
font-weight:500;
margin:0;
padding:0
}
.search__container-input .filter__container-active{
visibility:visible;
opacity:1
}
.available-tasks{
display:flex;
flex-direction:row;
gap:10px;
background-color:var(--white-color);
color:var(--dark-theme-bg);
border-radius:20px;
justify-content:center;
align-items:center;
min-height:56px;
padding:8px 20px
}
@media (max-width: 576px){
.available-tasks{
width:100%
}

}
.available-tasks__image{
display:block;
width:100%;
max-width:39px;
height:auto
}
.available-tasks__number{
font-size:22px;
font-weight:700;
margin:0;
padding:0;
white-space:nowrap
}
@media (max-width: 576px){
.available-tasks__number{
white-space:normal;
font-size:20px
}

}
.available-tasks__text{
font-weight:400;
margin:0;
padding:0
}
@media (max-width: 576px){
.available-tasks__text{
font-size:20px
}

}
.form_radio input[type=radio]{
display:none
}
.form_radio label{
display:inline-block;
cursor:pointer;
position:relative;
padding-left:25px;
margin-right:0;
line-height:18px;
-webkit-user-select:none;
-moz-user-select:none;
user-select:none
}
.form_radio label:before{
content:"";
display:inline-block;
width:17px;
height:18px;
position:absolute;
left:0;
bottom:0;
background:url(../img/icons/radio-en.svg) 0 0 no-repeat;
background-size:cover
}
.form_radio input[type=radio]:checked+label:before{
background:url(../img/icons/radio-dis.svg) 0 0 no-repeat;
background-size:cover
}
.form_radio label:hover:before{
filter:brightness(120%)
}
.task{
display:flex;
align-items:flex-start;
flex-direction:column;
width:calc((100% - 50px) / 3);
background-color:var(--white-color);
margin:0;
padding:25px 35px 25px 25px;
border-radius:20px;
position:relative;
color:var(--black-color)
}
.task.completed .task__title{
opacity:.6
}
.task.completed .task__scores-container img{
filter:grayscale(100%)
}
.task.completed .task__arrow{
opacity:.6
}
.task:hover{
box-shadow:0 2px 5px #00000040
}
.task__title{
margin:0 0 7px;
padding:0;
width:100%;
max-width:370px;
font-size:18px;
font-weight:500;
line-height:27px
}
.task__status{
display:inline-flex;
align-items:center;
justify-content:center;
background:var(--green-color);
color:var(--white-color);
text-align:center;
font-size:14px;
font-weight:300;
padding:6px 12px;
border-radius:20px;
margin:4px 0
}
.task.active .task__status{
background:var(--green-color)
}
.task.completed .task__status{
background:#676767
}
.task.moderation .task__status{
background:#f8d247
}
.task__text{
min-height:23px;
margin:0;
padding:0;
font-size:14px;
font-weight:300;
color:var(--dark-theme-bg)
}
.task__text-container{
display:flex;
flex-direction:column;
gap:4px
}
.task__arrow{
width:24px;
height:24px;
position:absolute;
top:24px;
right:10px
}
.task .task__scores-container{
display:flex;
flex-wrap:wrap;
flex-direction:row;
gap:6px 24px;
margin-top:13px
}
.task .task-score__container{
display:flex;
flex-direction:row;
gap:9px;
align-items:center
}
.task .task-score__image{
width:29px;
height:29px
}
.task .task-score__text{
margin:0;
padding:0;
font-weight:300;
font-size:16px
}
.task .task-score__number{
margin:0;
padding:0;
font-weight:700;
font-size:16px
}
.pagination{
display:flex;
align-items:center;
justify-content:center;
gap:20px;
margin:56px auto 0
}
@media (max-width: 576px){
.pagination{
gap:10px;
margin-top:40px
}

}
.pagination__prev,.pagination__next{
display:block;
width:31px;
height:32px;
background:url(../img/icons/arrow_forward.svg) no-repeat;
background-size:cover
}
.pagination__prev:hover,.pagination__next:hover{
opacity:.8
}
@media (max-width: 576px){
.pagination__prev,.pagination__next{
width:24px;
height:24px
}

}
.pagination__prev{
transform:rotate(180deg)
}
.pagination__pages{
display:flex;
align-items:center;
gap:12px
}
@media (max-width: 576px){
.pagination__pages{
gap:8px
}

}
.pagination__page{
display:block;
width:32px;
height:32px
}
@media (max-width: 576px){
.pagination__page{
width:24px;
height:24px
}

}
.pagination__page a{
display:block;
width:100%;
height:100%;
display:flex;
align-items:center;
justify-content:center;
background:var(--white-color);
font-weight:500;
font-size:18px;
color:var(--dark-theme-bg);
border-radius:50%
}
@media (max-width: 576px){
.pagination__page a{
font-size:14px
}

}
.pagination__page.active a{
background:var(--accent-color);
color:var(--white-color)
}
@media (hover: hover){
.pagination__page:hover a{
color:var(--white-color);
background:var(--accent-color)
}

}
body.dark .pagination__prev,body.dark .pagination__next{
filter:brightness(0) invert(1)
}
.input{
outline:none;
width:100%;
height:56px;
border-radius:20px;
padding:17px 20px;
font-size:18px;
font-weight:300;
border:1px solid var(--black-color)
}
.input.error{
border-color:var(--error-color)
}
.textarea{
outline:none;
margin:0;
padding:17px 20px;
font-size:18px;
font-weight:300;
border:1px solid var(--black-color);
border-radius:20px;
color:var(--black-color);
width:100%
}
.textarea .codex-editor__redactor{
min-height:200px
}
.sorting{
position:relative;
z-index:2;
color:var(--black-color)
}
.sorting__btn{
width:64px;
height:56px;
background-color:var(--white-color);
background-image:url(../img/icons/filter_dis.svg);
background-repeat:no-repeat;
background-position:center center;
border-radius:20px;
margin:0;
padding:0;
min-height:0
}
@media (max-width: 576px){
.sorting__btn{
width:56px
}

}
@media (hover: hover){
.sorting__btn:hover{
background-image:url(../img/icons/filter_en.svg)
}

}
.sorting__btn.active{
background-image:url(../img/icons/filter_en.svg)
}
.sorting__filters{
position:absolute;
top:64px;
right:0;
width:300px;
display:flex;
flex-direction:column;
gap:12px;
background:var(--white-color);
padding:20px;
border-radius:20px;
box-shadow:0 2px 5px #00000040
}
@media (max-width: 576px){
.sorting__filters{
width:290px
}

}
.sorting__filters p{
margin:0
}
.sorting__filters:not(.active){
display:none
}
.breadcrumb{
width:100%;
max-width:1400px;
line-height:1.25;
margin:20px auto -35px;
padding-left:20px;
z-index:1
}
@media (max-width: 1440px){
.breadcrumb{
display:inline-block
}

}
.breadcrumb li{
display:inline;
font-size:16px;
font-weight:300;
color:var(--line-color)
}
.breadcrumb li:not(:last-child):after{
display:inline;
content:"/";
color:var(--line-color);
font-weight:300;
margin-right:6px;
margin-left:6px;
pointer-events:none
}
@media (max-width: 576px){
.breadcrumb li:not(:last-child):after{
margin-left:2px;
margin-right:2px
}

}
.breadcrumb li a{
font-size:16px;
font-weight:500;
color:var(--ligth-accent-color)
}
.breadcrumb li a:hover{
text-decoration:underline
}
.header{
position:relative;
background:var(--gradient);
border-bottom-left-radius:20px;
border-bottom-right-radius:20px;
padding:29px 0
}
.header.main{
position:absolute;
top:0;
right:0;
left:0;
background:none
}
@media (max-width: 991px){
.header{
padding:20px 0
}

}
.header__container{
position:relative;
z-index:11;
display:flex;
align-items:center;
justify-content:space-between;
gap:60px
}
@media (max-width: 1200px){
.header__container{
gap:32px
}

}
.header__logo{
position:relative;
z-index:2;
display:block;
max-width:48px;
max-height:48px
}
@media (hover: hover){
.header__logo:hover{
opacity:.8
}

}
.header__logo img{
width:100%;
height:auto
}
.header__nav{
width:100%;
max-width:1050px
}
@media (max-width: 1200px){
.header__nav{
max-width:845px
}

}
@media (max-width: 991px){
.header__nav{
max-width:none;
position:absolute;
z-index:-1;
top:-20px;
left:0;
right:0;
width:100%;
height:100vh;
background:#0000004d;
overflow:auto;
opacity:0;
visibility:hidden;
transition:var(--transition)
}
.header__nav.open{
z-index:1;
opacity:1;
visibility:visible
}
.header__nav.open .header__menu{
transform:translate(0)
}

}
.header__menu{
width:100%;
margin-left:auto;
display:flex;
align-items:center;
justify-content:space-between;
gap:10px
}
@media (max-width: 1200px){
.header__menu{
gap:24px
}

}
@media (max-width: 991px){
.header__menu{
background:var(--gradient);
max-width:240px;
flex-direction:column;
align-items:flex-end;
justify-content:flex-start;
gap:16px;
padding:94px 20px 20px;
min-height:100%;
transform:translate(100%);
transition:var(--transition)
}

}
.header__menu-item{
cursor:pointer;
font-weight:400;
font-size:14px
}
@media (max-width: 991px){
.header__menu-item{
font-size:16px
}

}
.header__ui{
position:relative;
z-index:2;
display:flex;
align-items:center;
gap:30px
}
@media (max-width: 1200px){
.header__ui{
gap:20px
}

}
.header__burger{
display:none
}
@media (max-width: 991px){
.header__burger{
display:block
}

}
.menu-item__link{
display:block;
color:var(--white-color);
padding:8px 24px 9px;
border:1px solid transparent;
border-radius:20px;
transition:var(--transition)
}
@media (max-width: 1300px){
.menu-item__link{
padding:8px 16px 9px
}

}
@media (max-width: 1200px){
.menu-item__link{
padding:0;
border:none
}
.menu-item__link.active{
text-shadow:0px 0px 1px var(--white-color),0px 0px 1px var(--white-color)
}

}
@media (hover: hover){
.menu-item__link:hover{
opacity:.8
}

}
.menu-item__link:hover,.menu-item__link.active{
border-color:var(--white-color)
}
.notification{
position:relative;
width:48px;
height:48px;
border-radius:50%;
cursor:pointer
}
@media (hover: hover){
.notification:hover{
opacity:.8
}

}
@media (max-width: 991px){
.notification{
width:36px;
height:36px
}

}
.notification svg{
width:100%;
height:auto
}
.notification.active:after{
content:"";
position:absolute;
top:0;
right:0;
width:16px;
height:16px;
border-radius:50%;
background:#ff3f3f
}
@media (max-width: 991px){
.notification.active:after{
width:12px;
height:12px
}

}
.burger{
position:relative;
cursor:pointer;
transition:var(--transition);
width:32px;
height:24px
}
@media (hover: hover){
.burger:hover{
opacity:.8
}

}
.burger span{
background:var(--white-color);
position:absolute;
width:100%;
right:0;
top:calc(50% - 2px);
height:4px;
border-radius:10px;
transition:var(--transition)
}
.burger:before,.burger:after{
content:"";
background:var(--white-color);
position:absolute;
width:100%;
height:4px;
right:0;
border-radius:10px;
transition:var(--transition)
}
.burger:before{
top:0
}
.burger:after{
bottom:0
}
.burger.open:before{
transform:rotate(45deg) scale(.8);
top:5px
}
.burger.open:after{
transform:scale(0)
}
.burger.open span{
top:5px;
transform:rotate(-45deg) scale(.8)
}
.popup{
position:fixed;
width:100%;
height:100%;
background:#0000004d;
z-index:1000;
top:0;
left:0;
overflow-y:auto;
overflow-x:hidden;
opacity:0;
visibility:hidden;
transition:all .5s ease-in-out
}
.popup__body{
max-width:1440px;
padding:20px;
margin:auto;
display:flex;
align-items:center;
min-height:100%;
justify-content:center;
transition:all .5s ease-in-out;
opacity:0
}
.popup__content{
width:100%;
max-width:1440px;
background:var(--gradient);
position:relative;
transition:all .5s ease-in-out;
opacity:0;
transform:translateY(-100%);
border-radius:20px;
padding:40px 30px
}
.popup__close{
cursor:pointer;
display:block;
width:32px;
height:32px;
position:absolute;
right:32px;
top:32px;
transition:var(--transition)
}
@media (max-width: 576px){
.popup__close{
top:24px;
right:24px
}

}
.popup__close:hover{
opacity:.8
}
.popup__close:before{
content:"";
background-color:var(--white-color);
position:absolute;
width:20px;
height:2px;
left:calc(50% - 10px);
top:calc(50% - 1px);
transform:rotate(-45deg);
border-radius:1px
}
.popup__close:after{
content:"";
background-color:var(--white-color);
position:absolute;
width:20px;
height:2px;
left:calc(50% - 10px);
top:calc(50% - 1px);
transform:rotate(45deg);
border-radius:1px
}
.popup.open{
opacity:1;
visibility:visible
}
.popup.open .popup__body{
opacity:1
}
.popup.open .popup__content{
opacity:1;
transform:translate(0)
}
body.lock{
overflow:hidden
}
.add-autor__content{
padding-bottom:30px;
max-width:694px
}
@media (max-width: 576px){
.add-autor__content{
padding:32px 20px
}

}
.add-autor__title{
font-weight:700;
font-size:24px;
color:var(--white-color);
margin:-8px 0 16px
}
@media (max-width: 576px){
.add-autor__title{
margin-top:30px;
text-align:center
}

}
.add-autor .white-input{
text-align:left;
margin-bottom:24px
}
@media (max-width: 576px){
.add-autor .white-input{
text-align:center
}

}
.add-autor__list{
display:flex;
flex-direction:column;
gap:16px
}
.add-autor__list-text{
text-align:center;
color:var(--white-color);
margin:0
}
.add-autor__list .rating-of-activest__item{
width:100%
}
.start-page{
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
flex-grow:1;
padding:171px 0 60px;
background:var(--gradient)
}
.start-page__text{
margin:0 auto 77px;
max-width:700px
}
@media (max-width: 576px){
.start-page__text{
margin-bottom:40px
}

}
.start-page__text-title{
display:flex;
align-items:center;
gap:50px;
margin-bottom:46px
}
@media (max-width: 991px){
.start-page__text-title{
gap:30px;
justify-content:center
}

}
@media (max-width: 576px){
.start-page__text-title{
flex-direction:column;
gap:20px;
margin-bottom:20px
}

}
.start-page__text-title h1{
font-weight:700;
font-size:63px;
line-height:93%;
color:var(--white-color);
margin:0
}
@media (max-width: 991px){
.start-page__text-title h1{
font-size:60px
}

}
@media (max-width: 768px){
.start-page__text-title h1{
font-size:50px
}

}
@media (max-width: 576px){
.start-page__text-title h1{
font-size:40px;
text-align:center
}

}
.start-page__text-title img{
display:block;
max-width:130px;
height:auto
}
@media (max-width: 991px){
.start-page__text-title img{
max-width:120px
}

}
@media (max-width: 768px){
.start-page__text-title img{
max-width:100px
}

}
.start-page__text-description{
font-weight:300;
font-size:15px;
text-align:center;
color:#fff;
margin:0
}
@media (max-width: 576px){
.start-page__text-description{
font-size:16px
}

}
.start-page__download{
display:flex;
align-items:center;
justify-content:center;
flex-wrap:wrap;
gap:33px
}
@media (max-width: 768px){
.start-page__download{
gap:20px
}

}
.start-page__download-item{
display:flex;
align-items:center;
justify-content:center;
width:100%;
max-width:210px;
padding:0 20px;
height:78px;
background:#000;
border-radius:20px
}
@media (max-width: 576px){
.start-page__download-item{
max-width:190px;
padding:0;
height:50px
}

}
.start-page__download-item:hover{
opacity:.8
}
.start-page__download-item img{
height:100%;
width:auto
}
.profile-page{
padding-top:53px;
padding-bottom:40px
}
.profile-page__banner,.profile-page__quests{
margin-bottom:32px
}
.profile-page__dushboards{
display:flex;
flex-wrap:wrap;
gap:20px
}
.profile-page__dushboards-item{
display:flex;
flex-direction:column;
gap:18px;
width:100%;
max-width:calc((100% - 60px)/4)
}
@media (max-width: 1300px){
.profile-page__dushboards-item{
max-width:calc((100% - 40px) / 3)
}

}
@media (max-width: 991px){
.profile-page__dushboards-item{
max-width:calc((100% - 20px)/2)
}

}
@media (max-width: 576px){
.profile-page__dushboards-item{
max-width:100%
}

}
.banner{
padding:38px 30px;
background:var(--gradient);
border-radius:20px
}
@media (max-width: 576px){
.banner{
padding:40px 20px
}

}
.banner__top{
width:100%;
display:flex;
align-items:center;
justify-content:space-between;
gap:30px;
color:var(--white-color)
}
@media (max-width: 1200px){
.banner__top{
flex-wrap:wrap;
justify-content:flex-start;
gap:40px
}

}
@media (max-width: 576px){
.banner__top{
gap:20px
}

}
.banner__photo{
overflow:hidden;
width:100%;
max-width:228px;
height:228px;
border-radius:50%
}
.banner__photo img{
width:100%;
height:100%;
-o-object-fit:cover;
object-fit:cover
}
@media (max-width: 576px){
.banner__photo{
margin-right:auto;
margin-left:auto
}

}
.banner__text{
display:flex;
align-items:center
}
@media (max-width: 1200px){
.banner__text{
max-width:calc(100% - 268px)
}

}
@media (max-width: 768px){
.banner__text{
flex-direction:column;
align-items:flex-start
}

}
@media (max-width: 576px){
.banner__text{
width:100%;
max-width:none;
align-items:center
}

}
.banner__name{
padding-right:56px;
border-right:1px solid var(--white-color);
margin:0;
font-weight:700;
font-size:40px
}
@media (max-width: 1400px){
.banner__name{
padding-right:30px
}

}
@media (max-width: 991px){
.banner__name{
font-size:30px
}

}
@media (max-width: 768px){
.banner__name{
width:100%;
padding-right:0;
border:none;
padding-bottom:15px;
border-bottom:1px solid var(--white-color);
margin-bottom:15px
}

}
@media (max-width: 576px){
.banner__name{
text-align:center
}

}
.banner__role{
width:100%;
max-width:290px;
padding-left:50px;
margin:0;
box-sizing:content-box;
font-weight:300;
font-size:18px
}
@media (max-width: 1400px){
.banner__role{
padding-left:30px
}

}
@media (max-width: 768px){
.banner__role{
padding-left:0
}

}
@media (max-width: 576px){
.banner__role{
font-size:16px;
text-align:center
}

}
.banner__additional{
display:flex;
align-items:center;
gap:30px
}
@media (max-width: 576px){
.banner__additional{
flex-direction:column;
width:100%;
justify-content:center;
gap:16px
}

}
.banner__place{
display:flex;
align-items:center;
gap:6px 10px
}
@media (max-width: 576px){
.banner__place{
gap:6px
}
.banner__place svg{
width:20px;
height:auto
}

}
.banner__place p{
font-weight:300;
font-size:18px;
max-width:230px;
margin:0
}
@media (max-width: 576px){
.banner__place p{
font-size:14px;
max-width:none
}

}
.banner__social{
display:block;
width:100%;
width:70px;
height:70px
}
@media (max-width: 576px){
.banner__social{
width:40px;
height:40px
}

}
.banner__social svg{
width:100%;
height:auto
}
.banner__btns{
margin-top:24px;
display:flex;
flex-wrap:wrap;
gap:20px
}
@media (max-width: 1200px){
.banner__btns{
margin-top:40px
}

}
@media (max-width: 576px){
.banner__btns{
margin-top:24px
}

}
.banner__btns .white-btn{
max-width:calc((100% - 60px)/4);
padding:10px
}
@media (max-width: 1200px){
.banner__btns .white-btn{
padding:10px 20px;
max-width:300px
}

}
@media (max-width: 576px){
.banner__btns .white-btn{
max-width:none
}

}
.dushboard{
border-radius:20px;
padding:12px 18px 36px;
background:var(--white-color)
}
.dushboard__header{
width:100%;
position:relative;
display:flex;
align-items:center;
padding-bottom:10px;
border-bottom:1px solid var(--dark-theme-bg)
}
.dushboard__icon{
display:flex;
width:29px;
margin-right:20px
}
.dushboard__icon img{
width:100%;
height:auto
}
.dushboard__count{
display:block;
font-weight:700;
font-size:36px;
color:var(--dark-theme-bg);
margin-right:19px
}
.dushboard__name{
font-weight:200;
font-size:20px;
color:var(--dark-theme-bg);
margin:0
}
.dushboard__arrow{
position:absolute;
right:18px;
top:calc(50% - 12px);
width:9px;
height:15px
}
.dushboard__items{
display:flex;
flex-direction:column;
gap:15px
}
.rating-item{
position:relative;
display:flex;
align-items:center;
border-radius:20px;
padding:12px 58px 12px 12px;
color:var(--dark-theme-bg)
}
.rating-item:hover{
box-shadow:0 2px 5px #00000040
}
.rating-item.active{
color:var(--white-color);
background:var(--accent-color)
}
.rating-item.active .rating-item__rating img{
filter:brightness(100) invert(0)
}
.rating-item__photo{
width:61px;
height:61px;
overflow:hidden;
margin-right:14px;
border-radius:50%;
flex-shrink:0
}
.rating-item__photo img{
width:100%;
height:100%;
-o-object-fit:cover;
object-fit:cover
}
.rating-item__info{
display:flex;
flex-direction:column;
gap:8px
}
.rating-item__info-name{
font-weight:700;
font-size:16px;
margin:0
}
.rating-item__info-params{
display:flex;
align-items:center;
gap:12px;
flex-wrap:wrap
}
.rating-item__info-param{
display:flex;
align-items:center;
gap:6px
}
.rating-item__info-param:nth-child(2) span{
color:#09bf80
}
.rating-item__info-param:nth-child(3) span{
color:#e555bd
}
.rating-item__info-param span{
color:#ffe03f;
display:block;
font-weight:500;
font-size:14px
}
.rating-item__info-param img{
display:block;
width:18px;
height:auto
}
.rating-item__rating{
position:absolute;
right:12px;
top:50%;
transform:translateY(-50%);
display:flex;
align-items:center
}
.rating-item__rating span{
display:block;
font-weight:700;
font-size:16px;
margin-right:2px
}
.rating-item__rating img{
display:block;
width:22px;
height:auto
}
.info-item{
display:block;
position:relative;
padding:18px 35px 18px 18px;
border-radius:20px;
background:var(--white-color)
}
.info-item:hover{
box-shadow:0 2px 5px #00000040
}
.info-item.positive:before{
position:absolute;
content:"";
top:0;
left:0;
width:100%;
height:100%;
border-radius:20px;
background:#09bf8021
}
.info-item.negative:before{
position:absolute;
content:"";
top:0;
left:0;
width:100%;
height:100%;
border-radius:20px;
background:#e555bd24
}
.info-item.neutral:before{
position:absolute;
content:"";
top:0;
left:0;
width:100%;
height:100%;
border-radius:20px;
background:#ffe03f2b
}
.info-item__title{
font-weight:500;
font-size:16px;
color:var(--black-color);
margin:0 0 10px
}
.info-item__date{
display:block;
font-weight:300;
font-size:14px;
color:var(--dark-theme-bg);
margin-bottom:26px
}
.info-item__counter{
display:flex;
align-items:center;
gap:8px;
font-size:16px;
color:var(--dark-theme-bg);
font-weight:300
}
.info-item__counter span{
display:block
}
.info-item__counter span b{
font-weight:700
}
.info-item__counter img{
width:24px;
height:24px
}
.info-item__arrow{
position:absolute;
right:11px;
top:18px;
width:24px;
height:24px
}
.profile-quests{
padding:38px 30px;
border-radius:20px;
background:var(--white-color);
display:flex;
flex-direction:column;
gap:24px
}
@media (max-width: 576px){
.profile-quests{
padding:40px 20px
}

}
.profile-quests__header{
display:flex;
align-items:center;
gap:32px
}
@media (max-width: 576px){
.profile-quests__header{
align-items:flex-start;
gap:16px
}

}
.profile-quests__title{
font-weight:700;
font-size:24px;
color:var(--black-color);
margin:0
}
.profile-quests__arrow{
display:inline-block;
margin-top:7px
}
@media (max-width: 576px){
.profile-quests__arrow{
margin-top:9px
}

}
.profile-quests__items{
display:flex;
gap:20px;
flex-wrap:wrap
}
.profile-quests__items .task{
border:1px solid var(--black-color);
width:calc((100% - 40px) / 3)
}
@media (max-width: 991px){
.profile-quests__items .task{
width:calc((100% - 20px)/2)
}

}
@media (max-width: 768px){
.profile-quests__items .task{
width:100%
}

}
.edit-profile{
margin-top:56px;
margin-bottom:56px
}
.edit-profile__block{
padding:48px;
background:var(--white-color);
border-radius:20px
}
@media (max-width: 576px){
.edit-profile__block{
padding:40px 20px
}

}
.edit-profile__title{
font-weight:700;
font-size:40px;
color:var(--black-color);
margin:0 0 32px
}
@media (max-width: 576px){
.edit-profile__title{
font-size:32px;
text-align:center
}

}
.profile-form{
display:flex;
gap:0 56px;
align-items:flex-start
}
@media (max-width: 768px){
.profile-form{
flex-direction:column-reverse
}

}
@media (max-width: 576px){
.profile-form{
align-items:center
}

}
.profile-form__fields{
display:flex;
flex-direction:column;
gap:32px
}
@media (max-width: 576px){
.profile-form__fields{
gap:24px
}

}
.profile-form__photo{
width:100%;
max-width:368px;
margin:65px 0 0
}
@media (max-width: 768px){
.profile-form__photo{
margin:0 auto 16px
}

}
@media (max-width: 400px){
.profile-form__photo{
max-width:240px
}

}
@media (max-width: 576px){
.profile-form .btn{
max-width:none
}

}
.profile-form .error-massenge{
margin-top:-16px;
margin-bottom:-20px
}
@media (max-width: 576px){
.profile-form .error-massenge{
text-align:center;
margin-top:-8px;
margin-bottom:-12px
}

}
.feilds-item{
width:100%
}
.feilds-item__title{
font-family:var(--font-family);
font-weight:700;
font-size:24px;
color:var(--dark-theme-bg);
margin-bottom:12px
}
@media (max-width: 576px){
.feilds-item__title{
text-align:center;
font-size:20px
}

}
.feilds-item__inputs{
display:flex;
flex-wrap:wrap;
gap:20px
}
.feilds-item__inputs .input,.feilds-item__inputs .select{
display:block;
width:100%
}
.feilds-item__inputs .input .SimpleSel__title,.feilds-item__inputs .select .SimpleSel__title{
white-space:normal
}
@media (max-width: 1200px){
.feilds-item__inputs .input,.feilds-item__inputs .select{
max-width:100%
}

}
.feilds-item__input-container{
display:flex;
flex-direction:column;
width:100%;
max-width:calc((100% - 20px)/2);
gap:20px
}
@media (max-width: 1200px){
.feilds-item__input-container{
max-width:100%
}

}
.feilds-item__input-container .error-massenge{
margin-top:-13px;
margin-bottom:-13px
}
@media (max-width: 576px){
.feilds-item__input-container .error-massenge{
text-align:center;
margin-top:-8px;
margin-bottom:-12px
}

}
.photo-load{
width:100%
}
.photo-load__media{
display:flex;
align-items:center;
justify-content:center;
width:100%;
max-width:368px;
aspect-ratio:1;
border-radius:20px;
overflow:hidden;
border:1px solid var(--dark-theme-bg)
}
@supports not (aspect-ratio: 1){
.photo-load__media:before{
content:"";
float:left;
padding-top:100%
}
.photo-load__media:after{
content:"";
display:block;
clear:both
}

}
.photo-load__media .no-photo{
max-width:100%;
max-height:100%;
padding:48px
}
.photo-load__media .photo{
width:100%;
height:100%;
-o-object-fit:cover;
object-fit:cover;
border-radius:20px
}
.photo-load__btn{
width:100%;
font-weight:500;
font-size:22px;
text-align:center;
color:var(--accent-color);
margin-top:16px
}
.photo-load__btn:hover{
color:var(--accent-color-hover)
}
.need-help-link{
display:none
}
.task-page{
margin-top:56px;
margin-bottom:56px;
display:flex;
flex-direction:column;
gap:32px
}
.task-page__title{
color:var(--text-color)
}
@media (max-width: 750px){
.task-page__title{
text-align:center
}

}
.task-page__title-container{
display:flex;
flex-direction:row;
align-items:center;
justify-content:start;
gap:40px
}
.task-page__title-container .checkbox-container{
margin-top:11px
}
@media (max-width: 768px){
.task-page__title-container .checkbox-container{
margin-top:0
}

}
@media (max-width: 750px){
.task-page__title-container{
flex-direction:column;
align-items:center;
gap:16px
}

}
.tasks-container{
display:flex;
flex-direction:row;
flex-wrap:wrap;
gap:25px
}
@media (max-width: 1100px){
.tasks-container .task{
width:calc((100% - 25px)/2)
}

}
@media (max-width: 750px){
.tasks-container .task{
width:100%
}

}
.task-container{
display:flex;
flex-direction:row;
gap:40px;
margin-top:56px;
margin-bottom:56px
}
@media (max-width: 991px){
.task-container{
flex-direction:column
}

}
@media (max-width: 576px){
.task-container{
gap:24px
}

}
.task-info{
width:100%;
max-width:450px;
padding:30px;
background-color:var(--white-color);
color:var(--black-color);
box-sizing:border-box;
border-radius:20px;
position:relative
}
@media (max-width: 991px){
.task-info{
max-width:100%;
display:flex;
flex-direction:column;
align-items:flex-start
}

}
@media (max-width: 576px){
.task-info{
padding:30px 20px
}

}
.task-info__title{
font-size:20px;
font-weight:500;
line-height:24px;
margin:20px 0 -4px;
padding:0
}
.task-info__image-container{
position:relative
}
.task-info__image{
display:block;
width:100%;
height:auto;
-o-object-fit:cover;
object-fit:cover;
border-radius:20px
}
.task-info__status{
display:inline-flex;
align-items:center;
justify-content:center;
background:var(--green-color);
color:var(--white-color);
text-align:center;
font-size:16px;
font-weight:500;
padding:8px 16px;
border-radius:20px;
position:absolute;
top:12px;
right:12px
}
.task-info__status.active{
background:var(--green-color)
}
.task-info__status.completed{
background:#676767
}
.task-info ul{
display:flex;
flex-direction:column;
gap:12px;
margin-top:20px;
width:100%
}
.task-info ul li p{
margin:0;
padding:0;
font-size:16px;
font-weight:400
}
@media (max-width: 540px){
.task-info ul li p{
font-size:12px
}

}
.task-info__rewards{
margin-top:20px;
display:flex;
flex-direction:column;
gap:16px
}
.task-info__reward{
display:flex;
flex-direction:row;
gap:6px;
align-items:center
}
.task-info__reward-image{
width:29px;
height:29px;
margin:0;
padding:0
}
.task-info__reward-number{
font-size:16px;
font-weight:500;
margin:0;
padding:0
}
@media (max-width: 540px){
.task-info__reward-number{
font-size:12px
}

}
.task-info__reward-text{
font-size:16px;
font-weight:300;
margin:0;
padding:0
}
@media (max-width: 540px){
.task-info__reward-text{
font-size:12px
}

}
.task-info__reward-container{
display:flex;
flex-direction:row;
gap:16px;
align-items:center
}
.task-info__reward-container p{
font-size:16px;
font-weight:500;
margin:0;
padding:0
}
@media (max-width: 540px){
.task-info__reward-container p{
font-size:12px
}

}
.task-description{
padding:30px;
background-color:var(--white-color);
box-sizing:border-box;
border-radius:20px;
width:100%
}
@media (max-width: 576px){
.task-description{
padding:30px 20px
}

}
.task-description__title{
margin:0 0 20px;
padding:0;
font-size:40px;
font-weight:700;
color:var(--black-color)
}
@media (max-width: 540px){
.task-description__title{
font-size:20px
}

}
.task-description .form{
display:flex;
flex-direction:column
}
.task-description .form .textarea{
margin:0;
padding:20px;
font-size:18px;
font-weight:300;
border-radius:20px;
width:100%;
min-height:240px;
resize:none
}
.task-description .form .input{
margin-top:18px
}
.task-description__text p{
margin:0;
padding:0;
font-size:18px;
font-weight:400;
color:var(--black-color);
line-height:22px
}
@media (max-width: 540px){
.task-description__text p{
font-size:14px
}

}
.task-description__text p:not(:last-child){
margin-bottom:18px
}
.task-description .btn{
margin:32px 0 0
}
@media (max-width: 540px){
.task-description .btn{
max-width:100%
}

}
.rating-page{
margin-top:56px;
margin-bottom:56px;
display:flex;
flex-direction:column;
gap:32px
}
@media (max-width: 750px){
.rating-page__title{
text-align:center
}

}
.rating-page__title-container{
display:flex;
flex-direction:row;
align-items:center;
justify-content:start;
gap:40px
}
@media (max-width: 750px){
.rating-page__title-container{
flex-direction:column;
align-items:center
}

}
.rating-of-activest__container{
display:flex;
flex-direction:row;
flex-wrap:wrap;
gap:20px
}
.rating-of-activest__item{
padding:20px;
background-color:var(--white-color);
color:var(--black-color);
display:flex;
flex-direction:row;
justify-content:space-between;
width:calc((100% - 30px)/2);
align-items:center;
border-radius:20px
}
@media (max-width: 1280px){
.rating-of-activest__item{
width:100%
}

}
@media (max-width: 650px){
.rating-of-activest__item{
flex-direction:column;
gap:20px;
width:calc((100% - 30px)/2)
}

}
@media (max-width: 460px){
.rating-of-activest__item{
width:100%
}

}
.rating-of-activest__item-info{
display:flex;
flex-direction:row;
align-items:center;
gap:16px;
flex-grow:1
}
@media (max-width: 650px){
.rating-of-activest__item-info{
flex-direction:column
}

}
.rating-of-activest__item-active{
background-color:var(--accent-color)
}
.rating-of-activest__photo{
width:80px;
height:80px
}
.rating-of-activest__photo img{
width:80px;
height:80px;
border-radius:50%;
-o-object-fit:cover;
object-fit:cover
}
.rating-of-activest__info{
display:flex;
flex-direction:column;
gap:5px
}
.rating-of-activest__info-name{
font-weight:700;
font-size:24px;
margin:0;
padding:0;
text-align:left
}
@media (max-width: 650px){
.rating-of-activest__info-name{
text-align:center
}

}
.rating-of-activest__info-post{
font-weight:300;
font-size:16px;
margin:0;
padding:0
}
@media (max-width: 650px){
.rating-of-activest__info-post{
text-align:center
}

}
.rating-of-activest__info-params{
display:flex;
flex-direction:row;
justify-content:center;
gap:12px;
margin-left:auto
}
@media (max-width: 650px){
.rating-of-activest__info-params{
margin:auto
}

}
.rating-of-activest__info-param{
display:flex;
flex-direction:row;
justify-content:center;
gap:2px;
align-items:center
}
.rating-of-activest__info-param span{
font-size:20px;
font-weight:400;
justify-content:center
}
.rating-of-activest__info-param img{
width:22px;
height:20px
}
.rating-of-activest__info-active{
display:flex;
flex-direction:column;
gap:5px
}
.rating-of-activest__info-active-name{
font-weight:700;
font-size:24px;
margin:0;
padding:0;
color:var(--white-color)
}
@media (max-width: 650px){
.rating-of-activest__info-active-name{
text-align:center
}

}
.rating-of-activest__info-active-post{
font-weight:300;
font-size:16px;
margin:0;
padding:0;
color:var(--white-color)
}
@media (max-width: 650px){
.rating-of-activest__info-active-post{
text-align:center
}

}
.rating-of-activest__info-active-params{
display:flex;
flex-direction:row;
justify-content:center;
gap:12px
}
.rating-of-activest__info-active-param{
display:flex;
flex-direction:row;
justify-content:center;
gap:2px;
align-items:center
}
.rating-of-activest__info-active-param:nth-child(2) span{
color:#09bf80
}
.rating-of-activest__info-active-param:nth-child(3) span{
color:#e555bd
}
.rating-of-activest__info-active-param span{
color:#ffe03f;
display:block;
font-weight:400;
font-size:20px
}
.rating-of-activest__info-active-param img{
width:22px;
height:20px
}
.rating-of-activest__rating{
display:flex;
align-items:center;
padding-left:5px;
min-width:100px;
justify-content:right
}
@media (max-width: 650px){
.rating-of-activest__rating{
justify-content:center
}

}
.rating-of-activest__rating span{
margin:0;
padding:0;
font-size:24px;
font-weight:500
}
.rating-of-activest__rating img{
width:31px;
height:29px
}
.rating-of-activest__rating-active span{
margin:0;
padding:0;
font-size:24px;
font-weight:500;
color:var(--white-color)
}
.rating-of-activest__rating-active img{
filter:brightness(100) invert(0);
width:31px;
height:29px
}
.available-ideas{
display:flex;
flex-direction:row;
gap:6px;
background-color:var(--white-color);
height:56px;
width:100%;
max-width:180px;
border-radius:20px;
justify-content:center;
align-items:center;
color:var(--black-color)
}
@media (max-width: 750px){
.available-ideas{
max-width:none
}

}
.available-ideas__image{
width:100%;
max-width:29px;
height:auto
}
.available-ideas__number{
font-size:22px;
font-weight:700;
margin:0;
padding:0
}
.available-ideas__text{
font-weight:400;
margin:0;
padding:0
}
.ideas__container{
display:flex;
flex-direction:row;
flex-wrap:wrap;
gap:25px
}
.ideas__item{
display:flex;
flex-direction:column;
width:calc((100% - 50px) / 3);
background-color:var(--white-color);
margin:0;
padding:25px 35px 25px 25px;
border-radius:20px;
position:relative
}
@media (max-width: 1100px){
.ideas__item{
width:calc((100% - 25px)/2)
}

}
@media (max-width: 750px){
.ideas__item{
width:100%
}

}
.ideas__date{
margin:0;
padding:0;
font-size:14px;
font-weight:300;
color:var(--dark-theme-bg)
}
.ideas__title{
margin:12px 0 0;
padding:0;
font-size:18px;
font-weight:500;
color:var(--black-color)
}
.ideas-suggest__link{
background-color:var(--accent-color);
padding:8px 16px;
display:flex;
flex-direction:row;
gap:12px;
font-size:20px;
font-weight:500;
color:var(--white-color);
border-radius:20px;
text-align:center;
align-items:center;
height:56px
}
@media (max-width: 750px){
.ideas-suggest__link{
width:100%;
max-width:none;
justify-content:center
}

}
.ideas-suggest__image{
width:18px;
height:18px
}
.ideas-page{
margin-top:56px;
margin-bottom:56px;
display:flex;
flex-direction:column;
gap:32px
}
.ideas-page__title{
color:var(--text-color)
}
@media (max-width: 750px){
.ideas-page__title{
text-align:center
}

}
.ideas-page__title-container{
display:flex;
flex-direction:row;
align-items:center;
justify-content:start;
gap:40px
}
@media (max-width: 750px){
.ideas-page__title-container{
flex-direction:column;
align-items:center
}

}
.ideas__text-container{
margin:12px 0;
display:flex;
flex-direction:column;
gap:6px
}
.ideas__creators{
margin:0;
padding:0;
font-size:14px;
font-weight:500;
color:var(--black-color)
}
.ideas__voting{
margin:0;
padding:0;
font-size:14px;
font-weight:300;
color:var(--black-color)
}
.ideas__scores-container{
display:flex;
flex-direction:row;
justify-content:space-between;
margin-right:-15px
}
.ideas-score__container{
display:flex;
flex-direction:row;
gap:9px;
align-items:center
}
.ideas-score__image{
width:29px;
height:29px
}
.ideas-score__image-like{
width:29px;
height:29px;
background-image:url(../img/icons/trans-like.svg);
background-repeat:no-repeat;
background-size:cover;
cursor:pointer
}
@media (hover: hover){
.ideas-score__image-like:hover{
background-image:url(../img/icons/green-like.svg);
background-repeat:no-repeat;
background-size:cover
}

}
.ideas-score__image-like-active{
width:29px;
height:29px;
background-image:url(../img/icons/green-like.svg);
background-repeat:no-repeat;
background-size:cover
}
.ideas-score__text{
margin:0;
padding:0;
font-weight:300;
font-size:16px
}
.ideas-score__number{
margin:0;
padding:0;
font-weight:700;
font-size:16px
}
.ideas-score__vote{
margin:0;
padding:0;
font-weight:300;
font-size:16px
}
.idea-page{
display:flex;
flex-direction:column;
gap:32px;
margin-top:56px;
margin-bottom:56px;
padding:0 15px
}
.idea-container{
background-color:var(--white-color);
border-radius:20px;
padding:48px
}
@media (max-width: 750px){
.idea-container{
padding:20px
}

}
.idea-info{
display:flex;
flex-direction:row;
gap:24px;
margin-bottom:10px
}
@media (max-width: 400px){
.idea-info{
flex-direction:column;
align-items:center
}

}
.idea-info__date{
font-size:16px;
font-weight:300;
margin:0;
padding:0;
color:var(--dark-theme-bg)
}
.idea-info__voting{
font-size:16px;
font-weight:500;
margin:0;
padding:0;
color:var(--dark-theme-bg)
}
.idea-description__title{
font-size:40px;
font-weight:700;
margin:0 0 18px;
padding:0;
color:var(--black-color)
}
@media (max-width: 400px){
.idea-description__title{
text-align:center
}

}
.idea-description p{
font-size:18px;
font-weight:400;
margin:0;
padding:0;
color:var(--black-color)
}
@media (max-width: 400px){
.idea-description p{
text-align:center
}

}
.idea-description p:not(:last-child){
margin-bottom:18px
}
.idea-description-like{
display:flex;
flex-direction:row;
gap:30px;
align-items:center;
color:var(--black-color)
}
@media (max-width: 400px){
.idea-description-like{
flex-direction:column;
align-items:center
}

}
.authors__container{
display:flex;
flex-direction:row;
flex-wrap:wrap;
gap:22px
}
.author__container{
display:flex;
flex-direction:row;
width:calc((100% - 44px) / 3);
border:1px solid var(--black-color);
border-radius:20px;
padding:16px 35px 16px 20px;
align-items:center;
gap:12px;
position:relative
}
@media (max-width: 1100px){
.author__container{
width:calc((100% - 22px)/2)
}

}
@media (max-width: 768px){
.author__container{
width:100%
}

}
@media (max-width: 450px){
.author__container{
flex-direction:column
}

}
.author__container img{
width:80px;
height:80px;
border-radius:50%;
-o-object-fit:cover;
object-fit:cover
}
.author__container:hover{
box-shadow:0 2px 5px #00000040
}
.author__info{
display:flex;
flex-direction:column;
gap:4px
}
.author__name{
font-size:24px;
font-weight:700;
margin:0;
padding:0;
color:var(--black-color)
}
@media (max-width: 450px){
.author__name{
text-align:center
}

}
.author__post{
font-size:16px;
font-weight:300;
margin:0;
padding:0;
color:var(--dark-theme-bg)
}
@media (max-width: 450px){
.author__post{
text-align:center
}

}
.author__arrow{
background-image:url(../img/icons/arrow.svg);
background-repeat:no-repeat;
background-size:cover;
background-position:center;
width:15px;
height:26px;
position:absolute;
top:calc(50% - 13px);
right:16px
}
.author__container-active{
border:none;
background-color:var(--accent-color)
}
.author__name-active,.author__post-active{
color:var(--white-color)
}
.author__arrow-active{
background-image:url(../img/icons/arrow-white.svg)
}
.market-page{
margin-top:56px;
margin-bottom:56px
}
.market-page__title{
font-weight:700;
color:var(--text-color);
margin:0 0 32px
}
@media (max-width: 576px){
.market-page__title{
text-align:center
}

}
.market-page__items{
display:flex;
flex-wrap:wrap;
gap:35px;
margin-top:32px
}
@media (max-width: 1200px){
.market-page__items{
gap:25px
}

}
@media (max-width: 576px){
.market-page__items{
gap:16px
}

}
.market-page__items .market-item{
max-width:calc((100% - 140px)/5)
}
@media (max-width: 1200px){
.market-page__items .market-item{
max-width:calc((100% - 75px)/4)
}

}
@media (max-width: 991px){
.market-page__items .market-item{
max-width:calc((100% - 50px) / 3)
}

}
@media (max-width: 576px){
.market-page__items .market-item{
max-width:calc((100% - 16px)/2)
}

}
.market-item{
width:100%;
display:flex;
flex-direction:column;
gap:16px;
padding:24px 26px;
background:var(--white-color);
color:var(--black-color);
border-radius:20px
}
@media (max-width: 576px){
.market-item{
padding:20px 15px
}

}
.market-item__media{
width:100%
}
.market-item__media img{
display:block;
width:100%;
height:auto
}
.market-item__description{
display:flex;
justify-content:space-between;
flex-wrap:wrap;
gap:16px;
align-items:flex-start;
flex-direction:column
}
.market-item__name{
margin:0 0 6px;
font-weight:500;
font-size:20px;
color:var(--black)
}
.market-item__coast{
display:flex;
gap:6px;
align-items:center;
font-family:var(--font-family);
font-weight:400;
font-size:16px
}
.market-item__coast:before{
flex-shrink:0;
content:"";
width:19px;
height:19px;
background:url(../img/icons/bonus.svg) no-repeat;
background-size:cover
}
.market-item__coast b{
font-weight:700
}
.market-item__coast.enough{
color:var(--green-color)
}
.market-item__coast.not-enough{
color:var(--error-color)
}
.market-item__coast.not-enough:before{
background:url(../img/icons/not-bonus.svg) no-repeat
}
.market-item__buy{
width:25px;
height:25px;
background:url(../img/icons/cart.svg) no-repeat;
background-size:cover
}
@media (max-width: 768px){
.market-item__buy{
display:none
}

}
.product-page__wrapper{
background:var(--white-color);
border-radius:20px;
padding:48px;
display:flex;
gap:40px;
margin-top:56px;
margin-bottom:56px
}
@media (max-width: 991px){
.product-page__wrapper{
flex-direction:column
}

}
@media (max-width: 576px){
.product-page__wrapper{
padding:40px 20px;
gap:24px
}

}
.product-page__slider{
width:100%;
max-width:400px
}
.product-page__slider .swiper-slide{
display:flex;
align-items:center;
justify-content:center
}
.product-page__slider .swiper-slide img{
max-width:100%;
height:auto
}
.product-page__slider-top{
position:relative;
margin-bottom:10px
}
.product-page__slider-top .prev,.product-page__slider-top .next{
position:absolute;
top:50%;
right:0;
z-index:1;
transform:translateY(-50%);
width:30px;
height:32px;
cursor:pointer;
background:url(../img/icons/arrow_forward.svg) no-repeat;
transition:var(--transition)
}
.product-page__slider-top .prev:hover,.product-page__slider-top .next:hover{
opacity:.8
}
.product-page__slider-top .prev{
left:0;
right:auto;
transform:translateY(-50%) rotate(180deg)
}
.product-page__slider-bot .swiper-slide{
cursor:pointer;
padding:10px
}
.product-page__info{
width:100%
}
.product-info__header{
display:flex;
align-items:center;
flex-wrap:wrap;
gap:12px 30px;
margin-bottom:20px
}
.product-info__name{
font-weight:700;
font-size:40px;
color:var(--black-color);
margin:0
}
.product-info__coast{
display:flex;
align-items:center;
gap:10px;
font-weight:400;
font-size:24px;
color:var(--dark-theme-bg)
}
.product-info__coast:before{
flex-shrink:0;
content:"";
width:33px;
height:32px;
background:url(../img/icons/bonus.svg) no-repeat;
background-size:cover
}
.product-info__coast b{
font-weight:700;
font-size:22px
}
.product-info__coast.enough{
color:var(--green-color)
}
.product-info__coast.not-enough{
color:var(--error-color)
}
.product-info__coast.not-enough:before{
background:url(../img/icons/not-bonus.svg) no-repeat
}
.product-info__description{
margin-bottom:20px;
color:var(--dark-theme-bg)
}
.product-info__description p{
margin:0
}
.product-info__description p:not(:last-child){
margin-bottom:16px
}
.lg-outer .lg-thumb-item.active,.lg-outer .lg-thumb-item:hover{
border-color:var(--accent-color)
}
.start-form{
flex-grow:1;
padding:171px 0 60px;
background:var(--gradient);
color:var(--white-color)
}
.start-form__container{
max-width:440px
}
.start-form__header{
display:flex;
align-items:center;
gap:24px;
margin-bottom:32px
}
.start-form__logo{
max-width:80px;
flex-shrink:0
}
@media (max-width: 576px){
.start-form__logo{
display:none
}

}
.start-form__logo img{
width:100%;
height:auto
}
.start-form__title{
width:100%;
font-weight:700;
font-size:40px;
line-height:100%;
margin:0;
text-align:center
}
.start-form__inputs{
display:flex;
flex-direction:column;
gap:16px
}
.start-form__forgot{
display:block;
font-weight:300;
font-size:16px;
text-decoration:underline;
text-align:center;
margin-top:16px;
margin-bottom:-8px
}
.start-form__submit{
margin-top:24px
}
.start-form__btns{
display:flex;
gap:16px
}
@media (max-width: 576px){
.start-form__btns{
flex-direction:column
}

}
.start-form__btns .white-btn{
max-width:none
}
.start-form__agreement{
display:flex;
align-items:flex-start;
gap:10px;
margin-top:16px
}
.start-form__agreement .checkbox{
background:none;
border-color:var(--white-color)
}
.start-form__agreement .checkbox span{
color:var(--white-color);
filter:brightness(0) invert(1)
}
.start-form__agreement p{
opacity:.9;
font-weight:300;
font-size:13px;
line-height:120%;
color:var(--white-color);
margin:2px 0 0
}
.start-form__agreement p a{
text-decoration:underline
}
.start-form__agreement p a:hover{
opacity:.8
}
.start-form__link{
display:block;
font-weight:300;
font-size:16px;
text-align:center;
margin-top:16px
}
.start-form__link a{
display:block;
text-decoration:underline
}
.start-form__link a:hover{
opacity:.8
}
.white-input{
background-color:var(--white-color);
border:1px solid transparent;
border-radius:20px;
color:#565671;
font-size:18px;
font-weight:300;
text-align:center;
width:100%;
min-height:56px;
padding:10px 20px
}
.white-input:focus{
outline:none;
border-color:var(--black-color)
}
.white-input:valid{
color:var(--dark-theme-bg)
}
.white-input.error{
border-color:var(--error-color)
}
.vk-btn{
display:flex;
align-items:center;
justify-content:center;
gap:7px;
background-color:#2f8dff;
border-radius:20px;
color:var(--white-color);
font-size:18px;
font-weight:300;
text-align:center;
width:100%;
min-height:56px;
padding:10px 20px
}
.vk-btn:before{
content:"";
display:block;
width:24px;
height:24px;
background:url(../img/icons/vk.svg) no-repeat;
background-size:cover
}
.vk-btn:hover{
opacity:.8
}
.notifications__content{
padding:48px 48px 64px
}
@media (max-width: 576px){
.notifications__content{
padding:60px 20px 48px
}
.notifications__close{
top:24px;
right:24px
}

}
.notifications__header{
display:flex;
gap:8px 40px;
margin-bottom:32px
}
@media (max-width: 768px){
.notifications__header{
flex-direction:column
}

}
@media (max-width: 576px){
.notifications__header{
align-items:center;
margin-bottom:20px
}

}
.notifications__header .checkbox-container{
margin-top:11px
}
@media (max-width: 576px){
.notifications__header .checkbox-container{
margin-top:4px
}

}
.notifications__header .checkbox-container__text{
color:var(--white-color)
}
.notifications__header .checkbox{
background:none;
border-color:var(--white-color)
}
.notifications__header .checkbox span{
color:var(--white-color);
filter:brightness(0) invert(1)
}
.notifications__title{
font-weight:700;
font-size:40px;
color:var(--white-color);
margin:0
}
@media (max-width: 576px){
.notifications__title{
font-size:32px;
text-align:center
}

}
.notifications__block{
display:flex;
flex-direction:column;
gap:16px
}
.notifications__block:not(:last-child){
margin-bottom:32px
}
.notifications__block-title{
font-family:var(--font-family);
font-weight:700;
font-size:24px;
color:var(--white-color);
margin:0
}
@media (max-width: 576px){
.notifications__block-title{
text-align:center;
font-size:20px
}

}
.notifications__block-list{
display:flex;
flex-wrap:wrap;
gap:20px
}
@media (max-width: 576px){
.notifications__block-list{
gap:16px
}

}
.notifications__block-list .notifications-item{
max-width:calc((100% - 40px) / 3)
}
@media (max-width: 1080px){
.notifications__block-list .notifications-item{
max-width:calc((100% - 20px)/2)
}

}
@media (max-width: 768px){
.notifications__block-list .notifications-item{
max-width:100%
}

}
.notifications-item{
position:relative;
width:100%;
display:flex;
flex-direction:column;
gap:12px;
border-radius:20px;
background:var(--white-color);
padding:26px 48px 26px 24px
}
@media (max-width: 576px){
.notifications-item{
padding:20px 48px 20px 20px
}

}
.notifications-item:hover{
box-shadow:0 2px 5px #00000059
}
.notifications-item:after{
content:"";
position:absolute;
top:50%;
right:14px;
transform:translateY(-50%);
display:block;
width:31px;
height:32px;
background:url(../img/icons/arrow_forward.svg) no-repeat;
background-size:cover
}
.notifications-item.new .notifications-item__date:before{
content:"";
display:block;
width:8px;
height:8px;
border-radius:50%;
background:var(--error-color);
margin-right:8px;
margin-top:-3px
}
.notifications-item__date{
display:flex;
align-items:center;
font-weight:300;
font-size:14px;
color:var(--dark-theme-bg);
margin:0
}
.notifications-item__name{
font-weight:500;
font-size:18px;
color:var(--black-color);
margin:0
}
.notifications-item__type{
font-weight:300;
font-size:14px;
color:var(--dark-theme-bg)
}
.suggest-page{
margin-top:56px;
margin-bottom:56px;
display:flex;
flex-direction:column;
gap:32px
}
.suggest-container{
background-color:var(--white-color);
border-radius:20px;
padding:48px
}
@media (max-width: 576px){
.suggest-container{
padding:40px 20px
}

}
.suggest-container__title{
margin:0 0 32px;
padding:0;
font-size:40px;
font-weight:700;
color:var(--black-color)
}
@media (max-width: 756px){
.suggest-container__title{
text-align:center
}

}
.suggest-info{
display:flex;
flex-direction:row;
gap:60px
}
@media (max-width: 756px){
.suggest-info{
flex-direction:column;
gap:30px
}

}
.suggest-info__container{
display:flex;
flex-direction:column;
gap:12px;
width:100%
}
.suggest-info__container .form{
display:flex;
flex-direction:column;
gap:24px
}
@media (max-width: 576px){
.suggest-info__container .form .btn{
max-width:none
}

}
.suggest-info__title{
margin:0;
padding:0;
font-size:24px;
font-weight:700;
color:var(--black-color)
}
@media (max-width: 756px){
.suggest-info__title{
text-align:center
}

}
.suggest-info__button-author{
color:var(--accent-color);
font-size:18px;
font-weight:500;
margin:16px 0 0;
padding:0;
width:-moz-fit-content;
width:fit-content;
cursor:pointer
}
@media (max-width: 576px){
.suggest-info__button-author{
width:100%;
margin-top:8px;
text-align:center
}

}
.suggest-author__container{
display:flex;
flex-direction:row;
align-items:center;
gap:16px;
width:100%;
max-width:432px;
border:1px solid var(--black-color);
border-radius:20px;
padding:16px 35px 16px 20px;
position:relative
}
@media (max-width: 576px){
.suggest-author__container{
max-width:none
}

}
@media (max-width: 400px){
.suggest-author__container{
flex-direction:column
}

}
.suggest-author__container-active{
border:none;
background-color:var(--accent-color)
}
.suggest-author__container:hover{
box-shadow:0 2px 5px #00000040
}
.suggest-author__photo{
border-radius:50%;
width:80px;
height:80px;
-o-object-fit:cover;
object-fit:cover
}
.suggest-author__info{
display:flex;
flex-direction:column
}
@media (max-width: 400px){
.suggest-author__info{
align-items:center
}

}
.suggest-author__name{
margin:0;
padding:0;
font-size:18px;
font-weight:700;
color:var(--black-color)
}
.suggest-author__name-active{
color:var(--white-color)
}
.suggest-author__post{
margin:0;
padding:0;
font-size:16px;
font-weight:3200;
color:var(--black-color)
}
.suggest-author__post-active{
color:var(--white-color)
}
.suggest-author__arrow{
background-image:url(../img/icons/arrow.svg);
background-repeat:no-repeat;
background-size:cover;
background-position:center;
width:15px;
height:26px;
position:absolute;
bottom:24px;
right:16px
}
.suggest-author__arrow-active{
top:calc(50% - 13px);
background-image:url(../img/icons/arrow-white.svg)
}
.suggest-author__delete{
background-image:url(../img/icons/delete.svg);
background-repeat:no-repeat;
background-size:cover;
background-position:center;
width:16px;
height:16px;
position:absolute;
top:24px;
right:16px
}
.text-page{
font-weight:400;
color:var(--text-color);
margin-top:56px;
margin-bottom:56px;
min-height:0
}
.text-page .title__text{
color:var(--text-color);
margin-bottom:32px
}
@media (max-width: 576px){
.text-page{
font-size:14px
}
.text-page h1{
font-size:1.75em
}

}
.text-page ul{
display:block;
list-style-type:disc;
margin-block-start:1em;
margin-block-end:1em;
margin-inline-start:0px;
margin-inline-end:0px;
padding-inline-start:40px;
unicode-bidi:isolate
}
.text-page ul li{
list-style-type:disc
}
@media (max-width: 576px){
.text-page ul,.text-page ol{
padding-left:20px
}

}
.text-page a{
text-decoration:none
}
.text-page a:hover{
opacity:.8
}
.text-page b,.text-page strong{
font-weight:700
}
.text-page__contacts{
display:flex!important;
flex-direction:column;
gap:5px;
padding-inline-start:0!important
}
.text-page__contacts li{
list-style-type:none!important
}
.text-page__contacts-phone{
text-decoration:none
}
.text-page__contacts-mail{
color:var(--accent-color)
}
.history-page{
margin-top:56px;
margin-bottom:56px
}
.history-page__title{
font-weight:700;
font-size:40px;
color:var(--text-color);
margin:0 0 32px
}
@media (max-width: 576px){
.history-page__title{
text-align:center
}

}
.history-page__items{
display:flex;
flex-wrap:wrap;
gap:25px
}
.history-page__items .info-item{
width:100%;
max-width:calc((100% - 50px) / 3)
}
@media (max-width: 991px){
.history-page__items .info-item{
max-width:calc((100% - 25px)/2)
}

}
@media (max-width: 576px){
.history-page__items .info-item{
max-width:100%
}

}
.news-container{
display:flex;
flex-direction:row;
gap:40px;
margin-top:56px;
margin-bottom:56px;
align-items:start
}
@media (max-width: 991px){
.news-container{
flex-direction:column
}

}
@media (max-width: 576px){
.news-container{
gap:24px
}

}
.news-info{
width:100%;
max-width:450px;
padding:30px;
background-color:var(--white-color);
color:var(--black-color);
box-sizing:border-box;
border-radius:20px;
position:relative
}
@media (max-width: 991px){
.news-info{
max-width:100%;
display:flex;
flex-direction:column;
align-items:center
}

}
@media (max-width: 576px){
.news-info{
padding:30px 20px
}

}
.news-info__title{
font-size:20px;
font-weight:500;
line-height:24px;
margin:20px 0 -4px;
padding:0
}
.news-info__image-container{
position:relative
}
.news-info__image{
display:block;
width:100%;
height:auto;
-o-object-fit:cover;
object-fit:cover;
border-radius:20px
}
.news-info__status{
display:inline-flex;
align-items:center;
justify-content:center;
background:var(--green-color);
color:var(--white-color);
text-align:center;
font-size:16px;
font-weight:500;
padding:8px 16px;
border-radius:20px;
position:absolute;
top:12px;
right:12px
}
.news-info__status.active{
background:var(--green-color)
}
.news-info__status.completed{
background:#676767
}
.news-info__status.moderation{
background:#f8d247
}
.news-info ul{
display:flex;
flex-direction:column;
gap:12px;
margin-top:20px;
width:100%
}
.news-info ul li p{
margin:0;
padding:0;
font-size:16px;
font-weight:400
}
@media (max-width: 540px){
.news-info ul li p{
font-size:12px
}

}
.news-info__rewards{
margin-top:20px;
display:flex;
flex-direction:column;
gap:16px
}
.news-info__reward{
display:flex;
flex-direction:row;
gap:6px;
align-items:center
}
.news-info__reward-image{
width:29px;
height:29px;
margin:0;
padding:0
}
.news-info__reward-number{
font-size:16px;
font-weight:500;
margin:0;
padding:0
}
@media (max-width: 540px){
.news-info__reward-number{
font-size:12px
}

}
.news-info__reward-text{
font-size:16px;
font-weight:300;
margin:0;
padding:0
}
@media (max-width: 540px){
.news-info__reward-text{
font-size:12px
}

}
.news-info__reward-container{
display:flex;
flex-direction:row;
gap:16px;
align-items:center
}
.news-info__reward-container p{
font-size:16px;
font-weight:500;
margin:0;
padding:0
}
@media (max-width: 540px){
.news-info__reward-container p{
font-size:12px
}

}
.news-description{
padding:30px;
background-color:var(--white-color);
box-sizing:border-box;
border-radius:20px;
width:100%
}
@media (max-width: 576px){
.news-description{
padding:30px 20px
}

}
.news-description__title{
margin:0 0 20px;
padding:0;
font-size:40px;
font-weight:700;
color:var(--black-color)
}
@media (max-width: 540px){
.news-description__title{
font-size:20px
}

}
.news-description .form{
display:flex;
flex-direction:column
}
.news-description .form .textarea{
margin:0;
padding:20px;
font-size:18px;
font-weight:300;
border-radius:20px;
width:100%;
min-height:240px;
resize:none
}
.news-description .form .input{
margin-top:18px
}
.news-description__text p{
margin:0;
padding:0;
font-size:18px;
font-weight:400;
color:var(--black-color);
line-height:22px
}
@media (max-width: 540px){
.news-description__text p{
font-size:14px
}

}
.news-description__text p:not(:last-child){
margin-bottom:18px
}
.news-description .btn{
margin:32px 0 0
}
@media (max-width: 540px){
.news-description .btn{
max-width:100%
}

}
.news-description__date{
margin-top:10px;
margin-bottom:10px
}
.news-description__date p{
margin:0;
padding:0;
font-size:16px;
font-weight:400
}
@media (max-width: 540px){
.news-description__date p{
font-size:14px
}

}
.add-photo-block{
margin-top:18px
}
.add-photo-block__images{
display:flex;
flex-wrap:wrap;
gap:10px
}
.add-photo-block__images:not(:empty){
margin-bottom:18px
}
.add-photo-block__image{
position:relative;
width:100%;
max-width:calc((100% - 40px)/5);
border-radius:20px;
aspect-ratio:1.7777777778;
background:#000
}
@supports not (aspect-ratio: calc(16 / 9)){
.add-photo-block__image:before{
content:"";
float:left;
padding-top:56.25%
}
.add-photo-block__image:after{
content:"";
display:block;
clear:both
}

}
@media (max-width: 1400px){
.add-photo-block__image{
max-width:calc((100% - 30px)/4)
}

}
@media (max-width: 1200px){
.add-photo-block__image{
max-width:calc((100% - 20px) / 3)
}

}
@media (max-width: 576px){
.add-photo-block__image{
max-width:calc((100% - 10px)/2)
}

}
.add-photo-block__image img{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
-o-object-fit:cover;
object-fit:cover;
border-radius:20px;
filter:brightness(70%)
}
.add-photo-block__image .delete{
cursor:pointer;
display:block;
width:32px;
height:32px;
position:absolute;
right:12px;
top:12px;
transition:var(--transition)
}
.add-photo-block__image .delete:hover{
opacity:.8
}
.add-photo-block__image .delete:before,.add-photo-block__image .delete:after{
content:"";
background-color:var(--white-color);
position:absolute;
width:20px;
height:2px;
left:calc(50% - 10px);
top:calc(50% - 1px);
transform:rotate(-45deg);
border-radius:1px
}
.add-photo-block__image .delete:after{
transform:rotate(45deg)
}
.add-photo-block__input{
display:block;
font-weight:500;
font-size:18px;
color:var(--accent-color);
cursor:pointer;
transition:var(--transition)
}
.add-photo-block__input:hover{
color:var(--accent-color-hover)
}
.add-photo-block__input input{
position:absolute;
width:0;
height:0;
opacity:0;
visibility:hidden
}
:root{
--simpS_color_placeholder: var(--black-color);
--simpS_radius: 5px;
--simpS_color_light: var(--ligth-accent-color)
}
.table-form__filter{
position:relative
}
@media (max-width: 750px){
.table-form__filter{
width:100%
}

}
.table-form__filter .SimpleSel{
color:var(--black-color);
font-size:18px;
font-weight:300;
text-align:left;
min-width:290px
}
.table-form__filter .SimpleSel__list{
padding:10px 0
}
.table-form__filter .SimpleSel__list_item:not(:last-child){
border:none
}
.table-form__filter .SimpleSel__top_body{
background:var(--white-color);
width:100%;
padding:12px;
color:#000;
text-align:center;
text-overflow:ellipsis;
border:none!important;
height:56px;
border-radius:20px
}
.table-form__filter .SimpleSel__body{
width:auto;
min-width:100%;
margin-top:8px;
border-color:var(--black-color);
border-radius:20px;
border:none;
box-shadow:0 4px 8px #00000040
}
.table-form__filter .SimpleSel__list_item_body{
align-items:flex-start;
font-weight:300;
transition:var(--transition);
padding:8px 12px
}
.table-form__filter .SimpleSel__icon{
width:10px;
height:5px;
margin-left:16px
}
.table-form__filter .SimpleSel__icon:after{
width:15px;
height:15px;
top:calc(50% - 4px);
color:var(--black-color)
}
.table-form__filter .SimpleSel__list_item_icon{
flex-shrink:0
}
.table-form__filter .SimpleSel--open .SimpleSel__icon:after{
top:calc(50% + 4px)
}
.table-form__filter .SimpleSel--open .SimpleSel__body{
max-height:240px
}
.select.error .SimpleSel__top_body{
border-color:var(--error-color)!important
}
.select.SimpleSel--open .SimpleSel__icon:after{
top:calc(50% + 4px)
}
.select .SimpleSel{
color:var(--black-color);
font-size:18px;
font-weight:300;
letter-spacing:.02em;
text-align:left;
min-width:200px
}
.select .SimpleSel__list_item:not(:last-child){
border:none
}
.select .SimpleSel__top_body{
background:var(--white-color);
width:100%;
padding:12px;
color:#000;
text-align:center;
text-overflow:ellipsis;
border:1px solid var(--black-color);
height:56px;
border-radius:20px
}
.select .SimpleSel__body{
width:auto;
min-width:100%;
margin-top:10px;
border-color:var(--line-color);
border-radius:20px;
border:none;
box-shadow:0 4px 8px #00000040
}
.select .SimpleSel__list_item_body{
align-items:flex-start;
font-weight:300;
transition:var(--transition);
padding:8px 12px
}
.select .SimpleSel__list_item{
transition:var(--transition)
}
.select .SimpleSel__list_item:hover{
background:#eae9e9
}
.select .SimpleSel__icon{
width:10px;
height:5px;
margin-right:10px
}
.select .SimpleSel__icon:after{
width:15px;
height:15px;
top:calc(50% - 4px);
color:var(--black-color)
}
.select .SimpleSel__list_item_icon{
flex-shrink:0
}
.select .SimpleSel__list_item--disabled{
display:none
}