:root { --txt:#fff; --gap:clamp(24px,3.6vw,48px); --adminbg:#0006; --adminborder:#fff3; --inputbg:#0009; --nav0:#40d3ec; --nav1:#9feefb; --menu0:#fff; --menu1:#ff8500; --menu2:#ff8500; --pad:min(64px,4.8vw); --zebra:var(--gap); --zebraw:calc(0.03vw * 927); --zebrah:calc(0.03vw * 1055); --tr:0.25s; --ea:ease-in-out; --mainpad:max(var(--pad),calc(50vw - 700px)); --letterspacing:clamp(0.3rem,calc(2.3vw - 11px),1.2rem); --sectionhlpadding:clamp(20px,2.63vw,40px); --cmax:12; --ctpadding:1.2rem; } /* * { font-family:Verdana,Arial,sans-serif } */ html { font-family:Verdana; font-size:clamp(15px,1.5vw,20px); line-height:1.5em; scroll-padding-top:10em; } body { margin:0; display:grid; grid-template:"head" 8em "main" 1fr "foot" min-content / 1fr; min-height:100vh; min-height:100dvh; color:var(--txt); } #bg { position:fixed; width:100vw; height: 100vh; background-image:url(images/gradientdark.png); background-repeat:no-repeat; background-size:100vw 200vh; z-index:-1; } .noise { background-image:url(images/noise.png); background-repeat:repeat; z-index:-1; } #noise { position:fixed; width:100vw; height: 100vh; } #noisehead { position:absolute; width:100vw; height:4em; transition:height 0.3s ease-in-out; } header { height:4em; display:flex; align-items:center; grid-area:head; background-image:url(images/gradientdark.png); background-repeat:no-repeat; background-size:100vw 200vh; z-index:1000; position:sticky; top:0; box-shadow:0 0 40px #0003; transition:height 0.3s ease-in-out; } header.scrolled { height:2em; } header.scrolled #noisehead { height:2em; } footer { min-height:calc(85vh - 6rem); display:flex; align-items:end; grid-area:foot; } footer>div { position:sticky; bottom:0; width:100%; min-height:12rem; padding-bottom:1em; display:grid; gap:var(--gap); grid-template:"menu logo extra" min-content / 1fr min-content 1fr; box-sizing:border-box; margin:1em var(--mainpad) 0; } #footer_menu { grid-area:menu; } #footer_menu>ul { list-style-type:none; padding:0; width:min-content; } #footer_menu>ul:not(.fx) { border-top:1px solid #fff6; text-align:right; } #footer_menu>ul.fx { display:flex; gap:1em; } #footer_menu>ul:not(.fx) li { border-bottom:1px solid #fff6; margin:0; } #footer_menu>ul.fx>li { padding:0; display:inline; } A.menu0 { font:600 1rem/2em Fahkwang; padding:0 1em; display:block; color:var(--menu0); text-transform:uppercase; letter-spacing:1px; } A.menu1 { font:600 1rem/2em Fahkwang; padding:0 1em; display:block; color:var(--menu1); text-transform:uppercase; letter-spacing:1px; } A.menu0:hover,A.menu1:hover { color:var(--menu2); text-decoration:none; } A.submenu0 { font:600 1rem/2em Fahkwang; padding:0 1em; display:block; color:var(--menu0); text-transform:uppercase; letter-spacing:1px; } A.submenu1 { font:600 1rem/2em Fahkwang; padding:0 1em; display:block; color:var(--menu1); text-transform:uppercase; letter-spacing:1px; } A.submenu0:hover,A.submenu1:hover { color:var(--menu2); text-decoration:none; } A.fxmenu0 { font:400 1rem/1em x-siter; display:block; color:var(--menu0); } A.fxmenu1 { font:400 1rem/1em x-siter; display:block; color:var(--menu1); } A.fxmenu0:hover,A.fxmenu1:hover { color:var(--menu2); text-decoration:none; } #language { right:var(--mainpad); position:absolute; padding:0; margin:0; } #language li { display:inline; margin-left:.5em; text-transform:uppercase; font: 500 0.8rem/1.5em Fahkwang; letter-spacing: 14%; } #language a:hover { text-decoration:none; } .xtramenu0 { color:var(--menu0); } .xtramenu1 { color:var(--menu2); } #footer_logo { display:flex; flex-direction:column; gap:1em; grid-area:logo; justify-self:center; align-items:center; } #footer_logo>img { width:clamp(150px, 26.666vw, 240px); height:auto; } #footer_logo ul { list-style-type:none; display:flex; justify-content:space-between; width:50%; margin:0; padding:0; } #footer_logo a { color:var(--menu0); padding:0.2em; font:400 1rem/1em x-siter; } #footer_logo a:hover { color:var(--menu1); text-decoration:none; } #footer_logo span { font:300 0.5rem/1em Fahkwang; text-align:center; } #footer_extra { grid-area:extra; padding-left:4em; } main { padding:0 var(--mainpad); box-sizing:border-box; grid-area:main; } .content { box-sizing:border-box; display:flex; flex-wrap:wrap; gap:var(--gap); align-items:center; } .zebra { padding:var(--zebra); background-image:url(images/zebra.png); background-size:var(--zebraw) var(--zebrah); } section { position:relative; } section.content { margin:var(--pad) 0; } section::after { content:''; display:block; height:1px; background:#fff6; position:absolute; bottom:0; width:100%; } section.content::after { content:''; display:block; height:1px; background:#fff6; position:absolute; left:0; bottom:calc(-1 * var(--pad)); width:100%; } section.fold { display:grid; position:relative; gap:0; } section.fold>div.hl h1 { font:600 1.3rem/1.2em Fahkwang; padding:var(--sectionhlpadding) 0; letter-spacing:var(--letterspacing); text-transform:uppercase; margin:0; opacity:1; transition:opacity var(--tr) var(--ea); cursor:pointer; } section.fold>div.hl h1:hover { color:var(--menu2); } section.fold>div.bd { display:grid; grid-template-rows:0fr; opacity:0; transition:opacity var(--tr) var(--ea), grid-template-rows var(--tr) var(--ea); } section.fold>div.hl { display:grid; grid-template-rows:1fr; opacity:1; transition:opacity var(--tr) var(--ea), grid-template-rows var(--tr) var(--ea); z-index:1000; } section.fold>div.bd>div.content { overflow-y:hidden; padding:0 var(--pad); transition:padding-top var(--tr); transition:padding-bottom var(--tr); } section.fold>div.hl>div { overflow-y:hidden; } section.fold.active>div.bd { grid-template-rows:1fr; opacity:1; } section.fold.active>div.bd>div.content { padding:0; } section.fold.active>div.hl { grid-template-rows:0fr; opacity:0; } section.fold.active>div.hl h1 { opacity:0; pointer-events:none; } section.fold.active.blind>div.bd { opacity:0; pointer-events:none; } input,textarea { color:var(--textinput); background:var(--inputbg); } input.edit, textarea.edit { padding:1px; margin:0; font-size:14px; border:1px solid var(--adminborder); box-sizing:border-box; width:100%; } input.warn, textarea.warn { padding:1px; margin:0; font-size:14px; border:1px solid red; background-color:#fdd; color:#000; box-sizing:border-box; width:100%; } h1,h2,h3,h4,h5,h6 { margin:0; } .content h1 { font:600 1.5rem/1.5em Fahkwang; letter-spacing:var(--letterspacing); text-transform:uppercase; margin-bottom:0.75rem; } .content h2 { font:500 1rem/1.6rem Fahkwang; letter-spacing:0.5rem; text-transform:uppercase; } .content h3 { font:200 0.8rem/1.5em Fahkwang; letter-spacing:14%; text-transform:uppercase; } .content h4 { text-transform:uppercase; font-size:11px; color:#fff; background-color:#f70; padding:1px 1px 1px 3px; letter-spacing:1px; } .content h5 { font-size:10px; font-weight:normal; color:#666; display:block; text-align:center; margin:0 auto; padding:2px 10px; } img { border:none; display:block; } .ctcol p, .mgcol p { margin:0; padding:0; font:300 12px/28px Fahkwang; hyphens:auto; hyphenate-character:'-'; letter-spacing:10%; } pre { font-family:monospace; } .admin { color:#33c; margin:0 0 0 4px; } .adminbox { background-color:var(--adminbg); border-color:var(--adminborder); border-width:1px 0 1px 0; border-style:solid; padding:0; position:absolute; bottom:0; transform:translateY(100%); } .xsgalcontainer { display:grid; grid-template-columns:repeat(min(var(--c),var(--cmax)),1fr); gap:.5em; } .thumbnail { position:relative; } .thumbnail img { width:100%; } div.hr { background-color:#999; border:none; height:1px; margin:7px 0; } hr { display:none; } ul.list { list-style-type:none; padding:0; margin:0; } ul.list li { background-image:url(../images/dot.gif); background-repeat:no-repeat; background-position:0 1ex; padding-left:1em; } #menu ul { list-style-type:none; padding:0; margin:0 0 11px 0; border-bottom:1px solid #999; } #menu ul ul { margin-bottom:0; border:none; } A { text-decoration:none; } A:hover { text-decoration:underline; } A.icon { margin:0 1px; } A.icon:hover { text-decoration:none; } A.navigation { color:var(--nav0); } A.url { color:inherit; text-decoration:underline; font-weight:700; } A.url2 { color:inherit; background:#fff3; text-decoration:none; text-transform:uppercase; padding:0.1rem 0.7rem 0 1rem; display: inline-block; margin:0.65em 0; text-wrap:nowrap; border-radius:0.75rem; letter-spacing:58%; font:700 0.47rem/1.4rem Fahkwang; } A.url2:hover { color:inherit; background:#fff5; text-decoration:none; } /* A.url:before { content:"\f101"; font-family:x-siter; padding-right:0.25em; } */ A.download { color:var(--nav0); text-decoration:none; } A.download:before { content:"\f0f6 "; font-family:x-siter; padding-right:0.25em; } A.back { color:var(--nav0); text-decoration:none; } A.back:before { content:"\f100 "; font-family:x-siter; padding-right:0.25em; } A.prev { color:var(--nav0); text-decoration:none; } A.prev:before { content:"\f100 "; font-family:x-siter; padding-right:0.25em; } A.next { color:var(--nav0); text-decoration:none; } A.next:after { content:"\f101 "; font-family:x-siter; padding-left:0.25em; } A.navigation:hover,A.url:hover,A.download:hover,A.back:hover,A.prev:hover,A.next:hover { color:var(--nav1); } A.dir { color:var(--nav0); text-decoration:none; } A.dir:hover { color:var(--nav1); text-decoration:none; } A.dir:before { content:"\f114 "; font-family:x-siter; padding-right:0.25em; } A.dir:hover:before { content:"\f115 "; font-family:x-siter; padding-right:0.25em; } A.thread0 { font-size:10px; color:#777; font-weight:bold; margin:1px; } A.thread1 { font-size:10px; color:#c00; font-weight:bold; margin:1px; } A.thread0:hover,A.thread1:hover { color:#c00; text-decoration:none; } div.thread0 { padding:2px 0; color:#c00; background-color:#e0e0e0 } div.thread1 { padding:2px 0; color:#c00; background-color:#ccc; } div.posting { background-color:#eeeeee; padding:2px; } div.posting h4, div.posting .postinghead { color:#333; background-color:#ccc; display:block; margin:0; padding:1px; font-size:11px; text-transform:none; letter-spacing:0; } #guestbookhead h2 { float:left; } #guestbookhead a { float:right; color:#999; font-size:11px; margin:'.$xs_layout['content']['steg'].'px '.$xs_layout['content']['steg'].'px 0 0; } .foldhead { padding-left:10px; background:url(../images/rechts.gif) no-repeat left; font-weight:bold; color:#888; text-decoration:none; } .foldheadhigh { padding-left:10px; background:url(../images/unten.gif) no-repeat left; font-weight:bold; color:#888; text-decoration:none; } .foldhead:hover, .foldheadhigh:hover { text-decoration:none; } .foldbody { display:none; font-size:12px; } div.menuend { border-color:#999; border-width:1px 0 0 0; border-style:solid; padding:3px 0; } .xsicon { font-family:x-siter; font-size:14px; line-height:16px; } .thumbnail .xsicon { position:absolute; width:28px; background:#aaa; text-align:center; bottom:0; font:normal 20px/24px x-siter; } .thumbnail .xsicon:hover { text-decoration:none; color:#fff; background:#bbb; } .pup { left:0; border-radius:0 8px 0 0; } .pdown { right:0; border-radius:8px 0 0 0; } .box { margin:0; padding:0.8em 1.1em; border-radius:1em; background:#0003; } .box>p { margin:0; padding:0; } .quote { margin:0 0 0 16px; color:#0000BE; } .small { font-size:9px; } .big { font-size:14px; } .c { color:var(--menu2); } .subtxt { color:#999; font-weight:bold; } .u { text-decoration:underline; } .zoomicon { display:block; bottom:0; left:0; width:13px; height:13px; position:absolute; background:url(../images/zoom.gif) no-repeat 0 0; } .xsvideo { display:block; width:100%; } #logo { width:290px; aspect-ratio:307/19; left:var(--mainpad); position:absolute; transition:width 0.3s ease-in-out; } @media only screen and (min-width: 480px){ #logo { width:450px; aspect-ratio:307/19; left:var(--mainpad); position:absolute; transition:width 0.3s ease-in-out; } } header.scrolled #logo { width:250px; } a.logo { display:block; width:100%; height:100%; background:url(images/logo.svg) no-repeat 0 0; } #topmenu { position:absolute; left:0; top:0; } #menu { position:absolute; left:0; top:148px; width:200px; } #maincontent { position:absolute; left:216px; top:148px; background-color:#fff; border:1px solid #999; width:'.ct_width($xs_layout['content']['spalten'],'content',2).'px; } #maincontent > section { padding:'.$xs_layout['content']['steg'].'px 0 0 '.$xs_layout['content']['steg'].'px; } #marginal { position:absolute; left:890px; top:148px; background-color:#fff; border:1px solid #999; width:'.ct_width($xs_layout['margin']['spalten'],'margin',1).'px; padding:'.$xs_layout['margin']['steg'].'px 0 0 '.$xs_layout['margin']['steg'].'px; } #banner { position:absolute; left:216px; top:0; height:120px; width:640px; } #subnavi { position:absolute; left:216px; top:128px; } #searchsubmit { font-family:x-siter; font-size:20px; border:none; background:none; outline:none; } #searchsubmit:focus,#searchsubmit:hover { color:red; } .block { display:block; } .fileselection { margin-left:32px; display:none; } .language a { display:block; float:left; padding:0; margin-right:8px; font-weight:bold; font-size:11px; line-height:11px; color:#888; } .language a:hover { color:#c00; } .language span { display:block; float:left; padding:0; margin-right:8px; font-weight:bold; font-size:11px; line-height:11px; color:#c00; } .galnav { position:relative; margin-top:4px; } .galnav a { display:block; background:#fff; padding:0; margin:0 7px 0 0; width:8px; height:8px; float:left; border-radius:4px; } .galnav a:hover, .galnav a.activeSlide { background:#000; } #topmenu ul { list-style-type:none; padding:0; margin:2px 0; } #topmenu ul li { display:inline; margin:0; padding:0; } #topmenu ul li a.topmenu0 { background-color:#ddd; padding:0 8px; font-size:12px; font-weight:bold; color:#888; } #topmenu ul li a.topmenu1 { background-color:#bbb; padding:0 8px; font-size:12px; font-weight:bold; color:#c00; } #topmenu ul li a.topmenu0:hover { background-color:#fff; color:#c00; text-decoration:none; } #topmenu ul li a.topmenu1:hover { background-color:#fff; color:#c00; text-decoration:none; } .edit_wrapper { width:'.ct_width($xs_layout['content']['spalten'],'content',0).'px; margin:0; padding:0; overflow:hidden; } .edit_wrapper div { width:'.ct_width($xs_layout['content']['spalten'],'content',0).'px; } .edit_wrapper textarea { margin-left:'.$xs_layout['content']['steg'].'px; float:left; } span.playbutton { position:absolute; width:64px; height:64px; margin:-32px 0 0 -32px; top:50%; left:50%; background:url(../images/video_play_button.png) no-repeat 0 0; } span.playbutton:hover { background-position:0 -64px; } SUB,SUP { line-height:1px; } div.markup { border:1px inset #eee; background-color:#ddd; padding:3px 0; } div.markup a { border:1px outset #eee; padding:2px; margin:0; color:#444; text-decoration:none; cursor:pointer; } div.markup a:hover { border:1px inset #eee; background-color:#ccc; text-decoration:none; } .ctadmin div.markup { border:1px inset #eee; background-color:#ddd; padding:3px 0; } .ctadmin div.markup a { border:1px outset #eee; padding:2px; margin:0; color:#444; } .ctadmin div.markup a:hover { border:1px inset #eee; background-color:#ccc; } .ctadmin div.imgpos { border:none; background:none; padding:0; } .ctadmin div.imgpostd { border:none; background:#0006; padding:0; } /* Farbe 50% zwischen Content und adminbox */ .ctadmin span { display:block; height:17px; display:block; margin-bottom:1ex; padding-top:1px; } .ctadmin span a { display:block; height:16px; float:left; border-width:1px 1px 0 1px; border-style:solid; border-color:#999; background-color:#bbb; color:#444; text-decoration:none; margin:0 2px; padding:0 2px; cursor:pointer; } .ctadmin span a:hover { background-color:#ccc; } .ctadmin span a.active { background-color:#ccf; color:#000; padding-bottom:1px; } .ctadmin span a input { margin:0 2px; padding:0; font-size:10px; display:block; float:left; } .adminbox span.blind { color:#9e9ef0; display:inline; background:none; border:none; } .adminbox span.info { color:#000; display:inline; background:none; border:none; } abbr.info, abbr.blind, span.blind { display:block; float:left; height:18px; margin:1px 0 1px 0; padding:0 4px; font-size:10px; line-height:18px; border-style:solid; border-width:1px; border-color:#fff #777 #777 #fff; color:#777; background-color:#95a0f0; font-family:Verdana; text-decoration:none; } abbr.info { color:#000; } .ctadmin i { color:red; } .clear { clear:both; } .ctclear { clear:both; } .ctrl_prev { position:absolute; left:0; width:32px; z-index:1000; height:100%; display:none; } .gal_prev { position:absolute; left:0; width:32px; height:100%; background:#fff url(../images/banner-prev.gif) no-repeat 50% 50%; opacity:0.2; filter:alpha(opacity=20); } .ctrl_next { position:absolute; right:0; width:32px; z-index:1000; height:100%; display:none; } .gal_next { position:absolute; right:0; width:32px; height:100%; background:#fff url(../images/banner-next.gif) no-repeat 50% 50%; opacity:0.2; filter:alpha(opacity=20); } .gal_ct { position:absolute; bottom:0; left:0; background:#fff; opacity:0.6; filter:alpha(opacity=60); width:100%; } .gal_ct2 { padding:10px 32px; } .comment_delete { background:red; padding:6px 10px 6px 6px; border-radius:15px; margin:10px 0 0 0; display:inline-block; font-family:Verdana; color:#fff; font-weight:bold; line-height:18px; } .comment_publish { background:green; padding:6px 10px 6px 6px; border-radius:15px; margin:10px 0 0 0; display:inline-block; font-family:Verdana; color:#fff; font-weight:bold; line-height:18px; } .comment_go { background:#333333; float:right; padding:6px 15px; border-radius:15px; margin:10px 0 0 0; display:none; font-family:Verdana; color:#fff; font-weight:bold; line-height:18px; border:none; } .ctbox { --spalten:12; flex-basis:calc( (100% + var(--gap)) / 12 * var(--spalten) - var(--gap) ); width:100%; } .mgbox { --spalten:2; flex-basis:calc( (100% + var(--gap)) / 2 * var(--spalten) - var(--gap) ); } .ctcol { width:100%; } .ctcol>:not(div):first-child { padding-top:var(--ctpadding); } .ctcol>:not(div):last-child { padding-bottom:var(--ctpadding); } .ctbox1 { --spalten:1; } .ctbox2 { --spalten:2; } .ctbox3 { --spalten:3; } .ctbox4 { --spalten:4; } .ctbox5 { --spalten:5; } .ctbox6 { --spalten:6; } .ctbox7 { --spalten:7; } .ctbox8 { --spalten:8; } .ctbox9 { --spalten:9; } .ctbox10 { --spalten:10; } .ctbox11 { --spalten:11; } .ctbox12 { --spalten:12; } .mgbox1 { --spalten:1; } .mgbox2 { --spalten:2; } .ctadmin, .mgadmin { overflow:hidden; background-color:var(--adminbg); border-color:var(--adminborder); border-width:1px 0 1px 0; border-style:solid; padding:0; line-height:18px; font-size:0.66em; position:relative; } a.admin { display:block; float:left; height:18px; margin:1px 0; padding:0 4px; font-size:10px; line-height:18px; border-style:solid; border-width:1px; border-color:#fff #777 #777 #fff; color:#000; background-color:#95a0f0; font-family:Verdana; } a.admin:hover { display:block; float:left; height:18px; margin:1px 0; padding:0 4px; font-size:10px; line-height:18px; border-style:solid; border-width:1px; border-color:#666 #eee #eee #666; color:#fff; background-color:#95a0f0; text-decoration:none; } .submit { display:block; float:left; height:20px; margin:1px 0; padding:0 4px; font-size:10px; line-height:18px; border-style:solid; border-width:1px; border-color:#fff #777 #777 #fff; color:#000; background-color:#95a0f0; font-family:Verdana; } .submit:hover { display:block; float:left; height:20px; margin:1px 0; padding:0 4px; font-size:10px; line-height:18px; border-style:solid; border-width:1px; border-color:#666 #eee #eee #666; color:#fff; background-color:#95a0f0; text-decoration:none; } .search { display:block; float:left; margin:1px; padding:0 2px; font-size:10px; line-height:18px; font-family:Verdana; border-style:solid; border-width:1px; border-color:#888 #eee #eee #888; color:#000; background-color:#95a0f0; text-decoration:none; } .mobileonly { display:none; } .f-carousel.has-dots { margin:0 !important; } .hbspt-form { background:#0004; padding:2em; border-radius:1em; } @media(max-width:1024px) { :root { --cmax:9; } } @media(max-width:1200px) { #footer_extra { padding-left:2em; } } @media(max-width:850px) { footer>div { grid-template:"menu extra" min-content "logo logo" min-content / 1fr 1fr; } #footer_extra { padding-left:0; } } @media(max-width:768px) { :root { --cmax:6; } } @media(max-width:640px) { * { -webkit-text-size-adjust:none; } .ctbox1 { --spalten:12; } .ctbox2 { --spalten:12; } .ctbox3 { --spalten:12; } .ctbox4 { --spalten:12; } .ctbox5 { --spalten:12; } .ctbox6 { --spalten:12; } .ctbox7 { --spalten:12; } .ctbox8 { --spalten:12; } .ctbox9 { --spalten:12; } .ctbox10 { --spalten:12; } .ctbox11 { --spalten:12; } .ctbox12 { --spalten:12; } .mgbox1 { --spalten:2; } .mgbox2 { --spalten:2; } .screenonly { display:none; } .mobileonly { display:initial; } :root { --zebraw:calc(0.06vw * 927); --zebrah:calc(0.06vw * 1055); --cmax:4; } footer>div { grid-template:"menu" min-content "extra" min-content "logo" min-content / 1fr; } } @media(max-width:512px) { :root { --cmax:3; } } @media only screen and (max-device-width:480px){ * { -webkit-text-size-adjust:none; } } @font-face { font-family:'x-siter'; src: url('fonts/x-siter.eot'); src: url('fonts/x-siter.woff') format('woff'),url('fonts/x-siter.svg#x-siter') format('svg'),url('fonts/x-siter.ttf') format('truetype'); font-weight: normal; font-style: normal; } @font-face { font-family:'Fahkwang'; src: url('fonts/Fahkwang-Bold.eot'); src: url('fonts/Fahkwang-Bold.woff2') format('woff2'),url('fonts/Fahkwang-Bold.woff') format('woff'),url('fonts/Fahkwang-Bold.svg#Fahkwang-Bold') format('svg'),url('fonts/Fahkwang-Bold.ttf') format('truetype'); font-weight: 700; font-style: normal; } @font-face { font-family:'Fahkwang'; src: url('fonts/Fahkwang-SemiBold.eot'); src: url('fonts/Fahkwang-SemiBold.woff2') format('woff2'),url('fonts/Fahkwang-SemiBold.woff') format('woff'),url('fonts/Fahkwang-SemiBold.svg#Fahkwang-SemiBold') format('svg'),url('fonts/Fahkwang-SemiBold.ttf') format('truetype'); font-weight: 600; font-style: normal; } @font-face { font-family:'Fahkwang'; src: url('fonts/Fahkwang-Medium.eot'); src: url('fonts/Fahkwang-Medium.woff2') format('woff2'),url('fonts/Fahkwang-Medium.woff') format('woff'),url('fonts/Fahkwang-Medium.svg#Fahkwang-Medium') format('svg'),url('fonts/Fahkwang-Medium.ttf') format('truetype'); font-weight: 500; font-style: normal; } @font-face { font-family:'Fahkwang'; src: url('fonts/Fahkwang-Regular.eot'); src: url('fonts/Fahkwang-Regular.woff2') format('woff2'),url('fonts/Fahkwang-Regular.woff') format('woff'),url('fonts/Fahkwang-Regular.svg#Fahkwang-Regular') format('svg'),url('fonts/Fahkwang-Regular.ttf') format('truetype'); font-weight: 400; font-style: normal; } @font-face { font-family:'Fahkwang'; src: url('fonts/Fahkwang-Light.eot'); src: url('fonts/Fahkwang-Light.woff2') format('woff2'),url('fonts/Fahkwang-Light.woff') format('woff'),url('fonts/Fahkwang-Light.svg#Fahkwang-Light') format('svg'),url('fonts/Fahkwang-Light.ttf') format('truetype'); font-weight: 300; font-style: normal; } @font-face { font-family:'Fahkwang'; src: url('fonts/Fahkwang-ExtraLight.eot'); src: url('fonts/Fahkwang-ExtraLight.woff2') format('woff2'),url('fonts/Fahkwang-ExtraLight.woff') format('woff'),url('fonts/Fahkwang-ExtraLight.svg#Fahkwang-ExtraLight') format('svg'),url('fonts/Fahkwang-ExtraLight.ttf') format('truetype'); font-weight: 200; font-style: normal; }