@font-face {
    font-family: "DueDate";
    src: url('/_fonts/DueDate.ttf');
}

html,
body.Boardgames.CombatCommanderBodyClass, .mainBodyWrapper {
    background-color: rgb(156,144,86) !important;
    color: rgb(240,240,205);
  /*  box-shadow: -3px 0 2px 1px rgb(240,240,205);  */  /* -3px 0 2px 1px rgb(180,215,255) original light blue */
  /* NOTE not sure what box-shadow was for   ..   2020-04-12  */
}

.Boardgames.CombatCommanderBodyClass header, .Boardgames.CombatCommanderBodyClass footer, .Boardgames.CombatCommanderBodyClass .pageBlurb, .Boardgames.CombatCommanderBodyClass img, .Boardgames.CombatCommanderBodyClass .mainContentSection, .Boardgames.CombatCommanderBodyClass hr {
    border-color: rgb(240,240,205);
}

.Boardgames.CombatCommanderBodyClass div.banner span.BannerColorBar {
    /*background: linear-gradient(to bottom, rgb(61, 68, 47) 0%,rgb(108, 142, 48) 40%,rgb(108, 142, 48) 60%,rgb(61, 68, 47) 100%);*/
    background: linear-gradient(to bottom, rgb(90,99,36) 0%,rgb(144, 160, 54) 40%,rgb(144, 160, 54) 60%,rgb(90,99,36) 100%);
    box-shadow: 0px 0px 10px 5px rgb(240,240,205);
}


.Boardgames.CombatCommanderBodyClass #HeaderMenuButton {
    background-color: rgb(196, 39, 2);
    background: radial-gradient(ellipse at bottom right, rgb(245, 45, 35) 0%,rgb(218, 41, 28) 0%,rgb(196, 39, 2) 25%,rgb(130, 20, 0) 100%);
    color: white;
    box-shadow: 0 0 8px 3px rgb(240,240,205);
    border: none;
    outline: 0;
}

.pageBlurb h2 {
    color: rgb(245,245,240);
}


.CC_CoreSets_outer_wrapper {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
    /*margin-bottom: 750px;*/
    /*text-align:center; works, but doesn't look good (Core Sets h1) floated divs unaffected */
    /*   margin-bottom: 25px;
    display: inline-block;  with default of block, the floated accordion divs drop out of the outer wrapper div */
}

#CombatCommanderContentID h3.core-sets-h3 {
	font-size: 1.875rem;
    font-family: duedate;
/*     font-weight: 100; */
/*     text-transform: uppercase; */
}



#CombatCommanderContentID h3.core-sets-h3::first-letter {
  font-size: 2.25rem;
}


/*.CC_CoreSetsAccordionDivsWrapper
{padding:0;
}*/


.CC_CoreSetsAccordionDivs {
    text-align: center;
    background-color: rgb(61, 68, 47);
    border-width: 5px;
    border-color: rgb(240,240,205);
    width: 360px;
    margin: 10px 3px;
    font-size: .9em;
}

@media(max-width: 320px) {
    .CC_CoreSetsAccordionDivs {
        width: 310px;
    }
}

@media(min-width: 321px) and (max-width: 360px) {
    .CC_CoreSetsAccordionDivs {
        width: 320px;
    }
}

@media(min-width: 361px) and (max-width: 375px) {
    .CC_CoreSetsAccordionDivs {
        width: 340px;
    }
}


.auto-style1 /*BoxCover Art*/ {
    width: 250px;
    height: 336px;
}

.CC_CoreSetsAccordionDivs img {
    margin: 30px 0 0 0;
}


@media (max-width:767px) {
    .CC_CoreSetsAccordionDivs {
        margin-top: 20px;
        margin-bottom: 20px;
    }
}

.CC_CoreSetsAccordionDivs h3 {
    background-color: rgb(134, 150, 46); /*108, 142, 48*/
    font-family: duedate;
    font-weight: 100;
    font-size: 1.8em;
    color: rgb(240,240,205);
    border-bottom-color: rgb(156,144,86); /*160, 102, 82*/
    border-top-color: rgb(156,144,86);
    border-top-width: 5px;
    border-bottom-width: 5px;
}

