/* 
 * Style sheet for UEP - Berliner Moorböden im Klimawandel
 * version: 1.0
 * last modified: dd.mm.2015 by Carola Rocks
 * author: Carola Rocks
 * e-mail: carola.rocks@webtransledit.de
 * website: http://www.webtransledit.de
*/
body {background:rgba(255,255,255,1);}
/*resets*/
body{font-size:14px;line-height:1.65em;}.h1,h1{font-size:2.6em;}.h2,h2{font-size:2.15em;}.h3,h3{font-size:1.7em;}.h4,h4{font-size:1.25em;}.h5,h5{font-size:1em;}.h6,h6{font-size:.85em;}.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6{margin-top:.5em;margin-bottom:.5em;line-height:1.2em;}pre{font-size:.9em;}.lead{font-size:1.5em;margin-bottom:.85em;}blockquote{font-size:1.25em;}.highlight,p{margin-bottom:1.65em;}.alert,.breadcrumb,.flex-video,.form-group,.jumbotron p,.list-group,.progress,.table,.well,address,dt,legend,ol,ul{margin-bottom:1.5em;}p+dt,p+ol,p+ul{margin-top:-.15em;}
/*end of resets*/
body > .container {background:rgba(255,255,255,1); }
h1, h2, h3, h4 {color:#544D39;}
h1, h2, h3, h4, p, small { -webkit-hyphens: manual; -moz-hyphens: manual; -ms-hyphens: manual; hyphens: manual;}
a {color:#5884A0; }
a:focus { outline: 0;}

@media (min-width: 992px) {
  .row { margin-right: 0; margin-left: 0;}
}
/* overriding navbar defaults for small devices - mobile first */
/* setting menu bg colors */
.navbar-default {
  background-color: #C3D59B;
  background-image: none;
  filter: none; 
  border-radius: 0;
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075);
          box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075);}
