/* Ballet Soleil Main CSS */
/*------- 7/28/09 11:15AM -------*/
/*   
Theme Name: bsMain
Theme URI: www.balletsoleil.com
Description: Theme for Ballet Soleil
Author: Allan Douglas, DDGraphics WebMedia
Author: URI: www.ddgwebmedia.com
 */

/**********************************/

/* @group HTML Elements */

/*-------- HTML Elements --------*/

body {
	background-color: #d6d6d6;
	font: 95% Optima, "Sans Serif";
	color: #10220D;
	margin: 0;
	padding: 0;
}

a {
	text-decoration: none;
	color: #10220D;
}

a:hover {  
	color: #AA7F3F;
}

a img {
	border-color: #000;
}

p, td, h1, h2, h3, h4, h5, ul {
	font-family: Optima, "Sans Serif";
	color: #333;
}

p {
	font-size: 100%;
	margin: 0;
	padding: 0;
}

h1 {
	font-size: 140%;
}

h2 {
	font-size: 130%;
}

h3 {
	font-size: 120%;
}

/* @end HTML Elements */
/**************************/
/* @group ID Selectors */

/* ---- ID Selectors ---- */
/*- Container Around Everything -*/

#container {
	min-width: 750px;
	max-width: 1440px;
	margin: 0 auto;
	text-align: center;
	/*border: thin dashed navy;*/
}
/* @end ID Selectors */
/*********************************/

/* @group Left Col */

/* leftcol controls left column */
 
.leftcol {
	float: left;
	width: 48%;
	text-align: center;
}

.leftcol img {
	margin: 2em 0 0;
	padding: 0;
}

/* @end Left Col */
/************************/
/* @group Right Col */

/* rightcol controls right column */
 
.rightcol {
	float: right;
	width: 51%;
	margin: 0 auto;
	padding: 0;
}

.rightcol p {
	text-align: left;
	padding: 0;
	margin: 0 3% .8em;
}
/* @end Right Col */
/************************/
/* @group Any Column Stuff */

/* Styling of all columns */

.anycol {
	padding: .5em 0;
	margin: 0 auto;
}

/* paragraph styles for anycol */

.anycol p {
	text-align: left;
	padding: 0;
	margin: 0 5% .8em;
}

/* and then these h1 h3 statements, unique to whichever section has been attached above, will give the headers the appropriate background color */ 

.box h1 {
	font-size: 160%;
	background: white;
	padding: .2em;
	margin: 0 .5em;
}

/*-h2 {
	font: 130% "Imprint MT Shadow";
	color: #08083E;
	background: #6767B0;
	padding: .2em;
	margin: 0 .5em;
}-*/

.box h3 {
	text-transform: uppercase;
	font-size: 92%;
	margin: 1em .5em 0;
	padding: .2em;
}

h4{
	text-transform: uppercase;
	font-size: 92%;
	padding: 2px;
	margin: 1em 0 0 .5em;
}

/* @end Any Column Stuff */
/***************************/

/* date and posted control the small text info in article blurbs */

.date {
	font-size: 85%;
	font-weight: bold;
	color: #666;
	padding: 0 0 .5em .5em;
}

.posted {
	display: block;
	margin: 0 0 0 5em;
	padding: 0 0 1em 0;
	font-weight: bold;
	color: #666;
}

.postedUnderline {
	display: block;
	margin: 0 5px .5em 5em;
	padding: 0 0 .5em 0;
	font-weight: bold;
	color: #666;
	border-bottom: 1px solid #999;
}

address {
	margin-left: 5em;
}
/**************************/
/* @group Registration Stuff */ 

.register a:link, .register a:visited {
	/*display: inline;*/
	width: 11em;
	color: olive;
	background-color: silver;
	text-align: center;
	font-size: .95em;
	padding: 3px;
	border: medium ridge olive;
}

.register a:hover, .register a:active {
	color: white;
	background-color: olive;
	text-align: center;
	border: medium ridge olive;
}

/* @end Registration Stuff */
/***********************/
/* @group Contacts Page Stuff */

/*--- Contacts Page Stuff ---*/
/*-- Needed in every site that uses our DB for contact information --*/

#contact {
	float: left;
	width: 98%;
	position: relative;
	margin: 0 .5em;
	padding: 0;
	/*z-index: -6;*/
}

#contact .modules {
	clear: both;
	padding-top: 5px;
	text-align: center;
  }
  
