html { font-size:16px; background:#eee; color:#000; } body { font-family:Georgia, serif; background:#eee; color:#000; font-size:1em; line-height:1.25; } p { margin:0.5em } #body { background:#fff; max-width:1000px; margin:0 auto; overflow:hidden; width:100%; } h1, h2, h3, h4, h5, h6 { background-color:#fff; clear:both; font-family:Verdana,sans-serif; font-weight:bold; color:#600; margin:0.5em; } h1 { font-size:2em; line-height:1.25 } h2 { font-size:1.75em; line-height:1.4286 } h3 { font-size:1.5; line-height:1.6667 } h4, h5, h6 { font-size:1.125; line-height:1.1111 } #banner { background-color:#0a0580; width:100%; overflow:hidden; padding:15px 0; } q:before { content: '\201C'; } q:after { content: '\201D'; } q q:before { content: '\2018'; } q q:after { content: '\2019'; } #banner h1 { background:#0a0580 url('/local-icons/serhan-nazar-turkey.png') no-repeat center left; color:#fff; font-size:2em; line-height:1.1; margin:0; white-space:nowrap; } #contact img { border:solid #fff 0.25em; } #contact td { border:solid #fff 0.1em; } td.label, td.information { color:#000; text-align:left; vertical-align:top; padding:4px; } td.label { background:#dadada; } #toplinks, #toplinks ul { background:#009; color:#000; line-height:1; margin:0; padding:0; overflow:hidden; white-space:nowrap; width:100%; } #toplinks li { background:#9cc; list-style-type:none; } #toplinks a { display:block; font-size:0.8em; font-weight:bold; font-family:Verdana, sans-serif; line-height:2; height:1.75em; } #toplinks a:link, #toplinks a:visited { color:#000; background:#9cc; } #toplinks a:hover { background:#00c; color:#fff; text-shadow:-0.0625em 0.0625em #777; } #toplinks a:active { color:#ff6; background:#00c} a { text-decoration: none; } a:link, a:hover { color:#009 } a:visited { color:#603 } a:active { color:#c00 } .blurb { border:0.125em groove #dadada; margin:0.5em } .noborder { border:none } #address { clear:both; background:#d0d0ff; font-size:0.8em; line-height:1.5625; } address { text-align:center; } .display { text-align:center; } .motto { font-weight:bold; font-style:italic; font-size:1.25em; line-height:2; } p.ref { font-family:Verdana,sans-serif; font-weight:bold; } #photo_page { text-align:center; font-weight:bold; font-family:Verdana, sans-serif } .photo-page-links { padding:0; margin:0; } .photo-page-links .link.prev, .photo-page-links .link.current, .photo-page-links .link.next { display:block; float:left; font-size:1.5em; line-height:2; } .photo-page-links .link.prev, .photo-page-links .link.next { width:40% } .photo-page-links .link.current { text-align:center; margin:0 2.5%; width:15%; } .photo-page-links .link.prev { text-align:right; } .slides { margin:0 auto; max-width:90%; } .slides td { vertical-align:top; text-align:center; line-height:1.3889; font-size:0.9em; font-weight:normal; font-family: Georgia, serif; color:#111; background:#d0d0ff; padding:0.5em 0.5em 0.25em 0.5em; border:solid 0.25em #fff; width:50%; } .slides img { border: #a0a0a0 2px groove } #googlesearch { text-align: center; padding:0; margin:0 } #googlesearch { font-family:Verdana,sans-serif } #googlesearch input.text { border:1px solid #009; padding:1px 2px; background:#eef; color:black; } #googlesearch input.submit { border:1px outset #009; background:#ddf; color:black; } #googlesearch address, form {padding:0; margin:0} #news, #ref { list-style: none outside none; margin:0; padding:0; } #news li { background:#f7f7ff; line-height:1.75; margin-bottom:1em; } #ref li { background:#f7ffff; clear:both; -webkit-border-radius:0.75em; -moz-border-radius:0.75em; border-radius:0.75em; border-color:#fff; padding:0.5em; margin:1em; } .clear, .fix { clear:both; } .clearfix:before, .clearfix:after { content: " "; display: table; } .clearfix:after { clear: both; } .clearfix { *zoom: 1; } .photo-credit { font-size:1.1em; font-style:italic; font-weight:bold; line-height:1.8182; text-align:center; } .captioned { background:#fff; font-family:Verdana,sans-serif; font-size:0.75em; font-style:italic; } #menu-button { background-color:#009; font-size:2em; font-weight:bold; line-height:1.125; padding:.375em; } #menu-button a { background:linear-gradient(to bottom, #00c, #006); border:solid 2px #11a; color:#fff; text-decoration:none; } .gezgingoz { margin:2em auto; } .gezgingoz .description { display:block; float:left; width:65%; } .gezgingoz .cover { display:block; float:right; max-height:400px; width:30%; } /* poor man's hamburger menu, thanks to https://bitsofco.de/the-target-trick/ */ @media (max-width:799px) { #menu-button { position:fixed; top:0; left:0; width:100%; } #body { margin-top:3.75em; } #toplinks a { font-size:1.25em; padding:.125em .5em; } #toplinks { position:fixed; top:0; width:80%; max-width:400px; } #toplinks-close-button { text-align:right; } #toplinks:target { right:0; transition:right 1s; } #toplinks:not(:target) { right:-100%; transition:right 1.5s; } iframe, img { max-width:95%; height:auto; float:left; } } @media (max-width:479px) { #banner h1 { white-space:normal; line-height:1.25; font-size:2.5em; padding-left:3em; } } @media (min-width:480px) and (max-width:799px) { #banner h1 { line-height:2.5; font-size:2.5em; padding-left:3em; } } @media (min-width: 800px) { #menu-button { display:none; } #toplinks-close-button { display:none; } #toplinks a { display:block; float:left; padding:0.125em 0.25em; border-right:solid 2px #009; } #toplinks li:last-child a { border:none; } #banner h1 { font-size:4em; line-height:1.25; padding:0 0 16px 100px; } #contact-container { margin:0 auto; width:800px; } #contact { float:right; max-width:50%; } #contact-image { float:left; overflow:hidden; width:400px; } #contact-image .credit { display:block; padding-right:1em; text-align:right; font-size:0.75em; font-style:italic; font-family:sans-serif; line-height:1; } td.label, td.information { padding:1em 0.5em; } .left { float:left } .right { float:right } }