body{ margin:0; padding:0 0 12% 0; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; }
 
 .black, .black a, .black a:visited{color: #000000;}
 .darkgrey, .darkgrey a, .darkgrey a:visited {color:#333;}
 .white, .white a, .white a:visited {color: #ffffff;}
 .green, .green a, .green a:visited {color: #33CC00;}
 .limegreen, .limegreen a, .limegreen a:visited {color:#CC0;}
 .darkgreen, .darkgreen a, .darkgreen a:visited {color:#390;}
 .yellow, .yellow a, .yellow a:visited {color:#FF3;}
 .deepblue, .deepblue a, .deepblue a:visited {color:#36F;}
 .lightblue, .lightblue a, .lightblue a:visited  {color:#3CF;}
 .orange, .orange a, .orange a:visited  {color:#F60;}
 .red, .red a, .red a:visited  {color:#C00;}
 .cream, .cream a, .cream a:visited {color:#FFC;}
 .big {font-size: 5em;}
 .medium {font-size: 3em;}
 .twoem {font-size: 2em;}
 .onefiveem {font-size: 1.5em}
 .onetwoem {font-size: 1.2em}
 .small {font-size: 1em; }
 .smaller {font-size: .9em;}
 .smallest {font-size: .8em;}
 .tiny {font-size: .7em;}
 .teeny {font-size: .6em;}
 .high {height: 100%;}
 .nodec, .nodec a {text-decoration: none;}
 
 .bottom {position: relative; bottom: 0; vertical-align: baseline;}
 
 .h4{font-size: 3em; color:#000;}
 .contenttext {font-size: 0.9em; color: #FFF; }
 .title {line-height: 75%;}
 .subtitle {font-size: 1em; color: #FFF; }
 .smallheight {height: 225px;}
 img.download {text-decoration: none; }
 .download, download a, .download a:visited {text-decoration: none; }
 .download img {border: none;}
 .download img, download a img, .download a:visited img {text-decoration: none; }
 .clear {clear:both;}
 .pushleft {margin: 0; color:#36F; font-size: 2em; padding-left: 5%; float: left;} 
 .pushtoright {float:right; margin: 0;}
 .lbox {left: 5%; width: 250px; height: auto; border: thin #666 solid; float: left; padding: 0; margin: 5px 0 5px 0; overflow:hidden;}
 .rbox { left: 40%; width: 50%; height: 195px; border-top: thin #666 solid; float: left; padding: 0; margin: 0 0 0 2%; }
 .picbox {left: 5%; width: 30%; height: 150px; border: thin #666 solid; float: left; padding: 0; margin: 0; overflow:hidden;}
 .wordbox {left:35%; height: 150px; width:65%; border-top: thin #666 solid; border-bottom: thin #666 solid;float: right; padding: 0; margin: 0;}
 .padleft {padding-left: 2%;}
 .padtop {padding-top: 1%;}
 .padleft7 {padding-left: 5%;}
 .padbottom {padding-bottom: 2%;}
 .zeromargin {margin:0 ;}
 .centre {text-align: center;}
 .left {text-align:left;}
 .line100 {line-height: 100%;}
 
 #content {position: relative; left: 192px; top: 0%; width: 768px; background:transparent  url(../images/opaque.png); padding: 2%; height: auto; overflow:auto;}
 #titlearea { width: 100%; height: 325px; position: relative; padding: 0; margin: 75px 0 0 0; right:0;}
 #titleareagallery { width: 100%; position: relative; padding: 0; margin: 75px 0 0 0; right:0;}
 #textarena { width: 100%; position: relative; padding: 3% 0% 0% 5%; margin: 0 auto; right: 0; height: auto;}
 #gallerytextarena { position: relative; padding: 3% 0% 0% 5%; margin: 0 auto; right: 0; height: 200px;}
 #maintitle { position: absolute; height:auto; width: auto; padding: 0; left: 0; margin: 0; bottom: 0%; }
 #stuff {width:100%; position:relative; height:auto; margin: 0; border: 0; padding: 0;}
 #lefttitle { position: absolute; height:auto; width: 100%; padding: 0; left: 0; margin: 0; bottom: 0; }
 #sub { position: absolute; width: 40%; padding: 0; right: 0; margin: 0; bottom: 0%; text-align:right; height: auto;}
 #title2 { float: left; position: relative; height: 325px; width: 95%; left: 5%; margin: 0; padding: 0; overflow: hidden;}
 #bottomword {position: absolute; left: 0; margin: 0; bottom: 0%; width: 100%; padding: 0; height: auto; }
 #textarena {position: relative; width: auto; padding: 3% 5% 0 5%; margin: 0; overflow:auto; }
 #spacer {clear: both; position: abolute; width: auto; margin: 0; padding: 0; border: 0; left: 0;}

 #left-sidebar{ position:absolute; top:0; left:0%; width: 192px; height:100%; background:transparent  url(../images/whiteopaque.png) repeat; }
 #logoleftside {clear: both; position: relative; top: 30px; margin: 0 auto; text-align:center; }
 #right-sidebar{ position:absolute; top:0%; right:0%; height:100%; }
 #footer {position:relative; bottom:0; left:0%; width:100%; height:12%; background-image:url(../images/gradient.jpg); background-repeat: repeat-y; padding: 1% 0 0 0; z-index: 99; }
 
  /* Footer */
 #importantinfo {position: absolute; left: 2%; height: auto; float: left; }
 #importantinfo a, #address a, #importantinfo a:visited, #address a:visited {text-decoration: none; }
 #phone {position: absolute; left: 20%; height: auto; width: 35%; text-align:center; float:left; }
 #address {position: absolute; left: 55%; width: 10%; height: auto; float:left; }
 #footlogo {position: absolute; left: 70%; width: 20%; top:5%; height: auto; float: left;}
 #ratinglogo {position: absolute; left: 80%; width: 10%; top:5%; height: auto; float: left;}

 
 /* Background Pictures */
 body#home, body#prices, body#thankyou, body#gallery {background-image:url(../images/treesbg.jpg); background-repeat:repeat-y;}
 body#camping, body#caravan {background-image:url(../images/lakenightbg.jpg); background-repeat:repeat-y;}
 body#watersports, body#activities, body#onshore, body#team {background-image:url(../images/dockbg.jpg); background-repeat:repeat-y;}
 body#holidayhomes {background-image:url(../images/treesbg.jpg); background-repeat:repeat-y;}
 body#rent, body#forsale, body#sale {background-image:url(../images/treesbg.jpg); background-repeat:repeat-y;}
 body#layout, body#access, body#amenities, body#rules {background-image:url(../images/leavesbg.jpg); background-repeat:repeat-y;}
 body#visit {background-image:url(../images/treesbg.jpg); background-repeat:repeat-y;}
 body#brochure {background-image:url(../images/treesbg.jpg); background-repeat:repeat-y;}
 body#oxfordshire {background-image:url(../images/cotswolds.jpg);background-repeat:repeat-y;  }
 body#dining {background-image:url(../images/restaurantbg.jpg); background-repeat:repeat-y;}
 body#entertainment {background-image:url(../images/camera.jpg); background-repeat:repeat-y;}
 
 /* Middle Pictures */
 body#home #title2 {background-image:url(../images/lakesider.jpg); background-repeat:no-repeat;}
 body#camping #title2 {background-image:url(../images/young-couple.jpg); background-repeat:no-repeat; }
 body#caravan #title2 {background-image:url(../images/caravans.jpg); background-repeat:no-repeat;}
  /*body#team #title2 {background-image:url(../images/tom_goldney_wakeboarding.jpg); background-repeat:no-repeat;} */
 body#rent #title2 {background-image:url(../images/hardwickstatics.jpg); background-repeat:no-repeat;}
 body#sale #title2 {background-image:url(../images/caravaninside.jpg); background-repeat:no-repeat;}
 body#holidayhomes #title2 {background-image:url(../images/holidayhomes.jpg); background-repeat:no-repeat;}
 body#layout #title2 {background-image:url(../images/layout.jpg); background-repeat:no-repeat;}
 body#amenities #title2 {background-image:url(../images/fishing.jpg); background-repeat:no-repeat;}
  /* body#oxfordshire #title2 {background-image:url(../images/oxfordshireskyline.jpg); background-repeat:no-repeat;} */
 body#rules #title2 {background-image:url(../images/ladydock.jpg); background-repeat:no-repeat;}
 body#access #title2 {background-image:url(../images/buddysystem.jpg); background-repeat:no-repeat;}
 
 /* Watersports Pages */
 #wrapbox {width: 100%; height: auto; overflow:hidden;}
 .profileimage {width: 100px; height: 100px; border: thin #666 solid; float: left; padding: 0; margin: 0; overflow:hidden;}
 .profile {position: absolute; left:25%; width: 70%; height: auto; border-top: thin #666 solid; border-bottom: thin #666 solid; float: left; margin: 0;padding: 0; font-size: .9em;}
 #qualifications {float: left; margin: 0; height: auto; padding: 0; width: 19%;}
 
  /* Amenities Pages */
 .leftbox {left: 5%; width:45%; height: auto; border: thin #666 solid; float: left; padding-left: 2%; margin: 0; overflow:hidden;}
 .rightbox {left:55%; width:45%; height: auto; border: thin #666 solid; float: right; padding-left: 2%; margin: 0;}
 
 /* Prices Page */
 #pricestitle { float: left; position: relative; height: 175px; width: 95%; left: 5%; margin: 0; padding: 0; }
 body#prices #titlearea {height: 375px;}
 body#prices #title2 {height: 325px;}
 #downloadbox {position: relative; height:200px; left: 192px; top: 0%; width: 768px; background:transparent  url(../images/opaque.png); padding: 0% 2% 0% 2%; margin: 0; text-decoration: none;}
 
 /* Contact Us Page */
 #mapbox {left: 5%; width: 640px; height: 480px; border: thin #666 solid; float: left; padding: 0; margin: 0 0 10px 0; background:transparent  url(../images/blackopaque.png); overflow:hidden;}
 #contactbox { width: 85%; height: 150px; float: left; padding-left: 2%; margin: 0;}
 
  /* Brochure Request Page */
 #formbackground {position: relative; left: 192px; top: 0%; width: 768px; background:transparent  url(../images/opaque.png); padding: 2% 2% 2% 2%; height: auto; z-index: -1; } 
 #request {left: 192px; top: 0%; width: 768px; background:transparent  url(../images/opaque.png); padding: 0% 2% 0% 2%; margin: 0% 0% 0% 192px; }
 
 /* Tables */
 #boxtable {border-left: #666 thin solid; border-top: #666 thin solid; border-right: #666 thin solid; border-bottom: #666 thin solid; border-spacing:0; width: 100%; border-collapse:collapse;}

 #boxtable tr.d0 {background: #bfbf30; color: #666;}
 #boxtable tr.d1 {background: #f2f2e6; color: #666;}
 #boxtable td.d2 {border-top:3px dashed #666; }
 
 /* For Sale Page */
 /*Credits: Dynamic Drive CSS Library */
 /*URL: http://www.dynamicdrive.com/style/ */
 #forsalebg {position: relative; left: 192px; top: 0%; width: 768px; background:transparent  url(../images/opaque.png); padding: 2%; height: auto; }
 #homesbox {position:absolute; height: 240px; width: 25%; border: thin #666; background: #666; float:left; text-align: center; }
 
 .thumbnail {font-size: 1em; color: #FFF; text-decoration: none;}
 .thumbnail:hover {background: #FFF; color: #000;}
 .thumbnail:active {background: #3CF; color: #000;}
 .thumbnail:focus {background: #3CF; color: #FFF;}
 .thumbnail img {border: 1px solid blue; margin: 0 5px 5px 0;}
 .thumbnail .popup {position: absolute; padding: 5px; left: 230px; top: 0; width: 330px; border: 1px dashed gray; visibility: hidden; background: #FFF; color: black; text-decoration: none; text-align: left; height: 550px; }
 .thumbnail .popup img {border-width: 0;padding: 2px;} /*CSS for enlarged image*/

 .thumbnail:active img {border:1px solid blue; margin: 0 5px 5px 0;}
 .thumbnail:active .popup { /*CSS for enlarged image*/
position: absolute; padding: 5px; left: 230px; top: 0; width: 330px; border: 1px dashed gray; visibility: hidden; background: #FFF; color: black; text-decoration: none;}
 .thumbnail:focus .popup {visibility: visible;}
 .thumbnail:focus img {border:1px solid blue;  margin: 0 5px 5px 0;}

/* Menu  */
.urbangreymenu {height:auto; position: relative; margin:0 auto; padding: 5px 3px 5px 3px; top: 20px; text-align:center; width: 80%; background:transparent  url(../images/opaque.png);/*width of menu*/}
.urbangreymenu .bar {font: normal .8em "Trebuchet MS", Arial, Helvetica, sans-serif; color: white;  /*last 2 values are the x and y coordinates of bullet image*/
margin: 0; /*bottom spacing between header and rest of content*/
padding: 0; /*31px is left indentation of header text*/}
.urbangreymenu .bar a{text-decoration: none; color: white; display: block; margin: 0; line-height: 1.1em; padding: 3px 0px 3px 0px;}
.urbangreymenu .bar a:hover{text-decoration: none;color: white;display: block; background:#360;}
.urbangreymenu .headerbar{font: normal .8em "Trebuchet MS", Arial, Helvetica, sans-serif;color: white; 
 /*last 2 values are the x and y coordinates of margin-bottom: 0; /*bottom spacing between header and rest of content*/
margin: 0;
padding: 0px 0px 0px 0px; /*31px is left indentation of header text*/}
.urbangreymenu .headerbar a{text-decoration: none; color: white; display: block; margin: 0; line-height: 1.1em; padding: 3px 0px 3px 0px; }
.urbangreymenu .headerbar a:hover{text-decoration: none; color: white; display: block; background:#360;}
.urbangreymenu ul{list-style-type: none; margin: 0; padding: 0; /*bottom spacing between each UL and rest of content*/}
.urbangreymenu ul li{padding: 0px; margin: 0;/*bottom spacing between menu items*/}
.urbangreymenu ul li a{font: normal .8em "Trebuchet MS", Arial, Helvetica, sans-serif; background:transparent  url(../images/whiteopaque.png); color: white; display: block; padding: 3px 0px 3px 0; line-height: 0.9em; margin: 0;
 /*link text is indented 8px*/text-decoration: none;}
.urbangreymenu ul li a:visited{ /*visited state CSS*/color: white; }
.urbangreymenu ul li a:hover{ background:#360; color: white; /*hover state CSS*/ }

.urbangreymenu .selected {background:# FFF; color: #000;}


/* easyscroll navigation buttons */	
#easyscrollnav, #easyscrollnav li{ height:28px;line-height:28px; margin:0;padding:0;	}	
#easyscrollnav{	margin:1em 0;}			
#easyscrollnav li{ list-style:none; float:left; background:#eee; margin-right:10px; padding:0 10px; color:#333; cursor:pointer;}					
#easyscrollnav li.over{	color:#999;	text-decoration:underline;}							
/* end easyscroll navigation buttons */

/* BEGIN GALLERY ELEMENTS */
#gallery-litebox {margin: 0px 50px 0px 0px; padding: 0; height: 300px;}
#gallery-litebox img {border: none;}
.buttons {position: relative ; height:auto; width: 100%; padding: 0; left: 100px; margin: 0; bottom: 0%;}

.gallery ul { list-style: none; }
.gallery ul li {  display: inline;  padding: 2px;}
/* END GALLERY ELEMENTS */


 @media screen{

  body>div#right-sidebar{position:fixed;}
  body>div#footer{position:fixed;}
 }
 
 * html body{overflow:hidden; } 
 * html div#content{height:100%; overflow:auto;}