#contact h2 {
	margin-bottom: 0px;
	-moz-border-radius: 10px;
	color: white;
	background-color: #807E59;
	border-bottom-width: medium;
	border-bottom-style: groove;
	border-bottom-color: #666666;
	text-align: center;
	margin-top: 15px;
}

#contact h4 {
	margin: 0 auto;
	text-align: center;
	margin-bottom: 0px;
	-moz-border-radius: 10px;
	color: white;
	background-color: #807E59;
	border-bottom-width: medium;
	border-bottom-style: groove;
	border-bottom-color: #666666;
}

#contact h5 {
	text-align: center;
	font-weight: normal;
	color: #333;
}

#contact .contact {
	text-align: center;
	float: left;
	display: block;
	font-size: small;
	width: 33%;
}
#rightcolcntct {
	float: right;
	width: 20%;
	margin: 0;
	z-index: 0;
	position: fixed;
	left: 78%;
}
.rowcccntct {
	clear: both;
	width: 100%;
}
.imagerc {
	width: 100%;
	border: thick ridge white;
}
.imagecc {
	width: 31%;
	border: thick ridge white;
}
/****************************/
/*---- Form Stuff ----*/
#frmcontainer {
	/*background-color: #CCCCCC;*/
	width: 90%;
	/*border: thin dashed #660099;*/
	margin: 0 auto;
	/*clear: both;*/
}
#frmcontainer h2 {
	font-size: 1.1em;
	margin: .5em 0em;
}

div.row {
	clear: both;
	padding-top: 5px;
	text-align: center;
  }
div.row1 {
	clear: both;
	padding-top: .5em;
	text-align: center;
}
div.row span.label {
	float: left;
	width: 35%;
	text-align: right;
  }

div.row span.formw {
	float: right;
	width: 45%;
	text-align: left;
}

span.formw input, textarea {
	border: thin inset silver;
	background-color: white;
}


div.row span.labelcr {
	float: left;
	width: 30%;
	text-align: right;
}

div.row span.labelbg {
	float: left;
	width: 15%;
	text-align: right;
}

div.row span.formcr {
	float: right;
	width: 70%;
	text-align: left;
	color: #000066;
}

div.row span.formbg {
	float: right;
	width: 10%;
	text-align: left;
}

div.rowbttns {
	clear: both;
	padding-top: .5em;
	text-align: center;
}
 
/*------ Form Button ------*/
.formbttn {
	cursor: pointer;
	background-color: #807E59;
	color: white;
	border: outset 1px #ccc;
	padding: 1px 2px;
}

.formbttnoff {
	background-color: #666699;
	color: #CCCCCC;
	border: outset 1px #ccc;
	padding: 1px 2px;
}

/*---- Button Classes ----*/

.sbmtbutton a:link, .sbmtbutton a:visited {
	width: 7em;
	display: block;
	border-top: medium solid #CCCCCC;
	border-right: medium solid #666;
	border-bottom: medium solid #666;
	border-left: medium solid #CCCCCC;
	color: navy;
	background-color: #FF7745;
	text-align: center;
	font-size: 1em;
	padding-top: 3px;
	padding-bottom: 3px;
	float: left;
}

.sbmtbutton a:hover, .sbmtbutton a:active {
	color: #FF7745;
	background-color: navy;
	text-align: center;
	border-top-color: #666;
	border-right-color: #CCC;
	border-bottom-color: #CCC;
	border-left-color: #666;
}
 /*---- End Form CSS ----*/

/* @end Contacts Page Stuff */
/***************************/
/* @group Form Stuff */

/* form styling - not much though kids */

form {
	margin: 0;
	padding: 0;
	/* font-size: 100%; */
}

fieldset {
	width: 146px;
	border: 0;
	margin: 0 0 10px 0;
	padding: 5px;
}

.default fieldset {
	width: auto;
	border: 0;
	margin: 10px 0 10px 50px;
	padding: 0;
}

legend {
	text-transform: uppercase;
	font-size: 99%;
	font-weight: bold;
	background: #D72E2E;
	color: #FFF;
	margin: 1em 0 .2em;
	padding: .2em;
}

.default legend {
	display: none;
}

label {
	display: none;
}


.default label {
	display: block;
	font-weight: bold;
}

input {
	margin-top: 0;
	padding: .2em;
	border: 0;
	background: #CABA8A;
	color: navy;
}

textarea {
	margin-top: 0;
	padding: .2em;
	border: 0;
	background: #CABA8A;
	color: navy;
}

.default input {
	display: block;
}

input.submit {
	border: 0;
	margin-bottom: -6px;
	padding: 2px;
	background: transparent;
	font-size: 1em;
}
/*-- rezies form stuff --*/

