/* CSS for ptime */


/* roboto-condensed-200 - latin */
@font-face {font-display: swap;font-family: 'Roboto Condensed';font-style: normal;font-weight: 200;src: url('/fts/roboto-condensed-v27-latin-200.woff2') format('woff2');}
/* roboto-condensed-600 - latin */
@font-face { font-display: swap; font-family: 'Roboto Condensed'; font-style: normal; font-weight: 600; src: url('/fts/roboto-condensed-v27-latin-600.woff2') format('woff2');}
@font-face { font-family: 'Scope One'; font-style: normal; font-display: swap; font-weight: 400;
  src: url('/fts/scope-one-latin-400-normal.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
/*
 * https://dev.to/janeori/css-type-casting-to-numeric-tanatan2-scalars-582j
 * https://css-tip.com/screen-dimension/
*/
@property --100vw { syntax: "<length>"; initial-value: 0px; inherits: false; }
@property --100vh { syntax: "<length>"; initial-value: 0px; inherits: false; }

:root { --100vw: 100vw; --100vh: 100vh; --px-width: calc(tan(atan2(var(--100vw), 1px))); --px-height: calc(tan(atan2(var(--100vh), 1px)));
  /* calc() wrapper required for Safari, bug: // https://bugs.webkit.org/show_bug.cgi?id=263000 */
  /* GENERAL Basic definitions -> var() */
	--shadow:2px -2px 6px 1px #cbcbcb;
	--darkborder: 1px solid #222;
	--midborder: 1px solid #777;
	--lightborder: 1px solid #eee;
	--blueborder: 1px solid rgba(29,112,183,0.8);
	--darkbg: hsl(200, 96%, 40%);
	--disable: 1px dotted #666;
	--grey: #777;
	--light-grey: #eee;
	--lgreen: rgba(153, 255, 153, 0.2);
	--med-grey: #666;
	--dark-grey: #444;
	--highlight-color: #2980b9;
	--valid: 1px solid green;
	--invalid: 1px solid red;
	--fomo: 'Roboto Condensed';
	/*Animation styles*/
	--timing: .4s;
	--ease: cubic-bezier(0.865, 0.140, 0.095, 0.870);
	--phiblue: rgba(29,112,183,0.8);
	--orangebox: 1px solid rgba(255, 105, 0, 1);
	--blueback: rgba(29,112,183,0.9);
	--midblueback: rgba(29,112,183,0.4);
	--lightblueback: rgba(29,112,183,0.2);
	--lightlightblueback: rgba(29,112,183,0.1);
	--dorangeback: rgba(255, 105, 0, 0.9);
	--lorangeback: rgba(255, 105, 0, 0.25);
}
/*generalities*/
.fo08 {font-size:0.8rem;}
.fomo {font-family:var(--fomo);}
.w100 {width:100%;} .w04 {width:4%;} .w05 {width:5%;} .w075{width:7.5%} .w10 {width:10%;} .w125{width:12.5%} .w15 {width:15%} .w20 {width:20%} .w25 {width:25%} .w30 {width:30%;} .w40 {width:40%;} .w50 {width:50%;} .w60 {width:60%;} .w70 {width:70%;} .w80 {width:80%;}
.mr05{margin-right:0.5em;}.mr03{margin-right:0.3em;}
.ml03{margin-left:0.3em;}
body{background-color:white;font-family: 'Scope One';font-weight:400;font-size:1.05rem;height: calc(var(--px-height) * 1px);
width: calc(var(--px-width) * 1px);}
button, input[type="submit"], input[type="reset"] {	background: none;color: inherit;border: none;padding: 0;font: inherit;cursor: pointer;outline: inherit;}
#page {max-width:1275px;margin:auto;min-height:600px;width:calc(var(--px-width) * 0.8 * 1px);background-color:#fff;}
#container {max-width:1275px;min-height:550px;height:auto;padding:2em 14%;margin-left:-4px;} 
#kopf {margin:auto;margin-left:-4px;height:72px;border-bottom:var(--orangebox);background-color:rgba(244,244,244,0.6);min-width:820px;max-width:1275px;}
#headcontainer {display:flex;justify-content:space-between;}
#foot {margin:auto;margin-left:-4px;height:50px;min-width:820px;max-width:1275px;background-color:rgba(244,244,244,0.6);border-top:var(--blueborder);font-family:Roboto Condensed;padding:1em;display:flex;justify-content:space-between;}
.main {display:flex}
.left {margin-right:2.5%; width:47.5%;}/* FLEX11*/
.right {margin-left:2.5%; width:47.5%;}
.left23 {margin-right:2.5%; width:37.5%;}/* FLEX23*/
.right23 {margin-left:2.5%; width:57.5%;}
a {text-decoration: none;}
.link {font-family:'Roboto Condensed';color: var(--dorangeback);cursor:pointer;font-size:1.05rem;}
h1 {font-size:1.9rem;font-family:Roboto Condensed;font-weight:300 !important;color:var(--dorangeback);margin-bottom:0.5rem;} 
h2 {font-size:1.5rem;font-family:Roboto Condensed;font-weight:300 !important;color:var(--dorangeback);margin-bottom:0.3rem;} 
h3 {font-size:1.3rem;font-family:Roboto Condensed;font-weight:300 !important;color:var(--dorangeback);margin-bottom:0.15rem;} 
h4 {font-size:1.1rem;font-family:Roboto Condensed;font-weight:300 !important;color:var(--dorangeback);}

.flex {display:flex;}
.ndsp {display:none;}
.narrow {display:none;}
.philink {text-align:right;}
.logowrap {width:90px;padding:10px;margin: 0 3.7em 0 0.5em;}
.ndsp {display:none;}
.navbox {font-size:1.1em; padding:2px 0.5em;margin-top:2.7rem;font-weight:300;color:rgba(100, 100, 100, 0.8);cursor:pointer;}
.navbox.active {color:var(--phiblue);cursor:default;}
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -ms-box-sizing: border-box;}
.btn, input[type=submit] {padding:7px 8px;background-color:var(--med-grey);border: var(--darkborder);box-shadow:var(--shadow);color:white;border-radius:5px;cursor:pointer;font-family:'Roboto Condensed';font-size:1em;}
/*datepicker*/
.ui-datepicker-title,.ui-datepicker-calendar {font-family:'Roboto Condensed';}
#ui-datepicker-div {width:200px;}

.clock {font-family:Roboto Condensed;font-weight:600;font-size:10rem;color:white;position:relative;top:200px;left:50%:auto;z-index:1000;text-shadow:4px 5px 5px black;}
.center {text-align:center;}
/* FORM ELEMENTS*/
.errform {width:80%;text-align:right;font-size:0.8em;color:red;}
input.valid {background-color:green;border:var(--valid);}
input.invalid {border: var(--invalid);}
/*label*/
.formgroup {font-family:Roboto Condensed;margin-bottom:5px;}
label {display:block;}
/* Selects */
select {-webkit-appearance: none;-moz-appearance: none;appearance: none;border-radius: 5px;font-size: 1rem;width:auto;border: var(--blueborder);padding:0 1.8em 1px 0.4em;background-color:white;font-family:'Roboto condensed'!important;font-weight:200;height:38px;font-size:1.1em;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAUCAIAAAAY12rUAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAJFJREFUeNpi/P//PwM1ABMDlcAgNOjy089kaPv4/c+jd99RDMpafhmISDXFZ+qp6Yceooh++Pbbpvto5rJL/4kDuNQz4JEj3hSoQUSahV8NA5HqCNrEQIxqYtzLQFAPkSHIgN8XxMcDI9ZMC0kputK8wOQKJKdF6hJOXeTFEbEugruLn5OFyOTOOFoeEQQAAQYAae5A514WfKgAAAAASUVORK5CYII=);
background-position: right;background-repeat: no-repeat;}
select:focus + .focus {font-family:'Roboto Condensed';font-weight:100;position: absolute;top: -1px;left: -1px;right: -1px;bottom: -1px;border: 2px solid var(--select-focus);border-radius: inherit;}
/*select:has(option[value="0"]:checked){border:1px solid red;}*/
select:not(:has(option[value="0"]:checked)){border: var(--blueborder)}
select:disabled:not(:has(option[value="0"]:checked)),select:disabled:has(option[value="0"]:checked){border:var(--disable)}
/*File Upload*/
.tahir{background-color: var(--dark-grey); padding: 6px 10px; border-radius: 5px;color:white;font-family:Roboto Condensed;
}
/*checkboxes*/
input[type="checkbox"] {
	/* Remove most all native input styles */-webkit-appearance: none;appearance: none;
	/* For iOS < 15 */background-color: var(--lightbg);
	margin: 0;font: inherit;color: currentColor;width: 1.15em;height: 1.15em;border: var(--blueborder);border-radius: 0.15em;transform: translateY(-0.075em);  display: grid;place-content: center;}
input[type="checkbox"]::before {content: "";width: 0.65em;height: 0.65em;clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);transform: scale(0);transform-origin: bottom left;transition: 120ms transform ease-in-out;box-shadow: inset 1em 1em var(--darkbg);
/* Windows High Contrast Mode */background-color: CanvasText;}
input[type="checkbox"]:checked::before {transform: scale(1);}
input[type="checkbox"]:disabled {border:1px dotted #666;}

/*text inputs*/
input[type="text"],input[type="password"] {-webkit-appearance: none;appearance: none;
	/* For iOS < 15 */background-color: var(--lightbg);
	padding-left:6px;font: inherit;color: currentColor;height: 2em;border: var(--midborder);border-radius: 5px;font-family:'Roboto Condensed';font-size:1.1em;height:2em;background:white;}
input[type="text"]:disabled {border: var(--disable);color:var(--grey);}
.admin input {margin-right:0.3em;}
textarea {font-family:Roboto Condensed;font-size:1.1em;}
/*Overlay*/
.overlay { position: fixed;top: calc((var(--px-height) * 1px)-900px); bottom: 0; left: 0; right: 0; background: rgba(0, 0, 0, 0.75); transition: opacity 500ms; visibility: hidden; opacity: 0;}
.overlay:target {visibility: visible;opacity: 1;}
.popup { margin: 30px auto; padding: 20px; background: #fff; border-radius: 6px; max-width:920px; min-width:320px; position: relative; transition: all 5s ease-in-out; }
.popup .close { position: absolute; top: 20px; right: 30px; transition: all 200ms; font-size: 30px; font-weight: bold; text-decoration: none; color: #333; }
.popup .close:hover { color: #06D85F; }
.popup .content { max-height: 30%; overflow: auto; }

/*Email*/
div.email > span:nth-child(2) { display: none; }
/** Global **/
*, *:before, *:after { box-sizing: border-box; }
/* Classes for standard parser*/
.dload {font-family:Roboto Condensed;margin-bottom:4px;}
.dload .imgicon {height:16px;margin-right:3px;display:inline-block;}

/*** Accordion ***/
/* Basic Accordion Styles */
.accordion { position: relative;  
  /* Radio Inputs */
  input[name='panel'] { display: none; }
  /* Labels */
  label {
	transition: all var(--timing) var(--ease); display: block; padding: 0.6em 1em 1.5em; width: 100%; height:2.5rem; border-bottom: 0.1em solid hsl(200, 96%, 80%); color: hsl(0, 100%, 100%); font-size: 1.1rem; line-height: 1rem; cursor: pointer; }
  input:checked + label { color: $highlight-color;     
}
/* Panel Content */
  .accordion__content {overflow: hidden;max-height: 0em;position: relative;padding: 0 1.5em;display: block;padding: 0 1em;width: 100%;background: hsl(0, 1%, 90%);transition: all 0.5s ease;    
    	.accordion__header {padding: 1em 0;}
    .accordion__body {		
    }
  } 
}
input[name='panel']:checked ~ .accordion__content { /* Get this as close to what height you expect */ max-height: 50em;transition: all 1s ease!important;  }

li {
	position: relative;
	list-style-type: none;
	list-style-position: outside;
}

.blist > li::before {
	content: "▷"; /* Default bullet */
	color: orange;
	margin-right: 6px;
	margin-left:-18px;
}

/* NEW NAV*/
nav {margin: 33px 0 20px 17px; z-index:11;}
nav ul {padding: 0; margin: 0; list-style: none; position: relative;}
nav ul li {	display:inline-block;}
nav a {	display:block;padding:3px 10px 4px;	color:#111;	font-size:20px;	line-height: 30px;text-decoration:none;}
nav a.active {color: var(--dorangeback);}
nav a:hover { background-color: var(--dorangeback);color:#FFF;}
/* Hide Dropdowns by Default */
nav ul ul {	display: none;	position: absolute;	background-color:#888;	color:#FFF;	top: 38px; /* the height of the main nav */	left:-4px;	}
nav#main-menu ul ul a { color:#111;	background-color:rgba(245,245,245,1);	border-left: 4px solid #fff;border-right: 4px solid #fff;font-size:17px;}
nav#main-menu ul ul a:hover { background-color: var(--dorangeback);color:#FFF;}
nav#main-menu ul ul:last-child { color:#111;	background-color:rgba(245,245,245,1);border-left: 4px solid #fff;border-right: 4px solid #fff; border-bottom: 8px solid #fff;}
/* Display Dropdowns on Hover */
nav ul li:hover > ul {display:inherit;}
/* First Tier Dropdown */
nav ul ul li {width:170px;float:none;	display:list-item;	position: relative;}
/* Second, Third and more Tiers	*/
nav ul ul ul li {position: relative;	top:-40px; left:170px;}
/* Change this in order to change the Dropdown symbol */
nav li > a:after { content:  '  ▽';font-size:0.9em;font-family:Roboto Condensed; }
nav li > a:only-child:after { content: ''; }


/*
.overlay{position: fixed;top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    visibility: hidden;
    transition: opacity .35s, visibility .35s, height .35s;
    overflow: hidden;
    background: black;
    z-index: 22;
}*/

#hamburger-input{
  display: none;
}

#hamburger-menu {
    position: absolute;top: 2em;right: 2em; width: 32px; height: 32px; display: none; border: none; padding: 0px; margin: 0px; cursor:pointer; background: linear-gradient(to bottom, 
      var(--dorangeback), var(--dorangeback) 20%, white 20%, white 40%, var(--dorangeback) 40%, var(--dorangeback) 60%, white 60%, white 80%, var(--dorangeback) 80%, var(--dorangeback) 100% );}

#hamburger-menu #sidebar-menu {
	visibility: hidden;position: fixed;top: 46px;left: -550px;width: 500px;height: 800px; margin-left:-1em;background-color: var(--dorangeback);transition: 0.5s; padding: 10px 1.5em; box-sizing: border-box;z-index:33;}
}
nav#sidebar-menu {}
nav#sidebar-menu ul {padding: 0; margin: 0; list-style: none; position: relative;}
nav#sidebar-menu ul li {display:block;}
nav#sidebar-menu a {display:block;padding:3px 10px 4px;	color:#fff;	font-size:20px;	line-height: 30px;text-decoration:none;}
nav#sidebar-menu a.active {color: #fff;}

nav#sidebar-menu ul ul a:hover { background-color:rgba(245,245,245,0.4);color:#111;width:220px!important;}
nav#sidebar-menu ul > li > a:hover { color:#111; background-color:rgba(245,245,245,0.6);width:150px;} /*top level*/
/* Hide Dropdowns by Default */
nav#sidebar-menu ul ul {display: block;top:-2em;margin-bottom:-2em;margin-left:10em;background-color:var(--lorangeback);color:#111;;width:220px;}
nav#sidebar-menu ul ul a { color:#111; background-color:var(--lorangeback);	font-size:20px; width:220px;}
nav#sidebar-menu ul ul:last-child { color:#eee;	background-color:rgba(245,245,245,0.6)}
/* Display Dropdowns on Hover */
/*nav#sidebar-menu ul li:hover > ul {display:block;}*/
/* First Tier Dropdown */
nav#sidebar-menu ul ul li {width:220px;float:none;	display:list-item;	position: relative;}

#hamburger-input:checked + #hamburger-menu #sidebar-menu {
    visibility: visible;
    left: 0;
}
#hamburger-input:checked ~ .overlay{
   visibility: visible;
  opacity: 0.4;
}

/* SLIDESHOW home */
.slideshow--5-for-10 {
  position: relative;
  z-index: 1;
}
.slideshow--5-for-10 img {
  color: transparent;
  opacity: 0;
  z-index: 0;
  animation: slideshow__fade--5-for-10 50s linear infinite 0s;
  backface-visibility: hidden;
}

.slideshow--5-for-10 img:not(:first-child) {
  position: absolute;
  top: 0px;
  left: 0px;
}

.slideshow--5-for-10 img:nth-child(1) { animation-delay: 0s;}
.slideshow--5-for-10 img:nth-child(2) { animation-delay: 10s;}
.slideshow--5-for-10 img:nth-child(3) { animation-delay: 20s;}
.slideshow--5-for-10 img:nth-child(4) { animation-delay: 30s;}
.slideshow--5-for-10 img:nth-child(5) { animation-delay: 40s;}

@keyframes slideshow__fade--5-for-10 {  
  0% { opacity: 0; animation-timing-function: ease-in;  }
  5.00% { opacity: 1; animation-timing-function: ease-out; }
  24.00% { opacity: 1; }
  28.00% { opacity: 0; }
  100% { opacity: 0; }}

  
  
/*MEDIA QUERIES*/
@media (max-width: 1500px) {
	#page {max-width:1200px;margin:auto;min-height:550px;min-width:1001px; width:calc(var(--px-width) * 0.8 * 1px);background-color:#fff;}
	#container {max-width:960px;min-height:550px;height:auto;padding:0 2em;} 
	#foot,#kopf {width:90%;min-width:1000px;}	
}
@media (max-width: 1000px) {
	#page {max-width:900px;margin:auto;min-height:550px;min-width:801px; width:90%;background-color:#fff;}
	#container {max-width:900px;min-height:550px;height:auto;padding:0 2em;} 
	/*.left, .right {width:49%;}*/
	#foot,#kopf {max-width:1000px;min-width:800px;}
	.clock {font-size:9rem;position:relative;top:180px;left:50%:auto;z-index:1000;text-shadow:4px 5px 5px black;}
}
@media (max-width: 800px) {
	#page {max-width:800px;margin:auto;min-height:550px;min-width:701px; width:100%;background-color:#fff;}
	#container {max-width:800px;min-height:550px;height:auto;padding:0 2em 0 1em;}
	#foot,#kopf {width:100%;} 
	.main {display:block;}
	.left, .right {width:100%;}
	.wide {display:none;}
	.narrow {display:block;}
	#hamburger-menu { display: inline;}
	.clock {font-size:7.5rem;position:relative;top:160px;left:50%:auto;z-index:1000;text-shadow:4px 5px 5px black;}
}
@media (max-width: 700px) {
	#foot,#kopf {width:100%;} 
	#page {max-width:700px;margin:auto;min-height:550px;min-width:601px; width:100%;background-color:#fff;}
	#container {max-width:800px;min-height:550px;height:auto;padding:0 1em;}
	.clock {font-size:6rem;position:relative;top:180px;left:50%;z-index:1000;text-shadow:4px 5px 5px black;}
	.philink {display:none;}	
}
@media (max-width: 600px) {
	#page {max-width:600px;margin:auto;min-height:550px;min-width:320px; width:100%;margin-left:-8px;background-color:#fff;}
	#foot,#kopf {margin:0 1em 0 -1em;max-width:555px;width:100%;} 
	#container {height:auto;min-height:550px;padding:0 1em;} 
	.main {display:block;}
	.left, .right {width:100%;}
	.clock {font-size:5rem;position:relative;top:180px;left:50%:auto;z-index:1000;text-shadow:4px 5px 5px black;}
}