/************************************* 以下適用所有尺寸 ***********************************/
.dei_iotPage_content_common{
  background-color: #f7f7f7;
  height: 60px;
}

.dei_common_iot_content{
  margin-top: 60px;
  background-color: white;
  padding: 10px;
}


.dei_common_iot_main_title{
  text-align: center;
  font-weight: bold;
  font-size: 20px;
  margin-top: 5px;
}

.dei_backstage_entrance{
  font-weight: 1000;
  text-decoration: underline;
}
/* 轉圈 */
.dei_loading {
  border: 3px solid #139045;
  border-right: 3px solid #fff;
  border-bottom: 3px solid #fff;
  border-radius: 50%;
  -webkit-animation: dei_loading 1s infinite linear;
  -moz-animation: dei_loading 1s infinite linear;
  -o-animation: dei_loading 1s infinite linear;
  animation: dei_loading 1s infinite linear;
  height: 40px;
  width: 40px;
}

.require_data::before{
  content: "*";
  color: red;
}

input.deiErrorInput{
  border: solid red 2px;
}


@-webkit-keyframes dei_loading {
  from {
      -webkit-transform: rotate(0deg);
  }
  to {
      -webkit-transform: rotate(360deg);
  }
}
@-moz-keyframes dei_loading {
  from {
      -moz-transform: rotate(0deg);
  }
  to {
      -moz-transform: rotate(360deg);
  }
}
@-o-keyframes dei_loading {
  from {
      -o-transform: rotate(0deg);
  }
  to {
      -o-transform: rotate(360deg);
  }
}
@keyframes dei_loading {
  from {
      transform: rotate(0deg);
  }
  to {
      transform: rotate(360deg);
  }
}

/* 閃爍動畫 */
@keyframes animate_fade_in_out {
  0%   { opacity:1; }
  50%  { opacity:0; }
  100% { opacity:1; }
}
@-o-keyframes animate_fade_in_out{
  0%   { opacity:1; }
  50%  { opacity:0; }
  100% { opacity:1; }
}
@-moz-keyframes animate_fade_in_out{
  0%   { opacity:1; }
  50%  { opacity:0; }
  100% { opacity:1; }
}
@-webkit-keyframes animate_fade_in_out{
  0%   { opacity:1; }
  50%  { opacity:0; }
  100% { opacity:1; }
}



/* 漂浮下拉選單 */
/* <div class="dei_select_input_common">
    <div class="dei_select_input_each_opt_common">1</div>
    <div class="dei_select_input_each_opt_common">2</div>
</div> */

/* 漂浮下拉遮罩 */
.dei_float_select_bg{
  width: 100%;
  height: 100%;
  z-index: 2;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  display: none;
}

.dei_select_input_common{
  transform: translateX(0px);
  z-index: 5;
  position: fixed;
  margin-top: -11px;
  left: 10px;
  width: 90%;
  cursor: pointer;
}

.dei_select_input_each_opt_common:first-child{
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}

.dei_select_input_each_opt_common:last-child{
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
  border: 1px solid #ddd;
}

.dei_select_input_each_opt_common{
  background: #fff;
  border: 1px solid #ddd;
  border-bottom: none;
  padding: 10px;
}

.dei_select_input_each_opt_common:hover{
  background: #49bb32;
  /* font-size: 18px; */
  color: white;
}


.bg_shadow_common{
  box-shadow: 4px 7px 8px -1px rgba(0, 0, 0, 0.1);
}
body{
    color: #4A4A4A;
}
.dei_prev_common_btn{
    font-size: 25px;
    float: left;
    color: #139045;
    cursor: pointer;
}
.dei_common_main_title{
    text-align: center;
    font-size: 18px;
    font-weight: bold;
    text-overflow: ellipsis;
    margin: 0 35px;
    white-space: nowrap;
    overflow: hidden;
}

.dei_common_main_right_icon{
    float: right;
    font-size: 25px;
    margin-top: -30px;
    cursor: pointer;
    color: #139045;
}

/* 雄蓋水的背景 */
.dei_the_most_beautiful_bgColor_common{
    background-color: #f8f8f8;
}

.dei_appPage_content_common{
    background-color: white!important;
}

.dei_common_bold_style{
    font-weight: bold !important;
}
.dei_common_done_btn{
  font-size: 18px;
  display: block;
  line-height: 36px;
}
/* fixed appbar */
.dei_common_fixed_appbar{
  position: fixed;
  top: 0;
  z-index: 50;
}
.dei_common_app_content{
  margin-top: 45px;
}
/* fixed appbar end*/
/* 開關 */
.switch {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 34px;
}
.switch input {display:none;}

.dei_swich_slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.dei_swich_slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .dei_swich_slider {
  background-color: #139045;
}

input:focus + .dei_swich_slider {
  box-shadow: 0 0 1px #139045;
}

input:checked + .dei_swich_slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

.dei_swich_slider.round {
  border-radius: 34px;
}

.dei_swich_slider.round:before {
  border-radius: 50%;
}

.dei_select_style_common{
  width: 100%;
  font-size: 14px;
  height: 40px;
  padding: 0px 12px;
}
  
/* app checkbox color */

input[type=checkbox].dei_a_r_d:checked:after,
input[type=checkbox].green_chk:checked:after{

  border: 1px solid #139045;
  background-color: #139045;
}


.dei_error_msg_div_common{
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1040;
  background-color:#00000075;
  z-index: 3000;
}
.dei_error_msg_txt2_common{
  font-weight: bold;
  font-size: 25px;
  top: 40%;
  position: relative;
  text-align: center;
  color:#eeeeee;
  margin: 0px 45px;
  text-align: left;

}
/****************** 以上適用適用所有尺寸 (含 large desktops, 1200px and up) ****************/




/**************** 此區適用 Medium devices (desktops, 992px and up) ****************/
@media (max-width: 1200px) {
    
}

/**************** 此區適用 Small devices (tablets, 768px and up) ****************/
@media (max-width: 992px) {
    
}

/**************** 此區適用 Extra small devices (phones, less than 768px) ****************/
@media (max-width: 768px) {
    
}