/*輸入視窗的定義*/
@charset "utf8";
body 
{
	position: relative;
	/*font-family: "Microsoft JhengHei","Lato", Arial, Helvetica, sans-serif;*/
	/*font-family: "Lato", "Microsoft JhengHei",Arial, Helvetica, sans-serif;*/
	font-family: "Microsoft JhengHei","Lato", Arial, Helvetica, sans-serif;
	color: #666666;
	font-size: 15px;
	/*line-height: 22px;*/
	/*background-color: #F5BABA;*/
	background-color: #FADDDD;
	background-image: url(./images/bg.jpg);
	background-size: cover;
	background-attachment: fixed;
	/*background-repeat:no-repeat;*/
}
div{	
	margin:0px;
}
.topBackground {
	background: url(./images/top_banner.png);
	padding: 0 0 16% 0;
	background-repeat: no-repeat;
	background-size: 100%;
	width:100%;
	margin:0px;
}
.TopBarLogo{
	position:absolute;
	top:4%;
	right:3%;
}
.TopBarLogoImg{
	max-width:100%;
}
.topLogo {
	background: url(./images/musoon_word.png);
	padding: 0 0 80px 0;
	background-repeat: no-repeat;
	margin:35px;
}
INPUT[TYPE="text"]
{
  Font-Size:1em;
	/*background-color:#EFEFEF;*/
  background-color:expression(this.readOnly==true?"#CDEDFF":"#EFEFEF");  
	border-color:#F7992B;
	border-width:1px;
	border-style:Solid;
	padding: 5px 8px;/*上 右 下 左*/
	width:250px;
}

.loginTable{
	font-family: "微軟正黑體", "Microsoft JhengHei",Arial, Helvetica, sans-serif;
  	/*Font-Size:1.5em;*/
  	font-size: 15px;
	color: #666666;
	letter-spacing:1px;
	border-top: 1px solid #8c8c8c;/*#286A28*/
	border-bottom: 1px solid #8c8c8c;
	border-left: 1px solid #8c8c8c;
	border-right: 1px solid #8c8c8c;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	width:700px;
}
.ipFont{
  Font-Size:1.2em;
	color:#000000;
}
.mamaFont{
  /*Font-Size:1.2em;*/
  font-size: 16px;
	color:#0000CC;
}
.submitBtn{
	font-family: "Microsoft JhengHei","微軟正黑體", Arial, Helvetica, sans-serif;
	color: #FFFFFF;
	/*font-size:1.2em;*/
	font-size:17px;
	letter-spacing:1px;
	padding: 10px 15px 10px 15px;/*上 右 下 左*/
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	border-radius: 8px;
	/*background-color: #F7992B;*/
	background-color:#5AAFEA;
	transition: all 0.2s ease;
	border-top: 1px solid #3487DB;/*#286A28*/
	border-bottom: 1px solid #3487DB;
	border-left: 1px solid #3487DB;
	border-right: 1px solid #3487DB;
	cursor:pointer;
}
.submitBtn:hover{
	color: #FFFFFF;
	background-color: #6EBEF4;
}

.loginMamaBaby{
	position: fixed;
	width: 30%;
	right: -1%;
	bottom: 0;
	padding: 0 0 36% 0;
	background-image: url(./images/mamaBaby.png);
	background-size: 100%;
	background-repeat: no-repeat;
}

.babyCamPhoto_left{
	width:55%;
	margin:0px;
	float: left;
}
.babyCamPhoto_right{
	width:45%;
	margin:0px;
	float: left;
}
.dataTable{
	font-size: 15px;
		margin-left:0; 
}
.cctv_photo{
	width:320px;
}
/* for cellphone */
@media screen and (max-device-width: 768px){

	.TopBarLogo{
		position:absolute;
		top:15px;
		right:15px;
		width:100%;
	}
	.TopBarLogoImg{
		position:absolute;
		top:10px;
		right:20px;
		width:30%;
	}
	
	.topLogo {
		padding: 0 0 15% 0;
		background-repeat: no-repeat;
		background-size: 60%;
		margin:35px;
	}
	
.loginTable {
  	Font-Size:1.7em;
  	width:80%;
}

	INPUT[TYPE="text"]{
	  Font-Size:1.5em;
		width:320px;
	}

	.babyCamPhoto_left{
		width:100%;
	}
	.babyCamPhoto_right{
		width:100%;
	}
	.mamaFont{
  /*Font-Size:1.2em;*/
		Font-Size:1em;
}
	.dataTable{
		Font-Size:1em;
		margin-left:auto; 
   margin-right:auto;
	}
	.cctv_photo{
		width:80%;
	}
}/*device width 768px*/