html,body {
	background-color: #202020;
	font-family: Times, serif;
	font-size: 11pt;
	counter-reset: pub 38;
}

#wrapper {
	margin: auto;
	max-width: 900px;
	min-width: 900px;
}

#headline {
	background-color: #202020;
	color: #eeeeee;
	margin-bottom: 0px;
}

#headline #logo {
	display: inline;
}

#headline #logo a #logo_img {
	margin: 0;
	margin-top: 0px;
	padding: 0;
	width: 135px;
	height: 58px;
	display: inline-block;
	background-image: url('img/dbb_w.png');
	background-repeat: no-repeat;
}

#headline #logo a:hover {
	text-decoration: none;
}

#headline #logo a span {
	color: #eeeeee;
	font-size: 20pt;
	display: inline-block;
	margin-left: -23px;
	vertical-align: top;
	padding-top: 31px;
	margin-bottom: -4px;
}

#headline #links {
	float: right;
	margin-top: 17px;
	margin-right: 24px;
}

#headline #links a span {
	color: #202020;
	font-weight: bold;
	font-size: 11pt;
	background-color: #eeeeee;
	padding: 3px 5px 3px 5px;
	margin-right: -28px;
	border-style: solid;
	border-width: 1px;
	border-radius: 8px;
	float: left;
	text-align: center;
	width: 105px;
	transform: rotate(-25deg);
}

#headline #links a:hover {
	text-decoration: none;
}

#headline #links a:hover span {
	color: #eeeeee;
	font-weight: bold;
	background-color: #202020;
	border-style: solid;
}

#main {
	background-color: #eeeeee;
	overflow: hidden;
	padding-bottom: 30px;
	border-color: #202020;
	border-radius: 15px;
	margin-top: 8px;
	margin-left: 0px;
	margin-bottom: 10px;
	margin-right: 0px;
}

#main .top {
	height: 55px;
	padding: 20px;
	padding-top: 10px;
	padding-bottom: 15px;
	font-size: 10.5pt;
	overflow: hidden;
}

#main #grid {
	padding-top: 10px;
	padding-left: 10px;
	padding-right: 10px;
	overflow: auto;
}

#main #imggrid {
	padding-top: 10px;
	padding-left: 10px;
	padding-right: 0px;
	/* max-height: 340px; */
	/* overflow: auto; */
}

#main #grid a {
	color: black;
}

#main #grid a .gsec {
	background-color: white;
	float: left;
	width: 230px;
	height: 160px;
	overflow: hidden;
	padding: 20px;
	padding-top: 10px;
	margin: 10px;
	border-style: solid;
	border-width: 1px;
	border-radius: 10px;
	border-color: black;
}

#main #grid a:hover .gsec {
	color: #222222;
	background-color: #202020;
	border-color: white;
}

#main #grid a .gsec .h2_ {
	font-size: 17pt;
	color: #202020;
	font-weight: bold;
	border-style: none;
}

#main #grid a:hover span .h2_ {
	color: white;
}

#main #grid a span .secpic {
	float: right;
}

#main #grid a span .secpic img {
	padding-top: 5px;
	height: 100px;
}

#main #grid a span .si {
	float: right;
	width: 230px;
}

#main #grid a .gpeople {
	background-color: white;
	float: left;
	width: 230px;
	height: 120px;
	overflow: hidden;
	padding: 20px;
	padding-top: 10px;
	margin: 10px;
	border-style: solid;
	border-width: 1px;
	border-radius: 10px;
	border-color: black;
}

#main #grid a:hover .gpeople {
	color: #222222;
	background-color: #202020;
	border-color: white;
}

#main #grid a span .peoplepic {
	float: right;
}

#main #grid a span .peoplepic img {
	padding-top: 5px;
	height: 100px;
	margin-left: 0px;
	padding-left: 0px;
}

#main #grid a span .si {
	float: right;
	width: 230px;
}

#main #grid a .gpeople .si {
	float: left;
	width: 80px;
}

#main #grid a:hover span .si {
	color: #eeeeee;
}

#main #grid a .gpeople .h2_ {
	font-size: 14pt;
	color: #202020;
	font-weight: bold;
	border-style: none;
}

#main #imggrid a .ggalleries {
	background-color: #202020;
	color: white;
	float: left;
	width: 160px;
	height: 160px;
	overflow: hidden;
	padding: 10px;
	margin: 5px;
	border-style: solid;
	border-width: 1px;
	border-radius: 10px;
	border-color: black;
	text-align: center;
  display: table;
  border-collapse: collapse;
}

#main #imggrid a:hover .ggalleries {
	color: #222222;
	background-color: #eeeeee;
	border-color: black;
}

#main #imggrid a span .galleriespic {
  width: 120px;
  height: 85px;
	display: table-row;
}

#main #imggrid a span .galleriespic img {
	max-height: 85px;
	max-width: 120px;
	border-style: solid;
	border-width: 1px;
	border-radius: 5px;
	border-color: white;
}

