[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
    display: none !important;
}

/* colors */
.i-color-underweight {
    color: #fdfe00;
}

.i-color-normal {
    color: #00a000;
}

.i-color-overweight {
    color: #fe9800;
}

.i-color-obese {
    color: #ee252b;
}

.i-color-morbid-obese {
    color: #89191a;
}

.i-background-underweight {
    background: #fdfe00;
}

.i-background-normal {
    background: #00a000;
}

.i-background-overweight {
    background: #fe9800;
}

.i-background-obese {
    background: #ee252b;
}

.i-background-morbid-obese {
    background: #89191a;
}

.i-value-highlight {
    font-size: 2.4em;
    display: inline-block;
    margin-left: .2em;
}

.i-unit-highlight {
    font-size: 1.8em;
    display: inline-block;
    margin-left: .2em;
}

.i-highlight-calculation-arrow {
    font-size: 1.8em;
    display: inline-block;
    margin-left: .2em;
}

.i-info-icon {
    width: 1.2em;
    height: 1.2em;
    color: white;
    background: #55acee;
    border-radius: 50%;
    line-height: 1.2em;
    text-align: center;
    cursor: pointer;
}

.simple-calc-result {
    margin-top: 2em;
}

.simple-calc-result__input-arrow-wrapper {
    display: none;
}

@media (min-width: 600px) {
    .simple-calc-result__input-arrow-wrapper {
        display: inline-block;
    }
}


.hh-element {
    overflow: hidden;
    margin: 1em 0;
    position: relative;
}

.hh-element__label {
    float: left;
    font-weight: normal;
    line-height: 2em;
}

.hh-element__label--before {
    margin: 0 1.5em 0 0;
    text-align: right;
    width: 4.4em;
}

.hh-element__label--multi-line {
    line-height: 1.05;
    margin-top: -0.2em;
}

.hh-element__label--after {
    color: #666666;
    margin: 0 0 0 1em;
    width: auto;
    text-align: left;
}

@media (max-width: 359px) {
    .hh-element--bmi .hh-element__label--after {
        font-size: .85em;
    }
}


.hh-element__label--radio {
    line-height: 1.25;
    margin-left: .5em;
}

.hh-element__input {
    float: left;
    margin: 0;
}

.hh-element__input--text {
    height: 2em;
    width: 5em !important;
}

.hh-element__input--select {
    height: 2em;
}

.hh-element__input--radio {
    line-height: 1.25 !important;
    margin-left: 1px !important; /* prevent left part of circle to be cut off in chrome */
    margin-top: .3em !important;
}

.hh-element__radio-wrapper {
    overflow: hidden;
}

.hh-element__description {

}


.hh-element__info {

}


.hh-element--has-info {
    padding-top: 1.5em;
}

.hh-element__info {
    position: absolute;
    left: 167px;
    top: 2px;
}

.hh-element__info--text {
    left: 140px;
}

@media (min-width: 360px) {
    .hh-element--has-info {
        padding-top: 0;
    }
    .hh-element__info {
        left: 268px;
        top: 11px;
    }

    .hh-element__info--text {
        top: 7px;
    }
}

.hh-element__label-input-wrapper {
    overflow: hidden;
}

.hh-element__asterisk {
    /* margin-left: 5.9em; */
    margin-left: 0;
}

/* hh box */

.hh-box {
    margin-bottom: 1.5em;
}

.hh-box__header{
    background-color: #225a2e;
    padding: 20px;
    overflow: hidden;
}
body .hh-box .hh-box__header .hh-box__header-title,
body .hh-box .hh-box__header h2.hh-box__header-title {
    color: white;
    text-align: center;
    line-height: 1.25;
    margin: 0;
}
.hh-box__content {
    background-color: #d0ebc7;
    padding: 20px;
}

.hh-box__content-section {
    margin-bottom: 10px;
}

.hh-box__content-section:last-child {
    margin-bottom: 0;
}


/* BMI IMAGES */
.hh-bmi-images {
    overflow: hidden;
    width: 100%;
}

