/*------------------------------
	Filename: style.css
	Author:	Rick Rose
	Created: 2012-04-22
	Modified: 2012-10-02
	Description: Stylesheet for CampgroundsLive!
--------------------------------*/
*{
padding: 0;
margin: 0;
}

.center{
margin: 0 auto 0 auto;
text-align:center;
}

html {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
}

body {
height: 100%;
width: 100%;
margin: 0;
padding: 0;
}

.bodytext{
color: rgba(249,225,167,1);
font-size:14px;
margin: 0 0 0 150px;
}

h1{
color: #F4E397;
font-weight: normal;
font-size: 24px;
text-transform:uppercase;
padding: 20px 0 10px 25px;
}

h2{
color: #F4E397;
font-weight: normal;
font-size: 18px;
text-transform:uppercase;
padding: 20px 0 10px 25px;
}

.leftindent{
margin:0 0 0 250px;
}

.leftmargin125{
margin-left:125px;
}

#detailbody h1{
color: black;
}

#fullscreenimage{
z-index: -999;
min-height: 100%;
width: 100%;
height: auto;
position: fixed;
top: 0;
left: 0;
}

#wrapper{
margin: 40px auto 0 auto;
width:1200px;
min-height: 500px;
}

#header{
clear: both;
margin:0;
background-image:url("../img/header-slice.jpg");
background-repeat: repeat-x;
width: 100%;
height: 129px;
position: relative;
margin-left: auto;
margin-right: auto;
}

#logo{
position:absolute;
top: -25px;
left: 50px;
width: 400px;
height: 105px;
}

#socialmediabox{
position:absolute;
top:-33px;
right: 10px;
width: 64px;
height: 30px;
}

#socialmediabox ul li {
display: block;
float: left;
position: relative;
margin-right: 2px;
}

#socialmediabox ul a {
display: block;
text-decoration: none;
}

#socialmediabox ul li:hover a {
color: #2A4C30;
}

li.facebook{
height:30px;
width:30px;
}

li.twitter{
height:30px;
width:30px;
}

#userinfo{
width: 297px;
float:right;
margin: 10px 15px 0 0;
}

#welcometext{
width: 200px;
float:right;
color: #F4E397;
margin: 3px 7px 0 0;
text-align:right;
}

#loginbutton{
display:block;
float:right;
width: 60px;
height: 20px;
border: 1px solid white;
line-height:1.4em;
color: white;
font-size: .8em;
font-weight: bold;
background-color: #D01515;
padding: 0px 0 0 0;
margin: 3px 0 0 0;
text-align: center;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}

#searchbox{
width: 203px;
height: 22px;
border: 1px solid green;
float:right;
margin: 46px 15px 0 0;
}

.search{
background-color: #F9E1A7;
border-color: #96E035;
border-style: solid none solid solid;
border-width: 1px medium 1px 1px;
font-size: 12px;
height: 16px;
padding: 2px 5px;
width: 170px;
float:left;
}

#magnifyglass{
width:22px;
height:22px;
float: right;
}

a {
color: #2A4C30;
text-decoration: none;
outline: 0;
}

a:visited {
}

a:hover {
text-decoration: none;
}

a img{
text-decoration: none;
border: 0 none;
}

#adbanner{
background-color: black;
width:100%;
height: 75px;
}

#linkbox{
background-color: black;
width:100%;
height: 25px;
}

#linkbox ul {
display: block;
float: left;
position: relative;
padding: 0;
margin: 0;
margin-left: 10px;
list-style-type: none;
}

#linkbox ul a{
color: white;
font-size: 12px;
font-weight: bold;
text-decoration: none;
}

#linkbox li{
display: block;
float: left;
position: relative;
margin-left: 5px;
}

#mainbox{
position: relative;
width:100%;
min-height: 750px;
}

#ratingbox{
display: block;
height:35px;
width:252px;
float:left;
}

