/* BSMR // style // V1 */

/*  ++++++++++++++++++++++++++++++++

    1.1 Root
          Colors of UX
  /  1,2 Text
          Sizes
          Link Coloring
          Element Standarts
  /  1.3 Section.Maincontent
          Format

  /   2.1 IMG
          Skaling
          Caption style
     2.2 Video
          Skaling
  /   2.3 Changelog
          Table Style

  /   3.1 Menu
  /   3.2 Sources
  /   3.3 Newsletter Box
     3.4 Sharing
          Social Media Buttons
  /   3.5 Author Bio
  /   3.6 Cookie Notice
  /   3.7 Section.Footer

++++++++++++++++++++++++++++++++  */


.buy a {
  font-weight: bold;
  text-decoration: none;
}
.buy a:not(:hover) {
    color: #FFF;
}
.buy a:hover {
  color: #FFF;
}

.buy_underline {
  display: inline-block;
}
.buy_underline:after {
    content: '';
    display: block;
    width: 0;
    height: 2px;
    background: #FFF;
    transition: width .3s;
}
.buy_underline:hover:after {
    width: 100%;
}

ul.buy {
  list-style: none;
  flex-wrap: wrap;
  padding: 0;
  margin: 0;
}

li.buy {
  padding: 2% 2%;
  margin-bottom: 2%;
  margin-right: 2%;
  height: auto;
  border: 0px solid #FFF;

  z-index: 1;
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
  outline: none;

  list-style: none;
  vertical-align: middle;
  display: inline-block;
  overflow: hidden;
}
li.buy:hover {
  color: #FFF;
}
li.buy:after {
  position: absolute;
  content: "";
  width: 0;
  height: 100%;
  top: 0;
  right: 0;
  z-index: -1;
  background-color: #333;
  transition: all 0.3s ease;
}
li.buy:hover:after {
  left: 0;
  width: 100%;
}

li.buy_jpc {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='576' height='293' viewBox='0 0 575.7 293.1'%3E%3Crect x='133.9' y='79.2' width='47.2' height='108.6' fill:%23333;/%3E%3Crect x='67' y='111.2' width='47.2' height='76.6' fill:%23333;/%3E%3Crect x='0.1' y='138.4' width='47.2' height='49.3' fill:%23333;/%3E%3Cpath d='M345.6 140.9c8.2-0.1 13.6-1.1 19.5-3.4 6-2.2 11.1-5.4 15.4-9.6 4.3-4.1 7.6-9 9.9-14.6 2.3-5.6 3.5-11.7 3.5-18.5 0-8.6-2.2-16.5-6.6-23.5-4.4-7.2-10.5-12.7-18.2-16.8-7.8-4.1-16.2-6.1-25.4-6.1h-3l0 92.6C340.7 140.9 345.2 140.9 345.6 140.9L345.6 140.9zM237.3 37.4c10.3 0 18.7-8.4 18.7-18.7C256 8.4 247.7 0 237.3 0c-10.3 0-18.7 8.4-18.7 18.7C218.7 29 227 37.4 237.3 37.4zM472.8 83c2.8 1.6 5.8 2.5 9.1 2.5 3.5 0 6.6-0.8 9.3-2.5 2.9-1.6 5.1-3.9 6.7-6.6 1.6-2.8 2.5-5.9 2.5-9.4 0-3.5-0.8-6.6-2.5-9.4-1.6-2.8-3.9-5-6.7-6.7-2.7-1.6-5.9-2.5-9.4-2.5-3.4 0-6.5 0.8-9.2 2.5-2.8 1.6-5 3.9-6.7 6.8-1.6 2.7-2.5 5.9-2.5 9.3 0 3.3 0.9 6.4 2.5 9.2C467.8 79.1 470 81.3 472.8 83L472.8 83zM417.2 128.1c2.9 2.7 6.4 5.1 10.3 7.2 7.8 4 16.6 6 26.4 6 15.6 0 28.1-4.3 37.3-12.9 2.3-2.1 3.9-3.8 4.9-5.2 1.2-1.6 2.8-4.2 4.8-7.9l-5.4-1.3c-2.4 3.8-4.4 6.5-6 8.2-1.6 1.8-3.8 3.7-6.5 5.8-7.5 5.6-15.6 8.4-24.2 8.4-0.9 0-2.9-0.2-5.9-0.6V47.9h-2.2c-13.7 0-24.9 4.4-33.6 13.1-4.2 4.3-7.6 9.4-10.1 15.3-2.5 6-3.8 11.8-3.8 17.7 0 9.2 2.2 17.4 6.5 24.5C411.7 122.2 414.3 125.4 417.2 128.1L417.2 128.1z' fill:%23333;/%3E%3Crect x='279.7' y='48.1' width='50.6' height='140' fill:%23333;/%3E%3Cpath d='M243.4 186.4c5-1.5 9-3.8 12-6.8 3-3.1 4.8-6.6 5.4-10.7s0.9-11.8 0.9-23.3V48.1h-48.6v100.7c0 11.4-0.3 17.6-1 18.6-0.7 1-3.8 1.5-9.4 1.5l0 19.7h18.2C230.9 188.6 238.4 187.8 243.4 186.4z' fill:%23333;/%3E%3C/svg%3E");
}























































