css/bmr-main.css

/*------------------------------------------------------------------ [Table of contents] 1. Content / bmr-calculator-container 1.1 Header / .bmr-calculator-header 1.2. Section / .bmr-calculator-item-container 1.2.1 Tooltip / .bmr-tip 1.2.1.1 Tooltip text / .bmr-tiptext 1.3. Results / .bmr-calculator-results 1.3.1 Section / .macro-nutrients-item 1.3.1.1 Section value / .bmr-calculator-value 1.3.1.2 Tooltip / .bmr-tip -------------------------------------------------------------------*/ .bmr-calculator-container { border-radius: 10px; color: #ffffff; } .bmr-calculator-input { border: 0; border-radius: 30px; font-weight: bold; font-size: 0.8em; color: #dcdcdc; } .bmr-calculator-input:focus { background-color: #7b7b7b; } .bmr-calculator-item-container label { font-size: 13px; } .bmr-calculator-submit, .bmr-calculator-reset { text-align: center; border-radius: 30px; } .bmr-calculator-reset { margin-top: 0; } .bmr-buttons { text-align: center; } .bmr-input-label { border-right: 1px solid #444444; border-bottom-left-radius: 30px; border-top-left-radius: 30px; color: #dcdcdc; } .bmr-error-display { color: #ffeb3b; } .bmr-split-button { border: 0; color: #ffffff; border-radius: 30px; } .bmr-sb-1 { margin-right: 0; border-bottom-right-radius: 0; border-top-right-radius: 0; } .bmr-sb-2 { margin-left: -5px; border-bottom-left-radius: 0; border-top-left-radius: 0; border-left: 1px solid #333333; } /* Tooltip */ .bmr-tip { color: #e9e9e9; } .bmr-tip .bmr-tiptext { color: #ffffff; } .bmr-tip .bmr-tiptext::after { border-color: #3f6cc3 transparent transparent transparent; } .bmr-print-button { color: #ffffff; background-color: #000; border: 0; border-bottom: 1px solid #ffffff; } /* Colors */ /* Inputs, reset buttons, etc */ .bmr-calculator-input, .bmr-calculator-reset, .bmr-split-button { background-color: #565656; } /* Calculate button, labels, etc */ .bmr-calculator-submit, .bmr-input-label, .bmr-split-button:hover, .bmr-active, .bmr-tip, .bmr-tip .bmr-tiptext { background-color: #3f6cc3; } /* Header line (bottom-border) */ .bmr-calculator-header { border-bottom: 1px solid #3f6cc3; } /* Calculator background */ .bmr-calculator-container { background-color: #2e2e2e; } /*------------------------------------------------------------------ [Table of contents] 1. Content / bmr-calculator-container 1.1 Header / .bmr-calculator-header 1.2. Section / .bmr-calculator-item-container 1.2.1 Tooltip / .bmr-tip 1.2.1.1 Tooltip text / .bmr-tiptext 1.3. Results / .bmr-calculator-results 1.3.1 Section / .macro-nutrients-item 1.3.1.1 Section value / .bmr-calculator-value 1.3.1.2 Tooltip / .bmr-tip -------------------------------------------------------------------*/ .bmr-calculator-container { color: #bfbfbf; background-color: #333333; } .bmr-calculator-header { border-bottom: 1px solid #31508c; color: #ffffff; background-color: transparent; } .bmr-calculator-input { border: 0; border-bottom: 2px solid #545454; padding: 10px 7px 7px 10px; font-weight: bold; font-size: 0.8em; color: #ffffff; background-color: transparent; } .bmr-calculator-input:focus { color: #6498fe; border-bottom: 2px solid #6498fe; } .bmr-calculator-input:focus + span { color: #6498fe; } .bmr-calculator-item-container { margin: 20px 0; } .bmr-calculator-item-container label { font-size: 13px; } .bmr-calculator-submit, .bmr-calculator-reset { text-align: center; color: #ffffff; } .bmr-calculator-submit { background-color: #31508c; } .bmr-calculator-reset { margin-top: 0; background-color: #545454; } .bmr-buttons { text-align: center; } .bmr-input-label { color: #cccccc; background-color: transparent; margin-top: 4px; font-size: 13px; } .bmr-error-display { text-decoration: underline; color: #cccccc; } .bmr-split-button { border: 0; color: #ffffff; background-color: #565656; } .bmr-split-button:hover, .bmr-active { background-color: #31508c; } .bmr-sb-1 { margin-right: 0; border-bottom-right-radius: 0; border-top-right-radius: 0; } .bmr-sb-2 { margin-left: -5px; border-bottom-left-radius: 0; border-top-left-radius: 0; border-left: 1px solid #333333; } /* Tooltip */ .bmr-tip { background-color: #31508c; color: #cccccc; } .bmr-tip .bmr-tiptext { background-color: #cccccc; color: #222222; border: 1px solid #222222; } .bmr-tip .bmr-tiptext::after { border-color: #cccccc transparent transparent transparent; } .bmr-print-button { color: #ffffff; background-color: #000000; border: 0; border-bottom: 1px solid #ffffff; } /*------------------------------------------------------------------ [Table of contents] 1. Content / bmr-calculator-container 1.1 Header / .bmr-calculator-header 1.2. Section / .bmr-calculator-item-container 1.2.1 Tooltip / .bmr-tip 1.2.1.1 Tooltip text / .bmr-tiptext 1.3. Results / .bmr-calculator-results 1.3.1 Section / .macro-nutrients-item 1.3.1.1 Section value / .bmr-calculator-value 1.3.1.2 Tooltip / .bmr-tip -------------------------------------------------------------------*/ .bmr-calculator-container { color: #3e3e3e; background-color: #ffffff; } .bmr-calculator-header { border-bottom: 1px solid #ffffff; color: #ffffff; background-color: #00a71c; } .bmr-calculator-input { border: 0; border-bottom: 2px solid #cccccc; padding: 10px 7px 7px 10px; font-weight: bold; font-size: 0.8em; color: #636363; } .bmr-calculator-input:focus { color: #00a71c; border-bottom: 2px solid #00a71c; } .bmr-calculator-input:focus + span { color: #00a71c; } .bmr-calculator-item-container { margin: 20px 0; } .bmr-calculator-item-container label { font-size: 12px; } .bmr-calculator-submit, .bmr-calculator-reset { text-align: center; color: #ffffff; } .bmr-calculator-submit { background-color: #00a71c; } .bmr-calculator-reset { margin-top: 0; background-color: #9e9e9e; } .bmr-buttons { text-align: center; } .bmr-input-label { color: #3e3e3e; background-color: #ffffff; margin-top: 4px; font-size: 13px; } .bmr-error-display { text-decoration: underline; color: #00a71c; } .bmr-split-button { border: 0; color: #ffffff; background-color: #9e9e9e; } .bmr-split-button:hover, .bmr-active { background-color: #00a71c; } .bmr-sb-1 { margin-right: 0; border-bottom-right-radius: 0; border-top-right-radius: 0; } .bmr-sb-2 { margin-left: -5px; border-bottom-left-radius: 0; border-top-left-radius: 0; border-left: 1px solid #ffffff; } /* Tooltip */ .bmr-tip { background-color: #00a71c; color: #ffffff; } .bmr-tip .bmr-tiptext { background-color: #444444; color: #ffffff; } .bmr-tip .bmr-tiptext::after { border-color: #444444 transparent transparent transparent; } .bmr-print-button { background-color: #c5c5c5; border: 0; border-bottom: 1px solid #ffffff; }/*------------------------------------------------------------------ [Table of contents] 1. Content / bmr-calculator-container 1.1 Header / .bmr-calculator-header 1.2. Section / .bmr-calculator-item-container 1.2.1 Tooltip / .bmr-tip 1.2.1.1 Tooltip text / .bmr-tiptext 1.3. Results / .bmr-calculator-results 1.3.1 Section / .macro-nutrients-item 1.3.1.1 Section value / .bmr-calculator-value 1.3.1.2 Tooltip / .bmr-tip -------------------------------------------------------------------*/ .bmr-calculator-container { color: #3e3e3e; background-color: #e9e9e9; } .bmr-calculator-header { border-bottom: 3px solid #6498fe; color: #636363; background-color: #e9e9e9; } .bmr-calculator-input { border: 0; padding: 10px 7px 7px 10px; font-weight: bold; font-size: 0.8em; background: #fff; color: #636363; } .bmr-calculator-input:focus { color: #6498fe; } .bmr-calculator-input:focus + span { color: #6498fe; } .bmr-calculator-item-container { margin: 20px 0; } .bmr-calculator-item-container label { font-size: 14px; font-weight: bold; } .bmr-calculator-results label { font-weight: normal; } .bmr-calculator-submit, .bmr-calculator-reset { text-align: center; color: #ffffff; } .bmr-calculator-submit { background-color: #6498fe; } .bmr-calculator-reset { margin-top: 0; background-color: #9e9e9e; } .bmr-buttons { text-align: center; } .bmr-input-label { margin-top: 5px; left: 2px; color: #3e3e3e; background-color: transparent; font-size: 13px; } .bmr-error-display { text-decoration: underline; color: #6498fe; } .bmr-split-button { border: 0; color: #ffffff; background-color: #9e9e9e; } .bmr-split-button:hover, .bmr-active { background-color: #6498fe; } .bmr-sb-1 { margin-right: 0; border-bottom-right-radius: 0; border-top-right-radius: 0; } .bmr-sb-2 { margin-left: -5px; border-bottom-left-radius: 0; border-top-left-radius: 0; border-left: 1px solid #e9e9e9; } /* Tooltip */ .bmr-tip { color: #e9e9e9; background-color: #6498fe; } .bmr-tip .bmr-tiptext { background-color: #555555; color: #ffffff; } .bmr-tip .bmr-tiptext::after { border-color: #555555 transparent transparent transparent; } .bmr-print-button { background-color: #c5c5c5; border: 0; border-bottom: 1px solid #ffffff; } /*------------------------------------------------------------------ [Table of contents] 1. Content / bmr-calculator-container 1.1 Header / .bmr-calculator-header 1.2. Section / .bmr-calculator-item-container 1.2.1 Tooltip / .bmr-tip 1.2.1.1 Tooltip text / .bmr-tiptext 1.3. Results / .bmr-calculator-results 1.3.1 Section / .macro-nutrients-item 1.3.1.1 Section value / .bmr-calculator-value 1.3.1.2 Tooltip / .bmr-tip -------------------------------------------------------------------*/ .bmr-calculator-container { color: #3e3e3e; background-color: #ffffff; } .bmr-calculator-header { border-bottom: 1px solid #ffffff; color: #ffffff; background-color: #6498fe; } .bmr-calculator-input { border: 0; border-bottom: 2px solid #cccccc; padding: 10px 7px 7px 10px; font-weight: bold; font-size: 0.8em; color: #636363; } .bmr-calculator-input:focus { color: #6498fe; border-bottom: 2px solid #6498fe; } .bmr-calculator-input:focus + span { color: #6498fe; } .bmr-calculator-item-container { margin: 20px 0; } .bmr-calculator-item-container label { font-size: 12px; } .bmr-calculator-submit, .bmr-calculator-reset { text-align: center; color: #ffffff; } .bmr-calculator-submit { background-color: #6498fe; } .bmr-calculator-reset { margin-top: 0; background-color: #9e9e9e; } .bmr-buttons { text-align: center; } .bmr-input-label { color: #3e3e3e; background-color: #ffffff; margin-top: 4px; font-size: 13px; } .bmr-error-display { text-decoration: underline; color: #6498fe; } .bmr-split-button { border: 0; color: #ffffff; background-color: #9e9e9e; } .bmr-split-button:hover, .bmr-active { background-color: #6498fe; } .bmr-sb-1 { margin-right: 0; border-bottom-right-radius: 0; border-top-right-radius: 0; } .bmr-sb-2 { margin-left: -5px; border-bottom-left-radius: 0; border-top-left-radius: 0; border-left: 1px solid #ffffff; } /* Tooltip */ .bmr-tip { background-color: #6498fe; color: #ffffff; } .bmr-tip .bmr-tiptext { background-color: #444444; color: #ffffff; } .bmr-tip .bmr-tiptext::after { border-color: #444444 transparent transparent transparent; } .bmr-print-button { background-color: #c5c5c5; border: 0; border-bottom: 1px solid #ffffff; } /*------------------------------------------------------------------ [Table of contents] 1. Content / bmr-calculator-container 1.1 Header / .bmr-calculator-header 1.2. Section / .bmr-calculator-item-container 1.2.1 Tooltip / .bmr-tip 1.2.1.1 Tooltip text / .bmr-tiptext 1.3. Results / .bmr-calculator-results 1.3.1 Section / .macro-nutrients-item 1.3.1.1 Section value / .bmr-calculator-value 1.3.1.2 Tooltip / .bmr-tip -------------------------------------------------------------------*/ .bmr-calculator-container { border-radius: 10px; color: #3e3e3e; background-color: #eceaea; } .bmr-calculator-header { border-bottom: 1px solid #d0d0d0; } .bmr-calculator-input { border: 0; border-radius: 8px; font-weight: bold; font-size: 0.8em; color: #636363; background-color: #f3f3f3; } .bmr-calculator-input:focus { background-color: #ffffff; } .bmr-calculator-item-container label { font-weight: bold; font-size: 13px; } .bmr-calculator-results label { font-weight: normal; } .bmr-calculator-submit, .bmr-calculator-reset { text-align: center; border-radius: 8px; background-color: #d0d0d0; } .bmr-calculator-reset { margin-top: 0; background-color: #f3f3f3; } .bmr-buttons { text-align: center; } .bmr-input-label { border-bottom-left-radius: 8px; border-top-left-radius: 8px; color: #3e3e3e; background-color: #d0d0d0; } .bmr-error-display { text-decoration: underline; color: #3b64ff; } .bmr-split-button { border: 0; color: #717171; background-color: #f3f3f3; border-radius: 8px; } .bmr-split-button:hover, .bmr-active { background-color: #d0d0d0; } .bmr-sb-1 { margin-right: 0; border-bottom-right-radius: 0; border-top-right-radius: 0; } .bmr-sb-2 { margin-left: -5px; border-bottom-left-radius: 0; border-top-left-radius: 0; border-left: 1px solid #eceaea; } /* Tooltip */ .bmr-tip { background-color: #ffffff; color: #000000; } .bmr-tip .bmr-tiptext { background-color: #ffffff; color: #000000; border: 1px solid #cccccc; } .bmr-tip .bmr-tiptext::after { border-color: #444444 transparent transparent transparent; } .bmr-print-button { background-color: #c5c5c5; border: 0; border-bottom: 1px solid #ffffff; }/*------------------------------------------------------------------ [Table of contents] 1. Content / bmr-calculator-container 1.1 Header / .bmr-calculator-header 1.2. Section / .bmr-calculator-item-container 1.2.1 Tooltip / .bmr-tip 1.2.1.1 Tooltip text / .bmr-tiptext 1.3. Results / .bmr-calculator-results 1.3.1 Section / .macro-nutrients-item 1.3.1.1 Section value / .bmr-calculator-value 1.3.1.2 Tooltip / .bmr-tip -------------------------------------------------------------------*/ /* Calculator */ .bmrCalculator, #bmrResults, #bmrPrintButton { display: none; } .bmrNoScript { display: block; } .bmr-calculator-container { width: 100%; font-family: Calibri, Verdana, Ariel, sans-serif; } .bmr-calculator-header { text-align: center; font-size: 1.5em; padding: 15px; } .bmr-calculator-button-container { display: table; width: 100%; text-align: center; } .bmr-calculator-item-container { width: auto; min-width: 250px; padding: 0 10px 0 10px; margin-top: 10px; display: inline-block; } .bmr-calculator-item-container label { font-size: 14px; margin-bottom: 22px; } .bmr-calculator-item { position: relative; } .bmr-calculator-input { outline: 0; width: 100%; padding: 7px 10px 7px 10px; padding-top: 7px; padding-right: 10px; padding-bottom: 7px; padding-left: 10px; font-size: 1.2em; } .bmr-input-label { position: absolute; top: 0; left: 0; padding: 4px 8px 5px 12px; } .bmr-calculator-submit, .bmr-calculator-reset { display: inline-block; margin: 10px 0 10px 0; padding: 5px 10px 5px 10px; font-size: 1.3em; cursor: pointer; } .bmr-calculator-submit { width: 70%; } .bmr-calculator-reset { width: 20%; } .bmr-calculator-results { padding: 10px; } .bmr-calculator-results .bmr-calculator-item-container { display: inline-block; min-width: 180px; } .bmr-calculator-results .bmr-calculator-value { font-weight: bold; font-size: 30px; } .bmr-error-display { width: 100%; text-align: center; padding: 10px; font-weight: bold; } .bmr-split-button { outline: 0; padding: 10px; width: 80px; } .bmr-buttons { display: block; } /* Tooltip */ .bmr-tip { position: relative; display: inline-block; border-radius: 100px; padding: 0px 5px 0px 4px; cursor: default; font-size: 12px; margin-bottom: 3px; } .bmr-tip .bmr-tiptext { visibility: hidden; position: absolute; z-index: 1; width: 160px; bottom: 125%; left: 50%; margin-left: -85px; padding: 5px; font-size: 14px; text-align: center; border-radius: 6px; } .bmr-tip .bmr-tiptext::after { content: ""; position: absolute; top: 100%; left: 50%; margin-left: -5px; border-width: 5px; border-style: solid; border-color: #555 transparent transparent transparent; } .bmr-tip:hover .bmr-tiptext { visibility: visible; } .macro-nutrients-container { display: flex; width: 100%; } .macro-nutrients-item { margin: 0 auto; } .macro-nutrients-item label { font-size: 13px; } /* Print */ @media print { .bmr-calculator-item-container { display: inline-block; } .bmr-tip, .bmr-calculator-submit, .bmr-calculator-reset, .bmr-error-display { display: none; } .bmr-amortization .bmr-amortization-body { display: block; width: auto; height: auto; overflow: visible; } .bmr-amortization, .bmr-amortization .bmr-amortization-body { border: 0 !important; } } .bmr-print-button { padding: 5px 10px; width: 50px; font-family: Calibri, Verdana, Ariel, sans-serif; border-top-left-radius: 10px; border-top-right-radius: 10px; text-align: center; outline: 0; }

Contact Form