body {
    margin: 0px;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    font-family: 'CLCF-Regular';
}

button {
    border: none;
}


.cntSmartFarm {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100%;
}


.cntnpc {
    position: absolute;
    overflow: visible;
    left: 0px;
    top: 0px;
    z-index: 25;
    background-color: transparent;
    pointer-events: none;
}

.npcBalloonBack {
    font-family: 'CLCF-Bold';
    background-color: transparent;
    color: rgb(11, 33, 91);
    overflow: hidden;
    z-index: 46;
}

.npcBalloonText {
    font-family: 'CLCF-Bold';
    background-color: transparent;
    color: rgb(11, 33, 91);
    overflow: hidden;
    z-index: 47;
}


.uiSmartFarmBack {
    background-color: transparent;
}

.uiSmartFarmBackTitle {
    background-color: black;
}

.uiSmartFarmBackNone {
    background-color: rgba(255, 255, 255, 0.1);
}

.uiSmartFarmTitle {
    font-family: 'CLCF-Regular';
    color: white;
    background-color: transparent;
    overflow: visible;
    text-shadow: 0 0 1em skyblue, 0 0 0.2em skyblue;
}

.uiSmartFarmTitle2 {
    font-family: 'CLCF-Regular';
    color: black;
    overflow: visible;
    text-shadow: 0 0 1em darkgray, 0 0 0.2em darkgray;
}

.uiSmartFarmTitle3 {
    font-family: 'CLCF-Bold';
    color: rgba(29, 45, 66);
    overflow: visible;
    text-shadow: 0 0 1em darkgray, 0 0 0.1em darkgray;
}

.uiSmartFarmTitle4 {
    font-family: 'CLCF-Regular';
    color: rgba(207, 223, 255);
    overflow: visible;
    text-shadow: 0 0 0.1em rgba(207, 223, 255), 0 0 0.1em rgba(207, 223, 255);
}

.uiSmartFarmTitleNum {
    font-family: 'CLCF-Bold';
    color: white;
    overflow: visible;
    text-shadow: 0 0 0.2em aquamarine, 0 0 0.2em skyblue;
}

.uiSmartFarmMultiLineH150 {
    line-height: 150%;
}

.uiSmartFarmDetail {
    font-family: 'CLCF-Regular';
    text-align: left;
    vertical-align: top;
    color: white;
    background-color: transparent;
    text-shadow: 0 0 1em skyblue, 0 0 0.2em skyblue;
}

.uiSmartFarmDetailHelp {
    font-family: 'CLCF-Regular';
    text-align: left;
    vertical-align: top;
    color: white;
    background-color: transparent;
    text-shadow: 0 0 1em skyblue, 0 0 0.2em skyblue;
}

.uiSmartFarmMoleModel {
    background-color: transparent; 
}

.uiSmartFarmBtn1 {
    font-family: 'CLCF-Regular';
    background-color: transparent;
    background-image: url('./image/mole_btn_normal.png');
    background-size: 100% 100%;
}

.uiSmartFarmBtn1:hover {
    background-image: url('./image/mole_btn_pushed.png');
}

.uiSmartFarmBtn1:active {
    background-image: url('./image/mole_btn_pushed.png');
}

.uiSmartFarmBtnText1 {
    color: white;
    text-shadow: 0 0 1em skyblue, 0 0 0.2em skyblue;
    text-align: center;
    background-color: transparent;
}

.uiSmartFarmBtnHelp {
    background-size: 100% 100%;
}

.uiSmartFarmBtnHelp:hover {
}

.uiSmartFarmBtnHelp:active {
}

    .uiSmartFarmBtnHelp_btn {
        background-image: url('./image/icon_help.png');
        background-size: 100% 100%;
    }

    .uiSmartFarmBtnHelp_btn:hover {
        background-image: url('./image/icon_help.png');
    }

    .uiSmartFarmBtnHelp_btn:active {
        background-image: url('./image/icon_help.png');
    }

.uiSmartFarmBtnHelpClose {
    background-size: 100% 100%;
}

.uiSmartFarmBtnHelpClose:hover {
}

.uiSmartFarmBtnHelpClose:active {
}

    .uiSmartFarmBtnHelpClose_btn {
        background-image: url('./image/sf_btn_close.png');
        background-size: 100% 100%;
    }

        .uiSmartFarmBtnHelpClose_btn:hover {
            background-image: url('./image/sf_btn_close_push.png');
        }

        .uiSmartFarmBtnHelpClose_btn:active {
            background-image: url('./image/sf_btn_close_push.png');
        }

.uiSmartFarmStepTitleFrame {
    z-index: 55;
}

.uiSmartFarmStatus {
    z-index: 61;
}

.uiSmartFarmStatusFlag {
    background-color: transparent;
    font-family: 'CLCF-Regular';
}

.uiSmartFarmStatusDetail {
    color: white;
    font-family: 'CLCF-Regular';
    background-color: transparent;
    text-align: left;
    vertical-align: top;
    line-height: 100%;
}


.uiSmartFarmElecAnimBack {
    color: black;
    font-family: 'CLCF-Regular';
    z-index: 42;
}

.uiSmartFarmDial {
    background-color: transparent;
    overflow: hidden;
}

.uiSmartFarmGraph {
    background-color: transparent;
}

.uiSmartFarmElecAnimRender {
    background-color: transparent;
}


.uiSmartFarmBtnReturn {
    background-image: url('./image/sf_btn_back.png');
    background-size: 100% 100%;
}

.uiSmartFarmBtnReturn_btn {
    background-image: url('./image/sf_btn_back.png');
    background-size: 100% 100%;
}


.uiSmartFarmStatusControlFlagBack {
    background-color: transparent;
}

.uiSmartFarmControlFlagOnAircon {
    content: url('./image/sf_status_aircon_a.png');
    width: 100%;
    height: 100%;
}

.uiSmartFarmControlFlagOnHeater {
    content: url('./image/sf_status_heater_a.png');
    width: 100%;
    height: 100%;
}

.uiSmartFarmControlFlagOnSprinkler {
    content: url('./image/sf_status_sprinkler_a.png');
    width: 100%;
    height: 100%;
}

.uiSmartFarmControlFlagOnDehumidifier {
    content: url('./image/sf_status_dehumidifier_a.png');
    width: 100%;
    height: 100%;
}

.uiSmartFarmControlFlagOff {
    background-color: red;
}

.uiSmartFarmControlFlagOffAircon {
    content: url('./image/sf_status_aircon.png');
    width: 100%;
    height: 100%;
}

.uiSmartFarmControlFlagOffHeater {
    content: url('./image/sf_status_heater.png');
    width: 100%;
    height: 100%;
}

.uiSmartFarmControlFlagOffSprinkler {
    content: url('./image/sf_status_sprinkler.png');
    width: 100%;
    height: 100%;
}

.uiSmartFarmControlFlagOffDehumidifier {
    content: url('./image/sf_status_dehumidifier.png');
    width: 100%;
    height: 100%;
}




.uiSmartFarmUIBack {
    background-color: transparent;
    z-index: 41;
}

.uiSmartFarmHelpBack {
    background-color: transparent;
    z-index: 41;
}

.uiSmartFarmHelpDetailBack {
    background-color: transparent;
}