div.content, div.aftercontent, div.bio_section {
}















































p.literature-title {
  clear: both;
  color: var(--text);
  font-weight: var(--bold);
}
img.literature-img {
    width: 22%;
    height: auto;
}
#literature-left {
    float: left;
}
p.literature-description {
  color: var(--text);
}
p.literature-buy {
  color: var(--text);
  font-weight: var(--bold);
}


.book-container#literature-left {
  padding: 0 2rem 0.5rem 0;
}
.book-container {
  width: 6rem;
  height: 9rem;
  display: flex;
  align-items: center;
  justify-content: center;
  perspective: 400px;
}
.book {
  transform: rotateY(-20deg);
  position: relative;
  transform-style: preserve-3d;
  width: 6rem;
  height: 9rem;
  transition: transform 1s ease;
  animation: 1s ease 0s 1 initAnimation;
}
.book:hover {
  transform: rotate(0deg);
}
@keyframes initAnimation {
  0% {
    transform: rotateY(0deg);
  }
  100% {
    transform: rotateY(-20deg);
  }
}
.book > :first-child {
  position: absolute;
  background: #000000;
  width: 6rem;
  height: 9rem;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
  box-shadow: 5px 5px 20px #666;
}
.book::before {
  content: ' ';
  background: #FFF;
  height: calc(9rem - 2 * 3px);
  width: 50px;
  top: 3px;
  position: absolute;
  transform: translateX(calc(6rem - 50px / 2 - 3px)) rotateY(90deg) translateX(calc(50px / 2))
}
.book::after {
  content: ' ';
  position: absolute;
  left: 0;
  width: 6rem;
  height: 9rem;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
  background: #000000;
  transform: translateZ(-50px);
  box-shadow: -10px 0 50px 10px #666;
}






















/*  ++++++++++++++++++++++++++++++++
    1.1 Root
++++++++++++++++++++++++++++++++  */
:root {
  --primary: #DA4167;
  --secondary: #ff3f34;
  --tertiary: #2c2c54;

  --text: #FFFAFF;
  --background: #121212;
  --background-overlay-1: #1d1d1d;
  --background-overlay-2: #2d2d2d;

  --bold: 600;
}

body {
  background: var(--background);
  padding-top: 0px;
  margin: 0px;
}

/* Scrollbar  */
::-webkit-scrollbar {
  width: 14px;
}
::-webkit-scrollbar-track {
  background: var(--background-overlay-1);
}
::-webkit-scrollbar-thumb {
  background: var(--background-overlay-2);
}
::-webkit-scrollbar-thumb:hover {
  background: var(--primary);
}
/*  +++++++++++++++++++++++++++++++++++  */















