Файл: anifun.ru/style/theme/style.css
Строк: 662
/*
Design by Xaotik
Vk: Vk.com/xaotik
Telegram: @Xaotik
*/
body
{
background: #f0f4f7;
background-attachment: fixed;
color:
#000000;
font-family: 'Roboto', sans-serif;
font-size: 16px;
margin: auto;
max-width: 900px;
}
a:link, a:visited {color :
#285473;text-decoration : none;}
a:hover {color : #285473;text-decoration
: none;}
img {vertical-align: -2px;border: 0px;margin: 0;padding:
0;}
table{width:
100%;}
::-webkit-scrollbar{
width:10px;
}
::-webkit-scrollbar-thumb{
background:
#dbe8f3;
border-radius: 10px;
box-shadow: inset 1px 1px 3px -1px
rgb(0 0 0 / 40%);
}
::-webkit-scrollbar-thumb:hover{
background:
#d3e0ea;
}
::-webkit-scrollbar-track{
background:
#f0f4f7;
}
::-webkit-scrollbar-track:hover{
background:
#f0f4f7;
}
.head{
background: #ffffff;
color: #000000;
position: absolute;
z-index: 1000;
top: 0;
left: 0;
right: 0;
height: 65px;
line-height: 64px;
box-shadow: rgb(0
0 0 / 13%) 0px 2px 3px;
}
.head_min {
max-width: 880px;
min-width: 1px;
margin: auto;
}
.logo{
display: table-cell;
width: 100%;
}
.lg1{
background: #8e44ad;
color: white;
padding: 15px 20px;
border-radius: 10px 0 0 10px;
box-shadow:
inset 1px 1px 3px -1px rgb(0 0 0 / 40%);
font-family: 'Comfortaa',
cursive;
font-weight: 700;
}
.lg2{
background: #3e3e3e;
color:
white;
padding: 15px 20px;
border-radius: 0 10px 10px 0;
box-shadow: inset 1px 1px 3px -1px rgb(0 0 0 / 40%);
font-family:
'Comfortaa', cursive;
font-weight: 700;
}
.head_link{
display:
table-cell;
}
.head_link a{
background: #e91e63;
color: #fff;
padding: 13px 20px;
border-radius: 5px;
box-shadow: inset 1px 1px
3px -1px rgb(0 0 0 / 40%);
}
.head_link a:hover{
background:
#e01c5f;
}
.head_link a span{
position: relative;
top:
6px;
}
.head_menu{
display:none;
}
.head_menu a{
display: flex;
background: #f7f7f7;
padding: 7px;
position: relative;
top:
9px;
color: #3e3e3e;
box-shadow: inset 1px 1px 3px -1px rgb(0 0 0
/ 40%);
border-radius: 5px;
}
.head_menu a:hover{
background:
#f3f3f3;
color: #8e44ad;
}
.head_menu a span{
font-size:
30px;
}
.content{
float: left;
width: 640px;
padding: 80px
10px 10px 10px;
}
.wright{
position: relative;
top: 80px;
float: right;
width: 235px;
}
.block_wright{
background: #ffffff;
padding: 16px 0 16px 0;
border-radius: 5px;
box-shadow: rgb(0
0 0 / 14%) 0px 2px 3px;
}
a.wright_link_home{
display:
block;
background: #f7f7f7;
padding: 10px 0 10px 25px;
color:
#8e44ad;
font-weight: 500;
border-left: 5px solid
#8e44ad;
}
a.wright_link_home:hover{
background: #f7f7f7;
border-left:
5px solid #8e44ad;
}
a.wright_link{
display: block;
padding: 10px 0
10px 25px;
color: #000000;
border-left: 5px solid
#fff;
}
a.wright_link:hover{
background: #f7f7f7;
color:
#8e44ad;
font-weight: 500;
border-left: 5px solid
#8e44ad;
}
.mt15{
margin-top:15px;
}
.mb15{
margin-bottom:15px;
}
.title{
background:
#fff;
color: #000;
line-height: 21px;
padding: 18px;
border-radius: 5px 5px 0 0;
border-bottom: 1px solid #f1f1f1;
box-shadow: rgb(0 0 0 / 14%) 0px 2px 3px;
}
.title span{
float: left;
color: #ececec;
font-size: 30px;
margin: -8px 11px 0
0;
}
.block{
background: #fff;
padding: 16px;
color:
#3c3c3c;
line-height: 25px;
border-bottom: 1px solid #f1f1f1;
box-shadow: rgb(0 0 0 / 14%) 0px 2px
3px;
}
a.link{
display:block;
background: #fff;
padding: 13px;
color: #3c3c3c;
line-height: 25px;
border-bottom: 1px solid
#f1f1f1;
box-shadow: rgb(0 0 0 / 14%) 0px 2px
3px;
}
a.link:hover{
background: #f7f7f7;
}
.icon{
float: left;
color: #8e44ad;
margin: 0 15px 0 0;
}
.hentai_list{
background:
#fff;
padding: 16px;
border-radius: 0 0 5px 5px;
box-shadow:
rgb(0 0 0 / 14%) 0px 2px 3px;
}
.hentai_list_pic{
width:
230px;
}
.hentai_list_pic img{
width: 200px;
height: 308px;
object-fit: cover;
border-radius:
5px;
}
.hentai_list_info{
vertical-align: top;
}
.hentai_list_info
div{
padding: 0 0 5px 0;
}
.hentai_list_a1{
display: table-cell;
width: 110px;
}
.hentai_list_a2{
display: table-cell;
color:
#565656;
font-weight: 300;
}
.hentai_list_like a{
display:
block;
background: #f9f9f9;
color: #a7a7a7;
padding: 5px 0 10px
0;
text-align: center;
border-radius: 5px;
margin: 3px 0 0
0;
}
.hentai_list_like a:hover{
background: #ffe0eb;
color:
#d287a1;
}
.hentai_list_like a span{
position: relative;
top:
5px;
left: -5px;
}
.video_content {
background: white;
overflow: hidden;
text-align: center;
padding: 10px 5px 10px
10px;
box-shadow: rgb(0 0 0 / 14%) 0px 2px 3px;
border-radius:
5px;
}
.block_video {
float : left;
width : 33%;
}
.video
{
background: #ffffff;
border: #ffffff solid 1px;
border-radius:
3px;
position: relative;
padding: 10px 10px 0 10px;
border-bottom: 2px solid #ffffff;
}
.video:hover {
background:
#f7f7f7;
border-bottom: 2px solid #f7f7f7;
}
.video img {
width:
100%;
height: 250px;
object-fit: cover;
border-radius:
3px;
}
.video b {
display: block;
color: #000;
line-height:
25px;
font-size: 16px;
font-weight: 400;
padding: 5px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 170px;
}
.video_rat {
background: #8e44ad;
color: #fff;
border-radius: 3px;
position: absolute;
left: 15px;
bottom: 260px;
height: 18px;
line-height: 18px;
font-size:
11px;
padding: 2px 10px 2px 8px;
}
.video_rat span{
float: left;
font-size: 20px;
margin: -1px 6px 0 0;
}
.input{
background:
#f7f7f7;
font-size: 16px;
width: 100%;
max-width: 100%;
min-width: 100%;
border: none;
color: #444444;
box-sizing:
border-box;
padding: 10px 12px 8px;
outline: none;
font-weight: 300;
height: 45px;
max-height: 300px;
min-height: 40px;
margin: 5px 0 10px 0;
box-shadow: inset 1px 1px
3px -1px rgb(0 0 0 / 16%);
font-family: Roboto, Arial, sans-serif;
-webkit-appearance: none;
-moz-appearance: none;
appearance:
none;
border-radius: 5px;
}
.button{
background: #3e3e3e;
color: #fff;
font-size: 15px;
padding: 12px;
border: none;
cursor: pointer;
outline: none;
width: 100%;
border-radius: 5px;
box-shadow: rgb(0 0 0 / 18%) 0px 2px
3px;
}
.button:hover{
background: #3a3a3a;
box-shadow: rgb(0 0 0 / 20%)
0px 2px 5px;
}
.err{
background: #f777a3;
padding: 13px;
color: #ffffff;
line-height: 25px;
box-shadow: rgb(0 0 0 / 14%)
0px 2px 3px;
margin: 0 0 15px 0;
text-align: center;
border-radius: 5px;
border-top: 5px solid
#ea6593;
}
.ok{
background: #46c792;
padding: 13px;
color:
#ffffff;
line-height: 25px;
box-shadow: rgb(0 0 0 / 14%) 0px 2px
3px;
margin: 0 0 15px 0;
text-align: center;
border-radius:
5px;
border-top: 5px solid #49da9f;
}
.no_hentai{
background:
#fff;
padding: 50px;
color: #607d8b;
font-size: 18px;
font-weight: 300;
box-shadow: rgb(0 0 0 / 14%) 0px 2px 3px;
text-align: center;
}
.no_hentai span{
display: block;
font-size:
80px;
padding: 0 0 15px 0;
}
a.create{
display: block;
background: #ffffff;
color: #7b7b7b;
font-weight: 300;
padding: 9px;
text-align: center;
border-radius: 5px;
border: 1px solid #f0f0f0;
}
a.create:hover{
background:
#fbfbfb;
}
.block_nav{
padding: 25px;
text-align:
center;
}
.block_nav b{
background: #3e3e3e;
color: #ffffff;
padding: 10px 16px;
border-radius: 50%;
box-shadow: rgb(0 0 0 /
13%) 0px 2px 3px;
}
.block_nav a{
background: #8e44ad;
color:
#ffffff;
padding: 10px 16px;
border-radius: 50%;
box-shadow:
rgb(0 0 0 / 13%) 0px 2px 3px;
}
.block_nav a:hover{
background:
#8841a7;
box-shadow: rgb(0 0 0 / 20%) 0px 2px 5px;
}
.block_nav
u{
color: #8c8d8e;
padding: 15px 15px 10px
15px;
}
.block_w{
background: url(/style/w.png) no-repeat right 9px
#fff;
background-size: 120px;
padding: 20px;
color:
#000000;
line-height: 28px;
box-shadow: rgb(0 0 0 / 14%) 0px 2px
3px;
border-radius: 5px 5px 0 0;
}
.block_w b{
font-size: 25px;
font-weight: 500;
}
.block_w span{
display: block;
font-size:
18px;
font-weight: 300;
}
.block_search{
background: #fff;
padding: 8px 10px 8px 10px;
box-shadow: rgb(0 0 0 / 14%) 0px 2px
3px;
border-radius: 0 0 5px 5px;
}
.input_search{
background:
#f7f7f7;
font-size: 16px;
color: #000000;
box-sizing:
border-box;
padding: 10px 12px 8px;
outline: none;
width:
100%;
height: 45px;
border: none;
border-radius: 0 5px 5px
0;
}
.input_search::-webkit-input-placeholder {
color:
#000000;
}
.button_search{
background: #f7f7f7;
color: #484848;
font-size: 16px;
width: 100%;
box-sizing: border-box;
padding: 10px 0 35px 15px;
outline: none;
cursor: pointer;
height: 40px;
border: none;
margin: 5px 0 5px 0;
border-radius: 5px 0 0 5px;
}
.button_search:hover{
color:
#637080;
}
#up {
position: fixed;
bottom: 0;
right: 0;
display: none;
background: #ffffff;
color: #000000;
padding:
10px;
margin: 0 30px 30px 0;
width: 50px;
height: 50px;
line-height: 4.5;
text-align: center;
border-radius: 50%;
box-shadow: rgb(0 0 0 / 13%) 0px 2px 3px;
}
#up span{
font-size: 35px;
}
#up:hover {
background:
#f7f7f7;
}
.foot{
padding: 30px 0 10px 0;
color: #88929a;
font-size: 15px;
font-weight: 300;
line-height: 21px;
text-align: center;
}
.rb{
background: url(img/rek.png) no-repeat top
right 0px #ffffff;
padding: 16px 16px 16px 20px;
line-height:
25px;
box-shadow: rgb(0 0 0 / 14%) 0px 2px 3px;
border-radius:
5px;
}
.rb a{
}
.stat{
padding: 5px;
text-align: center;
opacity: 0.3;
}
a.spoiler-trigger{
background: url(img/a1.png) no-repeat
top 10px right 10px #fff;
background-size: 30px;
display:
block;
padding: 13px;
color: #3c3c3c;
line-height: 25px;
border-bottom: 1px solid
#f1f1f1;
}
.spoiler-trigger.active{
background: url(img/a2.png)
no-repeat top 10px right 10px #fff;
background-size:
30px;
}
.spoiler-trigger span{
float: left;
font-size: 25px;
margin: -2px 13px 0 0;
}
.spoiler-block{
display:
none;
}
.cd-main-content {
text-align: center;
}
.cd-main-content
h1 {
font-size: 20px;
font-size: 1.25rem;
color: #64788c;
padding: 4em 0;
}
.cd-main-content .cd-btn {
position: relative;
display: inline-block;
padding: 1em 2em;
background-color: #89ba2c;
color: #ffffff;
font-weight: bold;
-webkit-font-smoothing:
antialiased;
-moz-osx-font-smoothing: grayscale;
border-radius:
50em;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0 0 5px
rgba(0, 0, 0, 0.1);
-webkit-transition: all 0.2s;
-moz-transition:
all 0.2s;
transition: all 0.2s;
}
.no-touch .cd-main-content
.cd-btn:hover {
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5), 0 0
20px rgba(0, 0, 0, 0.3);
}
@media only screen and (min-width: 1170px) {
.cd-main-content h1 {
font-size: 32px;
font-size: 2rem;
}
}
.cd-panel {
position: fixed;
top: 0;
left: 0;
height:
100%;
width: 100%;
visibility: hidden;
-webkit-transition:
visibility 0s 0.6s;
-moz-transition: visibility 0s 0.6s;
transition:
visibility 0s 0.6s;
z-index: 1000;
}
.cd-panel::after {
/*
overlay layer */
position: absolute;
top: 0;
left: 0;
width:
100%;
height: 100%;
background: transparent;
cursor: pointer;
-webkit-transition: background 0.3s 0.3s;
-moz-transition: background
0.3s 0.3s;
transition: background 0.3s 0.3s;
}
.cd-panel.is-visible
{
background: #0000001f;
cursor: pointer;
visibility: visible;
-webkit-transition: visibility 0s 0s;
-moz-transition: visibility 0s
0s;
transition: visibility 0s 0s;
}
.cd-panel.is-visible::after {
background: rgba(0, 0, 0, 0.6);
-webkit-transition: background 0.3s
0s;
-moz-transition: background 0.3s 0s;
transition: background 0.3s
0s;
}
.cd-panel.is-visible .cd-panel-close::before {
-webkit-animation: cd-close-1 0.6s 0.3s;
-moz-animation: cd-close-1 0.6s
0.3s;
animation: cd-close-1 0.6s 0.3s;
}
.cd-panel.is-visible
.cd-panel-close::after {
-webkit-animation: cd-close-2 0.6s 0.3s;
-moz-animation: cd-close-2 0.6s 0.3s;
animation: cd-close-2 0.6s
0.3s;
}
@-webkit-keyframes cd-close-1 {
0%, 50% {
-webkit-transform: rotate(0);
}
100% {
-webkit-transform:
rotate(45deg);
}
}
@-moz-keyframes cd-close-1 {
0%, 50% {
-moz-transform: rotate(0);
}
100% {
-moz-transform:
rotate(45deg);
}
}
@keyframes cd-close-1 {
0%, 50% {
-webkit-transform: rotate(0);
-moz-transform: rotate(0);
-ms-transform: rotate(0);
-o-transform: rotate(0);
transform:
rotate(0);
}
100% {
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}
}
@-webkit-keyframes cd-close-2 {
0%, 50% {
-webkit-transform:
rotate(0);
}
100% {
-webkit-transform: rotate(-45deg);
}
}
@-moz-keyframes cd-close-2 {
0%, 50% {
-moz-transform:
rotate(0);
}
100% {
-moz-transform: rotate(-45deg);
}
}
@keyframes cd-close-2 {
0%, 50% {
-webkit-transform:
rotate(0);
-moz-transform: rotate(0);
-ms-transform: rotate(0);
-o-transform: rotate(0);
transform: rotate(0);
}
100% {
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
}
}
.cd-panel-header {
position:
fixed;
width: 250px;
height: 50px;
line-height: 50px;
background: rgba(255, 255, 255, 0.96);
z-index: 2;
box-shadow: 0 1px
1px rgba(0, 0, 0, 0.08);
-webkit-transition: top 0.3s 0s;
-moz-transition: top 0.3s 0s;
transition: top 0.3s
0s;
}
.cd-panel-header h1 {
font-weight: bold;
color: #89ba2c;
padding-left: 5%;
}
.from-right .cd-panel-header, .from-left
.cd-panel-header {
top: -50px;
}
.from-right .cd-panel-header {
right: 0;
}
.from-left .cd-panel-header {
left: 0;
}
.is-visible
.cd-panel-header {
top: 0;
-webkit-transition: top 0.3s 0.3s;
-moz-transition: top 0.3s 0.3s;
transition: top 0.3s
0.3s;
}
.cd-panel-close {
position: absolute;
top: 0;
right:
0;
height: 100%;
width: 60px;
/* image replacement */
display:
inline-block;
overflow: hidden;
text-indent: 100%;
white-space:
nowrap;
}
.cd-panel-close::before, .cd-panel-close::after {
/* close
icon created in CSS */
position: absolute;
top: 22px;
left:
20px;
height: 3px;
width: 20px;
background-color: #424f5c;
/*
this fixes a bug where pseudo elements are slighty off position */
-webkit-backface-visibility: hidden;
backface-visibility:
hidden;
}
.cd-panel-close::before {
-webkit-transform:
rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform:
rotate(45deg);
-o-transform: rotate(45deg);
transform:
rotate(45deg);
}
.cd-panel-close::after {
-webkit-transform:
rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform:
rotate(-45deg);
-o-transform: rotate(-45deg);
transform:
rotate(-45deg);
}
.no-touch .cd-panel-close:hover {
background-color:
#424f5c;
}
.no-touch .cd-panel-close:hover::before, .no-touch
.cd-panel-close:hover::after {
background-color: #ffffff;
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
transition-property:
transform;
-webkit-transition-duration: 0.3s;
-moz-transition-duration: 0.3s;
transition-duration: 0.3s;
}
.no-touch
.cd-panel-close:hover::before {
-webkit-transform: rotate(220deg);
-moz-transform: rotate(220deg);
-ms-transform: rotate(220deg);
-o-transform: rotate(220deg);
transform: rotate(220deg);
}
.no-touch
.cd-panel-close:hover::after {
-webkit-transform: rotate(135deg);
-moz-transform: rotate(135deg);
-ms-transform: rotate(135deg);
-o-transform: rotate(135deg);
transform:
rotate(135deg);
}
.cd-panel-container {
position: fixed;
width:
250px;
height: 100%;
top: 0;
z-index: 1;
-webkit-transition-property: -webkit-transform;
-moz-transition-property: -moz-transform;
transition-property:
transform;
-webkit-transition-duration: 0.3s;
-moz-transition-duration: 0.3s;
transition-duration: 0.3s;
-webkit-transition-delay: 0.3s;
-moz-transition-delay: 0.3s;
transition-delay: 0.3s;
}
.from-right .cd-panel-container {
right:
0;
-webkit-transform: translate3d(100%, 0, 0);
-moz-transform:
translate3d(100%, 0, 0);
-ms-transform: translate3d(100%, 0, 0);
-o-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0,
0);
}
.from-left .cd-panel-container {
left: 0;
-webkit-transform:
translate3d(-100%, 0, 0);
-moz-transform: translate3d(-100%, 0, 0);
-ms-transform: translate3d(-100%, 0, 0);
-o-transform:
translate3d(-100%, 0, 0);
transform: translate3d(-100%, 0,
0);
}
.is-visible .cd-panel-container {
-webkit-transform:
translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0,
0);
transform: translate3d(0, 0, 0);
-webkit-transition-delay: 0s;
-moz-transition-delay: 0s;
transition-delay: 0s;
}
.cd-panel-content
{
background: white;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
overflow: auto;
padding: 10px
0 0 0;
-webkit-overflow-scrolling: touch;
box-shadow: rgb(0 0 0 /
32%) 0px 2px 3px;
}
a.cd-panel-link{
display: block;
background:
#fff;
padding: 13px;
color: #3c3c3c;
line-height: 25px;
border-bottom: 1px solid #f1f1f1;
}
a.cd-panel-link span{
float: left;
font-size: 25px;
margin: -2px 13px 0
0;
}
a.cd-panel-link:hover{
background: #f7f7f7;
color:
#8e44ad;
font-weight: 500;
border-left: 5px solid
#8e44ad;
}
.cd-panel-content p {
font-size: 14px;
font-size:
0.875rem;
color: #424f5c;
line-height: 1.4;
margin: 2em
0;
}
.cd-panel-content p:first-of-type {
margin-top: 0;
}
@media
only screen and (min-width: 768px) {
.cd-panel-content p {
font-size: 16px;
font-size: 1rem;
line-height: 1.6;
}
}
/*
Design by Xaotik
Vk: Vk.com/xaotik
Telegram: @Xaotik
*/