/* Copyrighted property of Frederic Hilpert - hilpert.solutions */
/* ANIMATIONEN -------------------------------------------------------------------------------------------------------------------------------------*/
/* BASIC ------------------------------------------------------------------------------------------------------------------------------------------*/
img,
picture        {aspect-ratio:attr(width)/attr(height);}
#logo          {max-height:96vh;}
a 	           {text-decoration:none;}
h2.descripto   {font-size:1.1rem;}
h3.descripto   {font-size:1.07rem;}
h4.descripto   {font-size:1.05rem;}
h5.descripto   {font-size:1rem;}
.subcaption    {font-size:0.9rem;}
.address       {font-size:1.2rem;}
.descripto     {font-size:1.1rem;}
.descripto,
.address       {color:#e7e7df;;}
.dgreentxt	   {color:#31472b;}
.ndgreentxt    {color:#4f5148;}
.greentxt	   {color:#6d9c27;}
.lgreentxt     {color:#baaf9d;}
.lgrquote      {color:#cbc1b0;}
.lighttxt      {color:#e7e7df;}
.lgreenbg      {background-color:#baaf9d;}
.dgreenbg      {background-color:#4f5148;}
.lightbg       {background-color:#efefe8;}
.fontnorm      {font-style:normal;}
.fontital      {font-style:italic;}
.bold          {font-weight:bold;}
.ls005         {letter-spacing:0.05rem;}
.ls01          {letter-spacing:0.1rem;}
.ls02          {letter-spacing:0.2rem;}
p.article::first-line   {line-height:100%;}
p.article::first-letter {font-family: 'modesto-expanded',serif;font-size:300%;color:#be8852;padding:0.1em 0.1em 0.1em 0em;font-weight:bold;float:left;line-height:0.5em;}
.highlighted {letter-spacing:0.03rem;font-size:1.15rem;color:#baaf9d;}
.textmarker_deact  {font-weight:normal; text-decoration: underline dashed #cfcec4; text-underline-position:under;}
.srccode	 {font-family: 'source-code-pro',monospace;}
.modesto 	 {font-family: 'modesto-expanded',serif;}
.congenial   {font-family: 'congenial-light',sans-serif;}
.aya         {font-family: 'aya-script', sans-serif;}
.hwt-artz    {font-family: 'hwt-artz', sans-serif;letter-spacing:0.05rem;font-variant: none;}
.brbx    {border: 1px solid #baaf9d;}
.slanted {transform:rotate(-5deg);}
#menbutt {height:8vh;}
#mm_om:focus #mm_mu,
#mm_om:hover #mm_mu   {display:block; animation: fadeInPage ease 1s; animation-iteration-count: 1; animation-fill-mode: both;}

div#mm_om:hover + div#dr_cn {display:block; animation: fadeInPage ease 1s; animation-iteration-count: 1; animation-fill-mode: both;}

#fr_mn  {scrollbar-base-color:#7e7c69;scrollbar-face-color:#7e7c69;scrollbar-3dlight-color:#4f5148;scrollbar-highlight-color:#4f5148;scrollbar-track-color:#4f5148;scrollbar-arrow-color:#7e7c69;scrollbar-shadow-color:#4f5148;scrollbar-dark-shadow-color:#4f5148;}
#fr_mn::-webkit-scrollbar-track-piece,
#fr_mn::-webkit-scrollbar {background-color:#7e7c69;}
#fr_mn::-webkit-scrollbar-thumb,
#fr_mn::-webkit-scrollbar-button,
#fr_mn::-webkit-scrollbar-track {background-color:#4f5148;}

.menulink:hover		 {animation: menulinkhover ease 1s; animation-iteration-count: 1; animation-fill-mode: both;}
.menulink:not(hover) {animation: menulinknohover ease 0.3s; animation-iteration-count: 1; animation-fill-mode: both;}
.menulink            {color:#e7e7df;}

.menlnkfrst 		     {border-radius: 0.3em 0 0 0;}
.menlnklast 		     {border-radius: 0 0 0 0.3em;}
.mactbuttn 			  	 {width:3em;max-height:10vh;}

@keyframes menulinkhover {
  from {background-color: #7e7c69;}
  to   {background-color: #342e2a;}
}

@keyframes menulinknohover {
  from {background-color: #342e2a;}
  to   {background-color: #7e7c69;}
}

/* Non-Critical Basics*/
a.descripto:active, a.descripto:hover  {color:#342f2b;}
/* MEDIA QUERIES ---------------------------------------------------------------------*/
/* Desktop Landscape-----------------------------------------------------------------------------------------*/
@media only screen and (min-device-aspect-ratio: 1/1) and (min-aspect-ratio: 2/1) {
	#fr_cn {width:68vw;float:right;}
}
@media only screen and (min-device-aspect-ratio: 1/1) and (max-aspect-ratio: 2/1) {
	#fr_cn {width:68vw;float:right;}
}
@media only screen and (min-device-aspect-ratio: 1/1) {
#fr_cn        {height:calc(100% - 0.9rem);}
.descripto    {margin:0px;}
h2.descripto  {margin-left:0.9vw;}
#fr_cn        {margin-bottom:0.3vw;}
#fr_cn        {margin-top:0.3vw;}
}
/* Standard Bildschirme --------------------------------------------------------------*/
@media only screen and (min-device-aspect-ratio: 1/1) and ( min-width: 950px ) {
#logo_left  	 {display:none;}
#fr_logo		 {text-align:left;}
.descripto 		 {padding-right:5px;}
}
/* Tablets und mittlere Bildschirme ----------------------------------------------------------------------------------------------------------------*/
@media only screen and (min-device-aspect-ratio: 1/1) and ( max-width: 950px ) {
#logo_left   {display:none;}
#fr_logo	 {text-align:left;}
.descripto   {padding-right:5px;}
}
/* Mobile Portrait -------------------------------------------------------------------------------------------------------------------------*/
@media only screen and (max-device-aspect-ratio: 1/1) {
#logo_lbig    {display:none;}
#fr_logo  	  {text-align:left;}
#fr_cn        {width:100%;}
.descripto    {padding-left:1vw;}
.descripto    {padding-right:1vw;}
.descripto    {padding-top:0.5vw;}
.descripto    {margin:0px;}
h2.descripto  {margin-left:0.7vw;}
}