/*  ++++++++++++++++++++++++++++++++
    1.2 Text
++++++++++++++++++++++++++++++++  */
html {
  font-size: 16px;
}
@media screen and (min-width: 320px) {
  html {
    font-size: calc(16px + 6 * ((100vw - 320px) / 680));
  }
}
@media screen and (min-width: 1000px) {
  html {
    font-size: 22px;
  }
}

h1,h2,h3,p,ul,ol{font-family: Arial, Helvetica, sans-serif; color: var(--text);}

h1,h2,h3{font-weight: var(--bold);clear: both;}

@media only screen and (min-width: 992px) {
      h1{font-size:2rem;}
      h2{font-size:1.6rem;}
      h3{font-size:1.3rem;}
      p, ul, ol {font-size:1rem;}
}

@media only screen and (max-width: 991px) {
      h1{font-size:2rem;}
      h2{font-size:1.6rem;}
      h3{font-size:1.3rem;}
      p, ul, ol {font-size:1rem;}
}

::selection {
  background: var(--primary);
  color: #FFF;
}
::-moz-selection {
  background: var(--primary);
  color: #FFF;
}

/*  ---------------------------  */

a {
  text-decoration: none;
}
section.maincontent p a, section.maincontent li a, section.addition a {
  font-weight: var(--bold);
}

/* Internal Links */
section.maincontent p a[href^="/"], section.maincontent li a[href^="/"], section.maincontent td a[href^="/"] {
  color: var(--primary);
}
section.maincontent p a[href^="#"], section.maincontent li a[href^="#"], section.maincontent td a[href^="#"] {
  color: var(--text);
}

/* External Links */
a[rel^="external"] {
  color: var(--text);
}
a[rel^="external"]::after {
    content: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Crect width='6' height='6' x='1.5' y='4.5' style='fill:%23000000;stroke:%23FFF'/%3E%3Cpath d='M4 2.5L5 3.5 5.3 4.3 2.8 6.5 5.5 9.3 7.8 6.8 8.5 7 9.5 8 11 6.5 11 1 5.5 1 4 2.5z' style='fill:%23FFF;stroke-width:1px'/%3E%3Cpath d='M6 2L10 2 10 6 9.5 6.8 8.3 4.8 5.3 8 4 6.8 7.3 3.8 5.3 2.5 6 2z' style='fill:%23000000;stroke-width:1px'/%3E%3C/svg%3E");
    position: absolute;
    margin: 0;
    border-bottom: none;
    padding: 0 0.4rem 0 0.4rem;
}

/* Hover */
section.maincontent p a:hover, section.maincontent p a:active {
  background: var(--primary);
  color: var(--text) !important;
}

/*  ---------------------------  */

strong, bold {
  font-weight: var(--bold);
}

hr {
  border: none;
  background-color: var(--text);
  height: 1px;
}
/*  +++++++++++++++++++++++++++++++++++  */















/*  ++++++++++++++++++++++++++++++++
    1.3 Section.Maincontent
++++++++++++++++++++++++++++++++  */
@media only screen and (max-width: 991px) {
  section.maincontent, section.addition {
    padding-top: 1.3rem;
    padding-left: 7%;
    padding-right: 7%;
   }
}

@media only screen and (min-device-width: 992px) and (max-device-width: 1024px) {
  section.maincontent, section.addition {
    padding-top: 1.3rem;
    padding-left: 7%;
    padding-right: 7%;
   }
}

@media only screen and (min-width: 1024px) {
  section.maincontent, section.addition {
    padding-top: 1.7rem;
    padding-left: 16%;
    padding-right: 16%;
   }
}