.hh-bmi-images__item {
    float: left;
    width: 23.5%;
    height: 100%;
    /* margin-right: 2%; */
    margin-right: 1.5%;
    position: relative;
}

.hh-bmi-images__item:last-child {
    margin-right: 0;
}

.hh-bmi-images__item-title {
    font-size: .9em;
    display: block;
    margin-bottom: .9em;
    text-align: center;
    color: black;
    line-height: 1.1;
    vertical-align: bottom;
}

.hh-bmi-images__item-image {
    margin: 0;
    padding: 0;
    display: block;
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: contain;
    height: 53vw;
    width: 100%;
}


/* underweight: .270067517, ratio: .190395545, ratio2: .178971812 */
/* normal: .383100381, ratio: .270082855, ratio2: .253877884 */
/* overweight: .367577197, ratio: .259139128, ratio2: .24359078 */
/* obese: .396674584 */
/* morbid obese: .397709924, ratio: .280382472, ratio2: .263559524 */
/* total excl obese: 1.418455019 */
.hh-bmi-images__item--underweight {
    width: 17.8971812%;
}

.hh-bmi-images__item--normal {
    width: 25.3877884%;
}

.hh-bmi-images__item--overweight {
    width: 24.359078%;
}
.hh-bmi-images__item--obese,
.hh-bmi-images__item--morbid-obese {
    width: 26.3559524%;
}

.hh-bmi-images__item-image--underweight {
    background-image: url('../images/bmi/female--underweight.png');
}

.hh-bmi-images__item-image--normal {
    background-image: url('../images/bmi/female--normal.png');
}

.hh-bmi-images__item-image--overweight {
    background-image: url('../images/bmi/female--overweight.png');
}

.hh-bmi-images__item-image--obese {
    background-image: url('../images/bmi/female--obese.png');
}

.hh-bmi-images__item-image--morbid-obese {
    background-image: url('../images/bmi/female--morbid-obese.png');
}

.m--male .hh-bmi-images__item-image--underweight {
    background-image: url('../images/bmi/male--underweight.png');
}

.m--male .hh-bmi-images__item-image--normal {
    background-image: url('../images/bmi/male--normal.png');
}

.m--male .hh-bmi-images__item-image--overweight {
    background-image: url('../images/bmi/male--overweight.png');
}

.m--male .hh-bmi-images__item-image--obese {
    background-image: url('../images/bmi/male--obese.png');
}

.m--male .hh-bmi-images__item-image--morbid-obese {
    background-image: url('../images/bmi/male--morbid-obese.png');
}

.m--boy .hh-bmi-images__item-image--underweight {
    background-image: url('../images/bmi/boy--underweight.png');
}

.m--boy .hh-bmi-images__item-image--normal {
    background-image: url('../images/bmi/boy--normal.png');
}

.m--boy .hh-bmi-images__item-image--overweight {
    background-image: url('../images/bmi/boy--overweight.png');
}

.m--boy .hh-bmi-images__item-image--obese {
    background-image: url('../images/bmi/boy--obese.png');
}

.m--boy .hh-bmi-images__item-image--morbid-obese {
    background-image: url('../images/bmi/boy--morbid-obese.png');
}

.m--girl .hh-bmi-images__item-image--underweight {
    background-image: url('../images/bmi/girl--underweight.png');
}

.m--girl .hh-bmi-images__item-image--normal {
    background-image: url('../images/bmi/girl--normal.png');
}

.m--girl .hh-bmi-images__item-image--overweight {
    background-image: url('../images/bmi/girl--overweight.png');
}

.m--girl .hh-bmi-images__item-image--obese {
    background-image: url('../images/bmi/girl--obese.png');
}

.m--girl .hh-bmi-images__item-image--morbid-obese {
    background-image: url('../images/bmi/girl--morbid-obese.png');
}


