.eld {
    display: inline-block;
    position: relative;
    height: 1em;
    overflow: hidden;
}
  
.eld::before {
    content: "\e03a";
    display: inline-block;
    position: relative;
    top: 2px;
    vertical-align: top;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    font-size: 1em;
    font-family: dki;
    line-height: 1;
    text-rendering: auto;
    text-transform: none;
    text-decoration: none;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.activityChangeRow {
    border-bottom: 0px solid gray !important;
    padding-bottom: 5px;
    margin-bottom: 5px;
}

table td {
    padding: 1px;
}

.modal {
    display: block;
}

.advanced {
    background-color: #dfdfdf;
    padding: 3px;
}

.label {
    line-height: 28px;
}

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

.iga-width-w {
    text-align: left;
}

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

.iga-width-e {
    text-align: center;
}

.iga-width-ew {
    text-align: center;
}

.iga-width-exw {
    text-align: center;
}

.w100 {
    width: 100% !important;
}

.btn-block {
    margin-top: 0 !important;
}

.div-center {
    margin: 0 auto;
    text-align: center;
}

.alert {
    margin-bottom: 5px;
    padding: 3px;
}

.has-success, .alert-success {
    color: #2F4B21 !important;
}

.input-group-addon {
    color: #fff !important;
    text-align: center !important;
}

.icon-success {
    color: #5CB85C;
}

.modal-header {
    padding: 9px 15px;
    border-bottom: 1px solid #eee;
    background-color: #5CB85C;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    font-size: 14px;
    color: #fff !important;
}

.modal-title {
    font-weight: bold;
}

.form-inline .form-control {
    width: auto;
}

.form-inline .form-group {
    display: inline-block;
}

.nav > li > a {
    bottom: -1px !important;
}

.lastAddon {
    border-radius: 4px !important;
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
}

.modal-body a {
    color: #5CB85C;
    font-weight: bold;
}

.form-group1 label, .form-group1 select, .form-group1 label, .form-group1 button {
    float: left !important;
}

.form-group1 {
    margin-left: 15px !important;
}

.guidedPanelStep1 {
    padding-left: 0;
    padding-right: 0;
}

.guidedPanel {
    padding-left: 0;
    padding-right: 0;
}

@media screen and (max-width: 767px) {
    .guidedPadding, .guidedPaddingStep1 {
        padding-left: 20px;
        padding-right: 10px;
    }
}

@media screen and (min-width: 1510px) {
    .rightPanels {
        min-width: 820px;
    }
}

.inputFt, .inputIn {
    width: 31px;
    padding-left: 10px;
    padding-right: 10px;
}

.panel, .panel-default, .panel-info, .panel-info>.panel-heading {
    border: 0px !important;
    border-radius: 0px !important;
}

span.glyphicon:before {
    display: none !important;
}

.text-info {
    color: #2F4038 !important;
}

.modal-title  {
	color: #fff !important;
}






body {
	background-color: #fff !important;
	max-width: 1000px !important;
	margin: auto !important;
    font-size: 16px !important;
    line-height: 1.4em !important;
    color: #2F4038 !important;
}

html, body, div, span, h1, h2, h3, h4, h5, h6, p {
	font-family: 'Open Sans', sans-serif !important;
    font-weight: 400 !important;
}

.container-fluid, .panel, .planner-main, .panel-body, .panel-default, .panel-info {
	background-color: #F6F6F6 !important;
    padding: 0px !important;
    box-shadow: 0 0px 0px rgba(0,0,0,.05);
    overflow-x: hidden !important;
}

.panel-body {
    padding: 0px !important;
}

.panel-body:before, .panel-body:after {
    display: none !important;
}

#guidedStep1, #guidedStep2, #guidedStep3, #guidedStep4 {
    min-width: 380px !important;
}

.glyphicon-info-sign {
	color: #2F4038 !important;
}

.glyphicon_info_physical {
	
}

.popover {
    color: #2F4038 !important;
	z-index: 999999 !important;
	font-size: 13px !important;
}

