/* CSS Document */
*
{
    /*  color: #100a0b;*/
}

.page-wrap
{
    padding-top: 0 !important;

    background-color: #1b0000;
}

.content-wrapper
{
    background-color: #1b0000  !important;
}

.container
{
    /*width:1345px !important;
    padding-left:15px !important;
    margin:0 !important;*/
}

h2
{
    color: #843426 !important;
}

.dc_chart
{
    font-size: 11px;

    width: 100%;
    height: 500px;
}

.dc_main_greeting
{
    font-size: 1.1em !important;

    display: inline-block;

    width: 100%;
    margin-right: 5px;
    margin-bottom: 10px;

    text-align: left;
    vertical-align: middle;

    color: #843426;
    
            border-radius: 4px;
}


.dc_point
{
    cursor: pointer;
}

.dc_ib
{
    display: inline-block;
}

.dc_fl
{
    float: left;
}


.dc_fr
{
    float: right;
}

.dc_card
{
    overflow: hidden;

    width: 228px;
    height: 320px;

    transition-duration: 200ms;
    transition-property: filter;
    text-align: center;

    filter: saturate(.9);
}

.dc_cardimg
{
    width: 228px !important;

    border-radius: 5%;
}

.dc_card:hover
{
    filter: saturate(1.5);
}

.dc_exppic
{
    line-height: 27px;

    color: #fff;
}

.dc_manacostsmall
{
    line-height: 15px !important;

    width: 15px !important;
    height: 15px !important;

    vertical-align: middle !important;
}

.dc_manacost
{
    font-weight: bold;
    line-height: 33px;

    display: inline-block;

    width: 33px;
    height: 33px;
    margin-left: 2px;

    text-align: center;
    vertical-align: top;

    color: #120c0e;
    border-radius: 50%;
    background-color: #cbc2c0;
}

.dc_statval_small
{
    position: relative;
    top: -38px;
    left: 5px;

    color: #f7f7f3;
}

#mainout
{
    color: #9f9f9f !important;
}

.dc_fltrtype
{
    padding-top: 8px;
}

.dc_expbars
{
    display: inline-block;

    margin-right: 7px;
    margin-bottom: -4px !important;
}

.dc_statgroup
{
    display: inline-block;

    margin-right: 7px;

    vertical-align: top;
}

.dc_baractive
{
    line-height: 30px;

    position: relative;
    top: 0;
    left: 0;

    display: inline-block;
    overflow: hidden;

    width: 0;
    height: 31px;
    padding-left: 10px;

    text-align: left;
}



.dc_bars
{
    overflow: hidden;

    width: 250px;
    height: 31px;
    margin-bottom: 4px;
    padding: 0 !important;

    
            border-radius: 4px;
    background-color: #9a8f8c;
}

.dc_oncard
{
    position: relative;
    top: -21px;
    left: 0;
}

.dc_wconcard
{
    position: relative;
    top: -28px;
    left: 0;
}


.dc_barcard
{
    float: left;

    margin-top: 1px;
    margin-left: 6px;

    opacity: .8;
}

.dc_baractivecards
{
    line-height: 20px;

    position: relative;
    top: 0;
    left: 0;

    display: inline-block;
    overflow: hidden;

    width: 0;
    height: 20px;
    padding-left: 10px;

    text-align: left;
}

.dc_barscards
{
    overflow: hidden;

    width: 180px;
    height: 20px;
    margin-bottom: 4px;
    padding: 0 !important;

    text-align: left;

    border: solid 1px #9a0e11;
    
            border-radius: 4px;
    background-color: #4a4543;
}

.dc_statval_small_cards
{
    position: relative;
    top: -33px;
    left: 5px;

    color: #f7f7f3;
}


.dc_barspad
{
    overflow: hidden;

    width: 250px;
    height: 31px;
    margin-bottom: 4px;
    padding-left: 10px;

    border: solid 1px #a88f87;
    
            border-radius: 4px;
}