.CC_CoreSetsAccordionDivs .accordionHeader,
.CC_CoreSetsAccordionDivs .accordionHeaderSelected {
    background: linear-gradient(rgb(240,240,205),rgb(215,215,190));
    color: rgb(52, 58, 40);
    border-color: rgb(61, 68, 47);
    border-top-width: 2px;
    padding: 8px 0;
}

    .CC_CoreSetsAccordionDivs .accordionHeader:last-of-type /*doesn't work*/ {
        border-bottom-width: 2px;
    }

    .CC_CoreSetsAccordionDivs .accordionHeader:hover,
    .CC_CoreSetsAccordionDivs .accordionHeaderSelected:hover {
        background: linear-gradient(rgb(156,144,86),rgb(143, 129, 85));
        color: rgb(240,240,205);
        text-decoration: underline;
    }


.BorderAbove {
    border-top: 1px solid rgb(240,240,205);
    margin-top: 20px;
}

.cc-AccordionInnerWrappers {
    border-left-color: rgb(156,144,86);
    border-right-color: rgb(156,144,86); /*rgb(108, 142, 48)*/
    border-left-width: 4px;
    border-right-width: 4px;
    width: 88%;
    margin: 0 auto;
}

.accContentBlockLineLinks {
    background-color: rgb(145, 112, 82);
    color: rgb(240,240,205);
}

    .accContentBlockLineLinks a,
    .accContentBlockLineLinks a:visited {
        color: rgb(240,240,205);
        display: block;
        padding: 8px 0;
        border-width: 2px 0;
        border-bottom-color: rgb(117, 91, 67);
        border-top-color: rgb(168, 129, 95);
    }

        .accContentBlockLineLinks a:hover {
            text-decoration: underline;
        }

    .accContentBlockLineLinks.InLineInstead a,
    .accContentBlockLineLinks.InLineInstead a:visited {
        display: inline-block;
        padding: 10px;
    }

a.MapsListLinks,
a.MapsListLinks:visited {
    color: rgb(240,240,205);
    text-decoration: underline;
}

.copyright_credit {
    position: relative;
    display: inline-block;
    font-size: .85em;
}

#Europe .copyright_credit {
    top: 220px;
    /* left: -192px;outside the main box*/
    left: -138px; /*inside the main box*/
    -ms-transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
    transform: rotate(270deg);
}

#Pacific .copyright_credit {
    top: 220px;
    /*  left: 194px; outside the main box*/
    left: 140px; /*inside the main box*/
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}

@media (max-width: 414px) {
    #Europe .copyright_credit {
        /*   left:-138px;inside the main box*/
    }

    #Pacific .copyright_credit {
        /*  left:140px; inside the main box*/
    }
}


.cc-text-shadow {
    text-shadow: 2px 2px 3px rgb(61, 68, 47);
}

.Boardgames.CombatCommanderBodyClass .grid.display td,
.Boardgames.CombatCommanderBodyClass .grid.display td a,
.Boardgames.CombatCommanderBodyClass .grid.display td a:visited,
.Boardgames.CombatCommanderBodyClass .grid.display td a:hover {
    color: rgb(52, 58, 40);
}


#Gridview1 select,
#Gridview2 select {
    width: 100%;
}




.Boardgames.CombatCommanderBodyClass div.dataTables_wrapper {
    border: 3px solid rgb(61, 68, 47);
    box-shadow: 0px 1px 5px 3px rgb(240,240,205);
    background: rgb(240,240,205);
}

.Boardgames.CombatCommanderBodyClass .grid.dataTable th,
.Boardgames.CombatCommanderBodyClass .grid.dataTable td {
    border-color: rgb(156,144,86) !important;
}

.Boardgames.CombatCommanderBodyClass .grid.dataTable {
    border-collapse: collapse;
    border-width: 0;
}

    .Boardgames.CombatCommanderBodyClass .grid.dataTable th:first-child,
    .Boardgames.CombatCommanderBodyClass .grid.dataTable td:first-child {
        border-left: 0;
    }

    .Boardgames.CombatCommanderBodyClass .grid.dataTable th,
    .Boardgames.CombatCommanderBodyClass .grid.dataTable td {
        border-right: 0;
    }