.btn-primary {
    background-color: #2F4038 !important;
    color: #fff !important;
	padding: 10px 10px!important;
	border-radius: 0px !important;
	border: 0px !important;
}

.btn-primary:hover {
    background-color: #89C541 !important;
}

.main-header h1 {
	font-size: 30px !important;
    letter-spacing: 5px !important;
    font-weight: 700 !important;
	text-align: center !important;
	padding: 25px !important;
}

.starting-header {
	background-color: #2F4038 !important;
	color: #fff !important;
	font-size: 20px !important;
    letter-spacing: 5px !important;
	text-align: center !important;
	padding: 25px 10px !important;
	border-top-left-radius: 0px !important;
	border-top-right-radius: 0px !important;
	
}

.starting-header1 {
    margin-bottom: 0px !important;
    font-weight: 700 !important;
    border-top-left-radius: 15px !important;
	border-top-right-radius: 15px !important;
}

.us_units, .metric_units {
    width: 50% !important;
	color: #fff !important;
	font-size: 20px !important;
    letter-spacing: 4px !important;
	text-align: center !important;
	padding: 15px !important;
}

.us_units {
	background-color: #89C541 !important;
}

.metric_units {
	background-color: #5D6F59 !important;
}

.us_units:hover, .metric_units:hover {
	background-color: #E0E2E1 !important;
    color: #000 !important;
}

.w100 {
    width: 100% !important;
}

.input-group {
	margin-top: 20px !important;
	padding-left: 30px !important;
	padding-right: 30px !important;
}

.input-group-addon {
    font-size: 16px !important;
    line-height: 1.2em !important;
    background-color: #89C541 !important;
    color: #fff !important;
	border-radius: 0px !important;
	border: 0px !important;
}

.label_class {
    width: 220px !important;
    letter-spacing: 3px !important;
    font-weight: 600 !important;
}

.label_class1, .result_labels {
    letter-spacing: 0px !important;
    font-weight: 600 !important;
}

.input_class, .sex_select {
	height: 45px !important;
	border-radius: 0px !important;
	border: 2px solid #89C541 !important;
}

.input_class:active, .input_class:focus {
	border: 2px solid #89C541 !important;
}

.input-group-btn select, .iga-width-e, .iga-width-ew {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    background-color: #89C541 !important;
    color: #fff !important;
	padding: 12px !important;
    width: 60px !important;
	border-radius: 0px !important;
	border: 0px !important;
	text-align-last: center !important;
}

select::-ms-expand {display: none !important;}
select{
    -webkit-appearance: none !important;
    appearance: none !important;
}

.input-group-btn select option {
    color: #000 !important;
    background-color: #fff !important;
}

.sex_select {
    background: url(assets/images/arrow.jpg) no-repeat right center !important;
}

.age_class {
	width: calc(100% - 0px) !important;
}

.sex_after {
    float: left !important;
    background-color: #89C541 !important;
    color: #fff !important;
	padding: 0px 2px 0px !important;
    width: 60px !important;
    height: 45px !important;
}

.input-group-age, .input-group-height, .input-group-physical {
	margin-top: 21px !important;
}

.yrs_class {
    background-color: #89C541 !important;
    color: #fff !important;
	padding: 11px 0px !important;
    width: 60px !important;
}

.input_height_feet, .input_height_inch {
	width: calc(50% - 60px) !important;
}

.input_height_cms {
	width: calc(100% - 60px) !important;
}

.height_feet, .height_inch {
	
}

.height_class {
	float: left !important;
    background-color: #89C541 !important;
    color: #fff !important;
	padding: 13px 20px 12px !important;
    width: 60px !important;
}

.input_height_cms, .height_cms {
	display: block !important;
}

.input_height_feet, .input_height_inch, .height_feet, .height_inch {
	display: none !important;
}

.heightPadding {
    width: 60px !important;
}

.physical_class {
	text-align: left !important;
	padding: 5px 20px !important;
}

.input_activity {
	width: 50% !important;
    height: 49px !important;
}

.estimate_btn {
	width: 50% !important;
	float: left !important;
	font-size: 16px !important;
    background-color: #89C541 !important;
    color: #fff !important;
	padding: 11px 20px 14px !important;
	border-radius: 0px !important;
	border: 0px !important;
}

