/* ----------------  reset  -------------------- */

html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, tt, var,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td 
{margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }

ol, ul {list-style: none; }

.clear{clear:both;font-size:0px;line-height:0px;height:0px;}



/* ----------------  basic layout  -------------------- */

body {background:url(images/bg.jpg) 0% 25% repeat-x; font-family: "Trebuchet MS", Verdana, Arial; font-size:10pt; color:#b2b2b2;}

#wrapper {background: url(images/splash.jpg) top center repeat-x; position:absolute; height:700px; width:100%; margin-top:-350px; top: 50%;}
#container {position:absolute; height:700px; width:980px; margin:-350px 0px 0px -490px; top: 50%; left: 50%; text-align: left;}

h1 {color:#5e8c70; font-size:10pt; margin-bottom:22pt; font-weight:600;}
p {font-size:9pt; margin-bottom:10pt; text-align:left; line-height:190%;}
p a {color:#5e8c70; }
p a:hover {color:#fff; }
p.footer {font-size:9pt; text-align:center; color:#4f4c4a;}
p.footer a {color:#4f4c4a;}
p.footer a:hover {color:#5e8c70;}

#txt-left {float:left; width:220px; height:300px; overflow:hidden; margin: 310px 45px 0 0;}
#txt-right {float:left; width:210px; height:300px; overflow:hidden; margin: 310px 0 0 0;}


#crossfader {position:relative; float:left; width:450px; height:425px; display:block; overflow:hidden; margin: 245px 55px 0 0;}
#gallery .portrait {margin: 0 25%;}
#gallery .landscape {margin: 50px 0 0 0;}

/* http://www.digitalia.be/software/reflectionjs-for-jquery#demo  */
/* you must use a CSS class without referring to the img tag (or use the style attribute) and it will display like expected */