/*
 * Style defnition for QinS Web 
 * All measuerements are given in pt, which is defined as
 * 	1pt = 1/72 INch ~ 0.35 mm * 	
 */

:root {
  --page-min-width: calc(950px);
  --page-max-width: calc(100vw);

  --header-height: calc(125px);
  --footer-height: calc(100px);
  --body-height: calc(100vh - 125px - 100px - 50px);
  --body-max-height: calc(100vh - 125px - 100px - 50px);
  --body-min-height: calc(200px);
}

/* Header Style  */

.QinS_HeaderStyle {
  /*  background-color: rgb(166,210,255);		/* QinS bright blue color */
  background-image: url("../Bilder/iStock-QinS-Header.jpg");
  min-width: var(--page-min-width);
  max-width: var(--page-max-width);
  height: var(--header-height);

  padding: 15pt 40pt 0pt 40pt; /* inner distance from table cell to table border "top/right/button/left" */
  border: 0pt 0pt 0pt 0pt; /* no border */
  margin: 0pt 0% 0pt 0%; /* only left and right margin */

  /* Test Boxes
  border-color: #151fac;
  border-width: 5pt;
  border-style: solid;
  */
}

/* Main Page Style */
.QinS_BodyStyle {
  background-color: rgb(240, 240, 240);
  min-width: var(--page-min-width);
  max-width: var(--page-max-width);

  max-height: var(--body-max-height);
  min-height: var(--body-min-height);

  overflow-y: hidden;

  padding: 15pt 15pt 15pt 15pt; /* inner distance from table cell to table border "top/right/button/left" */
  border: 0pt 0pt 0pt 0pt; /* no border */
  margin: -35pt 0% 0pt 0%; /* set to -35pt */

  border-top-left-radius: 35pt;
  border-top-right-radius: 35pt;
  border-top-width: 0pt;
}

/* Footer Style */
.QinS_FooterStyle {
  background-repeat: no-repeat;
  background-position: center;
  background-position: left;

  background-image: linear-gradient(
    to top right,
    rgb(24, 108, 169),
    rgb(24, 108, 169),
    rgb(153, 194, 227),
    rgb(153, 194, 227),
    rgb(255, 255, 255)
  );

  min-width: var(--page-min-width);
  max-width: var(--page-max-width);
  height: var(--footer-height);

  /* padding: 0pt 40pt 0pt 40pt; /* inner distance from tabel cell to table border */
  padding: 0pt 15pt 0pt 15pt; /* inner distance from tabel cell to table border "top/right/button/left" */
  border: 0pt 0pt 0pt 0pt; /* no border */
  margin: 0pt 0% 0pt 0%; /* only left and right margin */

  text-align: center;
  vertical-align: center;
}

/*==========================================================================================================================*/
/*==========================================================================================================================*/
/* 																															*/
/* CSS Style Definitions for Top Menue																						*/
/*   																														*/
/*==========================================================================================================================*/
/*==========================================================================================================================*/

.QinS_TopMenuStyle {
  min-width: 80pt;
  max-width: 100pt;

  text-align: center;
  vertical-align: top;

  padding: 0pt 0pt 0pt 0pt; /* no padding inner distance from table cell to table border */
  border: 0pt 0pt 0pt 0pt; /* no border */
  margin: 0pt 0pt 0pt 0pt; /* no margin */

  /* Test Boxes
  border-color: #151fac;
  border-width: 5pt;
  border-style: solid;
  */
}

.QinS_TopMenueButton {
  vertical-align: bottom;

  padding: 0pt 0pt 0pt 0pt; /* inner distance from table cell to table border "top/right/button/left" */
  border: 0pt 0pt 0pt 0pt; /* no border */
  margin: 0pt 0pt 0pt 0pt; /* only left and right margin */

  font-family: Verdana, Geneva, Tahoma, sans-serif;
  font-size: small;
  text-decoration: none;
  /* Test Boxes
  border-color: #e00404;
  border-width: 5px;
  border-style: solid;
*/
}

.QinS_TopMenueImage {
  height: 25pt;
  vertical-align: bottom;
}