.previous_next {
	width: 100% !important;
	min-width: 330px !important;
	text-align: center !important;
    padding-bottom: 20px !important;
    clear: both !important;
}

#btnGuidedPrevStep, #btnGuidedNextStep {
    font-size: 21px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
}

.previous_button button, .next_button button {
    padding: 10px 30px !important;
}

.previous_button {
	margin-right: 20px !important;
}

.panel-default {
    background-color: #F6F6F6 !important;
    margin-top: 0px !important;
    padding-top: 0px !important;
}

.reach_goal {
    margin-top: 0px !important;
}

.input_calendar {
    width: calc(100% - 0px) !important;
    height: 46px !important;
}

.calendar_img {
    max-width: 60px !important;
    max-height: 45px !important;
    padding: 0px !important;
    margin: 0px !important;
}

.calBtn {
    padding: 0px !important;
    margin: 0px !important;
    margin-top: -1px !important;
    margin-left: -3px !important;
}

.input_goal1 {
    float: left !important;
	width: 50% !important;
    height: 80px !important;
}

.percentage {
    float: left !important;
}

.goal_calculate_btn {
	width: 50% !important;
    height: 80px !important;
    float: right !important;
}

.results_header, .calories_class, .kilojoules_class {
    width: 33.33% !important;
    float: left !important;
    color: #fff !important;
	font-size: 20px !important;
	text-align: center !important;
	padding: 22px !important;
}

.results_top {
    border-top-left-radius: 0px !important;
	border-top-right-radius: 0px !important;
}

.results_buttons {
    margin-bottom: 45px !important;
}

.results_header {
    width: 33.34% !important;
	background-color: #2F4038 !important;
    border-radius: 0px !important;
    padding: 25px 10px 24px !important;
}

.calories_class {
	background-color: #64706C !important;
}

.kilojoules_class {
	background-color: #969F9C !important;
}

.results_buttons .active {
	background-color: #89C541 !important;
}

.results_block {
    width: 45% !important;
    float: left !important;
    text-align: left !important;
    margin: 5px 2.5% 20px !important;
    padding: 0px !important;
    background-color: #2F4038 !important;
    border: 0px !important;
}

.results_block .input-group-addon {
    border: 0px !important;
}

.results_block .input-group, .result_labels {
    margin: 0px !important;
    padding: 0px !important;
}

.result_labels {
    float: left !important;
    background-color: #2F4038 !important;
    width: calc(100% - 160px) !important;
    text-align: left !important;
    padding: 20px 0px 20px 12px !important;
}

.result_values {
    float: right !important;
    background-color: #fff !important;
    width: 160px !important;
    height: 80px !important;
    padding: 20px !important;
}

.resultsHighlight {
    color: #2F4038 !important;
    background-color: #fff !important;
    text-transform: uppercase !important;
    border-radius: 0px !important;
    border: 0px !important;
    padding: auto !important;
}

.weight_goal_top, .physical_top, .results_main_top {
    padding: 0px !important;
    background-color: #F6F6F6 !important;
}

.weight_change {
    padding-top: 20px !important;
}

.goal_maintenance {
    padding-top: 20px !important;
}

.weight_change span, .goal_maintenance span {
    padding-left: 30px !important;
}

.simulation_header {
    background-color: #5D6F59 !important;
    padding: 1px 10px 1px !important;
    line-height: 3.8em !important;
}

.simulation_top {
    width: 720px !important;
    margin: 25px auto !important;
    text-align: center !important;
}

.length_simulation, .length_simulation_days {
    background-color: #5D6F59 !important;
}

.length_simulation {
    background-color: #5D6F59 !important;
    padding: 20px 20px !important;
}

.length_simulation_days {
    background-color: #5D6F59 !important;
    padding: 20px 30px !important;
}

.length_simulation_input {
    border: 2px solid #dddddd !important;
    border-left: 0px solid #dddddd !important;
    border-right: 0px solid #dddddd !important;
    text-align: center !important;
    height: 66px !important;
    font-size: 21px !important;
}