table.dataTable > tbody > tr.child {
    padding: 0.5em .3em;
}

    table.dataTable > tbody > tr.child > td.child > ul > li {
        border: 1px solid lightgrey;
        border-width: 1px 0 0;
    }

        table.dataTable > tbody > tr.child > td.child > ul > li:first-child {
            border-top-width: 0;
        }

    table.dataTable > tbody > tr.child span.dtr-title {
        min-width: 125px;
    }


.ExtraSmallText {
    font-size: 12px;
    font-style: italic;
}

.cc-set-description ul {
    list-style-type: disc;
    margin: 1em 0;
}

    .cc-set-description ul li {
        margin-left: 20px;
    }

.CC_CoreSetsAccordionDivs .cc-instructions {
    padding: 0 30px;
    margin-bottom: 12px;
}



footer a,
footer a:link,
footer a:hover,
footer a:focus,
footer a:visited {
    color: rgb(255, 210, 110);
}


@media screen and (min-width: 500px) {

    .ccMapsInformation {
        display: flex;
    }

    #MapImageDiv {
        order: 1;
    }

    #MapData {
        order: 2;
        margin-left: 15px;
    }

    /* not needed with flex as I'm not using float

        .ccMapsInformation:after {
        content: ".";
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;
    }*/

}





/*  ***************************     MEMBERS LOGIN AREA  - PLAY LOGS, ETC  *******************************   */

/*.ccFormTextBoxes {
            width: 300px;
            border-radius: 6px;
            margin: 3px 0;
        }

        .ccFormTextBoxes {
            height: 2em;
        }

        .CommentTextarea /* Must come after .ccFormTextBoxes Height */ /*  {
         height: 200px;
        }

        .VP_SideDDL_class {
            width: 200px;
        }*/
.errorMessage {
    color: yellow;
}

.LoginBar {
    border-bottom-width: 3px;
    padding-bottom: 1em;
    margin-bottom: 2em;
}

@media screen and (max-width: 450px) {
    div.ui-datepicker {
        font-size: 12px;
    }
}

@media screen and (min-width: 600px) {
    /*#LogPlayPanel1
             {margin: 0 auto;
              width: 400px;
              display: inline-flexbox;*/
    /*border: solid purple 5px;}*/


    /*br.NoBreak
    {
       display: none
    }*/
}







/********************************************/
/******** HORIZONTAL STATS (TICKER) *********/
/********************************************/

/* Bootstrap Overrides */
#StatsOuterDiv {
    background-color: rgb(107, 119, 83);
    font-size: 1.375rem;
}

#StatsInnerDiv {
    color: rgb(224, 224, 195);
    letter-spacing: 1px;
}

    #StatsInnerDiv .cc_stats {
        margin-top: .5rem;
        margin-bottom: .5rem;
    }

#StatsOuterDiv.affix {
    top: 52px;
    width: 100%;
    z-index: 49;
    font-size: .875rem; /*14px*/
}

    #StatsOuterDiv.affix .cc_stats {
        margin-top: .25rem;
        margin-bottom: .25rem;
        padding: 0;
    }
/* End Bootstrap Overrides */



.carouselItemInnerWrapper {
    display: flex;
    flex-flow: row nowrap;
    /*border: 1px solid yellow;*/
}

    .carouselItemInnerWrapper .cc_stats {
        display: flex;
        flex-flow: row nowrap;
        justify-content: space-around;
        /*border: 1px solid lightblue;*/
    }

        .carouselItemInnerWrapper .cc_stats.cc_stats-header {
            padding-left: 1.5rem !important;
            padding-right: 1.5rem !important;
            flex-grow: 0;
        }

        .carouselItemInnerWrapper .cc_stats.cc_stats-content {
            flex-grow: 1;
        }

.WinLossStatsLabel {
    margin: 0 .5rem;
}


/********************************************/
/********** END HORIZONTAL STATS ************/
/********************************************/