.QinS_TopMenueImageSelected {
  height: 35pt;
  vertical-align: bottom;
}

.QinS_TopMenueLink {
  padding: 10pt 0pt 15pt 0pt; /* inner distance from table cell to table border "top/right/button/left" */
  border: 0pt 0pt 0pt 0pt; /* no border */
  margin: 15pt 0pt 0pt 0pt; /* only left and right margin */

  color: black;
  text-align: center;
  vertical-align: bottom;

  height: 40px;
  background-image: linear-gradient(
    rgb(125, 125, 125),
    rgb(175, 175, 175),
    rgb(200, 200, 200),
    rgb(175, 175, 175),
    rgb(125, 125, 125)
  );
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  border-top-width: 2px;
  border-color: #0f0f0f;
  border-width: 1pt;
  border-style: solid;
}

.QinS_TopMenueLinkSelected {
  padding: 15pt 0pt 15pt 0pt; /* inner distance from tabel cell to table border "top/right/button/leftt" */
  border: 0pt 0pt 0pt 0pt; /* no border */
  margin: 0pt 0pt 0pt 0pt; /* only left and right margin */

  color: white;
  text-decoration: bold;

  font-weight: bold;

  text-align: center;
  vertical-align: center;

  height: 55px;
  background-image: linear-gradient(
    rgb(50, 50, 50),
    rgb(75, 75, 75),
    rgb(100, 100, 100),
    rgb(125, 125, 125),
    rgb(100, 100, 100),
    rgb(75, 75, 75),
    rgb(50, 50, 50)
  );
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  border-top-width: 2px;
  border-color: #0f0f0f;
  border-width: 1pt;
  border-style: solid;
}

a > div:hover {
  color: blue;
  font-weight: bold;
  background-image: linear-gradient(
    rgb(175, 175, 175),
    rgb(200, 200, 200),
    rgb(225, 225, 225),
    rgb(250, 250, 250),
    rgb(225, 225, 225),
    rgb(200, 200, 200),
    rgb(175, 175, 175)
  );
}

/*==========================================================================================================================*/
/*==========================================================================================================================*/
/* 																															*/
/* CSS Style Definitions for Main Content																					*/
/*   																														*/
/*==========================================================================================================================*/
/*==========================================================================================================================*/

.QinS_BodyStyleLeftCol {
  text-align: center;
  vertical-align: center;

  width: 45%;

  height: var(--body-max-height);
  max-height: var(--body-max-height);
  min-height: var(--body-min-height);

  overflow-y: hidden;

  /* padding: 0pt 0pt 0pt 0pt; /* no padding inner distance from tabel cell to table border */
  /* margin: 0pt 0pt 0pt 0pt; /* no margin */

  /*
	border-color: #151fac;
	border-width: 5pt;
	border-style: solid;
	*/
}

.QinS_BodyStyleRightCol {
  text-align: center;
  vertical-align: top;

  width: 55%;

  height: var(--body-max-height);
  max-height: var(--body-max-height);
  min-height: var(--body-min-height);

  overflow-y: hidden;

  /* padding: 0pt 0pt 0pt 0pt; /* no padding inner distance from tabel cell to table border */
  /* margin: 0pt 0pt 0pt 0pt; /* no margin */

  /*
	border-color: #151fac;
	border-width: 5pt;
	border-style: solid;
	*/
}

.QinS_BodyStyleLeftText {
  text-align: center;
  vertical-align: center;

  max-height: var(--body-max-height);
  min-height: var(--body-min-height);

  overflow-y: scroll;

  padding: 5pt 5pt 5pt 5pt; /* no padding inner distance from tabel cell to table border */
  margin: 0pt 0pt 0pt 0pt; /* no margin */

  /*
  border: 1pt 1pt 1pt 1pt;
  border-top-left-radius: 35pt;
  border-top-right-radius: 35pt;
	border-color: red;
	border-width: 5pt;
	border-style: solid;
	*/
}