div#fraction
{
    display: inline-block;
    overflow: hidden;

    width: 250px;
    margin-right: 3px;

    text-align: center;
    vertical-align: top;
}

.dc_attr_f
{
    width: 60px;
}





.dc_lnkinput
{
    width: 350px !important;
    height: 30px !important;
    padding: 2px !important;

    cursor: pointer;
}

.dc_gs
{
    transition-duration: 200ms;
    transition-property: filter,opacity;

    filter: brightness(.7);
}

.dc_gs:hover
{
    filter: brightness(.9);
}

.dc_old
{
    filter: sepia(90%);
}

.dc_arrows
{
    line-height: 414px;

    display: inline-block;

    height: 414px;
}

.dc_attr_r
{
    width: 30px;
}

.dc_attr_c
{
    width: 32px;
}


.dc_noresults
{
    font-size: 2em;
    font-weight: bolder;
    line-height: 300px;

    width: 100%;
    height: 300px;

    text-align: center;
    vertical-align: middle;

    color: #b3b3b3;
}

.dc_clsselico
{
    position: relative;
    top: 12px;
    left: 125px;
}

.dc_token
{
    font-size: 1.3em !important;
    font-weight: bold !important;

    cursor: pointer;
    text-align: center;
}

.dc_widebutton
{
    overflow: hidden;

    width: 200px !important;
    height: 56px !important;

    vertical-align: middle !important;
}

.dc_tournmenubutton
{
    width: 140px;
    margin: 4px;
    padding: 4px;

    transition-duration: 200ms;
    transition-property: background-color,color;
    text-align: center;

    color: #100a0b;
    border: solid 1px #a88f87;
    
            border-radius: 4px;
    background-color: #9f9f9f;
}

.dc_lnkinput
{
    width: 350px !important;
    height: 30px !important;
    padding: 2px !important;

    cursor: pointer;
}

#statout
{
    padding: 10px;

    border-radius: 4px;
    background-color: #9f9f9f;
}

.dc_sharer
{
    margin: 10px 0;
}

div#filters
{
    height: 124px;
    margin-bottom: 2px;
    margin-bottom: 5px;
    padding: 2px;

    text-align: center;
    vertical-align: top;

    border-radius: 4px;
    background-color: #36221e !important;
}


.dc_op1 a
{
    background-color: #592d0a !important;
}

.dc_op2 a
{
    background-color: #703010 !important;
}

.dc_op3 a
{
    background-color: #7f3612 !important;
}

.dc_op4 a
{
    background-color: #913612 !important;
}

.dc_op5 a
{
    background-color: #a33612 !important;
}

.dc_op6 a
{
    color: #36221e !important;
    background-color: #b63612 !important;
}

.dc_op7 a
{
    color: #36221e !important;
    background-color: #c83612 !important;
}

.dc_op8 a
{
    color: #36221e !important;
    background-color: #da4812 !important;
}

.dc_op9 a
{
    color: #36221e !important;
    background-color: #ec4812 !important;
}

.dc_op10 a
{
    color: #36221e !important;
    background-color: #ff4812 !important;
}


.dc_selectedcards
{
    float: right;

    margin-right: 5px;

    color: #9a0e11;
    border: solid 1px #9a0e11 !important;
}

.dc_smrtsrch
{
    width: 250px !important;
    height: 28px !important;
    margin-bottom: 1px !important;

    color: #9f9f9f !important;
    border-radius: 4px !important;
    background-color: #36221e !important;
}

.dc_round
{
    -webkit-border-radius: 30%;
            border-radius: 30%;
}

.dc_timeoutinfo
{
    margin: 10px 0;
    padding: 20px 10px;

    text-align: center;

    color: #9f9f9f;
    
            border-radius: 4px;
    background-color: #36221e!important;
}

#historyfltr,
#smartsrchfltr
{
    padding-left: 5px;

    cursor: text;

    border: 1px solid #aaa;
    border-radius: 4px;
}

