/*Mein neues Spoiler-Design*/
.hpm_spoiler_headdiv, .hpm_spoiler_closebutton {
  background: 
  linear-gradient(217deg, rgba(255,255,255,.8), rgba(255,255,255,0) 70.71%),
  linear-gradient(127deg, rgba(100,100,100,.8), rgba(120,120,120,0) 70.71%),
  linear-gradient(36deg, rgba(250,250,250,.8), rgba(250,250,250,0) 70.71%);
  background-size: 110% 110%;
  box-shadow: 0px 0px 3px 1px #656565;
}
.hpm_spoiler_headdiv input {
  position:relative; 
  color:#383838; 
  width:98%
}
.hpm_spoiler_headdiv:hover, .hpm_spoiler:hover, .hpm_spoiler_closebutton:hover {
  background-size: 400% 400%;
  animation: gradient6 10s ease infinite;
}
 
 
.hpm_spoiler_closebutton {
  font-style:italic; 
  border-top:1px solid #383838; 
  padding:2px 10px;
  cursor:pointer;
}
.hpm_spoiler_closebutton a {
  color:#000000 !important; 
}
.hpm_spoiler_closebutton a:-webkit-any-link:hover {
  display:block; 
  width:100%; 
  text-decoration:none !important; 
  color:#000000 !important;
}
 
@keyframes gradient6 {
  from {
    filter: hue-rotate(0);
    background-position: 0% 50%;
  }
  to {
    filter: hue-rotate(360deg);
    background-position: 50% 100%;
  }
}
.hpm_spoiler  {display:inline-block; width:auto; max-width:98%; margin-right: 12px;}
.hpm_spoiler, .hpm_spoiler_headinput {outline:none; color: #ffffff !important;}
 
.hpm_spoiler_body {width:auto;   background: linear-gradient(0deg, #aaaaaa 0%, #fff 50%, #aaaaaa 100%) !important;; color:#000000; border-color:#f0efee; border-style:double; border-width:0 5px 5px 5px; border-radius:0 0 12px 12px; box-shadow: 12px 12px 12px #000000; rgba(0, 0, 0, 0.3); margin-left:12px;margin-right:12px; }
 
.hpm_spoiler_headdiv {  background: linear-gradient(0deg, #aaaaaa 0%, #fff 50%, #aaaaaa 100%) !important;; border:2px solid #f0efee; border-radius:12px; box-shadow: 12px 12px 12px #000000; rgba(0, 0, 0, 0.3);}
.hpm_spoiler_headdiv input {position:relative; color:#000000 !important; width:89%;}
.hpm_spoiler_headdiv:hover {background:#4d4d4d;}
 
.hpm_spoiler_closebutton {background-color:#4d4d4d; font:normal 5px Verdana,Arial,sans-serif; font-style:italic; border-top:1px solid #f0efee; padding:2px 12px; border-radius:0 0 12px 12px; }
.hpm_spoiler_closebutton a {display:block; width:100%; text-decoration:none; color:#000000 !important; }
.hpm_spoiler_closebutton:hover {background-color:#4d4d4d;}
 
 pre {width:auto; max-width: 65vw; min-width:10vw;}
.codelines {background-color:#4d4d4d; color:#000000; float:left !important;}
.bbcode_code {color:#4d4d4d;}
.code {display:inline-block; max-width:90%;}
.code pre {background-color:#4d4d4d; color:#000000; width:auto !important;}
 pre code {background:transparent !important; padding:inherit !important; font-weight:bold; font-size:14px; overflow-x:auto;max-width:100vw;}