#main #imggrid a:hover span .galleriespic img {
	border-color: black;
}

#main #imggrid a .ggalleries .si {
	display: table-row;
  bottom: 0px;
	width: 130px;
	color: white;
}

#main #imggrid a .ggalleries .h2_ {
	display: block;
  white-space: nowrap;
  margin: auto;
	color: white;
	font-size: 12pt;
	border-style: none;
}

#main #imggrid a:hover .ggalleries .h2_ {
	color: #202020;
}

#main #imggrid a span .si {
  white-space: nowrap;
  margin: auto;
  margin-top: 1px;
	display: block;
	font-size: 10pt;
	color: #eeeeee;
	text-align: center;
}

#main #imggrid a:hover span .si {
	color: #202020;
}

#main .contents {
	background-color: white;
	line-height: 130%;
	border-radius: 10px;
	margin-left: 30px;
	margin-right: 30px;
	margin-bottom: 20px;
	padding: 30px;
	padding-top: 15px;
	padding-bottom: 25px;
	overflow: auto;
}

#main .contents ol.pub {
	list-style-type: none;
}

#main .contents li.pub:before {
	content: "[" counter(pub) "]\00A0";
	counter-increment: pub -1;
}

#main .contents li.pub {
	text-indent: -30px;
	margin-bottom: 12px;
}

#footer {
	position: relative;
	background-color: #202020;
	color: #eeeeee;
	padding-top: 12px;
	padding-bottom: 12px;
	text-align: right;
	width: 100%;
}

.left {
	float: left;
	text-align: left;
}

.right {
	float: right;
	text-align: left;
}

a {
	text-decoration: none;
	color: #ec210c;
}

a:hover {
	text-decoration: underline;
}

h1 {
	margin-top: 0.2em;
	margin-bottom: 0.2em;
	font-size: 20pt;
	font-weight: bold;
}

h2 {
	margin-top: 0.15em;
	margin-bottom: 0.15em;
	font-size: 16pt;
	font-weight: bold;
}

h3 {
	margin-top: 0.1em;
	margin-bottom: 0.1em;
	font-size: 14pt;
	font-weight: normal;
	text-decoration: underline;
}

#lic {
	float: right;
	text-align: right;
	font-size: 7pt;
}

#slide {
	right: 0px;
	left: 0px;
	top: 0px;
	bottom: 0px;
	width: 100%;
	position: absolute;
	visibility: hidden;
	text-align: center;
	z-index: 1;
  margin: 0;
  padding: 0;
}

#curslide {
	height: auto;
	width: auto;
	background: #202020;
	overflow: hidden;
  margin-top: 3px;
}

#gallerynav {
  position: absolute;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
	padding-bottom: 150px;
	padding-top: 7px;
	z-index: 10;
}

#gallerynav:hover > .navspan {
  animation: none;
}

#gallerynav:hover > a .navspan {
  animation: none;
}

#gallerynav:hover > #oneof {
  animation: none;
}

#ctext {
	max-width: 70px;
	margin-right: 10px;
	max-height: 80%;
	float: right;
}

#ctbox {
	width: 120px;
	overflow: hidden;
	overflow-y: scroll;
}

#descbox {
	margin-right: 10px;
	margin-left: 10px;
	background-color: white;
	border-radius: 10px;
	padding: 7px;
	text-align: center;
}

#curdesc {
	line-height: 130%;
	overflow: auto;
}

.clickspan {
	cursor: pointer;
}

.navspan:hover {
	color: #eeeeee;
	font-weight: bold;
	background-color: #202020;
	border-style: solid;
}

.navspan:hover > .navimg {
  filter: invert(1);
}

@keyframes navanimation {
  0% {opacity: 1;}
  99% {opacity: 0;}
  100% {visibility: hidden;}
}

.navspan {
  animation: navanimation 1s ease-in 1.5s forwards;
	cursor: pointer;
	color: #202020;
	font-weight: bold;
	font-size: 20pt;
	background-color: #eeeeee;
	margin: 4px;
	padding: 3px 0px 3px 0px;
	border-style: solid;
	border-width: 1px;
	border-radius: 8px;
	text-align: center;
}

#galleryfirst {
  background: url(img/rwd.svg) no-repeat top left;
	padding: 0px 31px 0px 0px;
  margin: 0px 3px;
	border-width: 0px;
}

#gallerynext {
  background: url(img/fwd.svg) no-repeat top right;
	padding: 0px 21px 0px 0px;
  margin: 0px 3px;
	border-width: 0px;
}

#galleryclose {
  background: url(img/close.svg) no-repeat top left;
	padding: 0px 28px 0px 0px;
  margin: 0px 3px;
	border-width: 0px;
}


#galleryprev {
  background: url(img/bwd.svg) no-repeat top left;
	padding: 0px 21px 0px 0px;
  margin: 0px 3px;
	border-width: 0px;
}

#gallerylast {
  background: url(img/ffwd.svg) no-repeat top left;
	padding: 0px 33px 0px 0px;
  margin: 0px 3px;
	border-width: 0px;
}

