/*  roboto-regular - latin 
	https://google-webfonts-helper.herokuapp.com/fonts/roboto?subsets=latin
*/

@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/roboto-v20-latin/roboto-v20-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Roboto'), local('Roboto-Regular'),
       url('./fonts/roboto-v20-latin/roboto-v20-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('./fonts/roboto-v20-latin/roboto-v20-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('./fonts/roboto-v20-latin/roboto-v20-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('./fonts/roboto-v20-latin/roboto-v20-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('./fonts/roboto-v20-latin/roboto-v20-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
}

/*
Farbschema generiert auf 
https://www.webmart.de/web/harmonische-farben/#5CACAD:c:h:g:d 
*/

/* NEU LOGO FARBEN:
#8DDCE0 - hellgrün
#6ED7DB - mittelgrün
#5BAAAE - dunkelgrün
#013E41 - schriftgrün
*/

/* ALT?

dunkelgrau  rgb(229, 229, 229); 

HELLE Farben:
C3442B // red
A563FF // purple
5CABAD // blue
9DD94A // green
DCA351 // orange

DUNKLE Farben:
7C2C1B // red
683E9E // purple
294C4D // blue
557829 // green
B28542 // orange

*/

/* Kontraste: */
.myColor_default { color: #013E41; } 
.hrbreak {
   width:100%;
   border: none;
   background-color : #5BAAAE;
}


.body{
   margin-left:0; 
   margin-right:0; 
   background-color:white;
   background-repeat: no-repeat;
   font-family: 'Roboto';
   font-style: normal;
   font-weight: normal;
   /*font-size: normal;*/
}

.showhidediv {
   text-align: center;
   text-decoration:none;

}
a.showhide{
   text-decoration:none;
   display:inline-block; 
   margin-bottom:10px; 
   margin:20px; 
   padding:20px; 
}
a.showhide:link {
   border: solid 3px #294C4D;
   text-decoration:none;
   color: inherit; 
   transition: background-color 500ms, color 500ms, border 500ms, box-shadow 500ms;
}
a.showhide:visited {
   border: solid 3px #294C4D;
   text-decoration:none;
}

a.showhide:hover   { 
   border: solid 3px rgb(91, 170, 173);
   color: inherit;  
   box-shadow: 0px 0px 10px #BBB;
   text-decoration:none;
}

#topmenudiv{
   position:fixed; 
   width:100%; 
   top:0;
   z-index:3; 
   background-color: rgb(229, 229, 229); 
   box-shadow: 0px 1px 5px #000;
	border-top: solid 0px #013E41; 
	border-bottom: solid 0px #013E41; 
	text-align:center;
}
.nowrapper{
   vertical-align: bottom;
   display: inline-block;
}


.menuLogo{
	border: solid 1px #5BAAAE;
	width: 25px;
	vertical-align: bottom;
}
.menuLogo2{
	border: solid 0px #5BAAAE;
	vertical-align: bottom;
	height:30px;
}
#topmenutable{
   width: 100%; 
   text-align: center;
   border-spacing: 10px;
   border-collapse: separate;
   white-space: nowrap;
}

a.menu{ 
	font-size: 0.9em;
   white-space: nowrap;
   display:inline-block; 
   margin-bottom:15px; 
   padding-bottom: 5px;
   text-align:center; 
   width:20ex;
   border-style:none; 
   text-decoration:none;
   border-top: solid 8px rgb(229, 229, 229);
   border-bottom: solid 8px #5CABAD;
} 

a.menu:link    { color:inherit; text-decoration:none;  transition: border-top 500ms, border-bottom 500ms, color 500ms;}
a.menu:visited { color:inherit; text-decoration:none;  }
a.menu:hover   { 
   border-bottom: solid 8px rgb(141, 221, 224);
   text-decoration: none;
   box-shadow: 0px 0px 10px #BBB;
}
a.menu:active  { color:#444;  }


.content {
   /* margin-left: 0;  */
   /* margin-right: 0; */
   border-left: 0;
   font-family:calibri;
   /*font-size:1em;*/
   text-align: center;
   position:absolute;
   top:40px;
   /*text-shadow: 2px 2px;*/
   /*color: #333;*/
   width:100%;
   /*text-shadow: 1px 1px 6px #000000;*/
   /*line-height: 50%;*/
}

.pageintro {
   /*font-size: 1em;*/
   font-size: 2.5em;
   margin-left: 20; 
   margin-right: 20;
   /*font-family:calibri;*/
   text-align: center;
   /*text-shadow: 2px 2px 4px #000000;*/
   /* position:absolute; */
   /* top:60px; */
   /* font-size: 3.5em; */
   /*text-shadow: 2px 2px;*/
   /*color: #888;*/
   /*color:white;*/
   width:100%;
   /*line-height: 50%*/
   /*background-color: #5CABAD;*/
   /*color: #5CABAD;*/
   
}

/*
FARBEN
hellgrün 	#8DDEE0
grün 		rgb(141, 221, 224)
dunkelgrün  #5CABAD
menu-grau rgb(229, 229, 229)
braun #613920
hellbraun #AD7C5C


*/


.totalpagediv{
   background-color: transparent; 
   width: 100%; text-align: center; 
   margin-left: 0; 
   margin-right: 0;

   /* position: absolute;   */
   /* top:250px; */
   /*font-family:calibri;*/
   /* left:0; */
}


.refpic{

   /*background-color: white; */
   text-align: center;
   vertical-align: middle;
   width: 380px;
   height: 100px;
   /* border: 16px solid lightgrey; */
   position: relative;
   padding:15px;

   /* top:100px; */
   box-shadow: 1 4px 8px 0 rgba(1,0,0,0.4);
   border-radius: 5px; 


}

.refpic-right{
   /* background-color: white;  */
   text-align: left;
   width: 280px;
   /* height: 100px; */
   /* border: 16px solid lightgrey; */
   position: relative;
   padding:15px;
   /* top:100px; */
   /* border-right: solid 11px #BBB; */
   text-shadow: 0px 6px 8px #666666;

}

.refpic:hover { /*border: solid 11px #270;*/
                opacity: 0.7;
}
/* a.refpic  {border-right: solid 11px #BBB;} */
/* a.refpic:hover   { border-right: solid 11px #270;} */
.refimg{
   /* height: 50px; */
} 


p.linklist {
   font-weight: normal;
   background-repeat: no-repeat;
   background-position: center bottom;
   text-align: left;
   position: fixed;
}
h1 {

   text-align: left;
   font-size: 3.8em;
   color: #444;
   text-shadow: 2px 2px 4px #000000;
}
h2 {
   text-align: left;
   font-size: 2em;
   color: #444;
}

p.pic_title {
   background-color: #cc0000;
   position: fixed;
}
.linkcell {
   background-repeat: repeat-y;
   right: 13px;
   padding-left: 5px;
   padding-right: 34px;
}
/*p.menu {
   position: fixed;
   background-color: white;
}*/

.featurepic {
   box-shadow: 0 5px 8px 0 rgba(0,0,0,0.9);
   transition: 0.3s;
   border-radius: 4px;
   border-bottom: solid 11px #294C4D;
   border-top: solid 11px #294C4D;
   max-width: 500px; 
   height:auto;
   width: auto;


}


/*.summary div {
      background-color: blue;

}*/

.summarytable {
/*font-size: 1.2em;*/

   border-collapse:collapse;
}

.summarytable td{
   text-decoration: none;
   background-color: #004040;
   color: #FFFFFF;
   padding: 10px;
}


.maintable{

   width: 100%;
   /*font-size:8pt;*/
   margin-left: auto; 
   margin-right: auto;
   border-collapse:collapse;
   font-size: 1.2em;
   /*color: #333;*/
   background-color: rgb(229, 229, 229); 
}

.maintable td {
   padding: 10px;
   /*vertical-align: top;*/
   /*border-left: "none";
   border-right: "none";
   border-top: "none";
   border-bottom: "none";*/
}

.maintable-col-empty{
   width:20%; 
      /*background-color: #dca351;*/
      /*background-color: #dca351;*/


}

.maintable-col-left{
   text-align: center;
      /*background-color:   #807459  ;*/
      /*background-color: #dca351;*/
}

.maintable-col-right{
   /*text-align: center;*/
   /*font-size: 1.5em;*/
   /*width:30%; */
      /*background-color: #8DDEE0;*/
      /*background-color: #dca351;*/
      /*background-color: #dca351;*/

}

.support {
      background-color: lightgrey;
}
.supporttable {
   border-collapse:collapse;
   width:100%;
}

.supporttable td {
   text-decoration: none;
 /*  display: table-cell;*/
   vertical-align: top;
   padding-left   : 5pt;
   padding-right   : 5pt;
   padding-bottom  : 5pt;
   text-align:center;
   background-color: lightgrey;
}



a.supportlink:link    { font-size: 80px; color:#444;  text-decoration: none;}
a.supportlink:visited { font-size: 80px;color:#444;  text-decoration: none;}
a.supportlink:hover   { font-size: 80px;color:rgb(31, 73, 125);  text-decoration: none;}
a.supportlink:active  { font-size: 80px;color:#444;  text-decoration: none;}

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

.footertable {
	
	   background-color: rgb(229, 229, 229); /*rgb(31, 73, 125); */
	   font-size: 0.9em;

}   

.footertable td{
   /*background-color: rgb(229, 229, 229);*/
   /*color: white;*/
   text-decoration: none;
   text-align: left;
   vertical-align: top;
   /*border-top: solid;*/
   /*border: none;*/
   
}

.screenshots {
   background-color:lightgray;
   padding: 0 6px;
   /*float: center;*/
   width: 25%;
}

td.footercell{
   vertical-align: top;
}

a.footerlink:link    { color:grey;  text-decoration: none;}
a.footerlink:visited { color:grey;  text-decoration: none;}
a.footerlink:hover   { color:lightgrey;  text-decoration: none;}
a.footerlink:active  { color:grey;  text-decoration: none;}




.footer {
   font-size: small;
   color:#999;
   
}