/* @import url(https://fonts.googleapis.com/css?family=Lobster); */
/* @import url(https://netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.min.css); */

.dropbtn {
  color: white;
  text-decoration: underline;
  /*
  background-color: #04AA6D;
  padding: 16px;
  font-size: 16px;
  border: none;
  */
}

.dropbtn:hover {
  cursor: pointer;
  color: rgb(160, 160, 160);
}

.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown-content {
  /*float: left;*/
  display: none;
  position: absolute;
  background-color: rgb(255 255 255);
  width: 200px;
  /* box-shadow: 0px 1px 2px 0px rgba(0,0,0,0.2); */
  z-index: 100;
}

.dropdown-item {
  font-size: small;
  height: 30px;
  line-height: 30px;
  display: block;
  padding: 0 30px;
  margin-top: 10px;
  margin-bottom: 10px;
  text-align: center;
}

.dropdown-item:hover {
  background-color: rgb(236, 114, 18);
  cursor: pointer;
  font-weight: bold;
}

/* .dropdown:hover .dropdown-content {display: block;}

.dropdown:hover .dropbtn {background-color: rgb(36, 47, 62)}
*/


.div_event_titile {
  color: white;
  font-size: large;
  font-weight: bold;
}

.alert .inner {
  display: inline;
  padding: 6px;
  /* margin: 6px;*/
  border-radius: 3px;
  border: 1px solid rgb(180, 180, 180);
  background-color: rgb(212, 212, 212);
}

.alert .close {
  float: right;
  margin: 3px 12px 0px 0px;
  cursor: pointer;
}

.alert .inner,
.alert .close {
  color: rgb(88, 88, 88);
}

.alert input {
  display: none;
}

.alert input:checked~* {
  animation-name: dismiss, hide;
  animation-duration: 300ms;
  animation-iteration-count: 1;
  animation-timing-function: ease;
  animation-fill-mode: forwards;
  animation-delay: 0s, 100ms;
}

.alert.error .inner {
  border: 1px solid rgb(238, 211, 215);
  background-color: rgb(242, 222, 222);
}

.alert.error .inner,
.alert.error .close {
  color: rgb(185, 74, 72);
}

.alert.success .inner {
  border: 1px solid rgb(214, 233, 198);
  background-color: rgb(223, 240, 216);
}

.alert.success .inner,
.alert.success .close {
  color: rgb(70, 136, 71);
}

.alert.info .inner {
  border: 1px solid rgb(188, 232, 241);
  background-color: rgb(217, 237, 247);
}

.alert.info .inner,
.alert.info .close {
  color: rgb(58, 135, 173);
}

.alert.warning .inner {
  border: 1px solid rgb(251, 238, 213);
  background-color: rgb(252, 248, 227);
}

.alert.warning .inner,
.alert.warning .close {
  color: rgb(192, 152, 83);
}

@keyframes dismiss {
  0% {
    opacity: 1;
  }

  90%,
  100% {
    opacity: 0;
    font-size: 0.1px;
    transform: scale(0);
  }
}

@keyframes hide {
  100% {
    height: 0px;
    width: 0px;
    overflow: hidden;
    margin: 0px;
    padding: 0px;
    border: 0px;
  }
}

input {
  background-color: rgb(51, 51, 51);
  border: 0;
  outline: 0;
  border: solid 1px rgb(102, 102, 102);
  caret-color: white;
  height: 25px;
  color: white;
  width: auto;
  min-width: 200px;
  max-width: 100%;
  padding-left: 5px;
}

::-webkit-input-placeholder {
  /* WebKit browsers */
  color: rgb(133, 133, 133);
}

:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: rgb(133, 133, 133);
}

::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: rgb(133, 133, 133);
}

:-ms-input-placeholder {
  /* Internet Explorer 10+ */
  color: rgb(133, 133, 133);
}

.button-enable {
  background-color: rgb(236, 114, 18);
  border: 0;
  outline: 0;
  border: solid 1px rgb(236, 114, 18);
  color: white;
  height: 25px;
}

.button-enable:hover {
  background-color: rgb(172, 110, 63);
  border: 0;
  outline: 0;
  border: solid 1px rgb(172, 110, 63);
  color: white;
  height: 25px;
  cursor: pointer;
}

.button-enable:active {
  -webkit-transition: border linear .2s, -webkit-box-shadow linear .1s;
  border-color: rgba(88, 105, 192, 0.75);
  -webkit-box-shadow: 0 0 18px rgba(88, 105, 192, 3);
}

.button-disable {
  background-color: rgb(70, 33, 5);
  border: 0;
  outline: 0;
  border: solid 1px rgb(70, 33, 5);
  color: grey;
  height: 25px;
}

.div_loading {
  display: none;
  position: fixed;
  z-index: 100;
  width: 100%;
  height: 100%;
  background-color: rgba(192, 192, 192, 0.3);
  background-image: url("https://i.stack.imgur.com/MnyxU.gif");
  background-repeat: no-repeat;
  background-position: center;
}

.clear {
  clear: both;
}

.body {
  background-color: rgb(20, 34, 51);
  min-height: 100vh;
  margin: 0;
  display: flex;
  flex-direction: column;
}

.div_body {
  padding-left: 10px;
  padding-right: 10px;
  flex-grow: 1;
}

.div_footer {
  background-color: rgb(39, 39, 39);
  color: white;
  text-align: center;
  height: 30px;
  line-height: 30px;
  font-size: small;
  width: 100%;
}

.lab_user_name {
  float: right;
  width: auto;
  height: 40px;
  line-height: 40px;
}

a {
  color: #3498db; /* 淡蓝色链接 */
}

a:hover {
  color: #ffffff; /* 鼠标悬停时的链接颜色，可以选择其他颜色 */
}