@charset "utf-8";
/* CSS Document */

body
{
 font:Verdana, Arial, Helvetica, sans-serif;
 font-size:12px;
 background-color:#2c2c2a;
 margin-top:0px;


 }
 
#wrap
{ 
 width:1000px;
 margin:0px auto;
 overflow: hidden; /* I use this because of the colum can be at same height*/


 }
 

#headerbg
{
width:980px;
height:auto;
background-color:#2c2c2a;
}


#picturecol
{
 width:650px;
 height:250px;
 float:left;
 margin-bottom:10px;

 }
 
 
#photoinfo /* in section photographer detail shows up in photographer detail page */

{
 width:662px;
 height:auto;
 float:left;
 margin-bottom:10px;
 border:1px dashed #CCCCCC;
 background-color:#d7d8c8;
 
 }
  
#photographer /* where photographer photo shows up*/
{
 width:auto;
 height:auto;
 padding:3px 3 px 3px 3px;
 border:1px dashed #CCCCCC;
 float:left;
 margin-right:10px;
 }

#photographertext /* this is for photographer detail go like his nane and address etc*/
{

float:left;
width:500px;
height:auto;
padding-left:5px;
padding-right:5px;
font-size:14px;
padding-top:10px;
color:#898a7c;

}

#blankdiv /* this is used in photodeatil page where you saying add comments thingy */
{ width:645px;
  height:auto;
  padding-left:5px;
  padding-right:5px;
  padding-bottom:5px;
  padding-top:5px; 
  text-align:left;
  margin:0px auto;
  clear:left;
  border:1px dashed #cccccc;
  background-color:#898a7c;
  margin-top:10px;

  }
  
#greendiv
{
 width:655px;
 height:auto;
 padding: 5px 5px 5px 5px;
 text-align:left;
 background-color:#a6ba00;
 margin:0px auto;
 }  
 
#left
{
	width:280px;
	height:100%;
	padding-top:10px;
	padding-left:5px;
	padding-right:5px;
	float:left;
	background-color:#d7d8c8;
	margin-bottom: -2000px; /* I use this because of the colum can be at same height*/
    padding-bottom: 2000px; /* I use this because of the colum can be at same height*/
 }


#spacer /* this is for left col at the bottom, serve just like a padding */
{width:200px;
 height:10px;
}


#button
{
 width:982px;
 height:35px;
 float:left;
 background-color:#a6ba00;
 }
 
#headerleft
{
 width:500px;
 height:96px;
 float:left;
 margin-right:10px;
 background-image:url(../image/logo.jpg);
 background-repeat:no-repeat;
 background-color:#000000;
 
 }


#headerright
{
 width:400px;
 height:96px;
 float:right;
 background-color:#2c2c2a;
 background-image:url(../image/bestnature.jpg);
 background-repeat:no-repeat;
 } 

#body  /* this is used by all the pages except big photo page */
{
 width:677px;
 height:100%;
 padding-top:10px;
 padding-left:10px;
 padding-right:5px;
 background-color:#f5f6e8;
 float:left;
 margin-bottom: -2000px; /* I use this because of the colum can be at same height*/
 padding-bottom: 2000px; /* I use this because of the colum can be at same height*/

 }
 
#body1 /* this is used by where big photo show up */
{
 width:965px;
 height:100%;
 padding-top:10px;
 padding-bottom:10px;
 padding-left:10px;
 padding-right:5px;
 background-color:#f5f6e8;
 float:left;

 } 

#headingbox /* this is for left section area */
{
 width:271px;
 padding-left:3px;
 padding-right:3px;
 padding-top:3px;
 padding-bottom:3px;
 height:20px;
 background-color:#898a7c;
 color:#f5f6e8;
 font-size:14px;
 font-weight:bold;
 margin-top:10px;
 clear:left;

 }


#headingboxbig /* this is heading for body */
{
 width:657px;
 padding-left:5px;
 padding-right:3px;
 padding-top:3px;
 padding-bottom:3px;
 height:20px;
 background-color:#898a7c;
 color:#f5f6e8;
 font-size:14px;
 font-weight:bold;
 margin-top:10px;
 clear:left;
 }
 
 