.m--has-valid-input .hh-bmi-images__item--current .hh-bmi-images__item-image:before {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;

    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

    content: "\e900";
    position: absolute;
    top: 42%;
    right: -1em;
    width: 100%;
    text-align: center;
    font-size: 4em;
    transform: rotate(90deg);
    z-index: 1;
}

.m--has-valid-input .hh-bmi-images__item:nth-child(n + 2).hh-bmi-images__item--current .hh-bmi-images__item-image:before {
    transform: rotate(-90deg);
    right: auto;
    left: -1em;
}

.m--has-valid-input .hh-bmi-images__item-image {
    opacity: .3;
}

.m--has-valid-input .hh-bmi-images__item--current .hh-bmi-images__item-image {
    opacity: 1;
}


.m--has-valid-input .hh-bmi-images__item-title {
    opacity: .6;
}


.m--has-valid-input .hh-bmi-images__item--current .hh-bmi-images__item-title {
    opacity: 1;
}


@media (min-width: 768px) {
    .hh-bmi-calculators__input-positioner {
        overflow: hidden;
    }
    .hh-bmi-calculators__input {
        float: left;
        margin-top: 8px;
        /* width: 50%; */
        width: 300px;
        max-width: 300px;
    }
    .hh-bmi-calculators__input-hh-bmi-images {
        float: left;
        width: 50%;
        width: calc(100% - 300px);
    }

    .m--advanced .hh-bmi-calculators__input {
        margin-top: 0;
    }

    .m--advanced .hh-bmi-calculators__input-hh-bmi-images {
        margin-top: 24px;
    }


    .hh-bmi-images__item-image {
        height: 210px;
    }
}



/** GRAPH */

.hh-graph {
    position: relative;
    width: 100%;
}

.hh-graph__plotbox {
    padding-left: 3em;
    margin-right: -2em; /* compensate for bar margin */
}

.hh-graph__y-label {
    position: absolute;
    left: 0;
    bottom: 0;
    -ms-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    transform-origin: left top;
    color: #666666;
    text-align: center;
}

.hh-graph__bar {
    height: 6em;
    width: 3.8em;
    position: relative;
    display: inline-block;
    margin: 1.8em 2em 2em 0;
    color: #666666;
}

@media (min-width: 600px) {
    .hh-graph__plotbox {
        margin-right: -3em; /* compensate for bar margin */
    }

    .hh-graph__bar {
        margin-right: 3em;
    }
}

.hh-graph__bar-value {
    position: absolute;
    top: -1.8em;
    left: 0;
    width: 100%;
    text-align: center;
}

.hh-graph__bar-label {
    position: absolute;
    bottom: -2em;
    left: 0;
    width: 100%;
    text-align: center;
}


/* lose weight graph */

.hh-graph__y-label.m--bmi-lose-weight {
    bottom: 4em;
}

.hh-graph__bar.m--bmi-minimal {
    height: 6em;
}

.hh-graph__bar.m--bmi-excellent {
    height: 10em;
}

.hh-graph__bar.m--bmi-maximal {
    height: 14em;
}

.hh-graph__bar.m--bmi-minimal .hh-graph__bar-label {
    margin-left: -.2em;
}

.hh-graph__bar.m--bmi-excellent .hh-graph__bar-label {
    margin-left: -.5em;
}

.hh-graph__bar.m--bmi-maximal .hh-graph__bar-label {
    margin-left: -.4em;
}



/* hh-indicator */

.hh-indicator {
    color: #666666;
    font-size: 12px;
    font-size: 3.75vw;
    overflow: hidden;
}

@media (min-width: 480px) {
    .hh-indicator {
        font-size: 18px;
    }
}

.hh-indicator__positioner {
    width: 40em;
    position: relative;
    overflow: hidden;
}

.hh-indicator__categories {
    width: 100%;
    overflow: hidden;
    margin-top: 5em;
}

.hh-indicator__category {
    float: left;
    position: relative;
    height: 1.3em;
    margin: 2em 0 1.6em 0;
}

.hh-indicator--4-categories .hh-indicator__category {
    width: 25%;
}

.hh-indicator--5-categories .hh-indicator__category {
    width: 20%;
}

