﻿@media (min-width: 992px) {
    .header .navbar-nav > li > a {
		padding: 9px 30px 9px 30px;
	}

    .header-fixed .header.header-fixed-shrink .logo img {
        max-width: 125px;
        margin: 38px 0 -4px;
    }
}
::selection{
    color:#fff;
    text-shadow:none;
    background-color:#cf9a2d;
}
input[type="text"][readonly="readonly"].share{
    cursor:text;
}
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--multiple {
    border: solid 1px #ccc;
}
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple {
    border: 1px solid #ccc;
    border-radius: 0px;

}

.select2-container .select2-selection--single .select2-selection__rendered{
    
}
.select2-container .select2-selection--single{

}

.filter-by-block h1 {
    background: #222;
    border:1px solid #303030;
}
.filter-by-block .panel-body {
    padding: 15px 15px;
    border-top: none !important;
}
.filter-results{
    border-bottom:none;
}



body.dark .btn-u.btn-brd.btn-u-sea-shop {
    border-color: #cf9a2d;
    color: #cf9a2d;
    text-transform:uppercase;
}
body.dark .btn-u.btn-brd.btn-u-sea-shop:hover {
    border-color: #cf9a2d;
    color: #cf9a2d;
}

i.fa.fa-spin.spin-1, #loading-modal i.fa.fa-spin {
    -webkit-animation: fa-spin 1s infinite linear;
    animation: fa-spin 1s infinite linear;
}

.header .logo img{
    margin:2px 0px 10px 0px;
}

.header .topbar ul.loginbar > li > a, .header .topbar ul.loginbar > li > a:hover {
    color: #ccc;
    font-size: 11px;
    text-transform: uppercase;
    text-decoration:none;
}

.header .navbar-nav > li > a{
    font-family:"Sigmar One";
    /*font-family:"Passion One";*/
    /*color:#eee;*/
}
/*.header{
    border-bottom:solid 2px #444;
}
.header-fixed .header.header-fixed-shrink{
    box-shadow: 0 0 3px #444;
}*/
body.background1 .wrapper {
    background-image:url("/content/images/home-bg1.jpg");
    background-color: #000;
    background-attachment: fixed;
    background-repeat:repeat-y;
    background-position:center top;
    z-index: 1;
    position: relative;
}

.height-800 { 
    min-height: 800px !important;
}


/*attack-search*/
.attack-search .search-results{
    min-height:2000px;
}

.attack-search{
    background:rgba(0, 0, 0, 0.7);
    box-shadow:none;
    border-radius:12px;
    padding:30px;
}
.attack-search .page-nav-holder{
    margin-top:30px;
    padding:20px 0;
    border-top:1px solid #dedede;
}
.attack-search .result-category h2 .title{
    font-family:"Sigmar One";
    color: #cf9a2d;
}
.attack-search .search-result{
    /*background:#222;*/
    background:rgba(0, 0, 0, 0.8);
    padding:10px;
    border-radius:4px;
    margin-bottom:30px;
}

.attack-search .search-result .stars .fa-star{
    color:#eee;
}

.attack-search .search-result .stars .fa-star-o {
    color: #444;
}

.attack-search .search-result h4,
.attack-search .search-result h3{
    font-weight:600;

}
.attack-search .search-result ul{
    padding-left:0px;
    list-style:none;
}
.attack-search .results.badge{
    border-radius:4px;
}
.attack-search select[disabled]{
    color:#444;
}

.attack-search .version-info{
    background:rgba(0, 0, 0, 0.8);
    padding:10px;
    border-radius:4px;
}

#sidebar {
    min-width: 350px;
    max-width: 350px;
    width: 350px;
    height: 100vh;
    position: fixed;
    top: 0;
    left: -350px;
    /* top layer */
    z-index: 9999;
    background-color: #222;
    transition: all 0.3s;
    overflow-y: scroll; 
}
#sidebar.active{
    left:0;
}

#sidebar .sidebar-header h2{
    text-transform:uppercase;
    float:left;
}
#sidebar .panel-default{
    border:none;
}
#sidebar #hideFilter {
    border-color: #303030;
    background: #202020;
    color: #999;
}

#sidebar #hideFilter:hover {
    color: #fff;
    background: #444;
    border-color: #333;
}
.result-category button {
    border: 1px solid #cf9a2d;
}
.result-category button.selected {
    color: #cf9a2d;
    background-color: transparent;

}

.result-category .search-controls{
    float:right !important;
}

@media only screen and (max-width : 1199px), only screen and (max-device-width : 1199px) {
    .result-category .search-controls {
        float: left !important;
    }

}
.attack-search .thumbnail-search-results{
    overflow:hidden;
}
.attack-search .thumbnail-search-results .search-result .portfolio-box{
    margin-bottom:0px;
}



.attack-search .thumbnail-search-results .search-result .attack-link-holder {
    height:65px;
    overflow:hidden;
    margin-bottom:5px;
}

.attack-search .thumbnail-search-results .search-result a.attack-link {
    
}

.attack-search .thumbnail-search-results .search-result a.small {
    color:#999;
}
.attack-search .thumbnail-search-results .search-result a.small:hover {
    color: #eee;
}
.attack-search .thumbnail-search-results .search-result {
    float: left;
    overflow: hidden;

    width: 24.5%;
    margin: 5px 0.25% 5px 0.25%;
    height: 300px;
}