.simulation_second {
    background: #fff !important;
    max-width: 660px !important;
    margin: 0px auto !important;
    padding: 7px !important;
}

.simulation_second1 {
    padding-top: 0px !important;
    margin-bottom: 30px !important;
}

.simLabel {
    display: inline-block !important;
    width: 150px !important;
    line-height: 32px !important;
    text-align: center !important;
    font-size: 14px !important;
    font-weight: 700 !important;
}

.simVal {
    display: inline-block !important;
    width: 55px !important;
    padding: 10px 0px !important;
    text-align: center !important;
    padding-right: 4px;
    border-radius: 0px !important;
    background: #EFF1EE !important;
    color: #2F4038 !important;
}

.simVal1 {
    background: #D8DAD5 !important;
}

.charts_top {
    padding: 0px 5px 10px 15px !important;
}

.nav-tabs, .nav-tabs li {
    border: 0px !important;
}

.nav-tabs li a {
    margin-right: 0px !important;
    border-radius: 0px !important;
    border-top: 2px solid #dddddd !important;
    border-bottom: 2px solid #dddddd !important;
    border-right: 2px solid #dddddd !important;
    text-transform: uppercase !important;
    color: #2F4038 !important;
}

.nav-tabs li .first_li {
    border-left: 2px solid #dddddd !important;
}

.nav-tabs .active a {
    border-bottom: 0px solid #dddddd !important;
    color: #89C541 !important;
}

#chartContainer {
    background: #fff !important;
    padding: 15px 10px 5px 0px !important;
    border-bottom: 2px solid #dddddd !important;
    border-left: 2px solid #dddddd !important;
    border-right: 2px solid #dddddd !important;
}

#chart_id {
    width: 519px !important;
}

.slider_class {
    width: 100% !important;
    max-width: 470px !important; 
    float: right !important; 
    margin-bottom: 10px !important;
}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active {
    border: 1px solid #2F4038 !important;
    background: #2F4038 !important;
    color: #555555 !important;
}

.ui-slider .ui-slider-handle {
    width: 1em !important;
    height: 1.4em !important;
}

#table_div {
    padding-top: 10px !important;
}

.google-visualization-table-div-page {
    text-align: right !important;
}

.switch_mode {
	background-color: #E0E2E1 !important;
    font-style: italic !important;
    text-align: center !important;
    margin-top: -20px !important;
    border-radius: 0px !important;
    border: 0px !important;
}

.switch_mode button {
    font-size: 21px !important;
    background-color: #E0E2E1 !important;
    color: #2F4038 !important;
    border-radius: 0px !important;
    border: 0px !important;
    width: 100% !important;
    padding: 0px 10px 10px !important;
}

.advanced_control, .lifestyle_changes {
    display: none !important;
}

.switch_simple_top {
    display: none;
    margin-top: 30px !important;
    margin-bottom: 0px !important;
}

.switch_simple_top button {
    padding: 10px 10px 15px !important;
}

@media (min-width: 1020px) {
    #guidedStep1, #guidedStep2, #guidedStep3, #guidedStep4, .units_row, .panel, .panel-default, .panel-info {
        width: 1000px !important;
    } 
    
    .previous_next {
        min-width: 1000px !important;
    }
    
    .results_block2 {
        margin-top: -10px !important;
    }
    .table_top {
        margin-left: 10px !important;
    }
}

@media (max-width: 1019px) {
    #guidedStep1, #guidedStep2, #guidedStep3, #guidedStep4, .units_row, .panel, .panel-default, .panel-info, .simulation_top, .starting-header1, .main-header {
        width: 100vw !important;  
    }
    
    .previous_next {
	    width: 100vw !important;
        padding-left: calc(50vw - 190px) !important;
        text-align: center !important;
    }
    
    .previous_button, .next_button {
        float: left !important;
    }
    
    .previous_button button {
        margin-bottom: 20px !important;
    }
    
    .results_block {
        width: 100% !important;
        max-width: calc(100% - 35px) !important;
        float: center !important;
    }
    
    #chart_id {
        width: 520px !important; 
        max-width: 100% !important; 
    }
    
    .slider_class {
        max-width: 470px !important; 
    }
    
    .table_top {
        width: 100% !important;
    }
    
    .charts_top {
        text-align: center !important;
    }
}