div.content {
  max-width: 50rem;
  background: var(--background-overlay-1);
  padding: 1rem 2rem 2rem 2rem;
  margin-top: 4.5rem;
}
div.aftercontent {
  max-width: 50rem;
  background: var(--background-overlay-1);
  padding: 1rem 2rem 2rem 2rem;
}
/*  ---------------------------  */















/*  ++++++++++++++++++++++++++++++++
    2.1 IMG
++++++++++++++++++++++++++++++++  */
figure {
  margin: auto;
}
figcaption, .figcaption {
  margin: 0.3rem 0 1rem 0;
  color: var(--text);
  font-style: italic;
}
img.img {
  height: auto;
  margin: auto;
}
@media only screen and (max-width: 991px) {
   img.img {
     width: 100%;
   }
}


#img_full {
  clear: both;
  width: 100%;
  float: left;
}
figcaption#figcaption_full {
  clear: both;
  width: 100%;
  float: left;
}


#img_left {
  clear: both;
  float: left;
  padding-right: 5%;
  `}
#img_right {
  clear: both;
  float: right;
  padding-left: 5%;
}
@media only screen and (max-width: 991px) {  
  #img_left {
    width: 55%;
  `}
  #img_right {
    width: 55%;
  `}
}
@media only screen and (min-width: 992px) {  
  #img_left {
    width: 45%;
  `}
  #img_right {
    width: 45%;
  `}
}


#img_2_left {
  clear: both;
  width: 48%;
  float: left;
  padding-right: 2%;
}
figcaption#figcaption_2_left {
  clear: both;
  width: 48%;
  float: left;
}
#img_2_right {
  width: 48%;
  padding-left: 2%;
}
figcaption#figcaption_2_right {
  width: 48%;
  float: right;
}
/*  ---------------------------  */















/*  ++++++++++++++++++++++++++++++++
    2.2 Video
++++++++++++++++++++++++++++++++  */
video {
  max-width: 100%;
  height: auto;
}

.youtube_embed {
  position: relative;
  margin: 2rem 0 4rem 0;
}
@media only screen and (max-width: 991px) {
  .youtube_embed {
    max-width: 100%;
  }
}
@media only screen and (min-width: 992px) {
  .youtube_embed {
    max-width: 100%;
  }
}
.youtube_embed:before {
  content: "";
  display: block;
  padding-top: 56%; /* 16:9 Format */
}
.youtube_embed iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.youtube_embed figcaption {
  position: absolute;
}
/*  ---------------------------  */
















/*  ++++++++++++++++++++++++++++++++
    2.3 Changelog
++++++++++++++++++++++++++++++++  */
.sortbutton { width: 100%; height: 100%; border: none; background-color: transparent; font: inherit; color: inherit; text-align: inherit; padding: 0; cursor: pointer; }
sortierbar thead th span.visually-hidden { position: absolute !important; clip: rect(1px, 1px, 1px, 1px) !important; padding: 0 !important; border: 0 !important; height: 1px !important; width: 1px !important; overflow: hidden !important; white-space: nowrap !important; }
.sortierbar caption span { font-weight: normal; font-size: .8em; }
.sortbutton::after { display: inline-block; letter-spacing: -.2em; margin-left: .1em; width: 1.8em; }
.sortbutton.sortedasc::after { content: "\25B2\25BD"; }
.sortbutton.sorteddesc::after { content: "\25B3\25BC"; }
.sortbutton.unsorted::after { content: "\25B3\25BD"; }
.sortbutton.sortedasc > span.visually-hidden:first-of-type { display: none; }
.sortbutton.sorteddesc > span.visually-hidden:last-of-type { display: none; }
.sortbutton.unsorted > span.visually-hidden:last-of-type { display: none; }

table {
	border-spacing: 0px;
	border-collapse: collapse;
	overflow-x:auto;
}

table, td, th {
	border: 1px solid black;
}

table td {
	border-spacing: 0px;
	border-collapse: collapse;
	padding: 3px;
}

table th {
	border-spacing: 0px;
	border-collapse: collapse;
	padding: 3px;
	outline: none;
}

tr:nth-child(even) {background-color: #f2f2f2;}

tr:hover {
  color: #ffffff;
  background-color: var(--primary);
}
tr:hover a {
  color: #ffffff !important;
}

table caption {
	padding: 0.5em;
	text-align: left;
	font-weight: bold;
}

table.is_sortable thead th {
	background-color: var(--primary);
	color: #FFFFFF;
}
/*  ---------------------------  */
















/*  ++++++++++++++++++++++++++++++++
    3.1 Menu
++++++++++++++++++++++++++++++++  */
/* Sticky header don't overlay internal #links */
html {
  scroll-padding-top: 85px;
}
nav a {
  font-weight: var(--bold);
  color: #FFF;
}
@media only screen and (min-width: 991px) {
  .desktophide {
    display: none !important;
  }
}
@media only screen and (max-width: 992px) {
  .mobilehide {
    display: none !important;
  }
}
/*  ---------------------------  */
















/*  ++++++++++++++++++++++++++++++++
    3.2 Table of Contents, Bibliography
++++++++++++++++++++++++++++++++  */
div.toc {
    border-left: 8px solid var(--primary);
    margin: 0 0 2rem 0;
    overflow: hidden;
    padding: 0 0 0 1.5rem;
    background-color: var(--background-overlay-2);
}
div.toc a {
  color: var(--text);
  font-weight: var(--bold);
  text-decoration: none;
}
p.toc-headline {
  font-size: 1.3rem;
  color: var(--text);
  font-weight: var(--bold);
}
ul.toc-list {
  color: var(--text);
  list-style-type: none;
  margin-left: 0.4rem;
  padding: 0;
}
li.toc-bullet {
}
ul.toc-list-2 {
  list-style-type: none;
  margin-left: 1.2rem;
  padding: 0;
}
li.toc-bullet-2 {
}


sup a {
    color: var(--text);
    text-decoration: none;
}
div.citation {
  margin-left: 2.2rem;
}
div.citation p, div.citation p a {
  color: var(--text);
}
p.citation-headline {
  clear: both;
  font-size: 1.3rem;
  color: var(--text);
  font-weight: var(--bold);
}
span.citation-number {
  float: left;
  margin-left: -2.2rem;
}
span.citation-title {
}
span.citation-description {
  font-style: italic;
  display: inline-block;
}
span.citation-link {
  font-style: italic;
  display: inline-block;
}
/*  ---------------------------  */
















/*  ++++++++++++++++++++++++++++++++
    3.3 Newsletter Box
++++++++++++++++++++++++++++++++  */



/*  ---------------------------  */
















/*  ++++++++++++++++++++++++++++++++
    3.4 Sharing
++++++++++++++++++++++++++++++++  */
.share_headline {
  text-align: center;
  font-weight: 600;
  font-size: 1.6rem;
}

.share a {
  font-weight: var(--bold);
  text-decoration: none;
}
.share a:not(:hover) {
    color: #FFF;
}
.share a:hover {
  color: #FFF;
}

.share_underline {
  display: inline-block;
}
.share_underline:after {
    content: '';
    display: block;
    width: 0;
    height: 2px;
    background: #FFF;
    transition: width .3s;
}
.share_underline:hover:after {
    width: 100%;
}

ul.share {
  list-style: none;
  flex-wrap: wrap;
  padding: 0;
  margin: 0;
  text-align: center;
}

@media only screen and (max-width: 991px) {
  li.share {
    width: 26%;
  }
}
@media only screen and (min-width: 992px) {
  li.share {
    width: 26%;
  }
}

li.share {
  padding: 2% 2%;
  margin-bottom: 2%;
  margin-right: 2%;
  height: auto;
  border: 0px solid #FFF;

  z-index: 1;
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
  outline: none;

  list-style: none;
  vertical-align: middle;
  display: inline-block;
  overflow: hidden;
}
li.share:hover {
  color: #FFF;
}
li.share:after {
  position: absolute;
  content: "";
  width: 0;
  height: 100%;
  top: 0;
  right: 0;
  z-index: -1;
  background-color: var(--primary);
  transition: all 0.3s ease;
}
li.share:hover:after {
  left: 0;
  width: 100%;
}

li.via-telegram {
  background-color: #0088CC;
}
li.via-whatsapp {
  background-color: #25D366;
}
li.via-facebook {
  background-color: #3b5998;
}
li.via-twitter {
  background-color: #55ACEE;
}
li.via-linkedin {
  background-color: #0077B5;
}
li.via-pinterest {
  background-color: #CB2027;
}
li.via-mail {
  background-color: #7d7d7d;
}
/*  ---------------------------  */
















/*  ++++++++++++++++++++++++++++++++
    3.5 Author Bio
++++++++++++++++++++++++++++++++  */
.bio_section {
	background: none repeat scroll 0 0 var(--primary);
  padding: 0.8rem 1.2rem 0.8rem 1.2rem;
  margin-top: 1.7rem;
}

.bio_author_name a {
  color: #FFF !important;
}
.bio_author_name {
  font-weight: var(--bold);
  font-size: 1.3rem;
  text-align: left;
}

.bio_author_text a {
  color: #FFF !important;
}
.bio_author_text {
  color: #FFF;
  text-align: left;
}
.bio_author_text#bio_left {
  clear: right;
}
.bio_author_text#bio_right {
  clear: left;
}

img.bio_author_img {
	border: 3px solid #FFF;
	margin-bottom: 1.5%;
  overflow: hidden;
}
img.bio_author_img:after {
  content: "";
  clear: both;
}
@media only screen and (max-width: 991px) {
  img.bio_author_img {
    min-width: 33%;
    max-width: 36%;
    height: auto;
   }
}
@media only screen and (min-width: 992px) {
  img.bio_author_img {
    min-width: 20%;
    max-width: 22%;
    height: auto;
   }
}

img.bio_author_img#bio_left {
	float: left;
	margin-right: 3%;
}
img.bio_author_img#bio_right {
	float: right;
	margin-left: 3%;
}
/*  ---------------------------  */
















/*  ++++++++++++++++++++++++++++++++
    3.6 Cookie Notice
++++++++++++++++++++++++++++++++  */
div#cookie_fingerzeig {
 position: fixed;
 bottom: 36px;
 left: 3%;
 width: 94%;
 z-index: 99999;
 text-align: center;
 background-color: rgba(234, 239, 241, 0.7);
 border-style: solid;
}
p#cookie_fingerzeig_text {
 padding-left: 7px;
 padding-right: 7px;
}

a.cookie_fingerzeig_button,
a.cookie_fingerzeig_button:visited {
 text-decoration: none;
 padding: 7px;
 background-color: #000000;
 color: #FFFFFF;
 margin-right: 10px;
}

a.cookie_fingerzeig_button:hover,
a.cookie_fingerzeig_button:active {
 background-color: var(--primary);
 color: #FFFFFF;
}
/*  ---------------------------  */
















/*  ++++++++++++++++++++++++++++++++
    3.7 Section.Footer
++++++++++++++++++++++++++++++++  */
section.footer {
  background-color: var(--tertiary);
  font-size: 1rem;
  color: #FFF;
  width: 100%;
  margin-top: 44px;
  padding-top: 33px;
  padding-bottom: 6px;
  margin-bottom: -6px;

}
section.footer a{
  color: #FFF;
}
.footer-center {
  text-align: center;
}
.footer-left {
  float: left;
  margin-left: 10%;
}
.footer-right {
  float: right;
  margin-right: 10%;
}
/*  ---------------------------  */