:root {
  --main-color: #3498db;
  --secondary-color: #2ecc71;
}

* {
margin: 0;
padding: 0;
box-sizing: border-box;
}

html {  
  font-size: 25.4px;
  line-height: 137.45%;
  font-weight: normal;
  color:rgb(25,29,108);
  /* color:rgb(27,31,108); */
  /* color:rgb(27,31,95); */
  /* color:rgb(24.3,27.9,85.5); */
  
  font-family: arial, helvetica, sans-serif;
	  /* font-weight: 600; */
}

body
{
font-size: 1rem;
line-height: inherit;
color: inherit;

margin: 0;
padding: 0;

/* box-sizing: border-box; */

overflow:hidden;
height:100%; width:100%;

font-family: inherit;

/*background-color:rgb(15,7,62) ! important;*/
background: rgb(255,255,255) url(pics/inner_bg.png);

position:absolute;
position:fixed;
}

h1 /* default */   {
  /* display: block; */
  font-size: 2em;
  margin-top: 0.67em;
  margin-bottom: 0.67em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
}

h2 /* default */   {
  display: block;
  font-size: 1.5em;
  margin-top: 0.83em;
  margin-bottom: 0.83em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
}

h3 /* default */,h4,h5,h6 {
  display: block;
  font-size: 1.17em;
  margin-top: 1em;
  margin-bottom: 1em;
  margin-left: 0;
  margin-right: 0;
  font-weight: bold;
}

h1,h2,h3,h4
{
font-size: 1.09rem;
line-height: 140%;
margin-top: 0em;
margin-bottom: 0.65rem;
}

h4
{
line-height:110%;
}


p {
 
/*  font-size: inherit; */ /* Vererbt die Schriftgröße von body */
  font-size: 1rem;  /* Überschreibt inherit mit relativer Skalierung */
/*  line-height: inherit; */  /* Vererbt die Zeilenhöhe von body */
  line-height: 137.5%;    /* Setzt eine spezifische Zeilenhöhe */
  margin: inherit;
  margin-top: 0em;
  margin-left: 0;
  margin-right: 0;
  margin-bottom: 0.775rem; /* Abstand zwischen Absätzen */
  color: inherit; /* Sicherstellung der Textfarbe */

  padding: 0;
}

.scroll-max-spacer {
       display: block;
       height: 5%;
       width: 100%;
       clear: both;
}

hr {
  margin-top: 0;
  margin-bottom: 1.25rem;
  color:rgb(170,180,190);
  }

kbd {
  background-color: #eee;
  border-radius: 3px;
  border: 1px solid #b4b4b4;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2), 0 2px 0 0 rgba(255, 255, 255, 0.7) inset;
  color: #333;
  display: inline-block;
  font-size: 0.85rem;
  font-weight: normal;
  line-height: 1;
  padding: 2px 4px;
  white-space: nowrap;
}

kbd > kbd {
  border-radius: 3px;
  padding: 1px 2px 0;
  border: 1px solid black;
}


img
{
border-width:0px;
}


li
{
list-style:circle;
}

/* pre { font-family: monospace; } */

a, tlink
{
color:rgb(27,31,111);
font-weight: bolder;
font-size: 0.9rem;
text-decoration: underline;
line-height:130%;

}

a.tlink:hover
{
/* color: rgb(200,140,0); */
/* background:rgb(255,255,255); */
}

.psl-box
{
box-sizing: border-box;
}

.psl-box-shadow
{
box-shadow: 0px 5px 42px 0px rgba(8, 10, 40, .54);
}

div > p, h1,h2,h3 {
hyphens: auto;
box-sizing: border-box;
}

div
{
box-sizing: border-box;
}


span
{

}

@media screen and (( (resolution <= 150dpcm) and (min-width: 2560px) )
and ( (resolution <= 150dpcm) and (max-width: 8000px) )) {
/* @media screen and (( (resolution <= 150dpcm) and (min-width: 2560px)) and ((resolution <= 150dpcm) and (max-width: 8000px) ) */

/*
body
{
@supports (zoom: 1) {
  zoom: 1.1;
  }
}
*/

div.psl-box
{
@supports (zoom: 1) {
  zoom: 1.2;
  }
}
}