/* color of 1st level element font for small devices */
.navbar-default .navbar-nav > li > a { color: #545933; }
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  color: #000000; }
/* changing default grey color of clicked menu tabs to light green - 1st/first level */
.navbar-default .navbar-collapse {border-color: #D7E5B5;} /* light green */
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
  background-color: #D7E5B5;} /* light green */
/* dropdown items - 2nd level */
.dropdown-menu {background:#D7E5B5; margin:0; padding:0; }
.dropdown-menu ul {list-style: none; margin-bottom:0.8em; padding-left:32px; clear: both;}
.dropdown-menu ul li {margin:0;}
.dropdown-menu ul li a {
  display: block; padding: 3px; font-weight: normal;
  line-height: 1.428571429; width:100%; background:transparent;}
.dropdown-menu ul li a:hover,
.dropdown-menu ul li a:focus {text-decoration: none; background:rgba(232, 223, 201,0.5);} /* light brown */ 
.dropdown-menu> li:last-child { margin-bottom: 0; }
/* dropdown font colors */
.dropdown-menu ul li:first-child a {color:#555E2F; font-weight:bold;}
.dropdown-menu ul li:first-child a:focus,
.dropdown-menu ul li:first-child a:hover {color:#646B44;}
.dropdown-menu ul li a {color:#5B633A;} 
.dropdown-menu ul li a:focus,
.dropdown-menu ul li a:hover {color:#485B1F;}
.dropdown-menu ul.ibw li:nth-child(2) a {color:#757C56; font-weight:bold;}
.dropdown-menu ul.ibw li:nth-child(2) a:focus, .dropdown-menu ul.ibw li:nth-child(2) a:hover {color:#7A7256;
}
.logo-brand {vertical-align:middle; margin-top:-6px;}
/* navbar collapsed toggle button */
.navbar-default .navbar-toggle {
  border-color: #858C58; background-color:#C3D59B; transition:.3s background-color; }
.navbar-default .navbar-toggle:focus { 
  background-color: transparent; } /* changed in bootstrap.css to #C3D59B */
.navbar-default .navbar-toggle:hover { 
  background-color: #D8EDA8; } 
.navbar-default .navbar-toggle .icon-bar {
  background-color: #858C58;
}
/* breakpoint change as navbar menu items are too long for 768px */
@media (max-width: 991px) {
  .navbar-header {float: none; padding-right:15px;}
  .navbar-toggle {display: block;}
  .navbar-collapse {border-top: 1px solid transparent;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);}
  .navbar-collapse.collapse {display: none!important;}
  .navbar-nav {float: none!important; margin: 7.5px -15px;}
  .navbar-nav>li {float: none;}
  .navbar-nav>li>a {padding-top: 10px; padding-bottom: 10px; }
  .navbar-collapse.collapse.in {display: block!important; }
  .collapsing {overflow: hidden!important; }
  .navbar-nav .open .dropdown-menu { position: static;
    float: none; width: auto; margin-top: 0; border: 0; background:#D7E5B5;
    -webkit-box-shadow: none; box-shadow: none;}
}
/* end of breakpoint change */
@media (min-width: 992px) {
  /* larger font style etc on navbar - 1st/first level */
  .navbar-default .navbar-nav > li > a { #54522C; transition:.3s background-color; }
  .navbar-default .navbar-nav > li > a:focus,
  .navbar-default .navbar-nav > li > a:hover {background:#B2C18D; color: #F8F9E3; }
}
@media (min-width: 992px) and (max-width: 1199px) {
  /* larger font style etc on navbar - 1st/first level */
  .navbar-default .navbar-nav > li > a { font-size:16px; }
}
@media (min-width: 1200px) {
  /* again LARGER font style etc on navbar - 1st/first level */
  .navbar-default .navbar-nav > li > a { font-size:18px; }
}
@media (min-width: 992px) {
  .navbar-brand {display: none;}
  .navbar-default { border-color: #acbe85;}
  /* larger font style etc on navbar - 1st/first level */
  .navbar-default .navbar-nav > li > a { color: #54522C; transition:.3s background-color;}
  .navbar-default .navbar-nav > li > a:focus,
  .navbar-default .navbar-nav > li > a:hover {background:#B2C18D; color: #F8F9E3;}
  /* dropdown - open */ 
  .dropdown-menu ul {padding: 8px 16px;}
  .dropdown-menu ul li a {padding:3px; line-height:1.285714286; font-size:16px; font-weight:bold; } 
  .dropdown-menu ul li a:hover,
  .dropdown-menu ul li a:focus { background:rgba(232, 223, 201,0.5);}
  .dropdown-menu ul li:first-child a {color:#555E2F;}
  .dropdown-menu ul li a {color:#848c67;} 
  .dropdown-menu ul li a:hover { background:rgba(232, 223, 201,0.5);} 
  /* kernparameter wasserstand */
  .dropdown-menu ul.ibw li:nth-child(2) a {color:#5A6628; } /* #8E7304 */
  .dropdown-menu ul.ibw li:nth-child(2) a:hover, .dropdown-menu ul.ibw li:nth-child(2) a:focus {color:#685C33;} /* good: #738230 */

  .dropdown-menu, .dropdown-toggle:active, .open .dropdown-toggle,
  .navbar-default .navbar-nav .open .dropdown-menu>li>a,
  .navbar-default .navbar-nav .open .dropdown-menu {
    background-color: #EFF7DE;} /* light green */
  /* active tab, that has no dropdowns */
  .navbar-default .navbar-nav > .active{
    color: #726F4B;
    background: #D8E2B7; }
  .navbar-default .navbar-nav > .active > a, 
  .navbar-default .navbar-nav > .active > a:hover, 
  .navbar-default .navbar-nav > .active > a:focus {
    color: #726F4B;
    background: #D8E2B7;
  } 
}
@media only screen and (min-width:992px) {
  /* hover */
  .dropdown:hover .dropdown-menu {display: block;}
  /* animation */
  @-webkit-keyframes slideDown-01 { 0% {height: 0px;} 100% {height: 156px;} }
  @-moz-keyframes slideDown-01 {    0% {height: 0px;} 100% {height: 156px;} }
  @keyframes slideDown-01 {         0% {height: 0px;} 100% {height: 156px;} }
  .slideDown-01 {overflow: hidden; 
    -moz-animation-name: slideDown-01; -webkit-animation-name: slideDown-01; animation-name: slideDown-01;
    -moz-animation-timing-function: ease-out;
    -moz-animation-duration: 0.5s;
    -moz-animation-iteration-count: 1;
    -moz-animation-fill-mode: forwards;  
    -webkit-animation-timing-function: ease-out;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-fill-mode: forwards;
    animation-timing-function: ease-out;
    animation-duration: 0.5s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards; }
  @-webkit-keyframes slideDown-02 { 0% {height: 0px;} 100% {height: 182px;} }
  @-moz-keyframes slideDown-02 {    0% {height: 0px;} 100% {height: 182px;} }
  @keyframes slideDown-02 {         0% {height: 0px;} 100% {height: 182px;} }
  .slideDown-02 {overflow: hidden; 
    -moz-animation-name: slideDown-02; -webkit-animation-name: slideDown-02; animation-name: slideDown-02;
    -moz-animation-timing-function: ease-out;
    -moz-animation-duration: 0.5s;
    -moz-animation-iteration-count: 1;
    -moz-animation-fill-mode: forwards;  
    -webkit-animation-timing-function: ease-out;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-fill-mode: forwards;
    animation-timing-function: ease-out;
    animation-duration: 0.5s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards; }
  @-webkit-keyframes slideDown-03 { 0% {height: 0px;} 100% {height: 128px;} }
  @-moz-keyframes slideDown-03 {    0% {height: 0px;} 100% {height: 128px;} }
  @keyframes slideDown-03 {         0% {height: 0px;} 100% {height: 128px;} }
  .slideDown-03 {overflow: hidden; 
    -moz-animation-name: slideDown-03; -webkit-animation-name: slideDown-03; animation-name: slideDown-03;
    -moz-animation-timing-function: ease-out;
    -moz-animation-duration: 0.5s;
    -moz-animation-iteration-count: 1;
    -moz-animation-fill-mode: forwards;  
    -webkit-animation-timing-function: ease-out;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-fill-mode: forwards;
    animation-timing-function: ease-out;
    animation-duration: 0.5s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards; }
  @-webkit-keyframes slideDown-04 { 0% {height: 0px;} 100% {height: 124px;} }
  @-moz-keyframes slideDown-04 {    0% {height: 0px;} 100% {height: 124px;} }
  @keyframes slideDown-04 {         0% {height: 0px;} 100% {height: 124px;} }
  .slideDown-04 {overflow: hidden; 
    -moz-animation-name: slideDown-04; -webkit-animation-name: slideDown-04; animation-name: slideDown-04;
    -moz-animation-timing-function: ease-out;
    -moz-animation-duration: 0.5s;
    -moz-animation-iteration-count: 1;
    -moz-animation-fill-mode: forwards;  
    -webkit-animation-timing-function: ease-out;
    -webkit-animation-duration: 0.5s;
    -webkit-animation-iteration-count: 1;
    -webkit-animation-fill-mode: forwards;
    animation-timing-function: ease-out;
    animation-duration: 0.5s;
    animation-iteration-count: 1;
    animation-fill-mode: forwards; }
}
@media (min-width: 1200px) {
.navbar {margin-top:196px; } /* move up/down in conjunction with position of page-header */ 
}
/* end of main navbar top */

/* header */
.page-header {padding:0; margin-top:-20px; 
	background: url(../img/bg-panorama-mit-sbahn.jpg) no-repeat center 50%; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
	-webkit-box-shadow: inset 0 -4px 9px -3px #000;
	-moz-box-shadow: inset 0 -4px 9px -3px #000;
	box-shadow: inset 0 -4px 12px -3px #000;
    color: #fff;
    text-shadow: black 0.3em 0.3em 0.3em;
}
/* .page-header .logo-uep-small {margin-top:1.375em; margin-left:-1.125em; } */
.page-header .logo-uep-head  {width:65px; height:81px; margin-top:1.375em; margin-left:-1.125em;}
.page-header h1 { /* display:inline-block; background:#C3D59B; */ margin-left:0.5em; margin-bottom:0; font-size: 22px; line-height:1.3; color:#EFECDA; -webkit-hyphens: auto;
   -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; }
.page-header .logo-hu-head {margin-top:1.725em; width:65px; float:right; margin-right:-0.975em;}

/* language switch */
ul.lang-switch  { clear:both; float:right; margin-right:1.0em; line-height:1.0; white-space:nowrap;}
ul.lang-switch a { display:inline-block; color:#FFF; text-transform:uppercase; cursor:pointer;}
ul.lang-switch li {list-style:none; display:inline-block;}
ul.lang-switch span { vertical-align: bottom; margin-right:0.25em; margin-left:0.25em;
	content: "";
    display: inline-block;
    width: 0px;
    height: 1.0em;
    border-right: 1px solid #fafafa;
    border-left: 1px solid #b4b4b4;
    padding: 0;
	}
ul.lang-switch li:active a, ul.lang-switch li.active a {font-weight:bold;}
ul.lang-switch a:active, ul.lang-switch a.active {font-weight:bold;}
ul.lang-switch li a:hover { color:#FFF; text-decoration:underline; }

@media screen and (min-width: 480px) and (max-width: 639px) {
  .page-header .logo-uep-head {width:97px; height:120px;}
  .page-header h1 { font-size: 30px; line-height:1.375; }
  .page-header .logo-hu-head {margin-top:1.725em; width:80px; float:right; margin-right:-0.975em;}
  ul.lang-switch  { margin-top: -1.25em; }
}
@media screen and (min-width: 481px) and (max-width: 991px) {
  .page-header .logo-uep-head { margin-top:1.25em; margin-left:-1.125em; }
  .page-header h1 { margin-left:6.25%;}
}
@media (min-width: 640px) {
  .page-header .logo-uep-head {width:113px; height:140px;}
  .page-header .logo-hu-head {margin-top:1.725em; width:90px; margin-right:-0.975em;}
}
@media (min-width: 640px) and (max-width: 767px) {
  .page-header .logo-uep-head {margin-top:1.575em;}
  .page-header h1 { font-size: 36px; line-height:1.4; }
  ul.lang-switch  { margin-top: -1.75em; }
}
@media (min-width: 768px) {
  .page-header .logo-uep-head {margin-top:1.625em;}
  .page-header h1 { font-size: 42px; line-height:1.175; }
}
@media (min-width: 768px) and (max-width: 991px) {
  .page-header h1 { font-size: 36px; line-height:1.4; margin-left:-0.125em; padding-bottom:0.5em; }
  ul.lang-switch  { margin-top:-3.25em; }
}
@media (min-width: 992px) {
  .page-header .logo-uep-head { margin-top:1.725em; margin-left:0; }
  .page-header h1 { margin-left:-0.375em;}
  ul.lang-switch  { margin-top:-1.75em; }
}
@media (min-width: 1200px) {
  .page-header {clear:both; position:absolute; height:200px; width:100%; margin-top:-268px; } /* move in conjunction with page-header */ 
  .page-header .container {display:relative; }
  ul.lang-switch  { margin-top:-2.75em; }
}
/* end of header */

/* secondary nav2 - Home, Kontakt, Fotos etc */
.nav2-wrapper { clear:both; position:relative; float:right; margin-top: 28px; margin-right:-12px; z-index:2;}
.nav2 ul { list-style: none; width:100%; padding: 0; margin: 0; background-color: #003366; }
.nav2 li {display:inline-block; line-height: 30px; text-align:center; font-size: 1.0em; border-bottom: none;}
.nav2 a { display: block; height: inherit; padding-right:2.0%; padding-left:2.0%; border-bottom: 1px solid #888;
          text-decoration: none; color: #fff; transition: .3s background-color; }
.nav2 a:hover { background-color: #656D51; }
.nav2 a.active { background-color: #fff; color: #444; cursor: default; }
/* Sub Menus */
.nav2 > ul > li { text-align: center; }
/* .nav2 > ul > li > a { padding-left:0; } */
.nav2 li ul { position: absolute; display: none; width: inherit; }
.nav2 li:hover ul { display: block; }
.nav2 li ul li { display: block; }
@media screen and (max-width: 479px){
  .nav2-wrapper { margin-top: 0; }
  .nav2 li:first-child a { padding-left:12%; width:60px;}
}
@media screen and (min-width: 480px) and (max-width: 767px){
  .nav2-wrapper { margin-top: 0; margin-right: -14px;}
  .nav2 li { display: inline-block; width:100px; height: 35px; margin-right: -4px; line-height: 2.4; }
  .nav2 a  { border-bottom: none; padding-right:14%; padding-left:14%;}
}
@media screen and (min-width: 768px) and (max-width: 991px) {
  .nav2-wrapper { margin-top: -19px; margin-right: 0; }
  .nav2 li { display: inline-block; margin-right: -4px; width: 128px; height: 35px; line-height: 2.4; }
  .nav2 a  { border-bottom: none; padding-right:17%; padding-left:19%; }
}
@media (min-width: 992px) {
  .nav2-wrapper { margin-top: -8px; margin-right: 0; }
  .nav2 li { display: inline-block; margin-right: -4px; width:120px; height: 35px; line-height: 2.4; }
  .nav2 a  { border-bottom: none; padding-right:0.25em; padding-left:0.3em; }
}
@media (min-width: 1200px) {
  .nav2-wrapper { z-index:1000; }
  .nav2 li { width:144px; }
  .nav2 a {padding-top:2px;}
}

/* end of secondary nav - nav2 */

/* content */
@media (min-width: 640px) {
h1 {font-size:36px;}	
}
.breadcrumb { font-style:italic;}
@media (min-width: 768px) {
  .breadcrumb { background-color: transparent;}
}

/* individual pages content */
/* page Home */
.thumbnail {
  border: 1px solid #C3D59B;
}

.btn-info { padding:0.25em 0.4em 0.25em 0.6em;
  color: #5E4A03;
  background-color: #C3D59B;
  border-color: #A6B77E;
}
.btn-info:focus,
.btn-info.focus {
  background-color: #DEE8C7;
  border-color: #1b6d85;
}
.btn-info:hover {
  color:#6D5813;
  background-color: #DEE8C7;
  border-color: #A8B280;
}
.btn-info:active,
.btn-info.active,
.open > .dropdown-toggle.btn-info {
  color:#6D5813;
  background-color: #DEE8C7;
  border-color: #8D9E68;
}
.btn-info:active:hover,
.btn-info.active:hover,
.open > .dropdown-toggle.btn-info:hover,
.btn-info:active:focus,
.btn-info.active:focus,
.open > .dropdown-toggle.btn-info:focus,
.btn-info:active.focus,
.btn-info.active.focus,
.open > .dropdown-toggle.btn-info.focus {
  background-color: #269abc;
  border-color: #1b6d85;
}

/* page Projekt u. Links / war: Home 1 - logos sidebar right */
.logos-right-side {margin-top:1.0em;}
.logos-right-side img {margin-bottom:3.0em; margin-left:-1.0em;}
.foerd-text {display:none; }
.logo-be-rs, .logo-eu-rs, .logo-efre-rs  { width:80px; }
@media screen and (min-width: 480px) and (max-width: 639px) {
.logos-right-side img { margin-left:-1.5em;}
.logo-be-rs, .logo-eu-rs, .logo-efre-rs  { width:110px; }
}
@media (min-width: 640px) and (max-width: 767px)  {
.logos-right-side img { margin-left:-1.5em;}
.logo-be-rs { width:150px; height:37px; } 
.logo-eu-rs { width:120px; height:116px; }
.logo-efre-rs { width:120px; height:83px;}
}
@media (min-width: 768px) {
.logos-right-side img { margin-left:-1.5em;}
.logo-be-rs   { width:162px; height:40px; } 
.logo-eu-rs   { width:137px; height:133px; margin-right:2.0em; }
.logo-efre-rs { width:154px; height:106px; }
.foerd-text {display:block; margin-left:-1.5em; font-size:88%; line-height:1.333; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto;}
}
/* sidebar images, below submenu - all pages, ecxept home */
.sidebar-images {margin-top:3.0em;}
.thumbnail {
  width: 95%;
}
/* images - size of some larger images for keeping quality when smaller */
@media (min-width: 768px) {
  .stoffquelle {width:620px; height:456px;}
}
/* special column adjust - all pages, except home */
.col-sm-09 {
  position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
}
@media (min-width: 768px) {
.col-xs-offset-01 {left: 2.778%;}
 .col-sm-09 { float:left; width: 72.5%; }
}
/* images in content area */
.img-inside-top {display:inline-block; margin:0 0 1.0em 2.0em; float:right; border:1px solid #758450; border-radius:4px; box-shadow:3px 3px 5px 2px #ccc;}
.img-ins-wbo {margin:1.0em 1.5em 1.0em 2.5em; float:right; border-radius:4px; box-shadow:3px 3px 5px 2px #ccc;}
.img-m-wcaption {margin-bottom:0.75em;}
.img-xl-nocaption {margin-top:1.5em; margin-bottom:1.5em;}

/* formeln */
.formula {margin-left:14%; margin-bottom:1.0em;}
.ftop  {padding-left:3.0em;}
.fbott {padding-left:2.7em;}
.ftop2  {padding-left:4.5em;}
.fbott2 {padding-left:4.2em;}
.ftop3  {padding-left:3.3em;}
.fbott3 {padding-left:3.1em;}

/* klimaschutz - baukasten */
.stacktxt1 {margin-left:-12px;}
img.stack1 {margin-top:-1.65em; margin-left:5.5em; display:inline-block; max-width:100%;}
img.stack2 {margin-top:0.8em; margin-left:5.5em; display:inline-block; max-width:100%;}
.stacktxt2 {margin-top:5.5em; margin-left:1.5em;}
/* gef&auml;hrdung klimaschutzleistung */
.klimagef .thumbnail {padding:6px; }
.klimagef img {
  border: 1px solid #999;
  border-radius: 4px; margin-bottom:6px;  }
.klimagef small {color:#777; }

/* oes lebensraumleistung */
a.tooltpover {font-weight:bold; cursor:pointer;}

/* Entscheidungssysteme */
.button-esys {
	display: inline-block;
	background-color: #68923A !important;
	border: none;
	color: #fff !important;
	cursor: pointer;
	font-size: 0.9em;
	font-weight: 400;
	letter-spacing: 1px;
	padding: 0.9em 1.2em 0.9em 1.2em;
	text-transform: uppercase;
	-webkit-font-smoothing: antialiased;
	border-radius: 2em;
	text-decoration: none; }
.button-esys:focus {background-color: #000 !important; color: #fff !important; text-decoration:none;}
.button-esys:hover {background-color: #733B90 !important; color: #fff !important; }
.button-esys:active {background-color: #8D000 !important; color: #fff !important; text-decoration:none;}

/* wasserretentionsleistung */
.wasserret {margin-top:2.0em; margin-left:-15px;}
.wasserret .thumbnail p { margin-top:0.6em;}
@media (min-width: 767px) {
.wasserret .thumbnail {max-width:640px;}
}
/* anpassungsstrategie - entwicklungsziele */
.abltg {border:2px solid rgb(94, 87, 67); background-color:rgb(215,228,189); padding:0 15px 5px 15px; font-style:italic;}
.abltg h3 {margin-top:15px; font-weight:bolder;}
.abltg p {font-size:105%;}
.abltg h3,.abltg p {color: rgb(31,73,125);}
/* anpassungsstrategie - Einfluesse auf Projekte */
.panel-heading a {cursor:pointer;}
/* anpassungsstrategie - moormanagement */
.infobox {border:2px solid rgb(94, 87, 67); background-color:rgb(215,228,189); padding:10px 15px 5px 15px;}
.infobox p {font-size:105%;}

/* tables  */
.ttop {font-style:italic; font-weight:bold;} /* h5 table description above table */
table { border: 1px solid #000; margin-top:20px; margin-bottom:40px;}
table th { background-color:rgb(242,242,242);} 
table > thead > tr > th p,
table > tbody > tr > td p {
	margin:0 0 4px;
}
table > thead > tr > th,
table > tbody > tr > th,
table > thead > tr > td,
table > tbody > tr > td {
  padding: 8px 5px;
  line-height: 1.42857143;
  vertical-align: top;
  border: 1px solid #000;
}
.table-pcent,.tpcent {
  width: 100%;
  max-width: 100%;
  margin-bottom: 40px;
}
table.tziele > thead > tr > th, table.tziele > tbody > tr > td {border: 1px solid rgba(79,129,189,1);}
.tziele .tzhead01 {background-color:rgba(79,129,189,1);}
.tziele .tzhead02 {background-color:rgba(217,217,217,1);}
.tfaktor .tbgrey  {background-color:rgba(214,214,214,1);}
.colhead tbody td:nth-child(3), .colhead tbody td:nth-child(4) {
	text-align:center;}
.borderbott2 {border-bottom:2px solid #000;}
.klimaschutz > thead > tr > th p {line-height:1; margin:0 0 2px;}
.klimaschutz, .entwtypen, .mittwass, .tcenter td, .tcenter th {text-align:center; vertical-align:middle;}
.klimaschutz tbody td:nth-child(1) {text-align:left;}
.td-indent p { text-indent:-5.095em; padding-left:5.095em; }
.speicher {margin-top:1.0em;}
.speicher > thead > tr > th,
.speicher > tbody > tr > td {text-align:center;}
@media screen and (min-width: 768px) {
.speicher,.twasserret {margin-left:15%; width:60%; }
}
/* retentionsleistung f&uuml;r Hochwasser */
.twasserret thead th, .twasserret tbody {text-align:center;}
/* table bodveg with scrollbars at top and bottom */
table.bodveg-01, table.bodveg-02 {width:924px;}
.bodveg-01 {margin-top:6px;}
.bodveg-01, .bodveg-02 { margin-bottom:0;}
.bodveg th {font-size:larger;}
.dist01  {margin-left:1.95em;} 
.dist01b {margin-left:2.125em;} 
.dist02  {margin-left:1.45em;}
.dist03a {margin-left:0.875em;}
.dist03b {margin-left:0.3em;}
.bodveg-legend { text-indent:-0.6em; padding-left:0.6em; }
.bodveg-01 {margin-top:6px;}
.scrbar-wrapper1, .scrbar-wrapper2 {
  width: 100%; overflow-x: scroll; overflow-y:hidden; }
.scrbar-wrapper1 {height: 20px; }
.scrbar-wrapper2 {height: auto; }
.div1 { width:960px; height: 20px; }
.div2 { width:960px; height: auto; background-color: transparent; overflow: auto;}
@media (min-width: 1400px) {
  .doublescroll-wrapper {display:none;}
}
@media (max-width: 1399px) {
  .bodveg-02 {display:none;}
}
/* tables moorgebiete ueberblick */
table.tmgueber, table.tmgbodsub, table.tmghydro {width:100%;}
@media (min-width: 992px) {
  table.tmgueber, table.tmgbodsub, table.tmghydro {width:80%;}
}
.tmgueber th:nth-child(3), .tmgueber td:nth-child(3),
.tmgueber th:nth-child(4), .tmgueber td:nth-child(4) {text-align:center;}
.tmgbodsub th:nth-child(2), .tmgbodsub td:nth-child(2),
.tmgbodsub th:nth-child(3), .tmgbodsub td:nth-child(3) {text-align:center;}
table.tmghydro tbody td:nth-child(2),table.tmghydro thead th:nth-child(2),
table.tmghydro tbody td:nth-child(3),table.tmghydro thead th:nth-child(3) {text-align:center;}
/* tables moorgebiete steckbriefe 1px solid rgb(255,255,255) */
table.tmoorg {width:100%; margin-top:2.5em;}
.tmoorg td {border: none; padding-left:0.65em;}
.tmoorg tr {border-bottom: 1px solid rgb(255,255,255);}
.tmoorg tr:last-child {border-bottom: 1px solid rgb(0,0,0);}
.tmoorg tbody td:first-child, .tmoorgblue {background-color:rgb(23,89,169); color:rgb(255,255,255);}
.tmoorg tbody td:nth-child(3), .tmoorg tbody .tmoorggrey {background-color:rgb(203,213,222); border-left: 1px solid rgb(255,255,255);}
.tmoorg .listgesgeflab { padding-left:0; padding-right:0.5em;}
.tmoorg .listgesgeflab-values,.tmoorg .listgesgeflab-values-uebb {list-style:none; width:100%; display:inline; float:left; margin-left:-10px; clear:both;}
/* number of digits includes greater or smaller than sign ! */
.tmoorg .listgesgeflab-values {padding-left:4.0%; }
.tmoorg .listgesgeflab-values-uebb {padding-left:7.0%; }
.values-02 {padding-right:0.25em; padding-left:0.25em;}
.values-01.val-0101   {padding-left:3.95em;} 
.values-01.val-0102   {padding-left:3.390em;}
.values-01.val-0102gt {padding-left:2.500em;}
.values-01.val-0103   {padding-left:2.850em;}
.values-01.val-0103gt {padding-left:1.975em;}
.values-01.val-0104   {padding-left:1.950em;}
.values-01.val-0104gt {padding-left:1.130em;}
.values-01.val-0105   {padding-left:1.375em;} 
.values-01.val-0105gt {padding-left:0.5125em;}
.values-01.val-0106   {padding-left:0.775em;} 
.values-01.val-0106gt {padding-left:0;}
.values-01.val-0107gt {margin-left:-0.9em;}
.values-03.val-0301   {padding-left:3.95em;} 
.values-03.val-0302   {padding-left:3.390em;}
.values-03.val-0302gt {padding-left:2.500em;}
.values-03.val-0303   {padding-left:2.850em;}
.values-03.val-0303gt {padding-left:1.975em;}
.values-03.val-0304   {padding-left:1.950em;}
.values-03.val-0304gt {padding-left:1.130em;}
.values-03.val-0305   {padding-left:1.375em;} 
.values-03.val-0305gt {padding-left:0.5125em;}
.values-03.val-0306   {padding-left:0.775em;} 
.values-03.val-0306gt {padding-left:0;}
@media (min-width: 768px) {
  .tmoorg .listgesgeflab-values {padding-left:6.0%; }
  .tmoorg .values-02 {padding-right:2.0%; padding-left:2.0%;}
}	
/* end of tables */

/* ibw - parameter tabelle */
@media (max-width: 767px) {
  .btn-enlarge a  {visibility:hidden;}
}
@media (min-width: 768px) {
  .tpara-enlarge {position:relative; z-index:1;}
  .btn-enlarge a {
      position: absolute; z-index:2;
      padding:0.25em 0.5em 0.25em 0.5em; border-radius: 16px;
      margin-top:-268px; margin-left:28%;
	  background: rgba(0,0,0,.6);
      color: #fff; font-weight: bold; font-size: 1.2em;
      text-align: center; cursor:pointer;}
  .btn-enlarge a:hover, .btn-enlarge a:focus {color:#efefef; text-decoration:none;}
}
@media (min-width: 992px) {
  .btn-enlarge a {
      border-radius: 18px;
      margin-top:-340px; margin-left:31.2%; font-size: 1.4em;}
}
@media (min-width: 1200px) {
  .btn-enlarge a {
      margin-top:-420px; margin-left:32%; font-size: 1.6em; }
}
/* moorgebiete - steckbriefe nach naturraeumen */
ul.naturrme {list-style:none; margin-left:0; padding-left:0; }
.naturrme a { color:#77673B; font-weight:bold;}
.naturrme a:hover, .naturrme a:focus { color:#7A715B; text-decoration:underline;}

/* Steckbriefe Download-PDF-Button */
.button-steckbf {
	display: inline-block; margin-left:-30px;
	background-color: #68923A !important;
	border: none;
	color: #fff !important;
	cursor: pointer;
	font-size: 0.9em;
	font-weight: 400;
	letter-spacing: 1px; text-align:center;
	padding: 0.6em 1.3em 0.6em 1.3em;
	text-transform: uppercase;
	-webkit-font-smoothing: antialiased;
	border-radius: 1em;
	text-decoration: none; }
.button-steckbf:focus {background-color: #6B5B01 !important; color: #fff !important; text-decoration: underline;}
.button-steckbf:hover {background-color: #1759A9 !important; color: #fff !important; text-decoration: none;}
.button-steckbf:active {background-color: #8D000 !important; color: #fff !important; text-decoration: none;}
@media (min-width: 768px) and (max-width: 991px) {
  .button-steckbf {margin-left:-65px;}
}	
@media (min-width: 992px) and (max-width:1199px) {
  .button-steckbf {margin-left:-45px;}
}	
@media (min-width:1200px) {
  .button-steckbf {margin-left:-30px;}
}	
/* karte */
/* #map {height: 100%; border: 1px solid #333;} */
.map-legends {margin-top:3.0em;}
.legend-bottom {margin-top:2.5em;}

/* foto gallery - the properties with "flex" in their name give equal height to cols */
.row.fotogallery {margin-left:15px;}
.row.fotogallery .row {
  margin-right:-15px; margin-left:-15px;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
.fotogallery .col-sm-3 {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}
.fotopanel {
  margin-bottom: 20px;
  padding: 15px;
  border: 1px solid #ddd;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, .05);
          box-shadow: 0 1px 5px rgba(0, 0, 0, .05);
}
.fotopanel img {
  margin-bottom:15px;
  display: block;
  border: 1px solid #ddd;
  border-radius: 4px;
  -webkit-transition: border .2s ease-in-out;
       -o-transition: border .2s ease-in-out;
          transition: border .2s ease-in-out;
  -webkit-box-shadow: 0 0px 5px rgba(0, 0, 0, .2);
          box-shadow: 0 0px 5px rgba(0, 0, 0, .2);
	}
.fotopanel img:hover,
.fotopanel img:focus,
.thumbnail img.active {
  border-color: #337ab7;
  -webkit-box-shadow: 0 0px 15px rgba(51, 122, 183, .8);
          box-shadow: 0 0px 15px rgba(51, 122, 183, .8));
}
@media (max-width: 767px) {
.fotopanel {margin-right:10%;}
}	
@media (min-width: 768px) and (max-width: 991px) { /* noch nicht angepasst */
.fotogallery .col-sm-3 {width:45%; margin-right:2.0em; }

.fotovert-col-sm {}
.fotovert-col-sm-r  { }
.fotovert-col-sm-l  { margin-left:5.5%;}
 /* .fotovert-col-med-l  {margin-left:12.75%;} solche, die bei der nächstgröß. Variante kein l haben */
.fotovert-col-sm-rl {margin-right:1%; margin-left:5.5%;}
.fotodist-right {margin-right:7%;}
}
@media (min-width: 991px) and (max-width: 1200px) {
.fotovert-col-sm {width:30%; } /* für hochkant-format ohne folge-bild */
.fotovert-col-sm-r  {width:30%; margin-right:1%;}  /* für hochkant-format */
.fotovert-col-sm-l  {width:30%; margin-left:5.5%;} /* für hochkant-format */
.fotovert-col-sm-rl {width:30%; margin-right:1%; margin-left:5.5%;}  /* für hochkant-format */
.fotodist-right {margin-right:6.0%;} /* für quer-format */
}	
.hletter {margin-top:1.125em;} /* letter heading alphabetical order fotogalerie moorgebiete */

/* literaturhinweise */
#accmenu {width:95%;}
.list-group a {color:#333333;}
.list-group a:hover, .list-group a:focus {
  color:#5B5622; }/* muddy green-brown */
#accmenu .panel {
  border-left:5px solid #666; } /* other submenu border is #666026 */
/* removing rounded borders from top and bottom left */
#accmenu .list-group.panel > .list-group-item {
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
  border-left:none; }
#accmenu .list-group.panel > .list-group-item {
  border-bottom-right-radius: 4px;
  border-bottom-left-radius: 4px;
  background-color:#F2F6EA; }
#accmenu .list-group.panel > .list-group-item a {color:#666; /* font-weight:bold; */}
#accmenu .list-group-submenu > .list-group-item { border-bottom:none;}
/* sublevel 2 */
/* this indentation works only on those sublevels without toggle-plus, because toggle-plus gets other spaces due to tow 2 anchor tags */
#accmenu .list-group-submenu>a {padding-left:2.0em;}
.toggle-plus {cursor:pointer;}

/* kontakt */
#cmap { height: 450px;
		border: 1px solid black; }

/* impressum */
.imp-haftung .panel { height:200px; margin-bottom:1.5em; overflow:scroll; overflow-y:scroll; overflow-x:hidden; -moz-box-shadow: inset 0px 0px 4px #999; }
.imp-haftung h5 { padding-left:1.0em; color:rgb(102,102,102); font-weight:bold;} /* grey */
.imp-haftung p  { padding-right:1.125em; padding-left:1.125em; font-size:0.9em;}

/* end of individual pages content */

/* off-canvas sidebar custom styles by ccr here - other styles see offcanvas-styles.css */
/* off-canvas toggle button */
.navbar-custom { position: relative;
  min-height: 50px; } /* important for functionality of navbar, particular without class .navbar! */
.navbar-custom .navbar-toggle { 
  background-color: rgba(248, 248, 248, 1); border-color: #BFBFBF; transition:.3s background-color;}
/* bg color of toggle button when hovered */
.navbar-custom .navbar-toggle:hover { background-color: #E5E5E5; } 
.navbar-custom .navbar-toggle:focus { background-color: transparent; }
/* fcolor of lines inside toggle button */
.navbar-custom .navbar-toggle .icon-bar { background-color: #B2B2B2; } /* scheme matching green #5C4E0D */
.navbar-custom .button-title-offcanvas {color: #5C4E0D; font-weight:bold; text-transform: uppercase; }
  
/* offcanvas sidebar - submenu custom styles */
.nav.submenu {line-height:1.428; }
#sidebar .nav {
  border-left:5px solid #003366;
}
#sidebar .nav > li {
  border-right:1px solid #EDEDED;	
}
#sidebar .nav > li:first-child {
  border-top:1px solid #EDEDED; border-top-right-radius:6px;	
}
#sidebar .nav > li:last-child {
  border-bottom:1px solid #EDEDED; border-bottom-right-radius:6px;	
}
#sidebar .nav > li > a {
  -moz-box-shadow: inset 0 -18px 18px -18px rgb(245, 245, 245);
  -webkit-box-shadow: inset 0 -18px 18px -18px rgb(245, 245, 245);
  box-shadow: inset 0 -18px 18px -18px rgb(245, 245, 245);
}
#sidebar .nav > li > a:hover,
#sidebar .nav > li > a:focus {
  background-color: transparent; background:rgb(238, 238, 238, 0.3); 
  -webkit-box-shadow: inset 0 20px 20px -20px rgba(230,230,230,0.4);
  -moz-box-shadow: inset 0 20px 20px -20px rgba(230,230,230,0.4);
  box-shadow: inset 0 20px 20px -20px rgba(230,230,230,0.4);
}
@media (max-width: 640px){
  #sidebar {margin-bottom:20.0em; }
}
/* auto hyphenation of all links for smaller sizes */
@media screen and (max-width : 767px) {
  #sidebar .nav { -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; }
}
/* manual hyphenation of all links through soft break */
@media screen and (min-width: 768px) {
  #sidebar .nav { -webkit-hyphens: manual; -moz-hyphens: manual; -ms-hyphens: manual; hyphens: manual; }
}
/* sidebar submenu, sublevel and sub-head styling */
.submenu a {color:#333;}
.submenu a:hover, .submenu a:focus {
  color:#5B5622; /* muddy green-brown */
}
.submenu-head {background-color:rgba(195, 213, 155,0.2); font-weight:bold;}
.submenu-head.active { text-indent:-0.975em; padding-left:0.975em;
}
.kernpara a { 
  color:#003366; font-weight:bold; }
.kernpara a:hover,.kernpara a:hover {color:#23527C;}
.kernpara.active a {
  margin-left:1.0em; text-indent:-0.975em; padding-left:0.975em;
}
/* uep sublevels 3 and 4 */
.sublevel-head a { 
  margin-left:1.0em; text-indent:-0.975em; padding-left:0.975em; color:#666026; font-weight:bold;}
.sublevel-head a:hover, .sublevel-head a:focus {
  font-weight:bold; color:#877953;
}
/* 3rd level */
.sublevel3 a { margin-left: 1.275em; text-indent:-0.0125em; padding-left:0.0125em; color:#666026;}
.sublevel3 a:hover, .sublevel3 a:focus {color:#56532B;}
.sublevel3.active  { background:rgba(204,204,153,0.1);}
.sublevel3.active a, sublevel3 a:active, .sublevel3.subactive a /* when sublevel4 is active */ {
  margin-left:2.375em; text-indent:-0.925em; padding-left:0.925em;
}
/* 4th level */
.sublevel4 a  { margin-left:2.275em; text-indent:-0.0125em; padding-left:0.0125em; color:#6C7746; }
.sublevel4 a:hover, .sublevel4 a:focus { color:#545940;}
.sublevel4.active   { background:rgba(204,204,153,0.1);}
.sublevel4.active a, sublevel4 a:active {margin-left:3.375em; text-indent:-0.925em; padding-left:0.925em;
}
/* sublevel naturräume head */
.sublevel-head-az a,.sublevel-head-ue a { font-weight:bold; color:#847133; }
.sublevel-head-az a:hover, .sublevel-head-az a:focus, .sublevel-head-ue a:hover, .sublevel-head-ue a:focus {
  font-weight:bold; color:#6B5B01;
}
.sublevel-head-nrm a { font-weight:bold; color:#6C7746; }
.sublevel-head-nrm a:hover, 
.sublevel-head-nrm a:focus { font-weight:bold; color:#898E76; }
.sublevel-head-nrm.active a, .sublevel-head-nrm a:active { margin-left:1.0em; text-indent:-0.975em; padding-left:0.975em;
}
/* sublevel naturräume tabs */
.sublevel-nrm a { color:#6C7746; margin-left:2.3em; text-indent:-0.0125em; padding-left:0.0125em; }
.sublevel-nrm a:hover, .sublevel-nrm a:focus { 
  color:#545940;
}
.sublevel-nrm.active {background:rgba(204,204,153,0.1);}
.sublevel-nrm.active a, .sublevel-nrm.active a:active {
  color:#6C7746; margin-left:2.5em; text-indent:-0.925em; padding-left:0.925em;
}
/* collapsing the navbar or toggle button area after 767px */
@media screen and (min-width: 768px) {
  .navbar-custom {display:none;}
}
/* end of offcanvas navbar-custom styles */

/* logos inside offcanvas, below offcanvas menu left */
.logos-left-side { float:left; margin-top:4.5em; padding-right:15px; padding-left:15px; }
.logos-left-side img {clear:both; display:block; margin-bottom:3.0em;}
.foerd-text-lft {display:none; }
.logo-be-lft, .logo-eu-lft, .logo-efre-lft  { width:80px; }
.logos-left-side img.logo-eu-lft2 {display:none;}
@media screen and (min-width: 480px) and (max-width: 639px) {
.logo-be-lft, .logo-eu-lft, .logo-efre-lft  { width:110px; }
}
@media (min-width: 640px) and (max-width: 767px)  {
.logo-be-lft { width:150px; } 
.logo-eu-lft, .logo-efre-lft  { width:120px; }
}
@media (min-width: 768px) {
.logos-left-side { margin-left:0.6em; }
.logos-left-side img { padding-right:1.0em;}
.logo-be-lft    { width:145px; height:35px; }  /* full size is 180x44 */
.logo-eu-lft    { width:137px; height:133px; } /* full size */
.logo-efre-lft  { width:130px; height:89px; } 
.foerd-text-lft { display:block; margin-left:-2px; padding-right:1.0em; font-size:86%; line-height:1.33; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto;}
}
@media (min-width: 1200px) {
.logos-left-side { margin-left:2.125em; }
.logos-left-side img.logo-eu-lft   {display:none; }
.logos-left-side img.logo-eu-lft2  {display:block; width:252px; height:77px; }
.foerd-text-lft { margin-left:-0.25em; padding-right:2.0em; }
}
/* end of logos inside offcanvas - left */

/* page Links */
@media (min-width: 768px) {
  .plinks h2 {margin-bottom:0.8em;}
  .plinks h3, h4 {font-size:1.4em; margin-top:1.2em; margin-bottom:1.0em;}
  .plinks p { margin-bottom:0.25em;}
  .plinks p.hang { margin-left: 1.4em ; text-indent: -2.4em; padding-left:1.0em;} /* adding hanging indent */
}
/* back to top button */
.btop{
	position: fixed;
	display: none;
    background: rgba(140, 140, 140, 0.6) url(../img/assets/cd-top-arrow.svg) no-repeat center 50%;
	opacity:0.6;
	color: #fff;
	width: 50px;
	height: 48px;
	line-height: 48px;
	right: 10px;
	bottom: 10px;
	padding-top: 2px;
	border-top-left-radius: 4px;
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
	border-bottom-left-radius: 4px;
}
.btop:hover{
	opacity:1;
	transition:1s;
}@media only screen and (min-width: 992px) {
  .btop {
    right: 12px;
    bottom: 20px;
  }
}
@media only screen and (min-width: 1200px) {
  .btop {
    right: 1%;
    bottom: 25px;
  }
}
/* footer */
footer.footer {margin:4.165% auto; text-align:center;} 
.footer img { margin-bottom:15px;}.footer .logo-be-ft {width:120px; margin-right:3.125%;}
.footer .logo-eu-ft {width:170px; margin-right:3.125%;}
@media (max-width: 640px) {
.footer .row {margin-right:45px; margin-left:5px;}
}
@media (min-width: 641px) and (max-width: 745px) {
  .footer .logo-be-ft {width:120px; margin-right:5.205%;}
  .footer .logo-eu-ft {width:210px; margin-right:5.205%;}
}
@media (min-width: 746px) and (max-width: 767px) {
  .footer .logo-be-ft {width:180px; margin-right:5.205%;}
  .footer .logo-eu-ft {width:230px; margin-right:4.165%;}
}
@media (min-width: 768px) and (max-width: 991px) {
  .footer .logo-be-ft {width:160px; margin-right:7.29%;}
  .footer .logo-eu-ft {width:230px; margin-right:7.29%;}
}
@media (min-width: 992px) {
  .footer .logo-be-ft {width:160px; margin-right:12.49%;}
  .footer .logo-eu-ft {width:230px; margin-right:12.49%;}
}
/* end of footer */

/* globals */
.bold {font-weight:bold;}
.bottomdist {clear:both; margin-bottom:1.0em;}
.clearflt {clear:both;}
.move-up-10 {margin-top:-10px;}
.pad-left-1 {padding-left:1.0em;}
.pad-left-2 {padding-left:2.0em;}
.hyphenate { -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto;}
.indent {text-indent:-1.0em; padding-left:1.0em; }
.italic {font-style:italic;}
.justfd-one { text-align:justify; padding-top:1.0em;}
.larger {font-size:larger;}
.margin-in-15  {margin-left: 15px;}
.margin-out-15 {margin-left:-15px;}
.mdfh      {margin-top:1.65em;} /* mdfh for move-down-from-head - moves down line-height */
.moveup165 {margin-top:-1.65em;} /* moves up exactly as much as mdfh moves down - one line */
.red {color:rgba(204,0,0,1);}
.row-pad {margin-right:-30px; margin-left:-15px;}
.row-pad-02 {margin-right:-45px; padding-left:0.5em; }
@media (min-width: 768px) {
  .row-pad-02 {margin-right:-30px; margin-left-15px; }
}
.textalc {text-align:center;}
.textalv {vertical-align:middle;}
.underline {text-decoration:underline;}
		
/* special character and symbol formats */
.smallCaps {font-variant:small-caps;}
.subscript {vertical-align:-12%;}
.superscript {vertical-align:18%;}
