
/* (C)2025 wind */

/* ------------------------------------ */
/* --------- START -------------------- */
/* ------------------------------------ */

* {
    font-size: 0.92rem;
    /* color: #1E434C; */
    /* color       : #888888; /*A9A9A9; */
} 

body { margin:0; padding: 0; color: #232;  }

.wrapper_all { 
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 1rem;
}
  

.border { border: 1px solid grey; }
.bold { font-weight: 700; }
a { font-size: 0.84rem; }

a.strikethrough {
    text-decoration: line-through;
}

.debug { 
    font-size: 0.85rem;
}


/* ------------------------------------ */
/* --------- WIDTH -------------------- */
/* ------------------------------------ */

.box100 { width: 22rem; }
.box101{ width: 22.1rem; } 
.grid-row, .single_row, .grid-row_result, .exitbox { width: 22rem; }

.box_cal_week { width: 22rem; }
/* .box_cal_week { width: 21.4rem; } */
.cur_players, .for_players { width: 21.2rem; }


/* ------------------------------------------------ */
/* --------- h1 first box player Name ------------- */
/* ------------------------------------------------ */
h1 {
    display: flex;
    flex-direction: column;
    align-content: center;
    justify-content: center;
    margin:0;
    border: 1px solid #CCC;
    background-color: #FCFCEB;
    color: #343;
    text-align: center;

}

.history {
    font-weight: 900;
    font-size: 0.9rem;
    padding-top: 1.8rem;
    padding-bottom: 0.7rem;
}

.playerName {
    font-weight: 900;
    font-size: 1.4rem;
    padding-bottom: 1.5rem;
}


/* ------------------------------------------------ */
/* --------- NAVBOX ------------------------------- */
/* ------------------------------------------------ */

.navbox { 
    width: 22rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    border: 1px solid #CCC;
    border-top: 0;
    color: #3B5B5C;
    background-color: #FCFCEB;
    font-size: 0.88rem;

    a {
        font-size: 0.88rem;
    }

}




/* ------------------------------------------------ */
/* --------- DROPDOWNS ---------------------------- */
/* ------------------------------------------------ */


.cur_players { 
    padding: 0.4rem;
    border-top: 0;
    border-bottom: 0;
    color: #3B5B5C;
}

.for_players { 
    padding: 0.4rem;
    border-top:0;
    color: #3B5B5C;
    text-align: left;
    font-size: 0.88rem;
}

.select_notice {
    padding-bottom: 0.3rem;
    padding-left: 0.2rem;
    font-size: 0.88rem;
}

.select_notice_off {
    padding-bottom: 0.3rem;
    padding-left: 0.2rem;
    font-size: 0.88rem;
    color: #999;
}

form.select {
    width: 3rem;

}

.select {
    width: 3rem;

}

.choose_player {
    width: 10rem;
    font-size: 0.88rem;

}

.choose_player_off {
    width: 10rem;
    font-size: 0.88rem;
    color: #999;

}



/* ------------------------------------------------ */
/* --------- last update -------------------------- */
/* ------------------------------------------------ */


.last_update { 
    padding: 0.4rem;
    width: 70%;
    border: 1px solid #CCC;
    border-top:0;
    color: #3B5B5C;
    text-align: left;
    color: #888; 
    font-size: 0.8rem;

}

.box_B { 
    padding: 0.4rem;
    width: 50%;
    border: 1px solid #CCC;
    border-top:0;
    border-left: 0;
    color: #3B5B5C;
    text-align: right;
    color: #888; 
    font-size: 0.8rem;

    a { font-size: 0.78rem; }
}

/* ------------------------------------------------ */
/* --------- WEEK COUNTER ------------------------- */
/* ------------------------------------------------ */

.box_cal_week {
    display: flex; 
    flex-direction: row; 
    align-items: center;
    justify-content: center;
    padding: 0.6rem 0rem; 
    border: 1px solid #CCC;
    border-top:0;
    background-color: #F6F7C455;
    
    .img_back {
        width: 15px;
        height: 15px; 
        margin: 0;
        padding: 0;
        margin-top: 0.3rem;
        opacity: 80%;
    }
    
    .current {
        text-align: center;
        font-weight: 700;
        color: #d23600;
        padding-left: 0.5rem; 
        padding-right: 0.5rem;
        font-size: 1rem;
    }

    .cal_week_plain {
        color: #444;
        padding-left: 0.7rem; 
        padding-right: 0.7rem; 
    }
    
    .forward {
        margin: 0;
        padding: 0;
    }
    
    .img_forward {
        width: 15px;
        height: 15px; 
        margin: 0;
        padding: 0;
        margin-top: 0.3rem;
        opacity: 80%;
    }
}


/* ------------------------------------------ */
/* ------ grid definitions ------------------ */
/* ------------------------------------------ */


.grid-row {
    display: grid;
    grid-template-columns: 2rem 2rem 2rem 2rem 2rem 2rem 2rem 4rem 4rem;
    grid-gap: 0;
    align-content: center;
    line-height: 1.5rem; 
}

.grid-row_result {
    display: grid;
    grid-template-columns: 14rem 4rem 4rem;
    grid-gap: 0;
    align-content: center;
    line-height: 1.5rem; 
}


/* -------------------------------- */
/* ------ GENERAL ----------------- */
/* -------------------------------- */

.spacer {
    margin:0;
    padding:0;
    margin-bottom: 0.5rem;
}
  

.name, .name_epic, 
.nr_epic_kills, .single_points_epic,
.sum_of_chests, .sum_of_points, 
.sum_of_chests_heroics, .sum_of_points_heroics,
.name_level, .level
{
    font-size: 0.8rem;
}

.sum_of_chests_header {
    padding: 0;
    padding-bottom: 0.05rem;
    border: 0;
    border-left: 0px solid #CCC;
    border-bottom: 1px solid black;
    text-align: center;
    font-size: 0.79rem;

}

.sum_of_points_header {
    padding: 0;
    padding-bottom: 0.05rem;
    border: 0;
    border-bottom: 1px solid black;
    text-align: center;
    font-size: 0.79rem;
    
}


.highlight {
    font-weight: 700;
    color: #0070C0; 
}

.exitbox { 
    height: 5rem;
    padding-top: 1rem;
    border: 1px solid #CCC;
    border-top:0;
    text-align:center;
    line-height: 1.35rem;
 }


.level {
    border: 0;
    border-right: 1px solid #999;
    border: 1px solid black;
    border-top: 0;
    border-left: 0;
    text-align: center;
}

.sum_of_chests {
    border: 0;
    text-align: center;
    border-left: 0px solid #ccc; 
    color: #777;
}

.sum_of_points {
    border: 0;
    text-align: center;
    color: #d23600;
    color: #777;
    font-weight: 600;
    background-color: #FFFFCC;
    border-left: 1px solid #CCC;
    border-right: 1px solid #CCC;
} 

.sum_of_chests_sum {
    margin-top: -1px;
    border: 0;
    border-top: 1px solid black;
    text-align: center;
    font-weight: 600;
    font-size: 0.80rem;
    color: #777;
    
}

.sum_of_points_sum {
    margin-top: -1px;
    border: 0;
    border-top: 1px solid black;
    text-align: center;
    font-weight: 600;
    font-size: 0.80rem;
    color: #777;

} 

.sum_legend {
    padding-right: 0.4rem;
    border: 0;
    font-size: 0.88rem;
    text-align: right;
}

.sum_legend_epics {
    margin-top: -1px;
    padding-right: 0.4rem;
    border: 0;
    border-top: 1px solid black;
    font-size: 0.88rem;
    text-align: right;
}

.last_row { 
    border-top: 1px solid #333;
    margin-top: -2px;
 }

 .height1 {
    height: 2px;
    font-size: 0;
    line-height: 0;
    padding-bottom: 0.4rem;
 }


.legend_bottom {
    justify-content: flex-start;
    align-items: center;
    padding-right: 0.5rem;
    /* font-family: "Rosario", sans-serif; */
    text-align: left;
    font-style: italic;
    font-size: 0.8rem;
    color: #555;
}


.wind {
    padding-top: 0.4rem;
    padding-right: 0.5rem;
    font-size: 0.79rem;
    font-style: italic;
    text-align: right;
    color: #555;
}

/* -------------------------------- */
/* ------ EPICs ------------------- */
/* -------------------------------- */

.header_epics {
    grid-column: 1 / span 3;
    /* border: 1px solid grey; */
    padding-left: 0.4rem;
    border-bottom: 1px solid black;  
    font-family: "Rosario", sans-serif;
    font-variant: small-caps;
    font-weight: 700;
    text-align: left;
}

.header_epics_add {  /* "kills" */
    grid-column: 4 / span 4;
    border-bottom: 1px solid black; 
    padding-right: 0.5rem; 
    text-align: right;
    font-size: 0.79rem;
    color: #D23600;
    font-weight: 600;
}


.name_epic {
    grid-column: 1 / span 5;
    padding-left: 0.4rem;
}

.nr_epic_kills {
    padding-right: 0.4rem;
    text-align: left;
    color: #D23600; 
    font-weight: 700;
    
}

.nr_epic_kills_zoom {
    padding-right: 0.4rem;
    text-align: left;
    color: #D23600; 
    font-weight: 700;
    font-size: 1.1rem;
    
}

.single_points_epic {
    border: 0;
    text-align: left;
    color: #0070C0;
    font-size: 0.75rem;
    padding-top: 0.06rem;
}






/* -------------------------------- */
/* ------ CLAN -------------------- */
/* -------------------------------- */

.header_clan {
    grid-column: 1 / span 3;
    display: flex;
    flex-direction:row;
    align-items: flex-end;
    margin:0;
    padding-bottom: 0.18rem;
    padding-left: 0.4rem;
    line-height: 1rem;
    border-bottom: 1px solid black;  
    font-family: "Rosario", sans-serif;
    font-variant: small-caps;
    font-weight: 700;
    text-align: left; 
}


.clear_clan {
    grid-column: 1 / span 3;
}

.level_clanheader {
    padding: 0;
    border: 1px solid black;
    border-left: 0;
    text-align: center;
    font-weight: bold;
}



.legend_clan {
    padding-right: 0.5rem;
    font-size: 0.79rem;
    font-style: italic;
    text-align: right;
    color: #555;
}


/* -------------------------------- */
/* ------ CRYPTs ------------------ */
/* -------------------------------- */
.header_crypts {
    /* border: 1px solid grey; */

    display: flex;
    flex-direction:row;
    align-items: flex-end;
    margin:0;
    padding-bottom: 0.18rem;
    padding-left: 0.4rem;
    line-height: 1rem;
    border-bottom: 1px solid black;  
    font-family: "Rosario", sans-serif;
    font-variant: small-caps;
    font-weight: 700;
    text-align: left; 
}


.level_crypts {
    padding-top: 0.1rem;
    padding-bottom: 0.1rem;

    border: 1px solid black;
    border-left: 0;
    border-top: 0;
    font-size: 0.8rem;
    text-align: center;
    font-weight: 700;

}

.legend_crypts {
    padding-top: 0.3rem;
    padding-left: 0.4rem;
    padding-bottom: 0.4rem;
    border-bottom: 1px solid black;

    font-size: 0.79rem;
    font-style: italic;
    text-align: left;
    color: #555;
}

/* -------------------------------- */
/* ------ BANK -------------------- */
/* -------------------------------- */



.header_bank {
    /* border: 1px solid grey; */
    flex: 1;
    display: flex;
    flex-direction:row;
    align-items: flex-end;
    margin:0;
    padding-bottom: 0.25rem;
    padding-left: 0.4rem;
    line-height: 1rem;
    border-bottom: 1px solid black;  
    font-family: "Rosario", sans-serif;
    font-variant: small-caps;
    font-weight: 700;
    text-align: left; 
}


.header_bank_add {
    width: 4rem;
    padding-bottom: 0.1rem;
    border-bottom: 1px solid black;
    font-size: 0.79rem;
    /* font-style: italic; */
    text-align: center;
    color: #0070C0;
}

.level_bankheader {
    padding: 0;
    border-left: 1px solid black;
    border-bottom: 1px solid black;
    text-align: center;
    font-weight: 700;
    font-size: 0.8rem;
}


.singlepoints_bank {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 0.1rem;
    padding-bottom: 0.1rem;
    /* border-bottom: 1px solid black; */
    font-size: 0.79rem;
    color: #0070C0;
}


.level_bank {
    padding: 0;
    border-left: 1px solid black;
    border-bottom: 1px solid black;
    text-align: center;
    font-size: 0.79rem;

}

.legend_bank_top {
    grid-column: 8 / span 2;
    font-size: 0.79rem;
    font-style: italic;
    text-align: center;
    color: #0070C0;
}


.legend_bank {
    padding-top: 0.2rem;
    padding-right: 0.5rem;
    font-size: 0.79rem;
    font-style: italic;
    text-align: right;
    color: #555;
}


/* -------------------------------- */
/* ------ HEROICs ----------------- */
/* -------------------------------- */


.level_heroheader {
    padding: 0;
    border-left: 1px solid black;
    border-bottom: 1px solid black;
    text-align: center;
    font-weight: 700;
    font-size: 0.8rem;
}


.level_hero {
    padding: 0;
    border-left: 1px solid black;
    border-bottom: 1px solid black;
    text-align: center;
    font-size: 0.79rem;
    font-weight: 700;
}





.hero_inbetween_thingy {
    border-bottom: 1px solid #CCC;
}

.hero_inbetween_thingy2 {
    border-bottom: 1px solid #CCC;
    border-left: 0;
}


.sum_of_chests_heroics {
    border: 0;
    border-right: 1px solid #CCC;
    border-bottom: 1px solid #CCC;
    text-align: center;
    color: #777;
}

.sum_of_points_heroics {
    border: 0;
    border-right: 1px solid #CCC;
    border-bottom: 1px solid #CCC;
    text-align: center;
    color: #777;
    font-weight: 600;
    background-color: #FFFFCC;
    
} 


.legend_hero {
    padding-top: 0.4rem;
    padding-right: 0.5rem;
    font-size: 0.79rem;
    font-style: italic;
    text-align: right;
    color: #555;
}





/* -------------------------------- */
/* ------ border corrections ------ */
/* -------------------------------- */

.start {
    border-left: 1px solid black;
}

.start_off {
    border-left: 0;
}

.stop {
    border-right: 0;
}

.stop_hero {
    border-right: 1px solid black;
}