#headingboxbig1 /* this is heading for body for bigphotopage*/
{
 width:657px;
 padding-left:5px;
 padding-right:3px;
 padding-top:3px;
 padding-bottom:3px;
 height:20px;
 background-color:#898a7c;
 color:#f5f6e8;
 font-size:14px;
 font-weight:bold;
 margin:0px auto;
 margin-top:15px;
 clear:left;
 } 

/*
#textincenter  this shows up in photodetail page where twitter, facebook icon shows up just for text to shows up in center

{
 width:465px;
 height:30px;
 margin-bottom:5px;
 margin-top:5px;
 }
*/

#pagination

{
 width:635px;
 height:20px;
 border:1px dashed color:#898a7c;
 float:left;
 background-color:#d7d8c8;
 font-size:12px;
 padding-top:4px;
 padding-left:10px;
 margin-bottom:10px;
}

 
#footer
{
 width:962px;
 height:50px;
 background-color:#a6ba00;
 float:left;
 padding:10px 10px 10px 10px;
 color:#FFFFFF;
 font-size:12px;
 
 }


#comments123 /* this is a comment box when a person leave a commment about a photo */
{
 width:648px;
 height:auto;
 padding:10px 5px 10px 10px;
 margin:0px auto;
 border:1px dashed #a6ba00;
 } 
 
 
#comments456 /* this is a description box just below the big picture  */
{
 width:648px;
 height:auto;
 padding:10px 5px 10px 10px;
 margin:0px auto;
 border:1px dashed #a6ba00;
 text-align:left;
 }  
 
#divforphoto

{
 width:auto;
 height:auto;
 margin:0px auto;
 }
 

/* This was using for left nav but not any more 
#categoryboxtop
{
 width:270px;
 padding-left:3px;
 padding-right:3px;
 padding-top:7px;
 padding-bottom:3px;
 height:20px;
 background-color:#898a7c;
 border-top:1px dashed #898a7c;
 border-right:1px dashed #898a7c;
 border-left:1px dashed #898a7c;
 border-bottom:1px dashed #898a7c;
 color:#f5f6e8;
 font-size:12px;
 float:left;
 clear:left;

 }

#categoryboxmiddle
{
 width:270px;
 padding-left:3px;
 padding-right:3px;
 padding-top:7px;
 padding-bottom:3px;
 height:20px;
 background-color:#898a7c;
 border-bottom:1px dashed #898a7c;
 border-left:1px dashed #898a7c;
 border-right:1px dashed #898a7c;
 color:#f5f6e8;
 font-size:12px;
 float:left;
 clear:left;


 }
*/

#login /* When person need to loging */

{
 width:270px;
 height:auto;
 padding-top:10px;
 padding-left:5px;
 padding-bottom:10px;
 float:left;
 border:1px dashed #898a7c;
 background-color:#898a7c;
 margin-bottom:10px;
 color:#f5f6e8;
 font-size:12px;
 
 } 
 
#logout /* when a person nalready login need to logout */

{
 width:270px;
 height:auto;
 padding-top:10px;
 padding-left:5px;
 padding-bottom:10px;
 float:left;
 border:1px dashed #898a7c;
 background-color:#a6ba00;
 margin-bottom:10px;
 color:#f5f6e8;
 font-size:13px;
 
 } 
 
#sideads
{ 
 width:260px;
 height:auto;
 padding-top:10px;
 padding-left:5px;
 padding-right:5px;
 padding-bottom:10px;
 float:left;
 border:1px dashed #898a7c;
 margin-bottom:10px;
 margin-top:10px;
 }
 
#sideadsborder /* this is to wrap arond icons like twitter */
{ 
 width:auto;
 height:auto;
 float:left;
 border:3px solid #898a7c;
 margin-bottom:10px;
 margin-top:10px;

 }


#photosection /* Under this is all the thubnail will show up for all the section */

{
 width:642px;
 height:auto;
 float:left;
 padding-left:10px;
  padding-right:10px;
 padding-bottom:10px;
 padding-top:10px;
 border:1px dashed #CCCCCC;
 float:left;
 }

#membersdropdown
{
 width:260;
 height:20px;
 float:left;
 margin-bottom:10px;
 }
 
#commentbox