.rowrc {
	/*clear: both;*/
	margin: .5em 0 0;
	text-align: center;
}

.labelrc1 {
	float: left;
	width: 49%;
	text-align: center;
}

.labeldd {
	float: left;
	width: 49%;
	text-align: right;
	font-weight: bold;
}

.formrc1 {
	float: left;
	width: 49%;
	text-align: center;
}

.formdd {
	float: right;
	width: 50%;
	text-align: left;
}

/* @end Form Stuff */
/***********************/
/* @group Image Stuff */

/* @group Portfolio Stuff */

#imgthmbswrapper {
	position: relative;
	width: 100%;
	margin: 0 auto;
}	

.thmbsrow {
	clear: both;
	width: 90%;
	margin: 0 auto;
	border: medium inset #807E59;
}

.thmbsfloat {
	float: left;
	/*width: 28%;*/
	text-align: center;
	margin: .2em .1em;
}

/*---- Portfoilio Classes ----*/
/*-------- Classes --------*/

.photoCol {
	margin: 0 1em;
	padding: .5em 0;
	background: #FFF;
}

.photoCol img {
	display: block;
	text-align: center;
	margin-top: .4em;
	border: .3em solid #C5BDBD;
}

.phototitle {
	clear: both;
	font-size: 1.2em;
	font-variant: small-caps;
	text-align: center;
	margin: .5em 0;
}

.pfgalleryrow {
	clear: both;
	width: 70%;
	margin: 0 auto;

}

.pfgalleryprev, .pfgallerynext {
	font-size: 1em;
	font-weight: bold;
	text-transform: uppercase;
	color: #B7A07F;
}

.pfgalleryprev {
	float: left;
	text-align: left;
	width: 34%;
	/*border: .2em solid #C5BDBD;*/
	line-height: 120%;
}

.pfgallerynext {
	float: right;
	text-align: right;
	width: 34%;
	/*border: .2em solid #C5BDBD;*/
	line-height: 120%;
}

.pfpiclargepic {
	display: block;
	text-align: center;
	margin: 0 auto;
	padding: 0;
}
/*--- End Portfolio CSS ---*/

/* @end Portfolio Stuff */
/* For these larger images, I don't want them to float, for that causes the h3 above to be pushed to the right. I also declare a top margin to space the header and image apart, and also increase the border width slightly.  We also set it to display:block so that if body id is twoColLayout, the image will force the header and other bits to wrap around it */

.mainImage {
	display: block;
	text-align: center;
	float: none;
	margin-top: .4em;
	border: .3em solid #C5BDBD;
}

.imgaligncntr {
	display: block;
	text-align: center;
}

.imgindexadd {
	display: block;
	text-align: center;
	margin: 18em auto 0;
	padding: 0;
}

.imgcntrnegmargin {
	display: block;
	text-align: center;
}

/* drop shadow effect for the gallery thumbnails. Sadly this requires a div to be wrapped around the image markup, which is a shame */

.img-wrapper {
	margin: 20px 40px 0 0;
	background: url(shadow.gif) no-repeat bottom right;
	float: left;
	line-height: 0;
}

.img-wrapper img {
	float: none;
	margin: 0;
	background: #fff;
	padding: 4px;
	border: 1px solid #C5BDBD;
	position: relative;
	left: -5px;
	top: -5px;
}

/* used to ensure all our floated thumbnails stay the right width away from the left side of the box */

.thumbnails {
	margin: 0 0 20px 50px;
}

/* spacer used immediately after the floated gallery thumbnails to ensure the box expands to hold them all */

.spacer {
	clear: both;
}

/* @end Image Classes*/
/************************/
/* @group Navigation */
/*------ Navigation ------*/
/*-- 11/9/09 --*/

/* @group Top Nav */

#navigation {
	float: right;
	width: 100%;
	height: 2.3em;
	background: #181860;
}

#ournav, #ournav ul {
	float: right;
	width: 100%;
	list-style: none;
	line-height: 1.5em;
	background: #181860;
	font-weight: bold;
	padding: 0;
	margin: 0;
	border-top: thin solid #00440f;
	/*border-bottom: thin solid #00440f;*/
}

#ournav a {
	display: block;
	/*width: 10em;
	w\idth: 6em;*/
	text-decoration: none;
	color: white;
	padding: 0.2em .7em;
}

#ournav a:hover, #ournav a:active {
	color: navy;
}

#ournav li {
	float: left;
	padding: .3em 0; 
	/*width: 10em;*/
}