@media only screen and (max-width : 1199px), only screen and (max-device-width : 1199px) {
    .attack-search .thumbnail-search-results .search-result {
        width: 32.5%;
        margin: 5px 0.415% 5px 0.415%;
        height: 315px;
    }
}
@media only screen and (max-width : 991px), only screen and (max-device-width : 991px) {
    .attack-search .thumbnail-search-results .search-result {
        width: 49.5%;
        margin: 5px 0.25% 5px 0.25%;
        height:330px;
    }
}
@media only screen and (max-width : 767px), only screen and (max-device-width : 767px) {
    .attack-search .thumbnail-search-results .search-result {
        width: 99.5%;
        margin: 5px 0.25% 5px 0.25%;
        height: auto;
    }

    .attack-search .thumbnail-search-results .search-result .attack-link-holder {
        height: auto;
        margin-bottom:10px;
    }

}


/*attack-details*/
.attack-details{
    background:rgba(0, 0, 0, 0.7);
    box-shadow:none;
    border-radius:12px;
    padding:30px;
}
.attack-details #player{
    margin-left:auto;
    margin-right:auto;
    width:640px;
}
.attack-details .video-wrapper{
    position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.attack-details .video-wrapper iframe {
    position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.attack-details .attack-info{
    margin-top:20px;
    background:rgba(0, 0, 0, 0.8);
    padding:10px;
}
.attack-details .attack-info ul{
    padding-left:0px;
    list-style:none;
}
/*background mask*/
.background-mask::after{
    content:" ";
    left:0;
    bottom:0;
    width:100%;
    height:100%;
    z-index:-1;
    position:absolute;
}
.background-mask-30::after{
    background:rgba(0, 0, 0, 0.3);
}
.background-mask-40::after{
    background:rgba(0, 0, 0, 0.4);
}
.background-mask-50::after{
    background:rgba(0, 0, 0, 0.5);
}
.background-mask-60::after{
    background:rgba(0, 0, 0, 0.6);
}
.background-mask-70::after{
    background:rgba(0, 0, 0, 0.7);
}


.select2-container--default .select2-selection--multiple .select2-selection__rendered{
    padding:0 14px;
}

body.dark .select2-container--default .select2-selection--multiple {

    border: 1px solid #aaa;
    border-radius: 0px;
    cursor: text;

    color: #999;
    border-color: #303030;
    background: #202020;
}

/*body.dark .form-control {
    color: #999;
    border-color: #303030;
    background: #202020;
}*/

body.dark .header .navbar-nav > li > a, body.dark .header-v1 .navbar-default .navbar-nav > li > a, body.dark .header-v3 .navbar-default .navbar-nav > li > a {
    color: #bbb;
}
body.dark .header .navbar-nav > li.active > a, body.dark .header-v1 .navbar-default .navbar-nav > li > a, body.dark .header-v3 .navbar-default .navbar-nav > li > a {
    color: #cf9a2d;
}
body.dark .header .navbar-nav > li > a:hover{
    color: #cf9a2d;
}

/*ads*/
.bottom-ad{
    margin-top:30px;
}
.top-ad{
    margin-bottom:30px;
}

/*troop calculator*/
.troop-calculator #troop-select{
    margin-bottom:20px;
}
.troop-calculator #total{
    font-size:32px;
    font-weight:600;
    text-align:center;
    color:#cf9a2d;
    margin-bottom:15px;
}
.troop-calculator button{
    color: #888;
    background-color:transparent;
    border: solid 1px #888;
}
.troop-calculator button:hover{
    color:#fff;
    background-color:#cf9a2d;
    border: solid 1px #cf9a2d;
    transition: all 0.2s ease-in-out;
}
.troop-calculator td button{
    width:34px;
    height:34px;
    margin-left:2px;
    
}

.troop-calculator td.troop-name{
    font-size:18px;
    padding:0px;
    padding-left:10px;
    vertical-align:middle;
}
.troop-calculator td input{
    width:70px;
}
.troop-calculator td.buttons{
    text-align:right;
}
#socialLoginList button.btn.btn-default{
    border:none;
    color:#fff;
    padding:8px 14px;
}
#socialLoginList button.btn.btn-default.google {
    background-color:#DD4B39;
}
#socialLoginList button.btn.btn-default.facebook {
    background-color:#3B5998;
}
#socialLoginList button.btn.btn-default.twitter {
    background-color:#55ACEE;
}

.sky-form.contact-form label{
    display:inline-block;
}
.contact-form textarea{
    height:200px;
}
/*.form-group .rc-anchor-dark{
    border:1px solid #000 !important;
}*/
@media only screen and (max-width: 479px) {
    .attack-details {
        padding:30px 5px;
    }
    .attack-search {
        padding:30px 5px;
    }
    .attack-search .search-result {
        padding:5px;
    }
    .attack-search .result-category{
        text-align:center;
    }
    .attack-search .result-category .search-controls{
        float:none !important;
        margin-left:auto;
        margin-right:auto;
    }
    .attack-search .result-category h2 .title::after {
        content: "";
        display: block;
    }
    .copyright p, .copyright .footer-socials {
        text-align:center;
    }
    .copyright .copy::after {
        content: "";
        display: block;
    }
}

.attack-screenshots #ytvideo{
    margin:20px;
}
.attack-screenshots #ytvideo video, .attack-screenshots canvas {
    width: 100%;
    max-width: 1920px;
    height: auto;
}
