/* Stylesheet for VED. Copyright Nadia Perre. Passed CSS Validation. */

body {
margin: 0;
padding: 0;
font-weight: normal;
font-size: 101%;
font-family: Arial, Helvetica, sans-serif;
background-color: #bec7d2;
color: #000000;

}
/* to stop shorter pages from jumping */
html { min-height:100%; margin-bottom:1px; }

#wrapper {
width: 100%;
padding: 0px;
float: left;
}


.centernav {
width: 767px;
margin-left: auto;
margin-right: auto;
}

img.figure {
float:right;
margin-left:10px;
margin-bottom:10px;
border: 1px solid #666;
padding:10px;
}

img.figure1 {
float:left;
margin-left:0px;
margin-bottom:10px;
border:1px solid #666;
padding:10px;
}

/* self explanatory - the navigation bar of course  */
#navigation {
background-image: url(../images/topnav_back.gif);
background-repeat: repeat-x;
text-align:center;
border-left: 3px solid #FFFFFF;
border-right: 3px solid #FFFFFF;
width: 762px;
height: 39px;
padding: 0px;
float: left;
margin: 0px;
font-family: Arial, Helvetica, sans-serif; 
font-size: .75em;
line-height: 39px;
color:  #FFFFFF;
}

/* Style the navigation links */
#navigation a {
font-weight: normal;
color: #FFFFFF;
padding-right: 15px;
padding-left: 15px;
}

#navigation a:hover {
color:;
border-bottom: 4px solid #ffffff;  /* gives the border under the navbar link on mouseover */
}


.centerbody {
width: 762px;
margin-left: auto;
margin-right: auto;
}

#bodycon {
background-color: #FFFFFF;
border-left: 3px solid #FFFFFF;
border-right: 3px solid #FFFFFF;
width: 762px;
float: left;
padding: 0px;
margin: 0px;
}
/* left column */
#leftcon {
background-color: #FFFFFF;
width: 243px; 
margin: 0px;
padding: 0px;
float: left;
border-right: 1px dotted black;

}
/* div wrapper for the major news article section */
#newscon {
background-color: #FFFFFF;
width: 243px;
margin: 0px;
padding: 0px;
float: left;
}

#newstextcon {
padding: 0px;
width: 133px;
margin: 0px;
float: left;
}

/* the header image above the news items  - background image used */
#newstext {
background-image: url(../images/newsletter.png);
background-repeat: no-repeat;
width: 165px;  /* if you change this graphic, make sure you specify the correct width of it here */
height: 50px;  /* as above, specify the height of the image */
float: left;
margin: 0px 20px;
padding: 0px;
}

#services {
background-image: url(../images/services.png);
background-repeat: no-repeat;
width:165px;
height:50px;
float: left;
margin: 0px 20px;
padding: 0px;
}

#classes {
background-image: url(../images/classes.png);
background-repeat: no-repeat;
width:165px;
height:50px;
float:left;
margin:0px 20px;
padding:0px;
}
/* styles for the actual news box div */
#news {
background-color: #FFFFFF;
width: 175px; /* 233 */
padding-left: 0px;
padding-top: 15px;
padding-bottom: 25px;
margin: 0px;
text-align: left;
float: left;
font-size: 0.90em;
}

/* news box link styles */
#news a {
color: #2C4468;
line-height: 25px;
font-weight: normal;
padding: 0px;
text-decoration: underline;
}

#news a:hover {
	color: #bec7d2;
	font-weight: normal;
	padding: 0px;
	text-decoration: underline;
}

#news h2 {
	font-size: 1.1em;
	color: #000000;
}

/* right content area */
#rightcon {
background-color: #FFFFFF;
width: 490px; 
padding-left: 12px;
float: left;
margin: 0px;

}

#rightcon H1 {
	padding: 2px 2px 10px 15px;
	font-size: 130%;
	color: #000000;
	margin-left: px;
	letter-spacing: 0.60em;
	}

/* class to setting images to float left or right */
.imgleft {
	float: left;
	padding: 6px;
}

.imgright{
	float: right;
	padding: 6px;
}

/* general style for all paragraphs */
p {
color: #000000;
padding-left: 20px;
font-family: Arial, Helvetica, sans-serif; 
font-size: .80em;
font-weight: normal;
line-height: 1.5em;
}