#ournav li a:before {
	content: ":: ";
}

#ournav li a:after {
	content: " : ";
}

#ournav li.wide8 {
	width: 8em;
}

#ournav li ul {
	position: absolute;
	left: -999em;
	height: auto;
	width: 12em;
	font-weight: normal;
	margin: 0;
	border: thin solid #00440f;
}

#ournav li ul.iehalf {  /*second-level lists*/
	width: 6em;
}

#ournav li ul.iehalf li {  
	width: 6em;
	padding-right: 0;
}

#ournav li ul.iehalf li ul {  
	margin: -2em 0 0 6em;
	width: 6em;
}

#ournav li li {
	padding-right: .5em;
	width: 11.5em
}

#ournav li ul a {
	width: 10em;
	/*w\idth: 9em;*/
}

#ournav li ul ul {
	margin: -2.1em 0 0 12em;
}

#ournav li:hover ul ul, #ournav li:hover ul ul ul, #ournav li.sfhover ul ul, #ournav li.sfhover ul ul ul {
	left: -999em;
	z-index: 1;
}

#ournav li:hover ul, #ournav li li:hover ul, #ournav li li li:hover ul, #ournav li.sfhover ul, #ournav li li.sfhover ul, #ournav li li li.sfhover ul {
	left: auto;
	z-index: 1;
}

#ournav li:hover, #ournav li.sfhover {
	background: #6767B0;
	color: #181860;
}

/* Highlighting the current page */

body.home #ournav a#home, body.about #ournav a#about, body.towngov #ournav a#towngov, body.bylaws #ournav a#bylaws, body.permits #ournav a#permits, body.events #ournav a#events, body.history #ournav a#history, body.gallery #ournav a#gallery, body.contact #ournav a#contactc {
	color: gray;
	text-decoration: underline;
}

body.home #ournav a:hover#home,
body.about #ournav a:hover#about, body.bylaws #ournav a:hover#bylaws, body.towngov #ournav a:hover#towngov,
body.permits #ournav a:hover#permits, body.events #ournav a:hover#events, body.history #ournav a:hover#history, body.gallery #ournav a:hover#gallery, body.contact #ournav a:hover#contactc {
	color: black;
}

/* @end Top Nav */
/***********************/
/* @group Column Nav */
/* column nav links */

.colnav, .colnav ul {
	padding: 0;
	list-style: none;
	float: left;
	width: 99%;
	text-align: right;
	margin: 1em .5em 0 0;
}

.colnav a {
	color: #666;
	line-height: 150%;
	text-decoration: none;
	display: block;
}

.colnav a:hover, .colnav a:active {
	color: maroon;
}

.colnav li {   
	position: relative;
	float: left;
	line-height: 150%;
	width: 100%; 
}

.colnav li ul li {  
	margin-left: .5em;
}
/*-- end column nav links --*/
/* @end Column Nav */
/*************************/
/* @group Footer Nav */
/*---- Footer ----*/

#footer {
	clear: both;
	width: 90%;
	margin: 1em auto 0;
	text-align: center;
	font-size: .9em;
	padding: 0;
	border-top: 1px solid #2D356A;
}

#footer p {
	font-size: .9em;
}

.leftf {
	float: left;
	width: 70%;
	text-align: left;
}

.rightf {
	float: right;
	width: 28%;
	text-align: right;
}

/*#footer a:link, #footer a:visited {
	color: #181860;
}

#footer a:hover, #footer a:active {
	background: #181860;
	color: silver;
}*/

/*--- End Footer ---*/
/* @end Footer Nav */
/* @end Navigation */
/**************************/
/* @group Site Wide Classes */

/*-------- Classes --------*/
/*------ ClearFix ------*/

/*---- Used to push divs ----*/

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix {
	display: inline-block;
}

/* Hides from IE-mac \*/

* html .clearfix {
	height: 1%;
}

.clearfix {
	display: block;
}

/* End hide from IE-mac */

/*--- End ClearFix ---*/

.cancel {
	display: block;
	font-weight: bold;
	color: maroon;
	border-bottom: 1px solid #999;
	margin: 0 0 .5em 5em;
	padding: .5em 0;
}

.clearem {
	clear: both;
}
.ddGraphics {
	font-family: "Comic Sans MS";
	font-size: .85em;
	font-weight: bold;
	color: #666666;
	text-decoration: none;
}
.WebMedia {
	font-family: "Comic Sans MS";
	font-size: .85em;
	font-weight: bold;
	color: #990000;
	text-decoration: none;
}

/* @end Site Wide Classes */