@import url('https://fonts.cdnfonts.com/css/trebuchet-ms-2');

/* Google Font Josefin ist ausgeschaltet */
/* @import url(https://fonts.googleapis.com/css?family=Josefin+Sans:500);     */

@font-face { 
font-family: "FontAwesome"; 
src: url("/font-awesome-4.3.0/fonts"); 
}

* {
  box-sizing: border-box;
}
body {
  font-family: 'Josefin Sans', Arial, "Trebuchet MS", sans-serif;

}
.content_pane {
  margin: auto;
  width: 90%;
  margin-top: 15px;
  margin-bottom: 15px;
  background-color: #eeffee;
  background: linear-gradient(#ffffff, #eeffee, #eeffee, #ffffff);
}
.header {
  position: relative;
  margin: auto;
  width: 90%;
  padding: 0px;
  margin-bottom: 20px;
}
.main_area:before,
.main_area:after {
  content: " ";
  display: table;
}
.main_area:after {
  clear: both;
  margin: auto;
}
.main_area {
  *zoom: 1;
  min-width: 440px;
  /* width: @main_area_width; */
  margin: auto;
}
.left {
  float: left;
  width: 460px;
  box-sizing: border-box;
  padding: 5px;
}
.right {
  float: left;
  width: 19.8%;
  box-sizing: border-box;
  padding: 15px;
}
.middle {
  float: left;
  margin: auto;
  width: 430px;
  box-sizing: border-box;
  padding: 15px;
  margin-left: 20px;
  margin-top: 20px;
}
.top-to-bottom-boarder {
  padding: 15px;
  border-width: 3px;
  border-style: solid;
  -webkit-border-image: -webkit-gradient(linear, 0 0, 0 100%, from(#006733), to(rgba(0, 0, 0, 0))) 1 100%;
  -webkit-border-image: -webkit-linear-gradient(#006733, rgba(0, 0, 0, 0)) 1 100%;
  -moz-border-image: -moz-linear-gradient(#006733, rgba(0, 0, 0, 0)) 1 100%;
  -o-border-image: -o-linear-gradient(#006733, rgba(0, 0, 0, 0)) 1 100%;
  border-image: linear-gradient(to bottom, #006733, rgba(0, 0, 0, 0)) 1 100%;
}
.left-to-right-border {
  padding: 15px;
  border-width: 3px 0 3px 6px;
  border-style: solid;
  -webkit-border-image: -webkit-gradient(linear, 100% 0, 0 0, from(#006733), to(rgba(0, 0, 0, 0))) 1 100%;
  -webkit-border-image: -webkit-linear-gradient(right, #006733, rgba(0, 0, 0, 0)) 1 100%;
  -moz-border-image: -moz-linear-gradient(right, #006733, rgba(0, 0, 0, 0)) 1 100%;
  -o-border-image: -o-linear-gradient(right, #006733, rgba(0, 0, 0, 0)) 1 100%;
  border-image: linear-gradient(to right, #006733, rgba(0, 0, 0, 0)) 1 100%;
}
.left-and-right-border {
  padding-top: 15px;
  padding-bottom: 15px;
  border-width: 0 6px 0 6px;
  border-style: solid;
  -webkit-border-image: -webkit-gradient(linear, 100% 0, 0 0, from(#006733), to(rgba(0, 0, 0, 0))) 1 100%;
  -webkit-border-image: -webkit-linear-gradient(right, #006733, rgba(0, 0, 0, 0)) 1 100%;
  -moz-border-image: -moz-linear-gradient(right, #006733, rgba(0, 0, 0, 0)) 1 100%;
  -o-border-image: -o-linear-gradient(right, #006733, rgba(0, 0, 0, 0)) 1 100%;
  border-image: linear-gradient(to right, #006733, rgba(0, 0, 0, 0)) 1 100%;
  /* border-image: linear-gradient(to bottom, rgba(0, 0, 0, 0),@link_color, @link_color, rgba(0, 0, 0, 0) ) 1 100%; */
}
.footer {
  clear: both;
  margin: auto;
  width: 90%;
  padding: 5px;
}
.header-text {
  font-size: 26px;
  color: #006733;
 /* font-family: Courier New,Courier,Monaco,monospace; */
  line-height: 30px;
}
.header-text ul {
  text-decoration: underline;
}
.footer-text {
  font-size: 14px;
  color: #666;
  font-family: Courier New,Courier,Monaco,monospace;
  line-height: 50px;
}
.footer-text ul {
  text-decoration: underline;
}
.infoHeader {
  text-decoration: underline;
}
.theme-button {
    display: 		inline-block;
    height: 		20px;
    margin-left: 	2px;
    opacity: 		0.7;
    position: 		relative;
    transition: 	opacity 0.5s linear 0s;
    width: 			20px;
}
.theme-button:hover {
	opacity: 1;
	color:	#000;
}
.theme-button-selected:before {
  content: '●';
  position: absolute;
  color: #fff;
  left: 5px;
  top: -2px;
}
.toggle-btn{
    display: 		inline-block;
    height: 		20px;
    margin-left: 	2px;
    opacity: 		0.7;
    position: 		relative;
    transition: 	opacity 0.5s linear 0s;
    width: 			20px;
	font-size: 16px;
	border-radius: 10px;

}
.toggle-btn:hover {
	opacity: 1;
	color:	#000;
	
}
.toggle-btn-on:before{
  /*content: '✔';  */
  content: '♦'; 
  position: absolute;
  color: #fff; 
  left: 5px;
  top: 2px;

}
.toggle-btn-off:before{
  content: '◊';   
  position: absolute;
  color: #fff;
  left: 5px;
  top: 2px;
  color: #f00;
}
.position-right{
	float:			right;
	margin-left:	20px;
}
.position-left{
	float:			left;
	margin-right:	20px;
}
.info {
  font-size: 14px;
  color: #666;
  font-family: Courier New,Courier,Monaco,monospace;
  line-height: 14px;
}
.text {
  font-size: 12px;
  color: #999999;
  line-height: 21px;
  font-family: Courier New,Courier,Monaco,monospace;
}
.text_underlined {
  font-size: 12px;
  color: #999999;
  line-height: 21px;
  font-family: Courier New,Courier,Monaco,monospace;
  text-decoration: underline;
}
.links {
  padding-left: 15px;
  font-size: 16px;
  color: #666666;
  line-height: 26px;
  /*font-family: Courier New,Courier,Monaco,monospace; */
  font-family: "Josefin Sans",Arial,"Trebuchet MS",sans-serif;
  white-space: nowrap;
  margin-bottom: 20px;

}
.links h1 {
    color: 			#666666;
    font-size: 		20px;
    font-weight: 	normal;
    line-height: 	0;
   /* margin-left: 	-24px; */
   font-family: Courier New,Courier,Monaco,monospace; 
    padding-top: 	0;
    text-align: 	left;
}
.links ul {
    text-decoration: none;
}
.links li{
    text-decoration: none;
}
.links a:link, .links a:visited, .links a:hover, .links a:active {
    color: 			#006733;
    text-decoration: none;
	opacity: 0.7;
}
.links a:hover, .links a:active {
	opacity: 1.0;
	text-decoration: underline;
}

.back-to-top-area{
clear: both;
    position: fixed;
    bottom: 10px;
    right:0;
	margin-right: 2%;
}
#back-to-top{
	/*display: none;*/
	width: 30px;
	height: 30px;
	 margin-left: 98%;
    -webkit-transform: rotate(-90deg); /* chrome & safari*/
    -moz-transform: rotate(-90deg); /* firefox */
    -o-transform: rotate(-90deg); /* opera */
    transform: rotate(-90deg); /* explorer > 9 */	 
}
#back-to-top:after {
    content:'\2191';
content:'\25BA';

}