.QinS_BodyStyleRightText {
  text-align: left;
  vertical-align: top;

  height: var(--body-max-height);
  max-height: var(--body-max-height);
  min-height: var(--body-min-height);

  overflow-y: scroll;

  padding: 5pt 5pt 5pt 5pt; /* no padding inner distance from tabel cell to table border */
  margin: 0pt 0pt 0pt 0pt; /* no margin */
  /*
  border-color: red;
	border-width: 5pt;
	border-style: solid;
  */
}

.QinS_ManStyle {
  width: "10%";
  float: right;
  border: 10px;
  border-style: solid;
  border-color: red;
}

/* open tbd */

/*==========================================================================================================================*/
/*==========================================================================================================================*/
/* 																															*/
/* CSS Style Definitions for Footer Menue																					*/
/*   																														*/
/*==========================================================================================================================*/
/*==========================================================================================================================*/

.QinS_BottomMenuStyle {
  min-width: 100pt;
  max-width: 200pt;
  width: 100pt;

  text-align: center;
  vertical-align: center;

  padding: 0pt 0pt 0pt 0pt; /* no padding inner distance from tabel cell to table border */
  border: 0pt 0pt 0pt 0pt; /* no border */
  margin: 0pt 0pt 0pt 0pt; /* no margin */
  /*
  border-color: #151fac;
  border-width: 5pt;
  border-style: solid;
  */
}

.QinS_BottomMenueButton {
  text-align: center;
  vertical-align: center;

  padding: 0pt 0pt 0pt 0pt; /* no padding inner distance from tabel cell to table border */
  border: 0pt 0pt 0pt 0pt; /* no border */
  margin: 0pt 0pt 0pt 0pt; /* no margin */
}

.QinS_BottomMenueLink {
  min-width: 100pt;
  max-width: 400pt;

  padding: 5pt 0pt 5pt 0pt; /* inner distance from tabel cell to table border "top/right/button/left" */
  border: 0pt 0pt 0pt 0pt; /* no border */
  margin: 0pt 0pt 0pt 0pt; /* only left and right margin */

  font: italic;
  font-family: Verdana, Geneva, Tahoma, sans-serif;
  font-size: small;
  text-decoration: none;

  color: black;
  text-align: center;
  vertical-align: center;

  background-image: linear-gradient(
    rgb(125, 125, 125),
    rgb(175, 175, 175),
    rgb(200, 200, 200),
    rgb(175, 175, 175),
    rgb(125, 125, 125)
  );
  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
  border-top-width: 2px;
  border-color: #0f0f0f;
  border-width: 1pt;
  border-style: solid;
}

.QinS_BottomMenueLinkSelected {
  min-width: 100pt;
  max-width: 400pt;

  padding: 5pt 0pt 5pt 0pt; /* inner distance from tabel cell to table border "top/right/button/leftt" */
  border: 0pt 0pt 0pt 0pt; /* no border */
  margin: 0pt 0pt 0pt 0pt; /* only left and right margin */

  font: italic;
  font-family: Verdana, Geneva, Tahoma, sans-serif;
  font-size: medium;
  text-decoration: none;

  color: white;
  text-decoration: bold;

  font-weight: bold;

  text-align: center;
  vertical-align: center;

  background-image: linear-gradient(
    rgb(50, 50, 50),
    rgb(75, 75, 75),
    rgb(100, 100, 100),
    rgb(125, 125, 125),
    rgb(100, 100, 100),
    rgb(75, 75, 75),
    rgb(50, 50, 50)
  );

  border-top-left-radius: 15px;
  border-top-right-radius: 15px;
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
  border-top-width: 2px;
  border-color: #0f0f0f;
  border-width: 1pt;
  border-style: solid;
}

.QinS_CopyrightStyle {
  width: 98%;
  
  overflow-y: hidden;

  /*
  text-align: center;
  vertical-align: center;
  
  font: italic;
  font-family: Verdana, Geneva, Tahoma, sans-serif;
  font-size: small;
  text-decoration: none;

  padding: 0pt 0pt 0pt 0pt; /* no padding inner distance from tabel cell to table border */
  /* border: 0pt 0pt 0pt 0pt; /* no border */
  /* margin: 0pt 0pt 0pt 0pt; /* no margin */
  /*
  border-color: #151fac;
  border-width: 5pt;
  border-style: solid;
  */
}