.select2-selection
{
    overflow: hidden;

    height: 58px;

    color: #9f9f9f !important;
    background-color: #36221e !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered
{
    color: #9f9f9f !important;
}

.dc_roundnum
{
    font-size: 16px;
    font-weight: bold;
    line-height: 19px;

    width: 21px;
    height: 21px;

    text-align: center;

    border: solid 1px #a88f87;
    background-color: #eeece7;
}


div#controls
{
    width: 150px;
    height: 117px;

    vertical-align: top;
}

.dc_saverhalf
{
    width: 74px !important;
    margin-right: 1px;
}


.dc_saver
{
    font-size: .8em;
    line-height: 28px;

    width: 150px;
    height: 28px;
    margin-bottom: 1px;

    text-align: center;

    color: #100a0b;
    border: solid 1px #a88f87;
    
            border-radius: 4px;
    background-color: #9f9f9f;
}

div#attribute
{
    display: inline-block;
    overflow: hidden;

    width: 260px;
    margin-right: 3px;

    text-align: center;
    vertical-align: top;
}

div#type
{
    width: 250px;
    height: 117px;
    margin-right: 5px;
    margin-left: 5px;

    vertical-align: top;
}

div#cost
{
    overflow: hidden;

    width: 132px;
    height: 116px;
    margin-right: 3px;
    padding-top: 5px;
}

div#kw
{
    width: 250px;
    height: 117px;
    margin-right: 3px;

    vertical-align: top;
}

div#sort
{
    overflow: hidden;

    width: 70px;
    height: 116px;
    margin-right: 3px;
}

div#cardname
{
    display: none;
    float: left;

    width: 65%;
    height: 116px;
    margin-right: 3px;
}

div#goback
{
    display: none;
    float: right;

    width: 132px;
    height: 116px;
    margin-right: 3px;
    padding-top: 5px;
}

.dc_srt
{
    width: 33px;
    height: 60px;
    padding-right: 2px;
}

.dc_srt:hover
{
    filter: grayscale(0);
}

.dc_page
{
    font-size: 12px;
    line-height: 15px;

    width: 17px;
    height: 17px;
    margin-right: 4px;
    padding: 2px;

    transition-duration: 200ms;
    transition-property: background-color, color;
    text-align: center;

    color: #f7f7f3;
    
            border-radius: 4px;
    background-color: #36221e;
}

.dc_page:hover
{
    color: #36221e;
    background-color: #f7f7f3;
}

.dc_page:active
{
    color: #000;
    background-color: #fff;
}

.dc_progress
{
    display: inline-block;
    overflow: hidden;

    width: 300px;
    height: 23px;
    margin-left: 1px;

    border: solid 1px #a88f87;
    
            border-radius: 4px;;
}

.dc_progressbar
{
    font-size: .85em;
    line-height: 21px;

    display: inline-block;

    height: 27px;
    padding-left: 5px;

    text-align: left;
    vertical-align: middle;
    white-space: nowrap;

    color: #000;
    
            border-radius: 4px;
    background-color: #9f9f9f;
}


.dc_dhead
{
    line-height: 25px;

    width: 230px;
    height: 25px;

    color: #100a0b;
    background-color: #a88f87;
}

.dc_drow
{
    line-height: 25px;

    display: table-row;

    height: 25px;
}

.dc_cell
{
    display: table-cell;

    padding: 5px;

    border-bottom: solid 1px #a88f87;
}

.dc_al
{
    text-align: left;
}

.dc_ar
{
    text-align: right;
}

.dc_attr_kw
{
    display: inline-block;

    margin: 2px;
    padding: 2px 3px;

    transition-duration: 200ms;
    transition-property: background-color;
    text-align: center;

    color: #100a0b;
    border: solid 1px #a88f87;
    
            border-radius: 4px;
    background-color: #9f9f9f;
}

.dc_attr_kw:hover
{
    background-color: #f7f7f3;
}

.dc_pageout
{
    text-align: center;
}



.dc_costnum
{
    font-size: 12px;
    font-weight: bold;
    line-height: 21px;

    width: 21px;
    height: 21px;

    text-align: center;

    border: solid 1px #a88f87;
    background-color: #eeece7;
}




div#right
{
    width: 220px;
    margin-left: 3px;
}


div#main
{
    clear: both;
}

.dc_margleft
{
    margin-left: 220px;
}


div#left
{
    width: 100%;
    margin: 5px 0;
    margin-bottom: 2px;
    padding: 5px;

    text-align: center;
    vertical-align: top;

    border: solid 1px #36221e;
    border-radius: 4px;
    background-color: #f7f7f3;
}


div#wrap
{
    margin: auto;
}

.dc_bighalf
{
    display: inline-block;

    width: 50%;
    padding: 10px;

    text-align: center;
    vertical-align: top;
}

.dc_fullwidth
{
    width: 100%;
    padding: 10px;
    /*  text-align: left !important;*/
}

.dc_lightup
{
    filter: invert(100%) !important;
}

div#statsmain
{
    font-weight: bold;

    margin-bottom: 4px;
}



div#bottom
{
    clear: both;

    color: #100a0b !important;
}


.dc_hlp
{
    position: relative;

    height: 220px !important;
}

div#help
{
    padding: 30px;
}

.dc_attrimg
{
    width: 50px;
}

div#crst
{
    float: right;

    margin-right: 10px;
}


.dc_spinner
{
    position: relative;

    width: 40px;
    height: 40px;
    margin: 100px auto;

    -webkit-animation: sk-rotate 2.0s infinite linear;
            animation: sk-rotate 2.0s infinite linear;
    text-align: center;
}

.dc_dot1,
.dc_dot2
{
    position: absolute;
    top: 0;

    display: inline-block;

    width: 60%;
    height: 60%;

    -webkit-animation: sk-bounce 2.0s infinite ease-in-out;
            animation: sk-bounce 2.0s infinite ease-in-out;

    border-radius: 100%;
    background-color: #333;
}

.dc_dot2
{
    top: auto;
    bottom: 0;

    -webkit-animation-delay: -1.0s;
            animation-delay: -1.0s;
}

.dc_deck_main
{
    display: inline-block;

    width: 32%;
    margin-right: 14px;
    margin-bottom: 5px;
    padding: 2px;

    text-align: left !important;
    vertical-align: middle;

    border: solid 1px #36221e;
    
            border-radius: 4px;
    background-color: #f7f7f3;
}

.dc_deckpar
{
    display: inline-block;

    margin-right: 5px;

    text-align: center;
    vertical-align: middle;
}

.dc_stat_decks
{
    font-size: 10px;
    line-height: 20px;

    display: inline-block;

    width: 57px;
    height: 20px;
    margin-left: 2px;

    transition-duration: 200ms;
    transition-property: background-color;
    text-align: center;

    color: #100a0b;
    border: solid 1px #a88f87;
    
            border-radius: 4px;
    background-color: #9f9f9f;
}

.dc_stat:hover
{
    background-color: #f7f7f3;
}

.dc_statval
{
    font-size: 12px;
    font-weight: bold;

    display: inline;

    color: #9a0e11;
}

.dc_curve
{
    float: left;

    width: 5px;
    height: 40px;
    margin-left: 1px;

    background-color: #100a0b;
}


.dc_curveactive
{
    text-align: center;
    vertical-align: bottom;

    background-color: #9f9f9f;
}

div#pagination
{
    margin-top: 10px;
    margin-bottom: 10px;
}


.dc_selpag
{
    font-weight: bold !important;

    color: #36221e !important;
    border: solid 1px #36221e;
    background-color: #f7f7f3 !important;
}

.dc_page
{
    font-size: 14px;
    line-height: 30px;

    width: 30px;
    height: 30px;
    margin-right: 4px;
    padding: 1px;

    transition-duration: 200ms;
    transition-property: background-color, color;
    text-align: center;

    color: #f7f7f3;
    border: solid 1px #36221e;
    
            border-radius: 4px;
    background-color: #36221e;
}

.dc_page:hover
{
    color: #36221e;
    border: solid 1px #36221e;
    background-color: #f7f7f3;
}

.dc_page:active
{
    color: #000;
    border: solid 1px #000;
    background-color: #fff;
}

.dc_nerf
{
    margin: 25px;

    border: solid 1px #36221e;
    
            border-radius: 4px;
    background-color: #f7f7f3;
}

.dc_deckname
{
    display: inline-flex;
    overflow: hidden;

    width: 200px;

    white-space: nowrap;
}

@-webkit-keyframes sk-rotate
{
    100%
    {
        -webkit-transform: rotate(360deg);
    }
}
@keyframes sk-rotate
{
    100%
    {
        -webkit-transform: rotate(360deg);
                transform: rotate(360deg);;
    }
}

@-webkit-keyframes sk-bounce
{
    0%,
    100%
    {
        -webkit-transform: scale(.0);
    }
    50%
    {
        -webkit-transform: scale(1.0);
    }
}

@keyframes sk-bounce
{
    0%,
    100%
    {
        -webkit-transform: scale(.0);
                transform: scale(.0);
    } 50%
    {
        -webkit-transform: scale(1.0);
                transform: scale(1.0);
    }
}


@media only screen and (max-width: 1200px)
{
    div#cardname
    {
        width: 52% !important;
    }

    div#left
    {
        height: auto;
    }

    div#kw
    {
        font-size: .9em;

        overflow: auto;

        width: 270px;
        height: 117px;
        margin-right: 3px;
    }

    .dc_deck_main
    {
        width: 48%;
        margin-right: 9px;
        margin-bottom: 5px;
        padding: 2px;

        vertical-align: middle;

        border: solid 1px #36221e;
        
                border-radius: 4px;
        background-color: #f7f7f3;
    }

    .dc_attr_f
    {
        width: 55px;
    }

    #fraction
    {
        width: 230px !important;
    }
}

@media only screen and (max-width: 1000px)
{
    .dc_bighalf
    {
        width: 100%;
    }

    .dc_progress
    {
        width: 100%;
    }

    .dc_fltrtype
    {
        padding-top: 0;
        padding-bottom: 10px;
    }

    .dc_titlecell
    {
        width: 10%;
    }


    div#adviser
    {
        width: 100%;
    }

    div#statistics
    {
        width: 100%;
    }

    .dc_stat
    {
        width: 207px !important;
    }

    .dc_attrimg
    {
        width: 30px;
    }

    .dc_attr_f
    {
        width: 30px;
    }

    div#attribute
    {
        width: 90px;
    }

    .dc_deck_main
    {
        float: left;

        width: 100%;
        margin-bottom: 5px;
        padding: 2px;

        vertical-align: middle;

        border: solid 1px #36221e;
        
                border-radius: 4px;
        background-color: #f7f7f3;
    }

    .dc_attr_f
    {
        width: 55px;
    }

    #fraction
    {
        width: 230px !important;
    }

    .dc_smrtsrch,
    #type,
    #kw
    {
        width: 155px !important;
    }
}

@media only screen and (max-width: 750px)
{
    div#goback
    {
        display: none;

        width: 100%;
        height: 50px;
        margin-right: 3px;
        padding-top: 5px;

        text-align: center;
        white-space: nowrap;
    }

    div#sort
    {
        width: 146px;
        height: 60px;
        margin-right: 3px;
    }

    div#kw
    {
        width: 200px;
    }

    .dc_attr_kw
    {
        font-size: .8em;
    }

    div#cardname
    {
        width: 70% !important;
    }

    div#cardname > h1
    {
        font-size: 2em !important;
    }
}
