Art Fight Vampires CSS

/*
* Code by @cyxxie and @leafjelly
* Assets by @leafjelly
* Feel free to report any bugs!
* This code is free-to-use! You may modify as you see fit
*/

.container-fluid{
 width:1190px!important;
 margin:auto;
}

.banner-container.mb-3 {
  border: rgba(0,0,0,.7) solid 6px;
}


#wrapper {
  background: url(https://file.garden/ZT2StWKGxCOellbN/artfight/vampireBG) center;
  background-color: #131131;
  font-family:Georgia, serif!important;
}


/*User Info*/
.card.panel.float-left.d-none.d-md-block.profile-avatar-wrapper {
  border: none;
}

.profile-header-background.panel-heading.bg-light.p-2.border.rounded.position-relative {
  background-image: url(https://file.garden/ZT2StWKGxCOellbN/artfight/vampireheader);
  border: #000 solid 5px !important;
}

.profile-header-wrapper.clearfix {
  background:rgba(14, 12, 35,.9);
  border: #890000 1px solid !important;
  width:86% !important;
  margin-left:1%;
  display: inline-block  !important;
}

.profile-header-name a {
  color: #FFF!important;
  font-variant:small-caps;
}
.element-disabled.text-muted.h5 {
  color: #FFF !important;
  opacity: .7;
}
.card-body.panel-body.profile-avatar-panel {
  background: rgba(14, 12, 35,.9);
  padding:10px;
  margin:13px 5px 5px 5px;
}

.d-none.d-md-block.mt-3.profile-header-normal-status {
  font-size:smaller;
}


.card.panel.float-left.d-none.d-md-block.profile-avatar-wrapper {
  background: none;
  border:none;
}
.panel-heading{
  background-image: url(https://file.garden/ZT2StWKGxCOellbN/artfight/vampireheader);
    background-color: #f0523b !important;
    border: #0d0000 solid 3px;
    color: #FFF !important;
    padding: 5px 10px;
    font-style: italic;
}
.username-navbar span {
  color: #db365c !important;
}

/*Navigation Tabs*/
.nav-tabs {
  width:12%;
  Margin:0 0 0 -8px !important;
  display: inline-block  !important;
  padding:4px !important;
  Font-style:italic;
  border:none;
  font-variant:small-caps;
}

.nav-tabs .nav-item {
  text-align: center;
  border: none;
  background: rgba(14, 12, 35,.9) !important;
}

.nav-link.active, a.btn.btn-primary.active, .page-item.active .page-link {
    background: #9f0039 !important;
    text-transform: uppercase;
    color: #fff4f4 !important;
}

.nav-tabs .nav-item:hover {
  background: #690026!important;
}
.nav-tabs .nav-link{
  color:#ff366e;
  padding:5px;
  border:#710000 1px solid !important;
}

/* Profile Description Box*/
.profile-description.mb-4.clearfix {
  margin:1em !important;
  background: rgba(14, 12, 35,.9);
  Min-height:263px !important;
  max-height: 580px !important;
  overflow: auto!important;
  border: rgba(255,0,59,0.2) solid 3px;
  padding: 20px 25px;
  float: right;
  width: 72%;#3d0020
}

/* Followers and Links */
.profile-links.col-md-6 {
  min-width: 100%;
}

.profile-links .table-card{
  font-size:small;
}

td a, .card-footer.panel-footer.text-right a{
  color: #ff6883;
}
td a:hover, .card-footer.panel-footer.text-right a:hover{
  color: #ffa0b1;
}

.w-25.text-right.bg-light.active {
  background: url() top;
    border: #000 solid;
    border-width: 0px 3px 2px 2px;
    background-color: #27031b !important;
    color: #aba8c7;
}
.table.table-bordered.table-card {
  background: rgba(14, 12, 35,0.8);
}
.table-bordered td {
  padding:3px 11px;
  border: #000 solid 2px;
}


td.w-25.text-right.bg-light.active {
    font-style: italic;
    font-weight: lighter;
}

.profile-followers.col-md-6 {
    min-width: 100%;
}

.profile-followers .card-body.panel-body{
  background: rgba(14, 12, 35,0.8);
  text-align: center;
  padding: 2px 36px;
  Height:150px;
  overflow:auto;
}

.card-body.panel-body{
  background: rgba(14, 12, 35,0.8);
  overflow:auto;
}

.col-6.col-md-4.profile-follower {
  min-width: 100% !important;
  font-weight:lighter;
  padding:2px
}

.card-footer.panel-footer.text-right {
    padding: 3px;
    font-size: small;
    background-color: #1e072d;
    border: #5d0000 1px solid !important;
}

.btn.btn-primary.form-control.btn-submit-once {
  background: #0c0018;
  border: #511616 1px solid !important;;
}

.btn-warning, .btn-danger, .btn-success, .btn.btn-primary, #profile-dropdown {
  background: #000;
  border:#000 solid 1px;
  color: #ff6060;
}

.btn-warning:hover, .alert-warning{
    background: #C7680B;
    border:#ff9a30 solid 1px
    color: #ffebbe;
}

.btn-success:hover, .alert-success{
    background: #0D855E;
    Border: #44C39A solid 1px;
    color: #9FEBBD!important;
}

.btn-danger:hover, .alert-danger{
    background: #2E00001;
    border:#E8513B solid 1px;
    color: #E8513B!important;
}

.card.panel.panel-default.mt-3 {
  background: none;
}

/*Profile Galleries*/
.card.panel.panel-default.profile-gallery-header.profile-attacks-header.mt-3{
  width:100%;
}

.profile-attacks-header .panel-heading, .profile-defenses-header .panel-heading, .profile-characters-header .panel-heading {
    padding: 2px 10px;
    font-size: 8px;
    font-variant:small-caps;
}

h2.d-flex.align-items-center.mb-0 {
    width: 21%;
    font-size: 23px;
    Padding:0px 5px;
    background:rgba(28, 0, 16,0.4);
}

small.profile-gallery-header-link.ml-auto {
    margin: 0px 5px;
    font-size: 13px;
    font-style: normal;
}

.panel-heading a{
  color: #fef3e3;
}
.panel-heading a:hover {
  color: #ead7bb;
}

.card.p-1.m-1.thumb-attack.attack-thumb.thumbnail, .card.p-1.m-1.thumb-attack.character-thumb.thumbnail {
    border: rgba(0,0,0, .3) solid 3px !important;
    background: rgba(69, 0, 38, 0.8);
}
.nametag.thumbnail-width.h5.p-1.my-auto.bg-light.border.rounded.text-center.text-truncate, .nametag.bookmark-character.flex-shrink-0.h5.p-1.ml-1.my-auto.bg-light.border.rounded {
  background: #1e072d !important;
  border: #970303 1px solid !important;
  color:#e6466c !important;
  font-variant:small-caps;
}

.nametag.thumbnail-width.h5.p-1.my-auto.bg-light.border.rounded.text-center.text-truncate:hover, .nametag.bookmark-character.flex-shrink-0.h5.p-1.ml-1.my-auto.bg-light.border.rounded:hover, .btn.btn-primary.form-control.btn-submit-once:hover{
  background-color: #3c153d !important;
  border:#bf1574 solid 1px !important;
  color:#ff8ea9!important;
}

.text-break i {
  color: #e6466c !important;
}
.text-break i:hover{
  color:#ff8ea9!important;
}

/*Comments*/
.comment .panel-body {
  background: rgba(14, 12, 35, .9)!important;
}

.comments h2, h2.profile-stats-title, h2.profile-characters-title, h2.profile-attacks-title,{
    background: rgba(14, 12, 35, .7);
    padding: 2px 10px;
    margin: 30px auto 5px auto;
    text-align: center;
    width: 22%;
    font-variant: small-caps;
    color: #e5effd;
}

h2.profile-defenses-title {
    background: rgba(14, 12, 35, .7);
    padding: 2px 10px;
    width: 33%;
    font-variant: small-caps;
    color: #e5effd;
}




/*Site User Interface*/
.artfight-nav.navbar.navbar-dark.navbar-static-top.navbar-expand-md.mb-0 {
  border-bottom: 3px #000 solid;
  background: #120000 !important;
}
.dropdown-menu {
  background: #120000;
}
.dropdown-divider {
  border-color: #890000;
}
.dropdown-menu a, .dropdown-menu .d-flex.align-items-center {
  color: #e6466c !important;
}
.dropdown-header {
  Color: #917272;
}
.badge.badge-info, .badge.badge-primary, .badge.badge-danger, {
  background: #ed3560;color: #000!important;
}
.dropdown-item:hover {
  Background: #330000;
  Color: #ffbbcb !important;
}

.alert.alert-info {
  background: #8d364e !important;
  border:#d3798e solid 1px;
}
.alert.alert-info a {
  color: #ffc8d5 !important;
}

.comment a, navbar-brand d-flex align-items-center p-0 {
  color:#e6466c;
  font-variant:small-caps;
}

a .nav-link {
  color: #ed3560;
}


.card.panel {
  background: none;
}

.footer .contain {
  background: #120000 !important;
  border-top:#000 solid 5px;
}
.page-item.disabled .page-link {
  background: #290000 !important;
  border: none;
}
.page-link {
  background: #120000;
  border: none;
}
  .page-link:hover {
  background: #430000;
}

.card {
  background: rgba(14,12,35,0.9);
}

p, div{
	color: #e5e8f2;
}

/*Mobile Fixes*/
@media screen and (max-width: 766px){
 .container-fluid, .comments h2, h2.profile-stats-title, h2.profile-characters-title, h2.profile-attacks-title, h2.d-flex.align-items-center.mb-0 {
	width: 100%!important;
 }

 .profile-header-wrapper.clearfix, .nav-tabs {
	width: 100%!important;
	Margin: auto!important;
 }

  .profile-description.mb-4.clearfix {
	float: none !important;
	width: 100% !important;
	Margin: auto !important;
  }
  .profile-body {
	max-height: none!important;
	min-height: auto !important;
  }
  .col-6.col-md-4.profile-follower {
	height: inherit!important;
	min-width: inherit !important;
  }

  .profile-followers .card-body.panel-body{
	height: inherit !important;
  }
}