/* @media screen and not ( (orientation:portrait) or (max-width: calc(1000px)) ) */
/* @media all and (orientation:landscape) */

	#psl1 {	
	/* transform: scale(0.75);  */
	left: 1.75%;
	top: 62px;
	width:100%;
	height:100%;
	z-index: 121;
	}

	#psl1-image {	
	/* transform: scale(1);  */	
	width: 100%; height: 100%;
	transition: 1.1s;
	}

	#shell {	
	display: inline-block;
	box-sizing: border-box;
	left:38.2%;
	left:max(38.2%, 330px);
	top:50px;
	width:61.8%;
	width:max(61.8%, 330px);
	z-index:110;	
	}

	#login {
	right:33%;
	top: 45px;
	width: 28rem;
	height: 18rem;
	z-index: 300;
	max-height: calc(100% - 73px);
	max-width: 66%;
	z-index:300;
	}

	#kontakt {
	right:25%;
	top: 45px;
	width: 45rem;
	height: 57.5rem;
	z-index: 300;
	max-height: calc(100% - 73px);
	max-width: 73%;
	z-index:300;
	}

	#webdesign {
	right:23.5%;
	top: 45px;
	width: 50.75rem;
	height: 30.5rem;
	z-index: 300;
	max-height: calc(100% - 73px);
	max-width: 75%;
	z-index:300;
	}

	#network
	{
	right:23.5%;
	top: 45px;
	width: 52.25rem;
	height: 53rem;
	z-index: 300;
	max-height: calc(100% - 73px);
	max-width: 76%;
	z-index:300;
	}




@media screen and ( (orientation:portrait) or (max-width: calc(1000px)) ) {
/* @media all and (orientation:portrait) { */
/* @media all and (max-width: 980px) {  */


	#psl1 {	
	/* transform: scale(0.75);  */
	left:1.3%;
	left:min(1.5%,8px);
	top: 62px;
	width: 42.5%;
	height: 42.5%;
	z-index:121;
	}

	#psl1-image {	
	/* transform: scale(0.75);  */
	width: 83%; height: 83%;
	transition: .06s;
}

	#shell {	
	display: inline-block;
	box-sizing: border-box;
	left: 38.2%;
	top: 50px;
	width: 61.8%;
	z-index:110;	
	}

	#login {
	left:0%;
	top: 40px;
	width: 100%;
	height: calc(100% - 68px);
	z-index: 300;
	max-height: 100%;
	max-width: 100%;
	z-index:300;
	}

	#kontakt {
	left:0%;
	top: 40px;
	width: 100%;
	height: calc(100% - 68px);
	z-index: 300;
	max-height: 100%;
	max-width: 100%;
	z-index:300;
	}

	#webdesign {
	left:0%;
	top: 40px;
	width: 100%;
	height: calc(100% - 68px);
	z-index: 300;
	/* max-height: calc(100% - 68px); */
	max-width: 100%;
	z-index:300;
	}

	#network {
	left:0%;
	top: 40px;
	width: 100%;
	height: calc(100% - 68px);
	z-index: 300;
	max-height: 100%;
	max-width: 100%;
	z-index:300;
	}

}






.psl_tab /* wird zugewiesen in webdesign.php */
{


}

.softwindow_header
{
/* position:relative; */
text-align:center;
vertical-align:top;
display:table-cell;
top:1px;

font-size:22px;
}

.softwindow_header:not(#brown-header)
{
background:url(pics/raster3-blue2.png);
}

#brown-header
{
/* background:url(pics/raster3-brown2.png); */
background:url(pics/raster3-blue2.png);
}


.softwindow_header /* aus inline entnommen (machine) */
{
  height: 28px; /* esent */
  width: 100%;  /* esent */
  text-align: center;  /* esent */
  display: block;  /* esent */
  /* border-bottom: 0px; */
  /* border-bottom-color: currentcolor; */
  
}



.sw_border
{
border-width:0px;
/* Rand auf 0px */
}



.opac02
{
/* :alpha(opacity=20); */
/* -moz-opacity: .2; */

opacity: .2;
}

.opac025
{
/* :alpha(opacity=25); */
/* -moz-opacity: .25; */

opacity: .25;
}

.opac03
{
/* :alpha(opacity=30); */
/* -moz-opacity: .3; */

opacity: .3;
}

.opac04
{
/* :alpha(opacity=40); */
/* -moz-opacity: .4; */

opacity: .4;
}

.opac05
{
/* :alpha(opacity=50); */
/* -moz-opacity: .5; */

opacity: .5;
}


.opac06
{
/* filter:alpha(opacity=60); */
/* -moz-opacity: .6; */

opacity: .6;
}

.opac07
{
/* filter:alpha(opacity=70); */
/* -moz-opacity: .7; */

opacity: .7;
}

.opac08
{
/* filter:alpha(opacity=80); */
/* -moz-opacity: .8; */

opacity: .8;
}

.opac09
{
/* filter:alpha(opacity=90); */
/* -moz-opacity: .9; */

opacity: .9;
}

.a		{position:absolute;}
.av		{position:absolute; visibility:visible;}
.ah		{position:absolute; visibility:hidden;}

.r		{position:relative;}
.rv		{position:relative; visibility:visible;}
.rh		{position:relative; visibility:hidden;}

.s		{position:static;}
.sv		{position:absolute; visibility:visible;}
.sh		{position:absolute; visibility:hidden;}



.stretch_image
{
position:absolute;

visibility:visible;

height:100%;

z-index:7;
}


.content_bg
{
position:absolute;
height:100%;
width:100%;
background: rgb(255,255,255); /* url(pics/raster4.gif); */

text-align:center;
overflow:hidden;
}