.hh-indicator__category-lower-bound-label {
    position: absolute;
    left: -1.8em;
    top: -2em;
}

.hh-indicator__category-label {
    position: absolute;
    left: 0;
    bottom: -2em;
    width: 100%;
    text-align: center;
    white-space: nowrap;
}

@media (min-width: 360px) {
    .hh-indicator__category-label {
        bottom: -1.6em;
    }
}


.hh-indicator__current {
    position: absolute;
    left: -100%;
    top: 0;
    margin-left: -3em; /* make absolute left position correspond to the arrow tip */
}

.hh-indicator__current-label {
    white-space: nowrap;
}

.hh-indicator__current-icon {
    text-align: center;
    font-size: 3em;
}


.hh-indicator--is-cat-4-4 .hh-indicator__positioner,
.hh-indicator--is-cat-5-5 .hh-indicator__positioner {
    margin-left: 0;
    float: right;
}

.hh-indicator--is-cat-5-1 .hh-indicator__category--5 .hh-indicator__category-label,
.hh-indicator--is-cat-5-2 .hh-indicator__category--5 .hh-indicator__category-label,
.hh-indicator--is-cat-5-1 .hh-indicator__category--5 .hh-indicator__category-lower-bound-label,
.hh-indicator--is-cat-5-2 .hh-indicator__category--5 .hh-indicator__category-lower-bound-label,
.hh-indicator--is-cat-5-3 .hh-indicator__category--5 .hh-indicator__category-lower-bound-label,
.hh-indicator--is-cat-4-3 .hh-indicator__category--5 .hh-indicator__category-lower-bound-label,
.hh-indicator--is-cat-5-4 .hh-indicator__category--5 .hh-indicator__category-lower-bound-label,
.hh-indicator--is-cat-5-3 .hh-indicator__category--5 .hh-indicator__category-label,
.hh-indicator--is-cat-4-3 .hh-indicator__category--5 .hh-indicator__category-label,
.hh-indicator--is-cat-5-4 .hh-indicator__category--5 .hh-indicator__category-label,
.hh-indicator--is-cat-5-3 .hh-indicator__category--1 .hh-indicator__category-label,
.hh-indicator--is-cat-4-3 .hh-indicator__category--1 .hh-indicator__category-label,
.hh-indicator--is-cat-5-4 .hh-indicator__category--1 .hh-indicator__category-label {
    display: none;
}

@media (min-width: 480px) and (max-width: 560px) {
    .hh-indicator--is-cat-5-1 .hh-indicator__category--4 .hh-indicator__category-lower-bound-label,
    .hh-indicator--is-cat-5-2 .hh-indicator__category--4 .hh-indicator__category-lower-bound-label {
        display: none;
    }
}

@media (min-width: 610px) {
    .hh-indicator--is-cat-4-3 .hh-indicator__category--5 .hh-indicator__category-lower-bound-label,
    .hh-indicator--is-cat-5-3 .hh-indicator__category--5 .hh-indicator__category-lower-bound-label,
    .hh-indicator--is-cat-5-4 .hh-indicator__category--5 .hh-indicator__category-lower-bound-label {
        display: block;
    }
}

@media (min-width: 980px) {
    .hh-indicator--is-cat-5-1 .hh-indicator__category--5 .hh-indicator__category-lower-bound-label,
    .hh-indicator--is-cat-5-2 .hh-indicator__category--5 .hh-indicator__category-lower-bound-label,
    .hh-indicator--is-cat-5-1 .hh-indicator__category--5 .hh-indicator__category-label,
    .hh-indicator--is-cat-5-2 .hh-indicator__category--5 .hh-indicator__category-label {
        display: block;
        margin-left: -.5em;
    }
}

@media (min-width: 1190px) {
    .hh-indicator--is-cat-5-5 .hh-indicator__category--2 .hh-indicator__category-lower-bound-label {
        left: 1.4em;
    }
}

