@charset "UTF-8"; @media only screen and (min-width:300px) and (min-height: 260px){ :root { --Vwidth: 90%; --Vleft: 5%; --Vtop: 40px; --Vscroll: auto; --VfsI:90%; }} @media only screen and (min-width:500px) and (min-height: 500px ){ :root { --Vwidth: 90%; --Vleft: 5%; --Vtop: 40px; --Vscroll: auto; --VfsI:80%; }} @media only screen and (min-width:700px) and (min-height: 500px ){ :root { --Vwidth: 75%; --Vleft: 5%; --Vtop: 20px; --Vscroll: auto; --VfsI:80%; }} @media only screen and (min-width:800px) and (min-height: 500px ){ :root { --Vwidth: 67%; }} @media only screen and (min-width:1000px) and (min-height: 600px){ :root { --Vwidth: 600px; --Vleft: 100px; --Vtop: 20px; --Vscroll: auto; --VfsI:80%; }} @media only screen and (min-width:1200px) and (min-height: 700px){ :root { --Vwidth: 650px; --Vleft: 150px; --Vtop: 20px; --Vscroll: auto; --VfsI:75%; }} @media only screen and (min-width:1600px) and (min-height: 900px){ :root { --Vwidth: 700px; --Vleft: 300px; --Vtop: 20px; --Vscroll: auto; --VfsI:75%; }} #termKontakt{ z-index:900; position:fixed; display: none; opacity: 0; top:60px; left: var(--Vleft); width:var(--Vwidth); height: calc(100vh - 80px); margin:0 auto; padding:10px; background:#ffb609; border:1px solid silver; border-radius:10px; cursor: pointer; transition:0.2s ease-in-out; overflow-y:auto; } #termKontakt{animation:einblenden 1.5s;} .Kbox{width:95%; padding:20px; border:2px solid #ffb609; } .termForm{width:95%; height:auto; padding:10px 20px; margin:0 auto; background:#ffb609; border:1px solid gray; border-radius:10px;} .termClose{width:35px; height:35px; border:2px solid red; cursor:pointer; float:right;} .boxI{width:98%; height:auto; padding:0 10px 2px; margin:3px auto; background:#f9f9f9;} .boxI2{width:98%; height:auto; padding:0 10px 2px; margin:5px auto 10px; background:#f9f9f9;} .boxBut{width:auto; height:auto; margin:20px 0 10px;} label{font-size:var(--VfsI); line-height: 0.9; padding:0; border-bottom: 1px solid silver;} .fsI{font-size:var(--VfsI);} input[type="text"], input[type="url"], input[type="email"], input[type="tel"]{ appearance: none; border-left: none; border-right: none; border-top: none; border-bottom: 1px solid blue; width: 98%; height:24px; padding:3px 5px; margin:0 auto; background:#f0f0f0; color:#000; font-size: 18px; font-weight:400; } textarea { appearance: none; width:95%; height:80px; padding:10px; margin:10px auto; border:1px solid silver; border-radius:6px; background:#f9f9f9; color:#000; font-size: 18px; font-weight:400; } sup { position: relative; vertical-align: top; top: 10px; font-family: Roboto, sans-serif, cursive; color:#0044ff; font-weight:600; } button{ font-size: 18px; padding: 5px 12px; font-family: Roboto, sans-serif, cursive; color: teal; border: 1px solid silver; background-image: linear-gradient(to top, gainsboro 0%, white 90%); border-radius: 16px; cursor:pointer; }