.cgrating{
position: relative;
top: 0;
left: 10px;
height: 18px;
width: 102px;
margin: 0 0 5px 0;
background-color: white;
border: 1px solid grey;
padding: 2px;
}

#rateme
{
font-size: 10px;
margin: 0 0 0 10px;
float:left;
padding:2px 0 0 0;
width:125px;
}

#starratingform
{
margin: 0 0 3px 10px;
padding: 1px 0 0 5px;
background-color:white;
width:102px;
height: 18px;
float:left;
}

#starratingform li
{
list-style:none;
}

.star2{
background: url("../img/white-star.png") no-repeat;
width:20px;
height:20px;
float:left;
}

#addtofavoritesbutton{
background-color: red;
width: 100px;
height: 45px;
float: right;
color:white;
text-align:center;
font-size:0.8em;
margin: 0 20px 0 0;
padding: 5px 0 0 0;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}

#mainphoto{
background-repeat: no-repeat;
width: 1000px;
height: 300px;
position: relative;
margin-left: auto;
margin-right: auto;
display: block;
top: 100px;
}

.greenfill{
background-color:#2A4C31;
}

#footer{
width: 100%;
height: 75px;
}

#greenbox{
height: 50px;
text-align: center;
}

#greenbox ul{
padding: 15px 0 0 0;
}

#greenbox li {
list-style: none;
border-right: 1px solid #B2D547;
display:inline;
font-size: 12px;
text-transform: uppercase;
}

#greenbox a {
color: #F9E1A7;
line-height: 18px;
margin: 0 2px 0 5px;
padding: 0 12px 0 12px;
text-decoration: none;
}

#greenbox ul li:hover a {
background-color: #F9E1A7;
color: #2A4C30;
}

.orangelink{
color:#FFA100;
}

#copyright{
color:#FFFFFF;
font-size: 12px;
position: relative;

height: 25px;
}

#choiceholder{
position: relative;
margin: 50px 0 0 100px;
width: 600px;
height: 250px;
}

#leftdiv{
float: left;
width: 250px;
height: 300px;
text-align: center;
margin: 10px;
color: #F4E397;
font-weight: normal;
font-size: 14px;
}

#rightdiv{
float:right;
width: 200px;
height: 300px;
text-align: center;
color: #F4E397;
font-weight: normal;
font-size: 14px;
margin: 10px 0 0 0;
padding: 0 0 0 70px;
border-left: 1px solid #B2D547;
}

#minimap{
width: 150px;
height: 150px;
border: 3px solid #FFFFFF;
margin-top: 20px;
}

#whatsthere{
width: 150px;
height: 130px;
margin: 20px 24px 0 0;
float: right;
padding: 15px 0 0 0;
font-size: 16px;
line-height: 1.5;
}

.miniphoto{
margin: 20px 0 0 10px;
width: 200px;
height: 300px;
}

#clicktext{
float: left;
margin: 0 0 10px 20px;
font-size: 12px;
color: rgba(249,225,167,1);
width: 600px;
font-size: 14px;
}

#mapshowtypes{
float: left;
margin: 2px 0 0 0;
padding: 3px 0 0 5px;
height: 30px;
width: 645px;
border: 2px solid rgba(0,113,113,1.0);
background-color: rgba(249,225,167,1.0);
color: rgba(0,0,0,1.0);
line-height: 1.5;
font-size: 12px;
}

#mapholder{
margin: 0 10px 10px 10px;
height: 600px;
width: 1175px;
float: right;
font-size: 14px;
color: rgba(249,225,167,1);
}

#map{
border: 2px solid rgba(0,113,113,1);
margin: 2px 0 0 0;
height: 600px;
width: 1167px;
}


#cginfowindow{
color: black;
height: 100px;
width: 400px;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
background-color:white;
}

#cginfowindow a{
color: blue;
}