.style1 {font-size: 12px}
.style2 {font-size: 14px }
.style3 {font-size: 75%; font-weight: bold; }
.style4 {font-size: 95%; font-weight: bold; }
.style5 {color: #2C4468}
.style6 {font-size: 80%}
.style7 {font-size: 75%}
.style8 {font-size: 75%}
.style9 {font-size: 80%; font-weight: bold; }
.style11 {font-size: 90%; font-weight: bold; }
.style12 {color: #990000; font-size: 75%; }
.style14 {color: #2C4468; font-size: 75%; }
.style16 {font-size: 75%}
.style17 {font-size: 80%}
.style19 {color: #990000}
.style20 {font-size: 16px}
.style21 {
	color: #003366;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: italic;
}

}

/* general link styles */
a {
color: #2C4468;
font-weight: normal;
text-decoration: none;
}

a:hover {
color: #990000;
font-weight: normal;
text-decoration: none;
padding: 0px;
}
/* footer styles */
.centerfooter {
width: 768px;
margin-left: auto;
margin-right: auto;
}

#footercon {
background-image: url(../images/footerback.gif);
background-repeat: repeat-x;
border-left: 3px solid #FFFFFF;
border-right: 3px solid #FFFFFF;
border-bottom: 3px solid #FFF;
width: 762px;
float: left;
margin: 0px;
height: 61px;
}

#footerleft {
width: 490px;
padding-left: 10px;
margin: 0px;
float: left;
line-height: 61px;
font-family: Arial, Helvetica, sans-serif;
font-size: 0.70em;
font-weight: normal;
color: #FFFFFF;
word-spacing: .5em;

}

#footerleft a {
font-weight: normal;
color: #FFFFFF;
}

#footerleft a:hover {
text-decoration: underline;
font-weight: normal;
color: #FFFFFF;
}

#footerright {
float: left;
width: 252px;
text-align: right;
line-height: 61px;
padding-right: 10px;
margin: 0px;
font-weight: normal;
color: #FFFFFF;
}

#footerright a {
font-weight: normal;
color: #FFFFFF;
font-family: Arial, Helvetica, sans-serif; 
font-size: 0.70em;
}

#footerright a:hover {
text-decoration: underline;
font-weight: normal;
color: #FFFFFF;
}

/* form styles */

fieldset { border:0;}
legend {
 font-weight: bold; 
 }
form#contactform {
font-size: 90%; 
color: #505050; 
margin: 50px 20px 30px 30px; 
padding: 5px; 
width: 80%;
background-color: #FEFEFE; 

}
form#contactform div {
 clear: both; padding-top: 6px; 
 }
label {
 float: left; 
 width: 25%; 
 }
input,textarea { float: right; width: 70%; text-align: left;
 
}

input {
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 9px;
height: 20px;
}

textarea { height: 100px; }

#send { 
float: right; 
margin: 0; 
width:40%; 
text-align: center; 
background-color: #752222;
color: white; 
padding: 2px 2px;
}

#contactform textarea:focus, #contactform input:focus, #contactform select:focus {
	background-color: #E6E6E6;
	color: #464545;}
	
 /* portfolio page gallery pic  styles */  
.gallery {
  margin:6px;
  padding:0;
  list-style:none; 
  }

.gallery li{
  display: block;
  float:left;
  margin: 10px 15px;
  padding:0;
  }
  
.gallery img {
border:1px solid black;
padding: 2px;
text-align: center;
}

.gallery img:hover {
border: 1px solid #6C1F1F;
}

/* style if you want a drop cap on the first letter of your paragraph  */
.dropcap {
	display: block;
	color: #000000;
	float: left;
	font-size: 350%;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	height: 1em;
	margin-bottom: 0em;
	padding-top: 0.2em;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 0.5em;
	text-align: left;
	text-indent: 2px;
	clear: none;
	margin-left: 0px;
	}
	
.dropcap1 {
   display: block;
	color: #000000;
   float: left;
   font-size: 280%;
   font-family: Arial, Helvetica, sans-serif; 
   font-weight: bold;
   height: .7em;
   margin-bottom: -.3em;
   padding: .2em 0 .1em 0;
	}
	
	/* sets the current page marker and gives a pink bottom border */
	#current{
border-bottom: 4px solid #bec7d2;  /* gives the border under the navbar link on mouseover */

}