{
 width:625px;
 height:autopx;
 border:1px dashed color:#898a7c;
 float:left;
 background-color:#d7d8c8;
 font-size:13px;
 padding-top:4px;
 padding-left:10px;
 padding-right:10px;
 padding-top:10px;
 padding-bottom:10px;
 margin-bottom:15px;
}

#commentbox1 /* this section is for photodetail page when someone leave acooment about your photot */

{
 width:625px;
 height:auto;
 border:1px dashed color:#898a7c;
 float:left;
 background-color:#d7d8c8;
 font-size:13px;
 padding-top:4px;
 padding-left:10px;
 padding-top:10px;
 padding-right:10px;
 padding-bottom:10px;
 margin-bottom:15px;
}

#smlcommentbox /* this section comes under photodeatil page when someone leave a message right section of phototext */
{
 width:470px;
 height:auto;
 text-align:left;
 float:left;
 }


.Photoborder
{
 width:auto;
 height:auto;
 padding:5px 5px 5px 5px;
 margin-right:10px;

}

.adsborder /* not using */
{
 width:auto;
 height:auto;
 border:3px solid #898a7c;
 
 }
 
/* puprple heading*/
.purple
{
 font-size:14px;
 font-weight:bold;
 color:#8f3575;
 }

/* blue heading*/
.blue
{
 font-size:14px;
 font-weight:bold;
 color:#2470be;
 }
 
/* green heading*/
.green
{
 font-size:14px;
 font-weight:bold;
 color:#67a61a;
 }
 
/* red font*/
.red
{
 font-size:13px;
 color:#FF0000;
 }
 
.redbold
{
 font-size:13px;
 color:#FF0000;
 font-weight:bold;
 }
 /* gray heading*/
.gray
{
 font-size:14px;
 font-weight:bold;
 color:#666666;
 }

.whitebold
{
 font-size:14px;
 font-weight:bold;
 color:#ffffff;
 }
 
.white
{
 font-size:13px;
 color:#ffffff;
 }
 
.buttcolorgreen
{
 background-color:#889801;
 color:#ffffff;
 border:1px solid #FFFFFF;
   height:23px;
 }
 
 .buttcolorblue
{
 background-color:#0290d8;
 color:#ffffff;
 border:1px solid #FFFFFF;
 height:23px;
 }
 
.buttcolorange
{
 background-color:#FF9900;
  color:#ffffff;
 border:1px solid #FFFFFF;
 height:23px;
  }
 
 
/* for top navigation starts here */ 
.solidblockmenu{
margin: 0;
padding: 0;
float: left;
font: bold 13px Arial;
width: 100%;
overflow: hidden;
margin-bottom: 1em;
border-top: 1px solid #625e00;
border-width: 1px 0;
background-color:#a6ba00;
}

.solidblockmenu li{
display: inline;
}

.solidblockmenu li a{
float: left;
color: white;
padding: 9px 11px;
text-decoration: none;
border-right: 1px solid white;
}

.solidblockmenu li a:visited{
color: white;
}

.solidblockmenu li a:hover, .solidblockmenu li .current{
color: white;
background-color:#898a7c; 
}




/* This is where our left nav starts */

.categoryboxtopmenu{
list-style-type: none;
margin: 0;
padding: 0;


}

.categoryboxtopmenu li{


border-top: 1px dashed #898a7c; /* Gray border beneath each menu item */

}

.categoryboxtopmenu li a{
background-color:#898a7c;
font-size:13px;
display:block;
color: #f5f6e8;
width: 269px;
text-decoration: none;
padding-left:4px;
padding-right:3px;
padding-top:7px;
padding-bottom:3px;
height:20px;

}

/* this is the end of side nav */



/* This is where the link color starts*/

a:link {
	color: #ffffff;
	text-decoration: underline;
}
a:visited {
	text-decoration: underline;
	color: #ffffff;
}
a:hover {
	text-decoration: none;
	color: #ffffff;
}
a:active {
	text-decoration: underline;
	color: #ffffff;
}
a {
	font-size:13px;
}

/* This is for blue navigation */

a.link2:link {
	color: #0099CC;
	text-decoration: underline;
}
a.link2:visited {
	text-decoration: underline;
	color: #666666;
}
a.link2:hover {
	text-decoration: none;
	color: #666666;
}
a.link2:active {
	text-decoration: underline;
	color: #666666;
}
a {
	font-size:13px;
}