/*importing google fonts*/
@import url('https://fonts.googleapis.com/css?family=Roboto|Open+Sans|Montserrat|Maven+Pro&display=swap');

body {
    font-family: 'Montserrat', 'Maven Pro', 'Open Sans', Tahoma;
    /*font-family: 'Roboto', 'Montserrat', 'Open Sans', Tahoma;*/
    font-size: 13px;
    /*font-size: 10pt;*/
    background-color: #eee;
    color: #000;
    /* Adjust for our iDevices */
    -webkit-text-size-adjust: 100%;
}

body, html {
    /*height: 100%;*/
}

.gradient-black-grey {
    background: linear-gradient(180deg, #000, #666);
}

.gradient-blue {
    background: linear-gradient(180deg, #3399cc, #115588);
}

.gradient-grey {
    background: linear-gradient(180deg, #666, #999);
}

.gradient-lightgrey {
    background: linear-gradient(180deg, #999, #ccc);
}

.gradient-black-blue {
    background: linear-gradient(0deg, #111, #115588);
}

.icon {
    font-size: 1.1em;
    border: solid 1px #666;
    border-radius: 6px;
    padding: 2px;
    font-weight: 600;
}

    .icon:hover {
        background-color:#fff;
    }

.container {
}

/*.row {
    margin:0;
}*/

.body-content {
    /*background-color: #fff;*/
    position: relative;
    /*margin-top: 20px;*/
    /*padding-left: 15px;
    padding-right: 15px;*/
    /*margin-left:10px;
    margin-right:10px;*/
    /*display: block;*/
    min-height: 500px;
}

.header-image {
    margin-left: -15px;
    margin-right: -15px;
    margin: 0;
}

.header-image img {
    width: 100%;
}

.progress {
    background: rgba(255,128,0,0.1);
    /*justify-content: flex-start;*/
    border-radius: 20px;
    align-items: center;
    /*position: relative;*/
/*    padding: 0 5px;
    display: flex;*/
    height: 6px;
    width: 100%;
    transition: width .5s ease-in-out;
    box-shadow: 0px 5px 10px rgba(33, 33, 33, .25), inset 0 5px 10px rgba(33, 33, 33, .25);
}

.glow {
    /*font-size: 80px;*/
    color: #f60;

    -webkit-animation: glow 1s ease-in-out infinite alternate;
    -moz-animation: glow 1s ease-in-out infinite alternate;
    animation: glow 2s ease-in-out infinite alternate;
}

.blue-shadow {
    /*box-shadow: 0px 5px 10px rgba(33, 33, 33, .25), inset 0 5px 10px rgba(33, 33, 33, .25);*/
    text-shadow: 2px 1px 3px #ffffff;
}

@-webkit-keyframes glow {
    from {
        text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #3399cc, 0 0 40px #3399cc;
    }

    to {
        text-shadow: 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #3399cc, 0 0 50px #3399cc, 0 0 60px #3399cc;
    }
}


a {
    /*color: #337ab7;*/
    color: #3377bb;
}

    a:hover {
        color: #cc6600;

        text-decoration: none;
    }

    a:visited {
        text-decoration: none;
    }

/* ##################################### */
#div_screen_size {
    
}

.intro-page-text {
    line-height: 2.0;
    font-size: 1.1em;
}


.footer {
    width: 100%;
    min-height: 100px;
    background-color: #3e3e3e;
    margin-top: 10px;
    padding: 10px;
    color: #f3f3f3;
    position: relative;
    bottom: 0px;
    /*overflow: hidden;*/
}

.sport-image-container {
    margin:10px;
}

    .sport-image-container img {
        height:60px;
    }

.commish-controlpanel-header {
    font-size: 1.2em;
    background-color: #336699;
    position: relative;
    top: 0;
    /*width: 100%;*/
    margin-left: -15px;
    margin-right: -15px;
    padding: 6px;
}

.commish-controlpanel {
    border: solid 1px #999;    
}


.smaller-font-10percent {
    font-size:0.90em;
}

.smaller-font-20percent {
    font-size:0.80em;
}

.smaller-font-30percent {
    font-size: 0.70em;
}

.larger-font-10percent {
    font-size:1.10em;
}

.larger-font-20percent {
    font-size:1.20em;
}

.fit-content {
    width:fit-content;
}

label {
    font-weight:500;
}

fieldset {
    padding: 0;
    margin: 0;
    /*border: 0;*/
    border: 1px solid #ccc;
    width: auto;
    display: inline-block;
    margin-left: 2px;
    margin-right: 2px;
    padding-top: 0.35em;
    padding-bottom: 0.625em;
    padding-left: 0.75em;
    padding-right: 0.75em;
}

legend {
    display: block;
    width: auto;
    border: 0px solid #ddd;

    padding: 4px;
    padding-left: 6px;
    padding-right: 6px;
    font-size: 1.1em;
    line-height: inherit;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 350px;
}

select {
    padding: 3px;
    border-radius: 4px;
}

/* Modal (background) */

.modal {
    display: none;
}

.modal-dialog {
    display:block;  /*Hidden by default*/ 
    position:fixed;  /*Stay in place*/ 
    z-index: 1;  /*Sit on top*/ 
    left: 100px;
    top: 100px;
    /*width: 50%;*/  /*Full width*/ 
    /*height: 50%;*/  /*Full height*/ 
    overflow: auto;  /*Enable scroll if needed*/ 
    background-color: rgb(0,0,0);  /*Fallback color*/ 
    /*background-color: rgba(0,0,0,0.4);*/  /*Black w/ opacity*/ 
}

/* Modal Content/Box */ 
.modal-content {
    background-color: #fefefe;
    margin: 15% auto;  /*15% from the top and centered*/ 
    padding: 20px;
    border: 1px solid #888;
    width: 100%;  /*Could be more or less, depending on screen size*/ 
    color:#666;
}


.email-header {
    background-color: #003366;
    padding: 6px;
    width: 100%;
}

.inline div {
    display: inline-block
}

.light-bold {
    font-weight: 500;
}

light-bold {
    font-weight: 500;
}

.login-container {
    position: relative;
    float: right;
    top: 5px;
    /*right: 20px;*/
    background-color: #ccc;
    border: solid 1px #114477;
    padding: 0px;
    margin: 10px 20px 5px 5px;
    width: auto;
    min-width: 100px;
    /*text-align: right;*/
    text-align: left;
    border-radius: 3px;
    -webkit-transition: transform .5s;
    transition: transform .5s;
}

    .login-container > div {
        padding: 2px;
        /*font-size: 1.2em;*/
    }

    .login-container:hover {
        /*background-color: #f00;*/
        /*transform: scale(1.25);*/
    }

    .login-container > div > div {
        /*font-size: 1.0em;*/
    }

.commish-login {
    background-color: #3377bb;
    padding: 0px 2px 0px 2px;
    margin: 2px;
    border-radius: 2px;
    color: #eee;
    font-size: 0.9em;
    width: fit-content;
}

.login-div {
    padding: 0px;    
    margin:auto;
}

    .login-div .btn {
        background-color: #ccc;
        border: none;
        padding: 3px;
        border-radius: 2px;
        color: #3399cc;
        text-align: left;
        width: 100%;
        font-size: 1.1em;
    }

    .login-div .btn:hover {
        background-color: #666;
        color: #cc9900;
        font-weight: 700;
        /*border: solid 1px #999;*/
    }

.container-with-legend-on-right {
    display: inline-block;
    float: left;
    margin-right: 4px;
    /*    position:relative;
    top: -5px;*/
}

.legend-auction-bids {
    border: solid 1px #aaa;
    background-color: #ddd;
    float: right;
    display: inline-block;
    padding: 2px;
    width: auto;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

    .legend-auction-bids div {
        display: block;    

        width: auto;
        margin: 2px;
        padding: 2px;
    }

.legend-my-bids {
    display: inline-block;
    float: left;
    position: relative;
    left: 0px;
    top: 0px;
}

.legend-title {
    font-weight: 600;
}

.email-preferences-container {
    max-width: 500px;
    width: fit-content;
    /*float: left;*/
}

.instructions {
    font-size: 0.9em;
    padding: 4px;
    margin-bottom: 8px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/***********************************************/
/* some generic padding and margin classes */
/***********************************************/
.indented-paragraph {
    margin-left:8px;
    font-size:0.9em;
}

.padding-0 {
    padding: 0px;
}

.padding-2 {
    padding: 2px;
}

.padding-4 {
    padding: 4px;
}

.padding-8 {
    padding: 8px;
}

.padding-12 {
    padding: 12px;
}

.margin-0 {
    margin:0px;
}

.margin-2 {
    margin: 2px;
}

.margin-4 {
    margin: 4px;
}

.margin-8 {
    margin: 8px;
}

.margin-12 {
    margin: 12px;
}

.top-padding-10 {
    padding-top: 10px;
}

.top-padding-20 {
    padding-top: 20px;
}

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

.bottom-padding-10 {
    padding-bottom: 10px;
}

.bottom-padding-20 {
    padding-bottom: 20px;
}

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

.left-padding-10 {
    padding-left: 10px;
}

.left-padding-20 {
    padding-left: 20px;
}

.left-padding-40 {
    padding-left: 40px;
}

.right-padding-10 {
    padding-right: 10px;
}

.right-padding-20 {
    padding-right: 20px;
}

.right-padding-40 {
    padding-right: 40px;
}

.top-margin-10 {
    margin-top: 10px;
}

.top-margin-20 {
    margin-top: 20px;
}

.top-margin-40 {
    margin-top: 40px;
}

.bottom-margin-10 {
    margin-bottom: 10px;
}

.bottom-margin-20 {
    margin-bottom: 20px;
}

.bottom-margin-40 {
    margin-bottom: 40px;
}

.left-margin-10 {
    margin-left: 10px;
}

.left-margin-20 {
    margin-left: 20px;
}

.left-margin-40 {
    margin-left: 40px;
}

.right-margin-10 {
    margin-right: 10px;
}

.right-margin-20 {
    margin-right: 20px;
}

.right-margin-40 {
    margin-right: 40px;
}

.bottom-border {
    border-bottom: solid 1px #999;
}

.no-bottom-border {
    border-bottom:unset;
}

.width-80 {
    width: 80px;
}

.width-100 {
    width: 100px;
}

.width-120 {
    width: 120px;
}

.width-160 {
    width: 160px;
}

.width-200 {
    width: 200px;
}

.width-250 {
    width: 250px;
}

.width-300 {
    width: 300px;
}

.width-350 {
    width: 350px;
}

.max-width-400 {
    max-width:400px;
}

.max-width-800 {
    max-width: 800px;
}

.max-width-1000 {
    max-width: 1000px;
}

.small-money-textbox {
    width: 80px;
    text-align: right;
}

.medium-money-textbox {
    width: 100px;
    text-align: right;
}

.large-money-textbox {
    width: 140px;
    text-align: right;
}

/* This overrides the bootstrap setting of margin-left: -20px; */
.checkbox {
    margin-left: 0;
}

.nav-container {
/*    position:relative;
    top:-20px;*/
}

.nav-menu-container {
    margin-left: 15px;
    margin-right: 15px;
}

.navbar {    
    border-bottom: solid 1px #999;
    background-color: #c6c6c6;
}

    .navbar .dropdown-menu:before {
        display: none;
        transition: 0.2s 1s;
    }

    .navbar .dropdown-menu:after {
        display: none;
        transition: 0.8s 1s;
    }

.dropdown:hover .dropdown-menu {
    /*display: block;*/
    transition-delay: 0.5s;
}

.navbar-header {
    border-right: solid .25px #aaa;
}

.navbar .navbar-nav > li > a {
    /*color: #337ab7;*/
    color: #3377bb;
    /*color: #cccccc;*/
    font-size:1.05em;
}

    .navbar .navbar-nav > li > a:hover {
        /*color: #cc6600;*/
        color: #3399cc;        
        /*color: #eee;*/
    }

.dropdown {
    background-color: #ccc;
    border-right: solid 1px #aaa;
    /*font-size: 14px;*/
}

    .dropdown:hover {
        background-color: #bbb;
    }

        .dropdown:hover > .dropdown-menu {
            display: block;
        }

li.dropdown:hover > .dropdown-menu a:hover {
    display: block;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 140px;
    padding: 0;
    margin: 2px 0 0;
    border-top: solid 1px #ccc;
}

    .dropdown-menu > li > a {
        border-bottom: solid 1px #ccc;
        background-color: #e3e3e3;
		/*color:#666;*/
    }


.menu-separator {
    height: 2px;
    background-color: #ccc;
}


.banner-logo img {
    width: 300px;
    /*content: url("../images/logo_FantasyAuction_crimson_wide.png");*/
    margin-left: 20px;
    border: solid 0px #ff0;
}

.banner-sport {
    /*color: #740c11;*/
    color: #336699;
    text-shadow: 2px 2px 2px #666;
    /*display: inline-block;*/
    z-index: 100;
    margin-left: 20px;
    /*font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;*/
    font-size: 36px;
    font-weight: 400;
    /*color: #740c11;*/
    text-shadow: 1px 1px 2px #666;
    border: solid 0px #115588;
    width: auto; /*300px;*/
}

.large-link {
    font-size: 1.2em;
    font-weight: 400;
    margin-top: 10px;
    margin-bottom: 10px;
}

.return-link {
    font-size: 18px;
    font-weight: 400;
    margin-top: 10px;
    margin-bottom: 10px;
}


.site-title {
    font-size: 36px;
    /*font-size: 4vw;*/
    font-weight: 400;
    margin-top: 10px;
    margin-bottom: 10px;
}

.league-title {
    color: #3377bb; /* Same as the menu color */
    /*color: #336699;*/
    display: inline-block;
    font-size: 28px;
    font-weight: 600;
    margin-left: 40px;
/*    position:relative;
    top:20px;*/
}

.team-title {
    font-size: 20px;
    /*color: #3399cc;*/
    font-style:italic;
}

.page-title {
    font-size: 20px;
    font-weight: 400;
    margin-top: 10px;
    margin-bottom: 10px;
}

.section-title {
    font-size: 16px;
    font-weight: 400;
}

.small-title {
    font-size: 14px;
    font-weight: 400;
}

.intro-text li {
    /*max-width: 900px;*/
    line-height: 2.0;
    /*padding: 8px;*/
    /*font-size: 14px;*/
    margin-left: -10px;
}

.help-link::before {
    content: '?';
    font-size: 80%;
    font-family: sans-serif;
    vertical-align: middle;
    font-weight: bold;
    text-align: center;
    display: inline-block;
    width: 1.8ex;
    height: 1.8ex;
    border-radius: 1ex;
    color: #666;
    background: white;
    border: thin solid blue;

    font-size: 1.4ex;
    line-height: 1.8ex;
    border-radius: 1.2ex;
    margin-right: 4px;
    padding: 3px;
    text-decoration: none;
}

.table {
    border-collapse: collapse;
    width:auto;
}

/*.table td {
    padding: 3px;
    border: solid 1px #ccc;
}*/


/***********************************************/
/* jQuery dialog box styles */
/***********************************************/

.ui-dialog {
    border-radius:6px;
    /*padding: 2px;*/
    /*background-color: #fff;*/
}

.ui-dialog .ui-dialog-titlebar {
    background-color: #666;
    border-color: #cc6600;
    border-color: #3399cc;
    border: solid 2px #3399cc;
    color: #eee;
}

/* The close button on our popup/dialog boxes*/
    .ui-dialog .ui-dialog-titlebar-close {
        /*background-color: #ccc;*/
        color: #0000aa;
        opacity: 1;
        padding: 2px;
        /* The 'X' in the close button could be an image */
    }

    .ui-dialog .ui-dialog-titlebar-close:after {
        content: "X";
        position: relative;
        bottom: 4px;
        /*font-size:1.1em;*/
    }

    .ui-dialog .ui-dialog-titlebar-close:hover {
        color: #cc6600;
    }

.ui-widget {
    font-family:inherit;
    font-size: 1.2em;
}

.ui-widget-header {
    background-color: #ddd;
}

.ui-widget.ui-widget-content {
    border: 1px solid #c5c5c5;
    box-shadow: 1px 1px 3px #999;
}

.ui-widget-content a {
    /*color: #337ab7;*/
    color: #3377bb;
}

    .ui-widget-content a:hover {
        color: #cc6600;
    }


/***********************************************/
/* standard record tables */
/***********************************************/
.table-records {
    border: solid 1px #ccc;
    border-collapse: collapse;
}

    .table-records .footer td {
        background-color: #666;
    }

    .table-records tr:nth-child(even) {
        background-color: #e3e3e3;
    }

    .table-records tr:nth-child(odd) {
        background-color: #e9e9e9;
    }

    .table-records tr:hover, tr:visited {
        background-color: #ffffff;
        cursor:pointer;
    }

    .table-records td {
        border: solid 1px #ccc;
        /*border-bottom: solid 1px #ccc;*/
        border-spacing: 0px;
        padding: 2px;
        /*max-width: 250px;
        min-width: 50px;*/
        padding-left: 8px;
        padding-right: 8px;
        /*font-size:11pt;*/
    }

    .table-records th {
        /*background: #ccc;*/
        background-color: #ccc;
        color: #000;
        /*border: solid 1px #aaa;*/
        border-bottom: solid 1px #aaa;
        border-spacing: 1px;
        padding: 4px;
        font-weight: 600;
    }

    .table-records th div {
        /*position:static;*/
        background: transparent;
        /*color: #900;*/
        /*padding: 9px 25px;*/
        /*top: 10px;*/
        /*margin-left: -25px;*/
        /*line-height: normal;*/
        /*border-left: 1px solid #800;*/
    }


.table-records-footer td {
    background-color: #ccc;
    /*padding:-10px;*/
}

.table-records-shadow {
    /*background-color: #fff;*/
    border-collapse: collapse;
    /*border-spacing: 1px;*/
    box-shadow: 1px 1px 5px #069;
}


.table-padding-4 td {
    padding: 4px;
}

.table-padding-8 td {
    padding: 8px;
}

.table-padding-12 td {
    padding: 12px;
}

.table-row-separator {
    height: 2px;
    background-color: #aaa;
}

/***********************************************/
/* This is for the main container of the table, also sets the height of the fixed header row */
.headercontainer {
    position: relative;
    width: auto;
    border: 1px solid #666;
    padding-top: 37px;
    background: #115588;
    box-shadow: 0 0 10px #333;
    height: 500px;
}

/* This is for the data area that is scrollable */
.tablecontainer {
    overflow-y: auto;
    height: 99.5%;
    background: #fff;
}

    /* Removes default cell borders and ensures table width 100% of its container */
    .tablecontainer table {
        border-spacing: 0;
        width: 100%;
    }

    /* adds a thin border to the left of cells, but not the first */
    .tablecontainer td + td {
        border-left: 1px solid #ccc;
    }

    /* cell padding and bottom border */
    .tablecontainer td, th {
        border-bottom: 1px solid #ccc;
        padding: 4px;
        width: auto;
    }

    /* make the default header height 0 and make text invisible */
    .tablecontainer th {
        height: 0px;
        padding-top: 0;
        padding-bottom: 0;
        line-height: 0;
        /*visibility: hidden;*/
        white-space: normal;
        /*position:relative;*/
    }

        /* reposition the divs in the header cells and place in the blank area of the headercontainer */
        .tablecontainer th div {
            visibility: visible;
            position: absolute;
            background: #115588; /* cool blue */
            color: #fff;
            padding: 10px 10px;
            top: 0;
            margin-left: -4px;
            line-height: normal;
            border-left: 1px solid #333;
        }

/* prevent the left border from above appearing in first div header */
th:first-child div {
    border: none;
}

/* alternate colors for rows */
.tablecontainer tbody tr:nth-child(even) {
    background-color: #eee;
}
/***********************************************/


/***********************************************/
/* Our jQuery datatable styles */

.dataTables_wrapper {
    width: fit-content;
}

    .dataTables_wrapper .dataTables_filter input {
        margin-bottom: 10px;
    }

div.dt-buttons {
    /*position: relative;*/
    float: right;
    margin-top: -34px;
    margin-left: 20px;
    margin-right: 20px;
}


table.dataTable {
    /*width: fit-content;*/
    /* width:100% and clear:both is set in datatables.css, which makes the width 100%? */
    /*clear:none;*/
    /*width:unset;*/

    border: solid 0px #999;
    border-collapse: collapse;
}

    table.dataTable thead th, table.dataTable thead td {
        /*padding: 8px 10px;*/
        padding: 4px 8px;
        border-bottom: 1px solid #s;
    }

    table.dataTable tbody th, table.dataTable tbody td {
        /*padding: 8px 10px;*/
        padding: 2px 6px;
    }


    table.dataTable td {
        /*border:solid 1px;*/
        /*border-bottom: solid 1px;*/
    }

table.dataTable th {
    background-color: #ccc;
}

table.dataTable tr {
    background-color: #ffffff;
}

    table.dataTable tr:nth-child(even) {
        background-color: #e6e6e6;
    }

    table.dataTable tr:nth-child(odd) {
        background-color: #efefef;
    }

    table.dataTable tr:hover {
        /*color: dodgerblue;*/
        background-color: #ccc; /* Not working */
    }

    table.dataTable tfoot td {
        padding: 2px 6px;
    }

/***********************************************/
.divTable {
    display: table;
    width: 100%;
}

.divTableBody {
    display: table-row-group;
}

.divTableHeading {
    background-color: #ccc;
    display: table-header-group;
}

.divTableRow {
    display:table-row;
}

/*.divTableRow:nth-child(odd) div {
    background-color: #f0f0f0;
}

.divTableRow:nth-child(even) div {    
    background-color: #e6e6e6;
}*/

    .divTableRow:nth-child(odd) {
        background-color: #ececec;
    }

    .divTableRow:nth-child(even) {
        background-color: #f9f9f9;
    }

    /*.divTableRow div {
        display:table-cell;
    }*/

    .divTableHead {
        display: table-cell;
        padding: 3px 10px;
        background-color: #ccc;
        font-weight: 600;
    }

.divTableCell {
    display: table-cell;
    padding: 3px 10px;
    color: #666; /*#013e7f;*/
    /*background-color: #ffffff;*/
    border: solid 1px #ccc;
}

/***********************************************/


/***********************************************/
/* standard alternating row colors for tables */
/***********************************************/
.standard-alternating-rows tbody tr:nth-child(odd) {
    background-color: #e3e3e3;
}

.standard-alternating-rows tbody tr:nth-child(even) {
    background-color: #e9e9e9;
}
/***********************************************/

.alert-danger, .alert-warning, .alert-success, .alert-info {
    display: table;
    /*background-color: #060606;*/
    padding: 3px;
    border: solid 1px #ccc;
    border-radius: 3px;
    width: fit-content;
}

.alert-danger {
    color: #7B241C; /*#800000;*/
    /*background-color: #F2D7D5;*/
}

.alert-warning {
    color: #9C640C; /*#cc6600;*/
    /*background-color: #FCF3CF;*/
}

.alert-success {
    color: #196F3D; /*#006600;*/
    /*background-color: #D4EFDF;*/
}

.text-danger {
    color: #c00;
}

.text-alert-danger {
    color: #c00;
}

.text-alert-warning {
    color: #cc9900;
}

.text-alert-success {
    color: #0b0;
}

.text-alert-info {
    color: #00b;
    color: #3399cc;
}

.text-alert-normal {
    color:#ccc;
}

/* The style for the minimum bid information message displayed on the bid page */
.minimumbid-alert-message {
    color: #cc9900;
}


div.not-my-maxbid::before {
    content: "Yes";
}

div.not-my-maxbid > span {
    display:none;
}

/*div.my-maxbid::after {
    content: "mine";
    color:#fff;
}*/

div.no-display > span {
    display: none;
}

.label-warning {
    padding: 4px;
    border: solid 1px #ccc;
    border-radius: 2px;
}

/* This class makes the label look like a button when submit is clicked */
.label-wait {
    background-color: #dcd369; /* #dcd369 = dull peach, #f90 = orange, #f4da2c = yellow gold */
    color: #666;
    padding: 4px;
    border: solid 1px #ccc;
    border-radius: 2px;
}

.green-credit {
    color: #090;
}

.debit {
    color: #999;
}

    .debit::before {
        content: "("
    }

    .debit::after {
        content: ")"
    }

.orange-debit {
    color:#cc6600;
}

.red-debit {
    color: #900;
}


.red-warning {
    color:#c00;
}

/* Custom div for page messages */
.page-message div {
    width: auto;
    margin-left: 20px;
    margin-bottom: 10px;
    padding: 6px;
}

.temp-message div {
    width: auto;
    margin-left: 10px;
    margin-bottom: 10px;
    padding: 6px;
}

.bid-notice table {
    border-collapse: collapse;
    width: auto;
}

.bid-notice td {
    padding: 4px;
    border: solid 1px #ccc;
}

.bid-container div {
    /*margin: 4px;*/
}

.confirm-bid {
    /*padding: 4px;*/
    margin-top: 10px;
}

.align-left {
    text-align: left;
}

.align-center {
    text-align: center;
}

.align-right {
    text-align: right;
}

.align-top div {
    vertical-align:top;
}

.form-control {
    display: block;
    /*width: 80%;*/
    /*height: 30px;*/
    padding: 6px 6px;
    /*font-size: 14px;*/
    line-height: 1.42857143;
    color: #333;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -moz-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.form-group {
    border: solid 0px #ccc;
    padding:4px;
}

.medium-bold {
    font-weight:600;
}

.grey-container {
    display:table;
    background-color: #ddd;
    color:#666;
    border:solid 1px #aaa;
    padding: 4px;
    margin: 2px;
    width: auto;
    border-radius: 2px;
}

/***********************************************/
.limiter {
    width: 100%;
    margin: 0 auto;
}


.container-table100 {
    width: 100%;
    min-height: 100vh;
    background: #c850c0;
    background: #990000;
    /*background: -webkit-linear-gradient(45deg,#4158d0,#c850c0);
    background: -o-linear-gradient(45deg,#4158d0,#c850c0);
    background: -moz-linear-gradient(45deg,#4158d0,#c850c0);
    background: linear-gradient(45deg,#4158d0,#c850c0);*/
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    padding: 33px 10px;
}


.auction-table {
    border-spacing: 1px;
    border-collapse: collapse;
    background-color: #eee;
    border-radius: 3px;
    overflow: hidden;
    width: 100%;
    margin: 0 auto;
    position: relative;
}

.auction-table * {
    position: relative;
}

    .auction-table td, table th {
        padding-left: 8px;
    }

    .auction-table thead tr {
        height: 40px;
        background: #ccc;
    }

    .auction-table tbody tr {
        height: 40px;
    }

        /*.auction-table tbody tr:last-child {
            border: 0;
        }*/

    .auction-table td, th {
        text-align: left;
    }

        .auction-table td.l, table th.l {
            text-align: right;
        }

        .auction-table td.c, table th.c {
            text-align: center;
        }

        .auction-table td.r, table th.r {
            text-align: center;
        }

.table100 th {
    font-size: 14px;
    color: #666;
    line-height: 1.2;
    font-weight: unset;
}

.auction-table tbody tr:nth-child(odd) {
    background-color: #e3e3e3;
}

.auction-table tbody tr:nth-child(even) {
    background-color: #e9e9e9;
}

.auction-table tbody tr {
    /*font-size: 14px;*/
    /*color: #666;*/
    line-height: 1.1;
    font-weight: unset;
    border: solid 1px #ccc;
}

.auction-table tbody tr:hover {
    /*color: #333;*/
    /*background-color: #f5f5f5;
    cursor: pointer;*/
}
/***********************************************/

.bottom-spacer {
    height: 40px;
    border: solid 0px #f00;
}

.team-settings-container {
    margin-top: 4px;
    margin-left: 4px;
    margin-right: 4px;
    border: solid 1px #666;
    border-radius: 5px;
    padding: 4px;
    min-height: 200px;
}

.league-settings-container {
    max-width: 900px;
    /*padding: 2px;*/
    /*padding-top: 10px;*/
    border: solid 0px #666;
    font-size: 1.1em;
    /*padding-bottom: 10px;*/
}

    .league-settings-container .row {
        margin-top: 20px;
        margin-left: 4px;
        margin-right: 4px;
        /*padding-top: 10px;*/
        border: solid 1px #666;
        border-radius: 3px;
    }

    .league-settings-container .league-settings-title, .league-settings-value, .league-settings-definiton {
        /*        border-bottom: 1px solid #999;
        border-left: 1px solid #999;*/
        /*min-height: 50px;*/
        
        border-radius: 3px;
        padding-top: 4px;
        padding-bottom: 4px;
/*        margin-top: 10px;
        margin-bottom: 10px;*/
    }

.league-settings-title {
/*    color: #cccccc;
    color: #3399cc;*/
    /*text-align: right;*/
}

.league-settings-value {
    color: #cc9900;
    /*color: #00bb00;*/
    /* color: #3399cc;*/
    /*margin-left: 10px;*/
}

.league-settings-definiton {
    font-size: 0.9em;
    color: #cccccc;
    /*margin-left: 10px;*/
}

    .league-bid-rules-container td {
        padding: 4px;
    }

.league-options-container {
    margin-top: 20px;
}

.form-label-container {
    border: solid 0px #666;
    /*display: inline-block;*/
    margin-top: 10px;
    /*text-align: left;*/
}

.form-control-container {
    border: solid 0px #f00;
    /*display: inline-block;*/
    margin-top: 10px;
    /*text-align: left;*/
}

.control-label {
    /*font-size: 14px;*/
}
/***********************************************/
/* containers with colored headers */
/***********************************************/
.div-colored-header {
    /*background-color: #cc6600;*/
    background-color: #ccc;
    color: #3e3e3e;
    font-weight: 600;
    padding: 4px;
    margin: 0px;
    border: solid 1px #999;
    /*border-top-left-radius:4px;*/
    border-radius: 6px 6px 0px 0px;
}


.div-data-area {
    background-color: #eee;
    padding: 8px;
    border: solid 1px #999;
    margin: 0px;
    border-radius: 0px 0px 6px 6px;
}

.div-label-header {
    background-color: #ccc;
    color: #333;
    margin: 4px;
    border: solid 1px #666;
    text-align: right;
    width: unset;
    /*width: fit-content;*/
    padding: 4px;
}

.div-label-data {
    background-color: #e3e3e3;
    color: #333;
    margin: 4px;
    border: solid 1px #66aa66;
    width: auto;
    /*width: fit-content;*/
    padding: 4px;
}

.highlight-div-header {
    background-color: #cc6600;
    margin: 0px;
}

.highlight-div-body {
    /*color: #0099cc;*/
}


.colored-header-text {
    color: #fff;
}

.table-data-area {
    background-color: #fff;
}
/***********************************************/

.btn-wide {
    width: 200px;
}

.btn-default {
    background-color: #ccc;
    border: solid 1px #999;
    /*color:#666;*/    
    font-size:inherit;
}

    .btn-default:hover {
        background-color: #ddd;
        border-color: #3399aa;
    }

.btn-low-profile {
    padding-left: 8px;
    padding-right: 8px;
    padding-top: 0px;
    padding-bottom: 0px;
}

/* The edit link/button at the bottom of detail pages */
.button-edit {
    margin-top: 20px;
    padding: 4px;
    background-color: #ccc;
    border: solid 1px #aaa;
    border-radius: 2px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

    .button-edit a {
        text-decoration: none;
        padding: 6px;
        margin: 0px;
    }

/* The return link/button at the bottom of edit pages */
.button-return {
    /*width: auto;*/
    padding: 4px;
    margin-top:20px;
    background-color: #ccc;
    border: solid 1px #aaa;
    border-radius: 2px;

    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
    -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

    .button-return a {
        text-decoration: none;
        padding: 6px;
        margin: 0px;
    }

.link-return {
    /*width: auto;*/
    font-size: 1.1em;
    padding: 4px;
    margin: 20px;
    margin-top: 20px;
}

.border-solid {
    border: solid 1px #ccc;
}

.border-solid .row {
    border: solid 1px #ccc;
}

.box {
    border: solid 1px #ccc;
    padding: 4px;
}

.box-container {
    border: solid 1px #ccc;
    border-radius: 3px;
}

hr {
    background-color: #999;
    /*height: 1px;*/
    margin-top: 5px;
    margin-bottom: 5px;
}

/***********************************************/

/* Countdown clock modifications */
.is-countdown {
    font-size: 1.1em;
    padding: 4px;
    margin-left: 0px;
    background-color: #000;
    /*text-align: right;*/
    width: auto;
    /*width: fit-content;*/
    /*width: auto;*/
    /*display: inline-block;*/
}

.countdown-holding span {
    color: #888;
}

.countdown-amount {
    /* Our clock digit color */
    color: #0f0;
    font-size: 100%;
}

/* I added these custom classes */
.clock-container {
    width: 95%;
    
    /*background-color: #000;*/
    /*border: 1px solid #aaa;*/
    margin-left: 0px;
}

.clock-column {
    width: 130px;
}

.timer {
    background-color: #000;
    font-weight: 600;
    padding: 0px;
    /*color:#0f0;*/
    width: auto;
}
/***********************************************/

/*.nav-tabs {
    border-bottom: 1px solid #ddd;
}*/

    /*.nav-tabs > li {
        float: left;
        margin-bottom: -1px;
    }*/

    .nav-tabs > li > a {
        /*margin-right: 2px;
        line-height: 1.42857143;
        border: 1px solid transparent;
        border-radius: 4px 4px 0 0;*/
        background-color: #ddd;
    }

    .nav-tabs > li.active > a,
    .nav-tabs > li.active > a:hover,
    .nav-tabs > li.active > a:focus {
        font-weight:600;
        color: #000;
        cursor: default;
        background-color: #6b6;
        border: 1px solid #ddd;
        border-bottom-color: transparent;
    }

.nav-tabs > li.error {
    background-color: #a16b6b;
}

.error {
    background-color: #a00;
}

/*dt {
    border:solid;
}

dd {
    border: solid;
}*/
.ui-widget-content {
}

/* ipad Mini Landscape */
/*@media only screen and (width:1024px) and (resolution: 163dpi) {

    div, span, a, td, th, legend {
        font-size: 1.1em;
    }
}*/

/* ipad Mini Portrait */
/*@media only screen and (width:768px) and (resolution: 163dpi) {

    div, span, a, td, th, legend {
        font-size: 1.1em;
    }
}*/

#LeagueSettingDialog {
    /*width:500px;*/
}

.hide-max:after {
    content:"Yes";
}

.finished-auctions td {
    font-size:0.8em;
}

/* The style used for the bid amounts in the Auction table */
.auction-bid-amount {
    text-align: right;
    margin-right: 40px;
} 

@media screen and (max-width: 1024px) {
    body {
        /*font-size: 14px;*/
    }

/*    div, span, a, td {
        font-size: 1.02em;
    }*/

    .dropdown, .dropdown-menu {
        /*font-size: 18px;*/
    }

        .dropdown li > ul > li {
            /*font-size: 18px;*/
        }

    .auction-table tbody td {
        height: 1.0em;
        padding: 10px 2px 10px 6px;
    }

}


@media screen and (max-width: 992px) {

    body {
        /*font-size: 16px;*/
    }

    .small {
        font-size: 0.8em;
    }

    .login-container {
        top: -40px;
    }

    .nav-container {
/*        margin-top: 0px;
        position: relative;
        top: 0px;*/
    }

    input[type=checkbox] {
        transform: scale(1.5);
        /* Webkit browsers*/
        -webkit-transform: scale(1.5);
    }

    input[type=text],
    select,
    textarea {
        font-size: 1.1em;
    }

/*    .ui-widget-content {
        font-size: 1.1em;
    }*/

    .auction-bid-amount {
        margin-right: 20px;
    } 

    .clock-column {
        width: auto;
    }
}


@media screen and (max-width: 768px) {

    .ui-dialog .ui-dialog-titlebar-close {
       
        /*bottom: 10px;*/
        /*left: 0px;*/
        /*margin: 0px 4px 0 0;*/
        height: 28px;   
        width: 24px;
    }

    body {
        font-size: 18px;        
    }
    
    div, span, a, td, th {
        /*font-size: 1.1em;*/
    }

    .dropdown, .dropdown-menu {
        font-size: 20px;
    }

        .dropdown li > ul > li {
            /*font-size: 20px;*/
        }

    [type=submit] {
        width: 50%;
        font-size: 1.2em;
    }


    input[type=text],
    select,
    textarea {
        /*max-width: 100%;*/
        font-size: 1.2em;
    }

    .banner-logo img {
        width: 300px;
        /*content: url("../images/logo_FantasyAuction_crimson_wide.png");*/
    }

    .form-control {
        /*width: 80%;*/
        height: 40px;
        padding: 6px 12px;
        font-size: 1.2em;
    }

    /*   
    .ui-dialog {
        width: 100%;
    }

    */

    .btn-grow-on-small-devices {
        width: 80%;
        font-size: 1.2em;
    }

    /********************************************************/
    /* This stacks table rows when the screen size is small */
    /********************************************************/
    .auction-table {
        display: block;
    }

        .auction-table > *, .auction-table tr, .auction-table td, .auction-table th {
            display: block;
        }

        /* This is where we hide the header row */
        .auction-table thead {
            display: none;
        }

        .auction-table tbody tr {
            height: auto;
            padding: 10px 0px 10px 0px;
        }

            /* This is how each td looks like a column split down the middle */
            .auction-table tbody tr td {
                padding-left: 40% !important;
                margin-bottom: 20px;
                margin-top: 10px;
            }

                .auction-table tbody tr td:last-child {
                    margin-bottom: 20px;
                }

                .auction-table tbody tr td:before {
                    font-size: 1.1em;
                    color: #666;
                    line-height: 1.2;
                    font-weight: unset;
                    position: absolute;
                    width: 40%;
                    left: 20px;
                    top: 0;
                    /*background-color:#ccc;*/
                    /*padding:4px;*/
                }

                /*.auction-table tbody tr td:nth-child(1):before {
                content: " ";
                background-color:#666;
            }*/

                .auction-table tbody tr td:nth-child(1) {
                    content: " ";
                    /*background-color: #096;*/
                    padding-bottom: 0px;
                }

                /* The PlayerName Column */
                /*                
            .auction-table tbody tr td:nth-child(2):before {
                            content: "Player";
                        }
            */

                .auction-table tbody tr td.columnBidButton {
                    content: " ";
                    /*margin-top: 10px;*/
                    height: 40px;
                    margin-top: 0px;
                    /*background-color: #9f0;*/
                }

                .auction-table tbody tr td.columnPlayer::before {
                    content: "Player";
                    margin-top: 8px;
                }

                .auction-table tbody tr td.columnHighBidder:before {
                    content: "High Bidder";
                    margin-top: 8px;
                }

                .auction-bid-amount {
                    /*display: inline-block;*/
                    text-align: left;
                    margin-right: 0px;
                }                

                .auction-table tbody tr td.columnBidAmount:before {
                    content: "Bid Amount";
                    margin-top: 8px;                    
                }

                .auction-table tbody tr td.columnTotalBidValue:before {
                    content: "Total Bid Value";
                    margin-top: 8px;
                }

                .auction-table tbody tr td.columnMaxBidAmount:before {
                    content: "Max Bid Set";
                    margin-top: 8px;
                }

                .auction-table tbody tr td.columnAuctionStart:before {
                    content: "Auction Start";
                    margin-top: 8px;
                }

                .auction-table tbody tr td.columnAuctionEnd:before {
                    content: "Auction End";
                    margin-top: 8px;
                }

                .auction-table tbody tr td.columnClock:before {
                    content: "Clock";
                    margin-top: 8px;
                }

                .auction-table tbody tr td.columnBidHistory:before {
                    content: "Bid History";
                    margin-top: 8px;
                }


    .column1, .column2, .column3, .column4, .column5, .column6, .column7, .column8, .column9, .column10 {
        text-align: left;
    }

    .column1, .column2, .column3, .column4, .column5, .column6 {
        width: 100%;
    }

    .auction-table tbody tr {
        font-size: 1.1em;
    }


    .clock-container {
        border: 0px solid #aaa;
    }

    .is-countdown {
        text-align: left;
        /*width:50%;*/
        width: 80%;
    }

    .textbox-width-increase-on-small-devices {
        width: 80%;
    }

}


@media screen and (max-width: 576px) {

    /*.container {
    padding-right: 5px;
    padding-left: 5px;*/
    /* margin-right: auto; */
    /* margin-left: auto; */
    /*}*/

    .banner-logo img {
        margin-left: 0px;
    }

    /*    .navbar {
    padding: 0px;
    margin-left: 0px;
    margin-right: 0px;
    width: 100%;
}*/

    .login-container {
        top: 0px;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        padding: 2px;
    }

    .dropdown, .dropdown-menu {
        /*font-size: 24px;*/
        /*font-size: 1.2em;*/
    }

    input[type=submit] {
        /*width: 100%;*/
        font-size: 1.1em;
    }

    input[type=checkbox] {
        transform: scale(2);
        /* Webkit browsers*/
        -webkit-transform: scale(2);
        margin: 4px 4px 4px 4px;
    }

    input[type=text],
    select,
    textarea {
        /*max-width: 100%;*/
        /*font-size: 1.1em;*/
    }

    table.dataTable {
        width: 90%;
    }


    .auction-table tbody tr td {
        margin-bottom: 30px;
    }
}


@media screen and (max-width: 480px) {

    [type=submit] {
        width: 100%;
    }

    input[type=text] {
        /*max-width: 100%;*/
        /*font-size: 1.1em;*/
    }

    /*input[type=checkbox] {
    transform: scale(2);*/
    /* Webkit browsers*/
    /*-webkit-transform: scale(2);
    margin: 4px 4px 4px 4px;
        
}*/

/*    .control-label {
        padding-left: 4px;
    }*/

    .login-div {
        padding: 4px;
    }

}