/* sets Google Maps camera infowindow (displayed after map marker is clicked) parameters - cammap.php */
#caminfowindow
{
font-size: 16px;
font-family: "Arial";
color: #000000;
height: 500px;
width: 500px;
}

.querycol{
position: relative;
width: 180px;
height: 400px;
padding: 10px 0 0 50px;
color: rgba(249,225,167,1);
font-size: 14px;
line-height: 1.8;
float: left;
border-right: 1px solid #96C718;
}

.querycol input{
padding: 0 0 0 10px;
}

.quarterpagetext{
width: 300px;
font-size: 14px;
line-height: 1.3;
margin: 20px auto 0 auto;
color: rgba(249,225,167,1);
}

.halfpagetext{
width: 646px;
height: 600px;
font-size: 14px;
line-height: 1.3;
margin: 20px auto 0 auto;
color: rgba(249,225,167,1);
}

.formwidth {
width: 645px;
margin: 20px auto 0 auto;
}

#commentform{
width: 645px;
height: 600px;
margin: 20px auto 0 auto;
color: rgba(249,225,167,1);
font-size: 12px;
border: 1px solid rgba(249,225,167,1);
padding: 10px;
}

#commentform p{
margin: 10px 0 0 0;
}

#commentform input{
margin: 0 5px 0 5px;
}

#commentform select{
margin: 0 5px 0 5px;
}

#commentform textarea{
margin: 2px 0 5px 0;
}

#buttonholder{
margin: 8px auto 0 auto;
width: 120px;
}


#uploadform{
width: 645px;
height: 600px;
margin: 20px auto 0 auto;
color: rgba(249,225,167,1);
font-size: 12px;
border: 1px solid rgba(249,225,167,1);
padding: 10px;
}

#uploadform p{
margin: 10px 0 0 0;
}

#uploadform input{
margin: 0 5px 0 5px;
}

#uploadform select{
margin: 0 5px 0 5px;
}

#uploadphotoform{
width: 750px;
height: 100%;
margin: 0 auto 0 auto;
padding: 10px;
color: rgba(249,225,167,1);
border: 1px solid rgba(249,225,167,1);
font-size: 16px;
}

#detailall{
width:100%;
height:100%;
padding: 20px 0 0 0;
}

#detailheader{
width:1080px;
height:117px;
background-color: rgba(220,220,220,1);
color: rgba(42,76,49,1);
padding: 10px 0 0 0;
margin: 0 auto 0 auto;
}

#cgname{
padding: 0 0 5px 10px;
height: 25px;
font-size: 20px;
}

#cgrating{
margin: 2px 0 7px 10px;
border: 1px solid black;
width: 100px;
height: 20px;
}

#detailbody{
width:1078px;
border: 1px solid black;
background-color: rgba(255,255,255,1);
margin: 0 auto 0 auto;
height: 650px;
}

.tab{
cursor: pointer;
}

#cgtabs ul {
padding: 15px 0 0 0;
}

#cgtabs li {
list-style: none;
border: 1px solid black;
display: table;
float: left;
width: 113px;
height: 50px;
padding: 0 10px 0;
color: rgba(249,225,167,1);
font-size: 14px;
text-align: center;
background-color: rgba(42,76,49,1);
}

#cgtabs li p{
display:table-cell;
vertical-align:middle;
}

#cgtabs a {
color: #F9E1A7;
line-height: 18px;
margin: 0;
padding: 0;
text-decoration: none;
}

#cgtabs li:hover a {
background-color: seagreen;
color: #2A4C30;
}

#cgtabs li.active{
background-color:seagreen;
}

#livetabs ul {
padding: 15px 0 0 0;
}

#livetabs li {
list-style: none;
border: 1px solid black;
display: table;
float: left;
width: 113px;
height: 50px;
padding: 0 10px 0;
color: rgba(249,225,167,1);
font-size: 14px;
text-align: center;
background-color: rgba(42,76,49,1);
}

#livetabs li p{
display:table-cell;
vertical-align:middle;
}

