
/* OddsMonkey Calculators Common CSS */

html, form, body { background-color: transparent; font-family: 'Open Sans', sans-serif; font-size: 14px; color: #022249 }
h2 { font-size: 1.5rem; font-weight: 700; line-height: 1.2; margin: 0 }

a { color: #0a71ae; text-decoration: underline; background-color: transparent; }
    a:hover { color: #000; text-decoration: underline }

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }

#calc-container { max-width: 650px; margin-left: auto; margin-right: auto; margin-top: 20px; }
.container { padding: 0 ; }

.form-group { margin-bottom: 0 }
    .form-group label { color: #0a71ae; margin-bottom: 0; font-size: 12px; text-transform: uppercase }

.card-main .card-header { background-color: #022249; color: #fff }
.cardprofit .card-header { background-color: #2a9584; color: #fff }

.form-exchange, .form-bookmaker, .form-partlay, .form-gray, .form-results, .form-green, .form-red { margin-bottom: 10px; padding: 10px; border-radius: 5px; border-style: solid; border-width: 1px }
.form-bookmaker { background-color: #D7ECFA; border-color: #84C4F1; }
.form-exchange { background-color: #FDDEE5; border-color: #FBAFBF; }
.form-gray{background-color:#eee;border-color:#ccc}
.form-results {border-style: none; padding: 15px}
.form-green { background-color:#dff0d8;border-color:#28a745; color:#3c763d; }
.form-red { background-color:#f2dede;border-color:#dc3545;color:#a94442; }

.om-btn-primary, .om-btn-primary:focus { color: #fff; background-color: #2a9584; -webkit-box-shadow: 0 2px 0 0 rgba(49,100,92,1); -moz-box-shadow: 0 2px 0 0 rgba(49,100,92,1); box-shadow: 0 2px 0 0 rgba(49,100,92,1); }
    .om-btn-primary:hover:not([disabled]) { background-color: #31645c; color: #fff }
    .om-btn-primary:disabled { color: #c5ece7; opacity: 0.55 }

.om-btn-info, .om-btn-info:focus { color: #fff; background-color: #0a71ae; -webkit-box-shadow: 0 2px 0 0 rgba(20,83,114,1); -moz-box-shadow: 0 2px 0 0 rgba(20,83,114,1); box-shadow: 0 2px 0 0 rgba(20,83,114,1); }
    .om-btn-info:hover:not([disabled]) { background-color: #145372; color: #fff }
    .om-btn-info:disabled { color: #b5dbf2; opacity: 0.55 }

.om-btn-white, .om-btn-White:focus { color: #022249 !important; background-color: #fff !important; border: 1px solid rgba(101,111,121,1); -webkit-box-shadow: 0 2px 0 0 rgba(101,111,121,1); -moz-box-shadow: 0 2px 0 0 rgba(101,111,121,1); box-shadow: 0 2px 0 0 rgba(101,111,121,1); }
    .om-btn-white:hover:not([disabled]) { background-color: #ddd !important; }
    .om-btn-white:disabled { color: #ccc !important; cursor: default }

.resultValue { font-weight:700; font-size:1.5rem; vertical-align:middle }
.resultsimple_title {line-height:30px}
.profit, .loss { font-weight: bold; }
.profit { color: green; }
.loss { color: #C00; }
.back {color:#84C4F1 }
.lay { color:#FBAFBF }
.disabled{background-color:#eee !important}
.backbg { background-color: #84C4F1 }
.laybg { background-color: #FBAFBF }
.neutralbg{background-color:#eee}
.layBadge { background-color: #FDDEE5; border-color: #FBAFBF; border-style:solid; border-width: 1px; padding:4px; font-size: 14px; }
.backBadge { background-color: #D7ECFA; border-color: #84C4F1; border-style:solid; border-width: 1px; padding:4px; font-size: 14px; }

.div-table-header { text-align: left; padding-top: 5px; padding-bottom: 5px; }
.div-table-data { padding-top: 5px; padding-bottom: 5px; font-weight: bold; }
.div-table-toprow { border-style: solid; border-width: 1px; border-color: #d9d9d9; border-top-left-radius: 5px; border-top-right-radius: 5px; }
.div-table-innerrow { border-style: solid; border-width: 1px; border-color: #d9d9d9; border-top-style: none; }
.div-table-bottomrow { border-style: solid; border-width: 1px; border-color: #d9d9d9; border-top-style: none; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; }

.hidden { display:none; }

/* Tooltip container */
.om-tooltip { position: relative; display: inline-block; border-bottom: 1px dotted black; /* dots under the hoverable text */ }
    /* Tooltip text */
    .om-tooltip .om-tooltiptext { visibility: hidden;width: 120px;background-color: black;color: #fff; text-align: center; padding: 5px 0; border-radius: 6px;
        /* Position the tooltip text*/
        position: absolute;
        z-index: 1;
        top: -5px;
        right: 105%;
    }
    /* Show the tooltip text when you mouse over the tooltip container */
    .om-tooltip:hover .om-tooltiptext { visibility: visible; }

/* copy button css */
a[data-copy] { cursor: pointer; }
   a[data-copy]:hover { color: #31645c !important; }
.svg-inline--fa { display: inline-block; font-size: inherit; height: 1em; overflow: visible; vertical-align: -0.125em; }
    .svg-inline--fa.fa-w-14 { width: 0.875em; }
svg:not(:root).svg-inline--fa { overflow: visible; }