body {
    background: -webkit-linear-gradient(top, #8c7a7a 0%, #af877c 65%, #af877c 100%) fixed;
    background: linear-gradient(to bottom, #8c7a7a 0%, #af877c 65%, #af877c 100%) fixed;
    background: url("../img/bg.jpg") no-repeat center center fixed;
    background-size: cover;
    font: 14px/20px "Lato", Arial, sans-serif;
    color: #9E9E9E;
    margin-top: 30px;
}

.slide-container {
    margin: auto;
    width: 100%;
    text-align: center;
    margin-top: 60px;
}

.wrapper {
    padding-top: 40px;
    padding-bottom: 40px;
}

.wrapper:focus {
    outline: 0;
}

.clash-card {
    background: white;
    width: 300px;
    display: inline-block;
    margin: 0 16px;
    border-radius: 4px;
    position: relative;
    text-align: center;
    box-shadow: -1px 15px 30px -12px black;
    z-index: 9999;
}

.clash-card__image {
    position: relative;
    height: 380px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.clash-card__image--wizard img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    position: absolute;
}

.clash-card__level {
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 3px;
}

.clash-card__level--barbarian {
    color: #EC9B3B;
}

.clash-card__level--archer {
    color: #EE5487;
}

.clash-card__level--giant {
    color: #F6901A;
}

.clash-card__level--goblin {
    color: #82BB30;
}

.clash-card__level--wizard {
    color: #4FACFF;
}

.clash-card__unit-name {
    font-size: 13px;
    color: #717171;
    margin-bottom: 20px;
}

.clash-card__unit-description {
    padding: 20px;
    margin-bottom: 10px;
}

.clash-card__unit-stats--barbarian {
    background: #EC9B3B;
}

.clash-card__unit-stats--barbarian .one-third {
    border-right: 1px solid #BD7C2F;
}

.clash-card__unit-stats--archer {
    background: #EE5487;
}

.clash-card__unit-stats--archer .one-third {
    border-right: 1px solid #D04976;
}

.clash-card__unit-stats--giant {
    background: #F6901A;
}

.clash-card__unit-stats--giant .one-third {
    border-right: 1px solid #de7b09;
}

.clash-card__unit-stats--goblin {
    background: #82BB30;
}

.clash-card__unit-stats--goblin .one-third {
    border-right: 1px solid #71a32a;
}

.clash-card__unit-stats--wizard {
    background: #4FACFF;
}

.clash-card__unit-stats--wizard .one-third {
    border-right: 1px solid #309eff;
}

.clash-card__unit-stats {
    color: white;
    font-weight: 700;
    border-bottom-left-radius: 14px;
    border-bottom-right-radius: 14px;
}

.clash-card__unit-stats .one-third {
    width: 33%;
    float: left;
    padding: 20px 15px;
}

.clash-card__unit-stats sup {
    position: absolute;
    bottom: 4px;
    font-size: 45%;
    margin-left: 2px;
}

.clash-card__unit-stats .stat {
    position: relative;
    font-size: 24px;
    margin-bottom: 10px;
}

.clash-card__unit-stats .stat-value {
    text-transform: uppercase;
    font-weight: 400;
    font-size: 12px;
}

.clash-card__unit-stats .no-border {
    border-right: none;
}

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}

.slick-prev {
    display: inline-block;
    left: 100px;
    z-index: 999;
}

.slick-next {
    display: inline-block;
    right: 100px;
    z-index: 999;
}

.clash-card__unit-name {
    text-align: center;
}

.clash-card__unit-name img {
    width: 100px;
    height: 100px;
    display: block;
    margin: 0 auto;
}

.slick-prev:before, .slick-next:before {
    font-size: 32px;
    opacity: .7;
}

.nk-nav-logo span {
    color: #333;
}

.nk-navbar.nk-navbar-white-text-on-top .nk-nav-logo .nk-nav-logo-onscroll {
    vertical-align: middle;
}

.nk-nav-logo img {
    vertical-align: middle;
}

.nk-navbar-full .nk-nav .dropdown > li, .nk-navbar-full .nk-nav > li {
    line-height: 48px;
}

.nk-navbar.nk-navbar-white-text-on-top .nk-nav > li > a {
    color: #8a8a8a;
    font-size: 16px;
}

.nk-navbar.nk-navbar-white-text-on-top .nk-nav > li.active > a, .nk-navbar.nk-navbar-white-text-on-top .nk-nav > li > a:hover {
    color: #333;
}