#livetabs a {
color: #F9E1A7;
line-height: 18px;
margin: 0;
padding: 0;
text-decoration: none;
}

#livetabs li:hover a {
background-color: seagreen;
color: #2A4C30;
}

#livetabs li.active{
background-color:seagreen;
}

.roundedtop {
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-topright: 10px;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}

/*left column on info-tab and detail-tab pages*/
#leftdetail {
width: 45%;
height: 550px;
float: left;
font-size: 14px;
padding: 10px 10px 0 10px;
margin: 5px 0 0 20px;
background-color: #F7F7F7;
line-height: 2.1;
}

#cgdescrip{
line-height: 1.3;
}

#rightdetail {
width: 45%;
height: 550px;
float: right;
font-size: 14px;
padding: 10px 10px 0 10px;
margin: 5px 20px 0 0;
background-color: #F7F7F7;
line-height: 2.1;
}

#commentbox{
line-height: 1.3;
}

.infotabhighlighted{
background-color: #D4D4D4;
padding:8px 8px 8px 8px;
margin: 0 0 5px 0;
}


input[type='checkbox']{
margin: 0 6px 0 12px;
}

#geocacheh1{
margin: 10px 0 10px 52px;
}

#geo{
height: 550px;
width: 90%;
margin: 0 auto 0 auto;
border: solid 1px black;
}

#camheader{
font-size:14px;
margin: 20px 0 0 263px;
}

#camholder{
width: 500px;
height: 400px;
margin: 0 auto 0 auto;
}

#livewxheader{
font-size: 14px;
margin: 20px 0 0 15px;
}

#livewxholder{
width: 1000px;
height: 800px;
border: solid 1px black;
margin: 0 auto 0 auto;
}

#forecastheader{
font-size: 14px;
margin: 20px 0 0 15px;
}

#forecastholder{
width: 1000px;
height: 800px;
border: solid 1px black;
margin: 0 auto 50px auto;
}

/* container to hold mini map on map tab */
#cgdetailmap {
width: 475px;
height: 400px;
border: solid 1px black;
margin: 20px 0 0 40px;
float: left;
}

/* div to hold driving directions on map tab*/
#directions {
width: 465px;
height: 380px;
padding: 10px;
margin: 20px 40px 0 0;
border: 1px solid black;
float: right;
font-size: 14px;
}

#contactusform  p{
margin: 10px 0 0 0;
}

#submitbutton{
margin: 5px 0 0 0;
}

#ablue{
color: orange;
}

/*div to hold add report form*/
#addreport {
margin: 0 auto 0 auto;
width: 750px;
padding: 10px;
color: rgba(249,225,167,1);
border: 1px solid rgba(249,225,167,1);
font-size: 16px;
}

#loginform {
line-height: 1.8;
border: 1px solid grey;
width: 415px;
padding: 15px;
height: 200px;
margin: 10px 0 0 0;
}

#registerform {
line-height: 1.8;
border: 1px solid grey;
width: 415px;
padding: 15px;
height: 510px;
}

#radardiv{
margin: 50px 0 0 50px;
}

/*index.html radar image div*/
#basemap, #image0, #image1, #image2, #image3, #image4, #image5, #image6, #image7, #image8, #image9
{
    position: absolute;
	width: 400px;
	height: 400px;
}

#recentreports{
width:318px;
border:1px solid grey;
float:right;
}

.roundedbutton{
height:100px;
width:200px;
margin: 10px;
border: 2px solid grey;
float:left;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}

.backbutton{
margin: 10px 0 0 0;
}

.captcha_code{
border: 2px solid orange;
}

.formbutton{
display:block;
width: 60px;
height: 20px;
border: 1px solid white;
line-height:1.4em;
color: white;
font-size: .8em;
font-weight: bold;
background-color: #D01515;
padding: 0px 0 0 0;
margin: 3px 0 0 0;
text-align: center;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}