@media (min-width: 720px) and (max-width: 1019px) {
    .chart_tabs {
        margin-left: calc(50% - 267px) !important;
    }
}

@media (max-width: 720px) {    
    #btnGuidedPrevStep, #btnGuidedNextStep {
        font-size: 16px !important;
    }
    
    .form-group1 label, .form-group1 select, .form-group1 label, .form-group1 button {
        font-size: 12px !important;
    }
    
    .form-group1 .form-control {
        max-width: 80px !important;
    }
    
    .form-group1 .times_per_day {
        clear: left !important;
    }
    
    .simLabel {
        width: 122px !important;
        line-height: 32px !important;
        font-size: 12px !important;
    }
    
    .simLabel1 {
        width: 88px !important;
    }
    
    .simLabel2 {
        width: 78px !important;
    }
    
    .simVal {
        width: 45px !important;
        padding: 4px 0px !important;        
        padding-right: 2px;
    }
    
    .nav-tabs li a {
        font-size: 12px !important;
    }
    
    .charts_top {
        text-align: left !important;
    }
}

@media (max-width: 520px) {
    .label_class, .physical_class {
        width: 120px !important;
        max-width: 120px !important;
    }
    
    .label_class1 {
        width: 220px !important;
        max-width: 220px !important;
    }
    
    .label_physical {
        width: 193px !important;
        padding: 5px 6px 5px 7px !important;
    }
    
    .length_simulation {
        width: 120px !important;
    }
    
    .length_simulation_days {
        width: 70px !important;
    }
    
    .length_simulation_input {
        height: 66px !important;
        font-size: 21px !important;
    }
    
    .results_block {
        width: 100% !important;
        max-width: calc(100% - 27px) !important;
    }
    
    .result_labels {
        width: 240px !important;
    }
    
    .result_values {
        width: 160px !important;
        height: 80px !important;
    }
    
    .estimate_btn {
        font-size: 11px !important;
        padding: 16px 4px 17px !important;
    }  
    
    #chart_id {
        width: 380px !important; 
        max-width: 100% !important; 
    }
    
    .slider_class, #table_div {
        max-width: 100% !important; 
    }
}

@media (max-width: 450px) {
    .main-header h1 {
        font-size: 26px !important;
        letter-spacing: 3px !important;
	    padding: 20px 5px 20px 20px !important;
        text-align: center !important;
    }
    
    .input_calendar {
        font-size: 12px !important;
        padding: 6px 2px;
    }
    
    #btnGuidedPrevStep, #btnGuidedNextStep {
        font-size: 14px !important;
    }
    
    .previous_button button, .next_button button {
        padding: 10px 20px !important;
        float: left !important;
    }
    
    .btnGuidedPrevStep {
	    min-width: 180px !important;
        width: 180px !important;
    }
    
    .next_button {
        margin-left: 20px !important;
    }
    
    .previous_button {
        margin-right: 0px !important;
        margin-left: 20px !important;
    }
	
	.resultsHighlight {
		font-size: 14px !important;
	}
    
    .length_simulation {
        width: 110px !important;
        padding: 20px 15px !important;
    }
    
    .length_simulation_days {
        width: 60px !important;
        padding: 20px 15px !important;
    }
    
    .result_labels {
        width: 180px !important;
        font-size: 15px !important;
    }
    
    .result_values {
        width: 140px !important;
    }
    
    .simLabel {
        width: 110px !important;
        line-height: 32px !important;
        font-size: 11px !important;
    }
    
    .simLabel1 {
        width: 76px !important;
    }
    
    .simLabel2 {
        width: 66px !important;
    }
    
    .simVal {
        width: 37px !important;
        padding: 1px 0px !important;      
        padding-right: 1px;
    }
    
    .chart_tabs li a {
        font-size: 12px !important;
        padding-left: 7px !important;
        padding-right: 7px !important;
    }
}