html{
    width: 100%;
    height:100%;
}
body{
    width:100%;
    height: 100%;
    margin: 0;
    position: relative;
    z-index: 1;
    font-family:var(--font-family);
    background-color: var(--NewBody);
    font-variant: normal;
    font-weight: 400;
    font-size: 16px;
    overflow-y: scroll;
    overflow-x: hidden;
}
.NewBody::-webkit-scrollbar{
    width: 15px;
}
.NewBody::-webkit-scrollbar-track{
 background-color:#313131;
}
.NewBody::-webkit-scrollbar-thumb{
    background:var(--liheral-gradient);
    border-radius: 10px;
}
/*---------------------------------------*/
.NewWeb{
    width:100%;
    height: auto;
    overflow: hidden;
    min-height:100%;
    
}
.NewWeb .NewHeader{
    width:99.78%;
    border-radius:0 0 20px 20px;
    border: 2px var(--NewBorder) solid;
    background-color: var(--newHeader);
    overflow: hidden;
    position: fixed;
    z-index:120;
}
.NewHeader header{
    width:100%;
    overflow:hidden;
    text-align: left;
    direction: ltr;
}
header .header{
    max-width:932px;
    width:100%;
    display: flex;
    height:45px;
}
.cover{
   width:100%;
   height:300px;
   position:  absolute;
   z-index:2;
   top:35px;
   overflow: hidden;
   background: url(../res/cover/cover566747748468.jpg);
   background-repeat: no-repeat;
   background-position:25% 75%;
   background-size: cover;
   pointer-events: none;
   border-radius:0 0 20px 20px;
}
#videoCover{
    display: none;
}
.coverFilter{
    border-radius:0 0 20px 20px;
    width:100%;
    height:300px;
    background: var(--liheral-gradient);
    /* animation: lineralGraf 1s infinite; */
}
@keyframes lineralGraf {
   0%{background: var(--liheral-gradientRus);}
   20%{background: var(--liheral-gradient);}
   30%{background: var(--liheral-gradientRus);}
   40%{background: var(--liheral-gradient);}
   50%{background: var(--liheral-gradientRus);}
   60%{background: var(--liheral-gradient);}
   70%{background: var(--liheral-gradientRus);}
   80%{background: var(--liheral-gradient);}
   90%{background: var(--liheral-gradientRus);}
   100%{background: var(--liheral-gradient);}
}
.Layout{
    position: relative;
    z-index: 2;
    top: 0;
    left:0;
    max-width:var(--layout);
    width:100%;
    margin: 0 auto 0 auto;
    padding-left: 16px;
    padding-right: 16px;
}
main{
    overflow: hidden;
}
.body{
    max-width:932px;
    width:100%;
    height: auto;
    margin-top:300px;
    padding-top:10px;
    overflow: hidden;
}
.col1{
  max-width:160px;
  width:100%;
  padding-top:45px;
  margin-right:10px;
  float:left;
  overflow: hidden;
}
.col2{ 
    max-width:430px;
    width:100%;
    float: right;
    padding-top:13px;
    overflow: hidden;
}
h1, a, p{
    width:100%;
    color: var(--color-text);
    text-decoration: none;
    margin: 0;
    padding: 0;
}

span{
    color: var(--text-color_ide);
    text-decoration: none;
    margin: 0;
    padding: 0;
}
p{
    margin: 0;
}
nav{
    overflow: hidden;
    width:100%;
}

.ico{
    display: block;
    max-width:35px;
    height:35px;
    width:100%;
    background-image: none;
}
img{
    width:100%;
    margin-bottom: -5px;
    cursor: pointer;
    height:auto;
    max-width:932px;
    border-radius:20px;
    object-fit: cover; 
    background-image: url(../res/cover/icon/profile.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.standard-sizeImg_original_post{
    max-width: 100%;
    height:515px;
    object-fit:cover;
    /* postSize */
}
.standard-sizeImg_original_on_post{
    max-width: 100%;
    height:515px;
    object-fit:cover;
    /* on */
}
.New_img_Collection_wrapW_post{
    max-width:100%;
    width:214px;
    height:300px;
    border-radius: 0px;
}
.standard-sizeImg_original_post_video{
    max-width:100%;
    height:180px;
    border-radius:20px 20px 0 0;
    /*  postSize */
}

:root{
    --newHeader:#313131;
    --NewBody:#484848;
    --NewContener:#444444;
    --NewBorder:#505050;
    --white:rgb(255, 255, 255, 0.5);
    --red:rgba(255, 0, 0, 0.5);
    --blue:rgb(0, 38, 255, 0.5);
    --DeepPink:rgba(255, 20, 147, 0.5);
    --BlueViolet:rgba(138, 43, 226, 0.5);
    --HotPink:rgba(255, 105, 180, 0.5);
    --color-text: #ffffff;
    --color-link-text:#f859d6;
    --color-button: #9455d4;
    --rgba-Cover:rgba(0, 0, 0, 0.5);
    --mobli-cover_filter:rgba(0, 0, 0, 0.4);
    --filter-Rus:hue-rotate(344deg);
    --liheral-gradientRus:linear-gradient(rgba(255, 255, 255, 0.658),rgba(255, 0, 0, 0.5),rgb(0, 38, 255, 0.5));
    --liheral-gradient:linear-gradient(310deg, rgba(157, 55, 240, 0.5),rgba(231, 47, 235, 0.5), rgba(131, 59, 255, 0.5) 60% );
    --liheral-gradient-pup:linear-gradient(310deg, rgba(157, 55, 240, 1),rgba(231, 47, 235, 1), rgba(131, 59, 255, 1) 60% );
    --text-color_ide:#8f8f8f;
    --layout:600px;
    --Collection_Layout:940px;
    --Video_Layout:1200px;
    --layout-album:960px;
    --layout-Audio:940px;
    --border-radius-audio:10px;
    --font-family: -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', Geneva, 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif, 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif, 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    --font-style: normal;
    --font-variant: normal;
    --font-weight: 400;
    --font-size: 16px;
    --scrollbarBg: #313131;
    --scrollbarThumb: #ffffff;
    --scrollbarWidth: 15px;
    --scrollbarBorder: 4px solid var(--scrollbarBg);
    --scrollbarBorderRadius: calc(var(--scrollbarWidth) / 2);
}