@media (min-width: 1280px) {
    .hh-indicator--is-cat-5-1 .hh-indicator__category--5 .hh-indicator__category-lower-bound-label,
    .hh-indicator--is-cat-5-2 .hh-indicator__category--5 .hh-indicator__category-lower-bound-label {
        margin-left: -3.2em;
    }
}


/* because font size is capped at 18px which corresponds to 480px vw */
@media (max-width: 479px) {
    .hh-indicator--is-cat-4-3 .hh-indicator__positioner,
    .hh-indicator--is-cat-5-3 .hh-indicator__positioner,
    .hh-indicator--is-cat-5-4 .hh-indicator__positioner {
        margin-left: -320px;
    }

    .hh-indicator--is-cat-5-3 .hh-indicator__category--2 .hh-indicator__category-lower-bound-label,
    .hh-indicator--is-cat-4-3 .hh-indicator__category--2 .hh-indicator__category-lower-bound-label,
    .hh-indicator--is-cat-5-4 .hh-indicator__category--2 .hh-indicator__category-lower-bound-label,
    .hh-indicator--is-cat-5-3 .hh-indicator__category--5 .hh-indicator__category-lower-bound-label,
    .hh-indicator--is-cat-4-3 .hh-indicator__category--5 .hh-indicator__category-lower-bound-label,
    .hh-indicator--is-cat-5-4 .hh-indicator__category--5 .hh-indicator__category-lower-bound-label {
        display: none;
    }

    .hh-indicator--is-cat-5-3 .hh-indicator__category--4 .hh-indicator__category-label,
    .hh-indicator--is-cat-4-3 .hh-indicator__category--4 .hh-indicator__category-label,
    .hh-indicator--is-cat-5-4 .hh-indicator__category--4 .hh-indicator__category-label {
        left: -1em;
    }
	.hh-bmi-images{
		/* min-height: 695px; */
		min-height: 265px;
	}


}

@media (min-width: 480px) {
    .hh-indicator__positioner {
        width: 40em;
    }

    .hh-indicator__positioner-wrapper {
        position: relative;
        height: 10em;
    }

    .hh-indicator--is-cat-5-3 .hh-indicator__positioner,
    .hh-indicator--is-cat-4-3 .hh-indicator__positioner,
    .hh-indicator--is-cat-5-4 .hh-indicator__positioner {
        position: absolute;
        left: calc(50% - 20em);
    }
}

@media (min-width: 768px) {
    .hh-indicator {
        font-size: 18px;
    }

    .hh-indicator__positioner {
        width: 50em;
    }

    .hh-indicator--is-cat-5-3 .hh-indicator__positioner,
    .hh-indicator--is-cat-4-3 .hh-indicator__positioner,
    .hh-indicator--is-cat-5-4 .hh-indicator__positioner {
        left: calc(50% - 25em);
    }
}



/* indicator ideal weight */


/* advanced restuls */

.hh-bmi-calculator__result-label {
    font-weight: bold;
}

.hh-bmi-calculator__result-value {
    display: inline-block;
}

.hh-bmi-calculator__result-value.m--normal {
    background: #00a000;
}

.hh-bmi-calculator__result-value.m--underweight,
.hh-bmi-calculator__result-value.m--overweight {
    background: #fdfe00;
}

.hh-bmi-calculator__result-value.m--obese {
    background: #fe9800;
}

.hh-bmi-calculator__result-value.m--morbid-obese {
    background: #ff0000;
}

.hh-bmi-calculators__lose-weight-graph {
    margin: 0 auto;
    font-size: 13px;
}

@media (min-width: 360px) {
    .hh-bmi-calculators__lose-weight-graph {
        font-size: 15px;
    }
}

@media (min-width: 400px) {
    .hh-bmi-calculators__lose-weight-graph {
        font-size: inherit;
    }
}


/* body fat */
.body-fat-popup-image {
    background-image: url('../images/body-fat/percentage-body-fat.png');
    width: 100%;
    height: 100vw;
    max-width: 600px;
    max-height: 500px;
    margin: 1em auto 0 auto;
}