графика
Сообщений 1 страница 5 из 5
Поделиться52022-02-03 04:37:58
.title_wrap::-webkit-scrollbar {display:none;}
.title_wrap {scrollbar-width: none;}
.title_wrap {
width: 1052px;
height: 206px;
box-sizing: border-box;
border: 1px solid #C5D0D7;
margin: auto;
scroll-snap-type: y mandatory;
position: absolute;
overflow-y: scroll;
overscroll-behavior-y: none;
scroll-behavior: smooth;
margin-top: 9px;
margin-left: 9px;
}
.title_section {
scroll-snap-align: start;
scroll-snap-stop: always;
width: 1052px; /* ширина болока*/
height: 100%;
position: relative;
font: normal 12px/150% tenor sans;
color: #FFFFFF;
text-shadow: 1px 1px 1px rgba(0,0,0,.25);
text-transform: uppercase;
}
.page1 {
background: url(https://forumstatic.ru/files/001b/73/06/89015.png?v=1) center;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 20px;
position: relative
}
.forumname {
color: rgba(255, 212, 58, 1);
font-size: 34px;
letter-spacing: 8px;
margin-bottom: 10px
}
.page1 span {
font: 200 10px var(--fontfamily);
letter-spacing: 3px;
}
.page1 span:last-child {
font-size: 8px;
letter-spacing: 2px;
position: absolute;
bottom: 15px
}
.page2 {
background: url(https://forumstatic.ru/files/001b/73/06/24175.png) center;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
gap: 30px;
position: relative;
box-sizing: border-box;
padding: 40px 20px
}
.table__special_links {
width: 100%
}
.table__special_links ul {
display: flex;
flex-wrap: wrap;
gap: 10px;
justify-content: center
}
.table__special_links a {
background: rgba(212, 215, 216, 1);
border: 1px solid rgba(218, 228, 233, 1) !important;
color: rgba(58, 61, 63, 1) !important;
font: 600 10px var(--fontfamily);
letter-spacing: .07em;
padding: 8px 30px;
flex: auto;
text-align: center;
transition: all .6s cubic-bezier(.08,.83,.68,1.02) 0s !important;
text-shadow: none
}
.table__special_links a:hover {
background: #343a3d;
border: 1px solid #262b2e !important;
color: rgba(212, 215, 216, 1) !important;
}
.page3 {
background: url(https://forumstatic.ru/files/001b/73/06/95240.png) center;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
position: relative;
box-sizing: border-box;
padding: 35px 60px
}
.activ_players span, .writers_players span {
text-align: center;
display: block;
margin-bottom: 25px
}
.persons {
display: flex;
height: 66px;
justify-content: space-between;
width: 100%;
gap: 30px
}
.persons a {
height: 66px;
width: 66px;
overflow: hidden;
border: 1px solid #585C5A !important;
position: relative;
}
.persons a em {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
z-index: 1;
display: block;
color: #FFFFFF;
font: 200 normal 11px var(--fontfamily);
transition: all 1s cubic-bezier(.08,.83,.68,1.02) 0s;
filter: blur(5px);
opacity: 0;
}
.persons img {
width: 66px;
filter: grayscale(100%);
mix-blend-mode: overlay;
}
.persons div {
position: relative;
background: #3F4849;
height: 66px;
width: 66px;
}
.persons div:after {
content: "";
background: rgba(38, 47, 49, 0.54);
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 1;
display: block;
transition: all .6s cubic-bezier(.08,.83,.68,1.02) 0s;
}
.persons a:hover em {
filter: blur(0);
opacity: 1
}