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

body {
text-align : center;
font-family:  Trebuchet MS, Arial, Verdana, Helvetica, sans-serif;
font-size: 12px;
line-height: 16px;
color : #000000;
background-color:#b7b09a; 
}
p {
font-size: 12px;
margin:15 0 0 20px;
line-height: 18px;
color : #000000; 
}

hr {
border: thin dashed;
}

h1 {
font-size: 16px;
margin: 0 10 10 20px;
color : #6d5015; 
}

table {
font-size: 12px;
line-height: 18px;
color : #000000; 
}
img {
border: none;
}  
#container {
width : 761px;
background: #ffffff;
margin : auto auto;
text-align : left;
}
#top {
width : 761px;
height: 170px;
background-image:url(../pics/grapLogo.jpg); 
background-repeat: no-repeat;
}
#nav {
clear:both;
width : 761px;
height: 94px;
float:left;
position: relative;
}
#content {
clear:both;
float:left;
width : 761px;
height:auto;
background-image:url(../pics/grapContainer.jpg);
background-repeat:repeat-y; 
position:relative;
}
#row {
width: 650px;
float:left;
padding:0 0 0 50px;
position:relative;
}

#bottomRow {
width: 761px;
float:left;
padding:0 0 0 50px;
position:relative;
background-color:#b7b09a; 
}


#leftCol {
width: 300px;
float:left;
position:relative;
}
#rightCol {
width: 300px;
float:right;
position:relative;
}

#leftColHome {
width: 270px;
float:left;
margin-left:30px;
position:relative;
}
#rightColHome {
width: 270px;
float:right;
margin-left:30px;
position:relative;
}



#galleryRow {
width: 650px;
height:200px;
margin:0 0 0 0px;
}
#galleryCol {
width: 135px;
margin:0 0 0 0px;
padding:10 10 10 10px;
float:left;
}

#galleryCol p{
margin:10 0 0 0px;
padding:0 0 0 0px;
line-height:14px;
}
#galleryCol h1{
margin:10 0 0 0px;
padding:0 0 0 0px;
line-height:14px;
}


/* normal links */

a {
color: #64572f;
margin: 0 0 0 0px;
}
a:hover {
color: #D39A00;
margin: 0 0 0 0px;
}


/* ////////// left form /////////// */

  
#footer {
width : 761px;
height: 92px;
float: left;
color: #FFFFFF;
background-image: url(../pics/grapFooter.jpg);
background-repeat: no-repeat;
position:relative;
} 
.footer {
text-align:center;
color: #64572f;
position: relative;
} 

/* ////////// application form /////////// */

th {
	text-align:left;
	font-size:12px;
}



/* ////////// list /////////// */
li {
font-size:12px;
list-style-type: none;
margin: 5 60 0 0;
padding: 0 0 0 20px;
list-style:square;
}





/*##########################################
form css
##########################################*/


#formLeft {
	color: #666666;
	float:left;
	width:300px;
}
#formRight {
	color: #666666;
	float:left;
	width:300px;
}


.textBox {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight:normal;
	color: #000000;
	font-size:13px;
	border:1px solid #c3c3c3;
	padding:5px;
	height:30px;
	width:300px;
}
.inputBox {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight:normal;
	color: #666666;
	font-size:13px;
	border:1px solid #c3c3c3;
	padding:5px;
	height:210px;
	width:304px;
	}

.textBox2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight:normal;
	color: #666666;
	font-size:13px;
	border:1px solid #c3c3c3;
	padding:5px;
	height:20px;
	width:250px;
}
.inputBox2 {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight:normal;
	color: #666666;
	font-size:13px;
	border:1px solid #c3c3c3;
	padding:5px;
	height:100px;
	width:250px;
	}
	
.formText {
	font-size:12px;
}
.floatLeft {
	float:left;
}
.floatRight {
	float:right;
}

input:hover, input:focus  {
	border-color:#c5c5c5;
	background:#ffe68e;
} 
textarea:hover, textarea:focus  {
	border-color:#c5c5c5;
	background:#ffe68e;
} 

/* These are the classes applied on the error messages
 * which prevent them from being displayed by default.
 */ 
.textfieldRequiredMsg, 
.textfieldInvalidFormatMsg, 
.textfieldMinValueMsg,
.textfieldMaxValueMsg,
.textfieldMinCharsMsg,
.textfieldMaxCharsMsg,
.textfieldValidMsg {
	display: none;
}

/* These selectors change the way messages look when the widget is in one of the error states.
 * These classes set a default red border and color for the error text.
 * The state class (e.g. .textfieldRequiredState) is applied on the top-level container for the widget,
 * and this way only the specific error message can be shown by setting the display property to "inline".
 */
.textfieldRequiredState .textfieldRequiredMsg, 
.textfieldInvalidFormatState .textfieldInvalidFormatMsg, 
.textfieldMinValueState .textfieldMinValueMsg,
.textfieldMaxValueState .textfieldMaxValueMsg,
.textfieldMinCharsState .textfieldMinCharsMsg,
.textfieldMaxCharsState .textfieldMaxCharsMsg
{
	display: inline;
	border: none;
	color:#8c2e80;
	font-weight:bold;
}