#galleryzoom {
  background: url(img/zoom.svg) no-repeat top left;
	padding: 0px 35px 0px 0px;
  margin: 0px 3px;
	border-width: 0px;
}

#gallerylink {
  background: url(img/permalink.png) no-repeat top left;
  background-size: 29px;
	padding: 0px 31px 0px 0px;
  margin: 0px 3px;
	border-width: 0px;
}

#oneof {
  animation: navanimation 1s ease-in 1.5s forwards;
  display: block;
  margin-top: 10px;
  margin-left: auto;
  margin-right: auto;
	color: #202020;
	font-weight: bold;
	font-size: 20pt;
	text-align: center;
  text-shadow:
    -1px -1px 0 #eeeeee,
    1px -1px 0 #eeeeee,
    -1px 1px 0 #eeeeee,
    1px 1px 0 #eeeeee;
}

.rambling {
	padding: 15px;
	padding-top: 10px;
	padding-bottom: 10px;
	margin: 0px;
	margin-top: 15px;
	margin-bottom: 15px;
	border-style: solid;
	border-width: 1px;
	border-radius: 8px;
	border-color: #202020;
}

.rambling h2 {
	text-align: center;
	margin-bottom: 15px;
}

.rambling h3 {
	text-align: center;
	font-size: 13pt;
	text-decoration: none;
	margin-bottom: 15px;
}

.rambling p {
	text-indent: 7px;
	margin-top: 7px;
	margin-bottom: 7px;
}

.ramblingdate {
	text-indent: 0px;
	padding-top: 10px;
	margin-bottom: 0px;
	text-align: right;
}

#contacts {
	float: left;
	margin-left: 30px;
}

#aboutimg {
	float: right;
	margin-right: 30px;
}


.permalink {
  margin: auto;
  text-align: center;
}

.permalink h2 {
  display: inline-block;
}

.permalink a img {
  max-height: 18pt;
  margin-bottom: -6px;
  border-left: 1px solid;
  border-color: black;
}

.permalink a img:hover {
  content: url("img/permalink_hover.png");
}

.rsslink {
  color: #eeeeee;
  margin-right: 8px;
}

img {
  background-color: white;
  background-image: url('data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIGlkPSJsb2FkZXItMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiDQogICB3aWR0aD0iMTAwcHgiIGhlaWdodD0iMTAwcHgiIHZpZXdCb3g9IjAgMCA0MCA0MCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgNDAgNDAiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KICA8cGF0aCBvcGFjaXR5PSIwLjIiIGZpbGw9IiMwMDAiIGQ9Ik0yMC4yMDEsNS4xNjljLTguMjU0LDAtMTQuOTQ2LDYuNjkyLTE0Ljk0NiwxNC45NDZjMCw4LjI1NSw2LjY5MiwxNC45NDYsMTQuOTQ2LDE0Ljk0Ng0KICAgIHMxNC45NDYtNi42OTEsMTQuOTQ2LTE0Ljk0NkMzNS4xNDYsMTEuODYxLDI4LjQ1NSw1LjE2OSwyMC4yMDEsNS4xNjl6IE0yMC4yMDEsMzEuNzQ5Yy02LjQyNSwwLTExLjYzNC01LjIwOC0xMS42MzQtMTEuNjM0DQogICAgYzAtNi40MjUsNS4yMDktMTEuNjM0LDExLjYzNC0xMS42MzRjNi40MjUsMCwxMS42MzMsNS4yMDksMTEuNjMzLDExLjYzNEMzMS44MzQsMjYuNTQxLDI2LjYyNiwzMS43NDksMjAuMjAxLDMxLjc0OXoiLz4NCiAgPHBhdGggZmlsbD0iIzAwMCIgZD0iTTI2LjAxMywxMC4wNDdsMS42NTQtMi44NjZjLTIuMTk4LTEuMjcyLTQuNzQzLTIuMDEyLTcuNDY2LTIuMDEyaDB2My4zMTJoMA0KICAgIEMyMi4zMiw4LjQ4MSwyNC4zMDEsOS4wNTcsMjYuMDEzLDEwLjA0N3oiPg0KICAgIDxhbmltYXRlVHJhbnNmb3JtIGF0dHJpYnV0ZVR5cGU9InhtbCINCiAgICAgIGF0dHJpYnV0ZU5hbWU9InRyYW5zZm9ybSINCiAgICAgIHR5cGU9InJvdGF0ZSINCiAgICAgIGZyb209IjAgMjAgMjAiDQogICAgICB0bz0iMzYwIDIwIDIwIg0KICAgICAgZHVyPSIwLjVzIg0KICAgICAgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiLz4NCiAgICA8L3BhdGg+DQogIDwvc3ZnPg==');
	background-repeat: no-repeat;
  background-position: center;
}

#main #grid img {
  background: transparent;
  background-image: none;
}

#curphoto {
  min-height: 500px;
  min-width: 500px;
}

