.fa {
font-family: "Font Awesome 5 Pro";
font-weight: 900;
}
.fa {
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
display: inline-block;
font-style: normal;
font-variant: normal;
text-rendering: auto;
line-height: 1;
}
.watchlist_parent {
position: relative;
width: 100%;
webkit-box-shadow: 0 4px 8px rgba(0,0,0,.04), 0 0 4px rgba(0,0,0,.06);box-shadow: 0 4px 8px rgba(0,0,0,.04), 0 0 4px rgba(0,0,0,.06);
}
.dropdown-content {
background-color: #fff;
margin: 0;
display: none;
min-width: 194px;
overflow-y: auto;
opacity: 0;
position: relative;
left: 0;
top: 0;
z-index: 9999;
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-box-shadow: 0 1px 2px rgb(0 0 0 / 4%);
box-shadow: 0 1px 2px rgb(0 0 0 / 4%);
box-sizing: border-box;
border: 1px solid rgba(0,0,0,.1);
}
.dropdown-content li.dropdown-title {
cursor: default;
}
.dropdown-content li {
clear: both;
color: rgba(0,0,0,.87);
cursor: pointer;
min-height: 30px;
line-height: 1.5rem;
/*width: 100%;*/
text-align: left;
}
.dropdown-content li>a, .dropdown-content li>span {
font-size: 14px;
color: #333;
display: block;
line-height: 30px;
padding: 5px 20px;
font-weight: 400;
}
.dropdown-content li:hover{
color: #0083da;
background-color: #f6f6f6;
}
.super__watchlist-menu {
display: flex;
margin-top: 10px;
}
.super__watchlist-select,
.super__watchlist-btn {
box-sizing: border-box;
padding: 12px 15px;
border: 1px solid rgba(0,0,0,.1);
color: #333;
background: #fff;
font-size: 15px;
font-weight: 500;
font-style: normal;
line-height: 16px;
cursor: pointer;
}
.super__watchlist-select {
display: flex;
flex-basis: 100%;
align-items: center;
border-right: none;
}
.super__watchlist-btn {
display: flex;
flex: 0 0 35px;
justify-content: center;
}
.super__watchlist-select i {
color: #a9a9a9;
margin-right: 8px;
margin-left: 2px;
font-weight: 400;
}
.dropdown-content li {
margin: 0;
}
.watchlist_parent .dropdown-content li.delete-watchlist a {
color: #8b1014;
}
.dropdown-title {
font-weight: 500;
padding: 14px 12px;
}
.watchlist_parent .dropdown-content li.delete-watchlist a {
color: #8b1014;
}
@media (max-width: 992px) {
.super__watchlist-select {
font-size: 14px;
}
.watchlist_parent {
position: relative;
width: 100%;
max-width: 210px;
}
.super__watchlist-select {
flex-basis: 100%;
}
}
@media only screen and (max-width:768px) {
.super__watchlist-select {
font-size: 13px;
}
.super__watchlist-menu {
justify-content: center;
}
}
.watchlist_parent .dropdown-content li.active a {
color: #8b1014;
}
.watchlist_btn_success i {
color: #f60;
}
.anime-item__watch-status {
position: absolute;
top: 0;
left: 0;
width: 100%;
text-align: center;
background-color: #3687bfcf;
color: white;
font-size: 0.9em;
transition: all 0.5s;
border-top-right-radius: 5px;
border-top-left-radius: 5px;
}
.anime-item__watch-status.watching {
background-color: #009933ad;
}
.anime-item__watch-status.seen {
background-color: #bf3643cf;
}
.anime-item__watch-status.will-watch {
background-color: #3687bfcf;
}
.anime-item__watch-status.abandoned {
background-color: #302f30cf;
}
.anime-item__watch-status.favourite {
background-color: #db8d3dcf;
}
.new-profile__watch-list {
margin-bottom: 20px;
padding: 10px;
}
.new-profile__watch-bar {
height: 10px;
background-color: #505050;
border-radius: 4px;
display: flex;
}
.new-profile__watch-bar div {
height: 100%;
}
.new-profile__watch-bar div:first-child {
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
}
.new-profile__watch-bar div:last-child {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
}
.new-profile__watch-bar--watching,
.new-profile__watch-type:nth-child(1)::before {
background-color: #009933ad;
}
.new-profile__watch-bar--will-watch,
.new-profile__watch-type:nth-child(2)::before {
background-color: #3687bfcf;
}
.new-profile__watch-bar--seen,
.new-profile__watch-type:nth-child(3)::before {
background-color: #bf3643cf;
}
.new-profile__watch-bar--abandoned,
.new-profile__watch-type:nth-child(4)::before {
background-color: #302f30cf;
}
.new-profile__watch-bar--favourite,
.new-profile__watch-type:nth-child(5)::before {
background-color: #db8d3dcf;
}
.new-profile__watch-types {
display: flex;
margin-top: 5px;
font-size: 0.85em;
}
.new-profile__watch-type {
margin-right: 15px;
color: rgba(0,0,0,.87);
}
.new-profile__watch-type:hover {
color: #f66600;
}
.new-profile__watch-type::before {
content: '';
display: inline-block;
vertical-align: top;
width: 8px;
height: 8px;
margin: 2px 7px 0 0;
background-color: #79c2d0;
border-radius: 50%;
}
.new-profile__watch-type span:first-child:after {
content: '-';
margin: 0 5px;
}
.show_it {
display: block;
left: 0px;
height: auto;
transform-origin: 100% 0;
opacity: 1;
transform: scaleX(1) scaleY(1);
position: absolute;
width: 100%;
top: 40px;
}
@media (max-width: 700px) {
.show_it {
width: 235px;
left: -21px;
height: auto;
}
.watchlist_parent {
width: auto;
margin: 0 auto;
}
}
.watchlist__sort-types {
display: flex;
position: relative;
background-color: #fff;
box-shadow: 0 0 1px 0 rgb(24 94 224 / 15%), 0 6px 12px 0 rgb(24 94 224 / 15%);
padding: 0.75rem;
border-radius: 99px;
}
.box-body-s {
background-color: #fff!important;
position: relative;
margin-bottom: 1rem!important;
padding: 0.7rem 1rem!important;
box-shadow: 0 1px 1px rgb(0 0 0 / 10%);
border-radius: 4px;
border: 1px solid rgba(0,0,0,.14);
}
.single_tabs {
border-bottom: solid 3px #f5f7fa;
}
.single_tabs {
width: 100%;
float: left;
padding: 0 25px;
}
ul.smenu {
float: left;
padding: 12px 0;
overflow: hidden;
}
ul.smenu li {
float: left;
}
ul.smenu li a {
color: #222d34;
}
ul.smenu li a {
width: 100%;
text-align: center;
float: left;
padding: 10px 20px;
font-weight: 500;
font-size: 14px;
border-radius: 3px;
}
ul.smenu li a.selected {
background: #00bcd4;
}
ul.smenu li a.selected, ul.smenu li a.selected:hover {
color: #fff;
}
@media only screen and (max-width: 540px) {
ul.smenu {
background: #f5f7fa;
}
ul.smenu li {
width: 50%;
padding: 2px;
}
ul.smenu li a {
text-shadow: none;
font-size: 14px;
font-weight: 500;
text-align: center;
padding: 10px 15px;
background: rgba(0,0,0,.03);
color: #222d34;
}
}
.new-profile__title {
text-transform: uppercase;
color: #505050;
font-size: 1.1em;
font-weight: 500;
margin: 0 0 10px;
}
.new-profile__title a {
color: #505050;
}
@media only screen and (max-width: 580px) {
.new-profile__watch-types {
flex-direction: column;
}
}
