body { font: 14px Verdana, Arial, Helvetica, sans-serif; background: #333333; margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */ padding: 0; text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */ color: #aaaaaa; } .oneColFixCtrHdr #container { width: 800px; /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */ background: #333333; margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */ border: 0px solid #000000; text-align: left; /* this overrides the text-align: center on the body element. */ } .oneColFixCtrHdr #header { background: #333333; padding: 0 00px 0 00px; /* this padding matches the left alignment of the elements in the divs that appear beneath it. If an image is used in the #header instead of text, you may want to remove the padding. */ } .oneColFixCtrHdr #header h1 { margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */ padding: 10px 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */ } .oneColFixCtrHdr #mainContent { padding: 0 00px; /* remember that padding is the space inside the div box and margin is the space outside the div box */ background: #333333; } .oneColFixCtrHdr #footer { padding: 0 10px; /* this padding matches the left alignment of the elements in the divs that appear above it. */ background:#111111; } .oneColFixCtrHdr #footer p { margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */ padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */ } #arrowl a{ font: 14px Verdana; padding-top: 4px; padding-bottom: 4px; display: block; width: 100px; color: #004a98; text-decoration: none; border-bottom: 0px solid black; } #arrowr a{ font: 14px Verdana; padding-top: 4px; padding-bottom: 4px; display: block; width: 100px; color: #004a98; text-decoration: none; border-bottom: 0px solid black; border-left: 1px solid #ffffff; border-right: 1px solid #ffffff; } .mytexttitle { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 16px; color: #004a98; margin-top: 0px; } .mytexttitlew { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 16px; color: #ffffff; margin-top: 0px; } .mytext { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #6e6e6e; } .mytextblue { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; text-decoration: underline; color: #004a98; } .myformtitle { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #004a98; } .myforminput { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #6e6e6e; }.warning { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #ff2020; } A:link {text-decoration: none; color: #004a98;} A:visited {text-decoration: none; color: #004a98;} A:active {text-decoration: none; color: #bd6100;} A:hover {text-decoration: underline; color: #bd6100;} /* -------------------------------------------------------- */ /* MENU */ #heading { display: block; text-align: center; margin-bottom: 1em; } #heading * { display: inline; padding: 4px; user-select: none; cursor: pointer; vertical-align: middle; } #heading li.active { background-color: #66ccff; border-radius: 3px; -webkit-border-radius: 3px; -opera-border-radius: 3px; -moz-border-radius: 3px; } #panes { text-align: justify; border-style: none; width: 345px; margin: 0 auto 0 auto; } #previous { float: none; cursor: pointer; } #next { float: none; cursor: pointer; } /* -------------------------------------------------------- */ /* CSS homepage buttons */ #button1 {width:100px; margin:0px 0px;} #button1 a, #button1 a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/hweb.jpg); background-repeat:no-repeat;} #button1 a span {padding-left:25px;} #button1 a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/hweb-over.jpg); background-repeat:no-repeat;} #button2 {width:100px; margin:0px 0px;} #button2 a, #button2 a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/hgraphic.jpg); background-repeat:no-repeat;} #button2 a span {padding-left:25px;} #button2 a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/hgraphic-over.jpg); background-repeat:no-repeat;} #button3 {width:100px; margin:0px 0px;} #button3 a, #button3 a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/hphoto.jpg); background-repeat:no-repeat;} #button3 a span {padding-left:25px;} #button3 a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/hphoto-over.jpg); background-repeat:no-repeat;} #button4 {width:100px; margin:0px 0px;} #button4 a, #button4 a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/hprogram.jpg); background-repeat:no-repeat;} #button4 a span {padding-left:25px;} #button4 a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/hprogram-over.jpg); background-repeat:no-repeat;} #button5 {width:100px; margin:0px 0px;} #button5 a, #button5 a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/hcontact.gif); background-repeat:no-repeat;} #button5 a span {padding-left:25px;} #button5 a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/hcontact-over.gif); background-repeat:no-repeat;} /* -------------------------------------------------------- */ /* CSS web buttons */ #button1w {width:100px; margin:0px 0px;} #button1w a, #button1w a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/wrestaurant.jpg); background-repeat:no-repeat;} #button1w a span {padding-left:25px;} #button1w a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/wrestaurant-over.jpg); background-repeat:no-repeat;} #button2w {width:100px; margin:0px 0px;} #button2w a, #button2w a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/wshop.jpg); background-repeat:no-repeat;} #button2w a span {padding-left:25px;} #button2w a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/wshop-over.jpg); background-repeat:no-repeat;} #button3w {width:100px; margin:0px 0px;} #button3w a, #button3w a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/waccommodation.jpg); background-repeat:no-repeat;} #button3w a span {padding-left:25px;} #button3w a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/waccommodation-over.jpg); background-repeat:no-repeat;} #button4w {width:100px; margin:0px 0px;} #button4w a, #button4w a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/wpersonal.jpg); background-repeat:no-repeat;} #button4w a span {padding-left:25px;} #button4w a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/wpersonal-over.jpg); background-repeat:no-repeat;} #button5w {width:100px; margin:0px 0px;} #button5w a, #button5w a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/wcompany.gif); background-repeat:no-repeat;} #button5w a span {padding-left:25px;} #button5w a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/wcompany-over.gif); background-repeat:no-repeat;} /* -------------------------------------------------------- */ /* CSS graphic buttons */ #button1g {width:100px; margin:0px 0px;} #button1g a, #button1g a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/glogo.jpg); background-repeat:no-repeat;} #button1g a span {padding-left:25px;} #button1g a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/glogo-over.jpg); background-repeat:no-repeat;} #button2g {width:100px; margin:0px 0px;} #button2g a, #button2g a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/gposter.jpg); background-repeat:no-repeat;} #button2g a span {padding-left:25px;} #button2g a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/gposter-over.jpg); background-repeat:no-repeat;} #button3g {width:100px; margin:0px 0px;} #button3g a, #button3g a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/gflyer.jpg); background-repeat:no-repeat;} #button3g a span {padding-left:25px;} #button3g a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/gflyer-over.jpg); background-repeat:no-repeat;} #button4g {width:100px; margin:0px 0px;} #button4g a, #button4g a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/gmenu.jpg); background-repeat:no-repeat;} #button4g a span {padding-left:25px;} #button4g a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/gmenu-over.jpg); background-repeat:no-repeat;} #button5g {width:100px; margin:0px 0px;} #button5g a, #button5g a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/gmagazine.gif); background-repeat:no-repeat;} #button5g a span {padding-left:25px;} #button5g a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/gmagazine-over.gif); background-repeat:no-repeat;} /* -------------------------------------------------------- */ /* CSS photo buttons */ #button1p {width:100px; margin:0px 0px;} #button1p a, #button1p a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/zbuilding.jpg); background-repeat:no-repeat;} #button1p a span {padding-left:25px;} #button1p a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/zbuilding-over.jpg); background-repeat:no-repeat;} #button2p {width:100px; margin:0px 0px;} #button2p a, #button2p a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/zlandscape.jpg); background-repeat:no-repeat;} #button2p a span {padding-left:25px;} #button2p a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/zlandscape-over.jpg); background-repeat:no-repeat;} #button3p {width:100px; margin:0px 0px;} #button3p a, #button3p a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/zvarious.jpg); background-repeat:no-repeat;} #button3p a span {padding-left:25px;} #button3p a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/zvarious-over.jpg); background-repeat:no-repeat;} #button4p {width:100px; margin:0px 0px;} #button4p a, #button4p a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/zfood.jpg); background-repeat:no-repeat;} #button4p a span {padding-left:25px;} #button4p a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/zfood-over.jpg); background-repeat:no-repeat;} #button5p {width:100px; margin:0px 0px;} #button5p a, #button5p a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/zportrait.jpg); background-repeat:no-repeat;} #button5p a span {padding-left:25px;} #button5p a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/zportrait-over.jpg); background-repeat:no-repeat;} #button6p {width:100px; margin:0px 0px;} #button6p a, #button6p a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/znight.gif); background-repeat:no-repeat;} #button6p a span {padding-left:25px;} #button6p a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/znight-over.gif); background-repeat:no-repeat;} /* -------------------------------------------------------- */ /* CSS portfolio buttons */ #button1f {width:100px; margin:0px 0px;} #button1f a, #button1f a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/hweb.jpg); background-repeat:no-repeat;} #button1f a span {padding-left:25px;} #button1f a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/hweb-over.jpg); background-repeat:no-repeat;} #button2f {width:100px; margin:0px 0px;} #button2f a, #button2f a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/hgraphic.jpg); background-repeat:no-repeat;} #button2f a span {padding-left:25px;} #button2f a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/hgraphic-over.jpg); background-repeat:no-repeat;} #button3f {width:100px; margin:0px 0px;} #button3f a, #button3f a:visited {display:block; width:100%; height:110px; line-height:20px; text-decoration:none; color:#000; background:url(/imgs/hphoto.jpg); background-repeat:no-repeat;} #button3f a span {padding-left:25px;} #button3f a:hover {display:block; width:100%; height:110px; cursor:pointer; text-decoration:none; color:#c00; background:url(/imgs/hphoto-over.jpg); background-repeat:no-repeat;} #nav, #nav ul {padding:0 0 5px 0; margin:0; list-style:none; font: 16px verdana, sans-serif; border:0px solid #ffffff; background:#ffffff; position:relative; z-index:920;} #nav {height:25px; padding:0;} #nav table {border-collapse:collapse;} #nav li {float:left; padding:0 25px 0 15px;} #nav li li {float:none;} /* a hack for IE5.x and IE6 */ #nav li a li {float:left;} #nav li a {display:block; float:left; color:#004a98; height:25px; padding-right:1px; line-height:25px; text-decoration:none; white-space:nowrap;} #nav li li a {height:20px; line-height:20px; float:none;} #nav li:hover {position:relative; z-index:930; background:#fefeff;} #nav a:hover {position:relative; z-index:930; text-decoration:none; color:#4d5c9c;} #nav :hover ul {left:0; top:24px;} /* another hack for IE5.5 and IE6 */ #nav a:hover ul {left:-10px;} #nav ul {position:absolute; left:-9999px; top:-9999px;} /* it could have been this simple if all browsers understood */ /* show next level */ #nav li:hover li:hover > ul {left:-15px; margin-left:100%; top:-1px;} /* keep further levels hidden */ #nav li:hover > ul ul {position:absolute; left:-9999px; top:-9999px; width:auto;} /* show path followed */ #nav li:hover > a {text-decoration:none; color:#000020;} /* but IE5.x and IE6 need this lot to style the flyouts*/ /* show next level */ #nav a:hover a:hover ul, #nav a:hover a:hover a:hover ul, #nav a:hover a:hover a:hover a:hover ul, #nav a:hover a:hover a:hover a:hover a:hover ul {left:100%; top:-1px;} /* keep further levels hidden */ #nav a:hover ul ul, #nav a:hover a:hover ul ul, #nav a:hover a:hover a:hover ul ul, #nav a:hover a:hover a:hover a:hover ul ul {position:absolute; left:-9999px; top:-9999px;} #gallery {width:720px; height:380px; padding:10px; border:1px solid #333; background: #888; position:relative; } #gallery b.default {position:absolute; left:10px; top:10px; width:548px; height:380px; text-align:center;} #gallery b.default img {display:block; margin:0 auto 10px auto; border:0px solid #eee; border-color:#555 #ddd #eee #333;} #gallery b.default span {display:block; color:#fff; font-family:verdana, arial, sans-serif; font-weight:normal; font-size:11px; width:350px; margin:0 auto;} #gallery ul {list-style:none; padding:0; margin:0; width:180px; position:relative; float:right;} #gallery ul li {display:inline; width:82px; height:82px; float:left; margin:0 0 5px 5px;} #gallery ul li a {display:block; width:80px; height:80px; text-decoration:none; border:1px solid #000; border-color:#eee #555 #333 #ddd;} #gallery ul li a span {display:none;} #gallery ul li a img {display:block; width:80px; height:80px; border:0;} #gallery ul li a:hover {white-space:normal; border-color:#555 #ddd #eee #333; background:#2040A0;} #gallery ul li a:hover b {position:absolute; left:-548px; top:0; width:548px; height:380px; text-align:center; background:#ffffff; z-index:20;} #gallery ul li a:hover span {display:block; color:#fff; font-family:verdana, arial, sans-serif; font-weight:normal; font-size:11px; width:350px; margin:0 auto;} #gallery ul li a:hover img {margin:0 auto 10px auto; width:auto; height:auto; border:0px solid #eee; border-color:#555 #ddd #eee #333;} #gallery ul li a:active, #gallery ul li a:focus {white-space:normal; border-color:#555 #ddd #eee #333; background:#777;} #gallery ul li a:active b, #gallery ul li a:focus b {position:absolute; left:-548px; top:0; width:548px; height:380px; text-align:center; background:#888; z-index:10;} #gallery ul li a:active span, #gallery ul li a:focus span {display:block; color:#fff; font-family:verdana, arial, sans-serif; font-weight:normal; font-size:11px; width:350px; margin:0 auto;} #gallery ul li a:active img, #gallery ul li a:focus img{margin:0 auto 10px auto; width:auto; height:auto; border:1px solid #eee; border-color:#555 #ddd #eee #333;}