/* 
https://bing.img.run/rand.php
https://cn.bing.com/th?id=OHR.RydalWater_ZH-CN2787617470_1920x1080.jpg#莱达尔湖
https://cn.bing.com/th?id=OHR.AutumnHedgehog_ZH-CN7309314630_1920x1080.jpg#小动物
https://cn.bing.com/th?id=OHR.ElephantRock_ZH-CN9293300383_1920x1080.jpg#大象岩
https://cn.bing.com/th?id=OHR.GeghardMonastery_ZH-CN8114246142_1920x1080.jpg#山脚
https://cn.bing.com/th?id=OHR.Ortygia_ZH-CN5237934114_1920x1080.jpg#克罗地亚西西里半岛
*/
body {
	background-color:#f3f4f4;
	background-image:url(https://cn.bing.com/th?id=OHR.ElephantRock_ZH-CN9293300383_1920x1080.jpg);
	background-size: cover;
	background-attachment: fixed;
	background-position: center;
	font-family: "Helvetica Neue", Helvetica, Microsoft Yahei, sans-serif;
}
a {
	text-decoration: none;
	color: inherit;
}
.mdui-container {
	min-width:676px;
	max-width:0;
}
.mdui-toolbar { /*工具栏*/
  //height: 56px !important;
  color: black;
  background-color: rgba(255, 255, 255, 0.2);
  backdrop-filter:blur(10px);
  box-shadow: 0px 0px 10px 2px rgba(0, 0, 0, 0.2);
	transition: background 0.2s;
}
.mdui-toolbar a{ /*工具栏链接*/
  //height: 56px;
  margin:0;
  padding:0px 20px;
}
.mdui-toolbar:hover{ /*工具栏激活*/
  color:black;
  background-color:rgba(255, 255, 255 ,1);
}
.mdui-toolbar .link:hover{ /*link激活*/
  font-weight: bold;
  color:white;
  background-color:black;
}
.mdui-container {}
.mdui-card {
  background: rgba(255, 255, 255, 0.1);
	padding: 10px;
	border-radius: 8px;
	backdrop-filter: blur(10px);
	box-shadow: 0px 0px 10px 6px rgba(0, 0, 0, 0.1);
	transition: background 0.2s;
}
.mdui-card:hover{
  background: rgba(255, 255, 255, 0.2);
}
.mdui-card-primary-subtitle {
	text-align: center;
}
.mdui-card-primary-title {
	font-size: 20pt;
	letter-spacing: 2pt;
	font-weight: bold;
	text-align: center;
}
.mdui-btn {
	min-width:85px;
//	max-width:85px;
	border-radius: 8px;
	padding: 0 15px;
	margin-bottom: 6px;
	background-color: rgba(255, 255, 255, 0.29);
}
.mdui-btn:hover {
	background-color: rgba(255, 255, 255, 0.69);
}
.mdui-btn:active {
	background-color: rgba(255, 255, 255, 0.99) !important;
}
.block {min-height:300px}
.foot{max-height:50px;padding:0}
.ml{margin-left:5px}
.mr{margin-right:5px}
.mt{margin-top:5px}
.mb{margin-bottom:5px}
.pc {padding-top:0px;font-size:0}
.br{color:white;background-color:#bf0000}
.br:hover{color:white;background-color:#e60000}
.br:active{color:white;background-color:#e60000!important}
.bg{color:white;background-color:#3d993d}
.bg:hover{color:white;background-color:#4dbf4d}
.bg:active{color:white;background-color:#4dbf4d!important}
.bb{color:white;background-color:#0070bf}
.bb:hover{color:white;background-color:#0096ff}
.bb:active{color:white;background-color:#0096ff!important}
.bp{color:white;background-color:#a800a8}
.bp:hover{color:white;background-color:#cc00cc}
.bp:active{color:white;background-color:#cc00cc!important}
.bl{color:white;background-color:#448aff}
.bl:hover{color:white;background-color:#40c4ff}
.bl:active{color:white;background-color:yellow!important}
.b-t:hover {
	color: white;
	background-color: #0070bf;
}
.b-t:active {
	color: white;
	background-color: #0096ff!important;
}

/*@keyframes rotate { //logo旋转
	from { transform: rotate(0deg); } to { transform: rotate(360deg); } }*/
#image-container img {
	animation: rotate 5s linear infinite; /* 5秒内完成一次360度旋转 */
	display: block; /*防止图片底部有间隙 */
	margin: 0 auto; /*居中显示 */
	max-width: 100%; /*图片最大宽度为容器宽度*/
	//height: auto; /*高度自适应*/
}