/*-- Berkshire Inns --*/
/*-- drop down with opacity --*/
/*-- 5/29/09 --*/
 
.extra {
     display: inline;
     width: 99%;
     float: left;
     text-decoration: none;
     margin: 0 auto;
}

.extra em {
     font-style: normal;
}

.extra em.txt, .extra b {
     display: none;
}

.extra .head {
     display: block;
     width: 99%;
     height: 0;
}azimuth:

.extra .color1 {
     background: #FFF;
}

.extra .color2 {
     background: #877660;
}

.extra .color3 {
     background: #8aaa7f;
}

a.extra img {
     border: 0;
     width: 99%;
     display: block;
     text-align: center;
}

.extra em.mh2 {
     margin: 0;
     color: #000;
     font-weight: normal;
     font-size: 1em;
     padding-left: 1em;
}

.extra em.mh3 {
     padding-left: .5em;
     margin: 0;
     color: navy;
     font-size: 99%em;
}

.extra em.mh4 {
     margin: 0;
     color: #fff;
     font-weight: normal;
     font-size: 90%;
     padding-left: .5em;
}

.extra:hover {
     position: relative;
     cursor: pointer;
     text-decoration: none;
}

.extra:hover b {
     display: block;
     position: absolute;
     top: 0;
     left: 0;
     width: 99%;
     height: 6em;
     opacity: 0;
}

.extra:hover .color1 b {
     
   }  

.extra:hover .color2 b {
     
    }

.extra:hover .color3 b {
    
}

.extra:hover em.txt {
     display: block;
     position: absolute;
     top: 2em;
     width: 99%;
     left: 2em;
     height: 5em;
     color: #000;
     margin: 0;
     line-height: 1.5em;
}


/* Berkshire Inns Main CSS */
/*------- 5/13/09 2:15PM -------*/
/*   
Theme Name: biMainMU
Theme URI: www.berkshireinns.com
Description: Theme for Berkshire Inns
Author: Allan Douglas, DDGraphics WebMedia
Author: URI: www.ddgwebmedia.com
 */

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

/* @group HTML Elements */

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

body {
     color: #08083E;
     font: 90% Optima, "Sans Serif";
     margin: 0;
     padding: 4em;
}

a {
     text-decoration: none;
}

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

p {
     font-size: .95em;
     margin: 0;
     padding: 0;
}

h1 {
     color: #333;
     font-size: 1.8em;
}

h2 {
     font-size: 1.5em;
     color: #333333;
}

h3 {
     font-size: 1.2em;
     color: #333333;
}

blockquote {
     width: 90%;
     margin: 1em auto 0;
     padding: 0;
}

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

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

#container {
     width: 970px;
     
     margin: 0 auto;
     /*border: thin dashed navy;*/
}

/*------ Wrapper Stuff ------*/

#wrapper {
     margin: 0 auto;
     width: 99%;
     width: 800px;
}

/*--- End Wrapper Stuff ---*/

/* @group Left Content */

#leftcontent {
     clear: both;
     float: left;
     width: 16%;
     margin: 0;
     padding: 0;
}

/* leftCol controls non-rounded boxes in the thinner left column, known as leftContent */
 
.leftCol {
     width: 95%;
     padding: .5em 0;
     background: #FFF;
     margin: .5em 0 0 .5em;
}

.leftCol p {
     margin: 0;
     font-size: 90%;
     color: #666;
     padding: 0 .5em .3em;
}


/* @end Left Content */
/*************************/

/*------ Header Stuff ------*/

/* default masthead holding the banner and mainNav */

#header {
     width: 100%;
}

#header h1 {
     color: #08083E;
     font: 3em "Imprint MT Shadow";
     margin: 0 0 0 1em;
}

.lefthdr {
     float: left;
     width: 40%;
     margin: 0;
     padding: 0;
}

.righthdr {
     float: right;
     width: 59%;
     margin: 0;
     padding: 0;    
}

.righthdr h1 {
     color: #484833;
     padding: 0;
     font-weight: bold;
     font-size: 2.5em;
     font-variant: small-caps;
     text-align: left;
     margin: .3em 0 .3em 1em;
}

.righthdr p {
     color: #484833;
     padding: 0;
     font-size: .9em;
     font-variant: small-caps;
     text-align: right;
     margin: .3em 1em 0 0;
}

/*----- End Header Stuff -----*/
/* @end ID Selectors */
/*********************************/
/* the appropriate background class will be applied based on ID attached to the body */

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

/* @group propcolumns */

 {
     background: white;
}

#wrapper {
     float: right;
     
     margin: 0;
     padding: 0;
}

#maincontent {
     float: left;
     width: 73%;
     width: 590px;
     height:100%;
     margin: 0 ;
     padding: 0;
     background: url(IMG_1970A.jpg) no-repeat fixed center 50px;
     background-position:fixed;
     overflow: auto;
}
.first-child+html #maincontent {padding-left:30px;}
table.anyCol {
     border-bottom: medium groove navy;
}

/* @group Sub Content */

#subcontent {
     float: right;
     width: 26%;
     margin: 0;
     padding: 0;
     /*border: thin solid maroon;*/
}

/* @end Sub Content */

/* @end propcolumns */
/***********************/
/* @group onecolumn */

#onecolumn {
     background: white;
}

#onecolumn #wrapper {
     float: left;
     margin: 1em 0 0 0;
     width: 99%;
}

#onecolumn #maincontent {
     float: left;
     width: 99%;
     margin: 0 auto;
     padding: 0;
}

/* @end onecolumn */
/************************/
/* @group Box Stuff */

/* box is the shaded area that holds a rounded corner box or flat box, fitting the given width of the column it is in. Usually combined with another class to control inner elements, eg box default */

.box {
     margin: 1.5em auto 0;
     padding: .5em 0 .5em 0;
}

.boxinns {
     margin: 0;
     padding: .5em 0 .5em 0;
     background-color: #FFF;
}

.boxfull {
     clear: both;
     width: 99%;
     margin: 0 auto;
     padding: .5em 0 .5em 0;
}

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

/* Styling of the boxes if there is no JavaScript support */

.anyCol {
     width: 98%;
     padding: .5em 0;
     margin: 0 .5em;
}

.thingstodo h2 {
     color: #FFF;
}

/* paragraph styles for any main boxes */

.anyCol p, .col p {
     color: #333;
     margin: 0;
     padding: 0;
}

/* 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;
}-*/

h3 {
     font-size: 92%;
     margin: 1em .5em 0;
     padding: .2em;
}
.boxinns h3 {
font-family:"Monotype Corsiva",sans-serif;
font-size:135%;
margin:0;
padding:0;
text-align:center;
}

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

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


.about p {
     margin: 0;
     padding: 0 .5em .5em .8em;
}


/* CSS for the box ends here */

/* @end Box 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 Reservation Stuff */ 

.resies {
     font-variant: small-caps;
     text-align: center;
}

.reziesdropdowns {
     text-align: center;
     margin: .5em 0 0;
     padding: 0;
}

/* @end Town 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: 500px;
     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: 55%;
  text-align: left;
  }
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 */

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

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

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

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

.default legend {
     display: none;
}

#subcontent label {
     display: none;
}


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

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

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

.default input {
     display: block;
}

#subcontent 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;
}
.labeldd {
     float: left;
     width: 49%;
     text-align: right;
     font-weight: bold;
}

.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 */
/* image control. First we define stuff common to ALL images on the page. It is then up to other styles to override these. By default, all images will have a 2px border, and bottom and right margins of 5px. They will all float left. */

/*img {
     float: left;
     margin: 0 0 .3em;
     /*-border: .2em solid #C5BDBD;
}*/

/* For any images in the default boxes - the pencil icons - I don't want the 2px border. So I set border to 0 */

.default img {
     border: 0;
}

/* 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;
}
.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;
}

#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;}

* html .clearfix {height: 1%;}
.clearfix {display: block;}
<!-[if IE 7]>
.clearfix {display:inline-block;}
.clearfix {display:block;}
<![endif]->

     /*--- End ClearFix ---*/
     
.banner h1 {
     font-variant: small-caps;
     text-align: center;
     color: silver;
     background-color: #8507ad;
     font-style: italic;
     letter-spacing: .5em;
}

.row {
     clear: both;
}

.bdrbottom {
     border-bottom: medium ridge #800;
}

.tagline {
     text-align: center;
     border-bottom: medium ridge #800;
     color: #800;
     width: 90%;
     margin: 1em auto 1.5em;
     padding: 0;
}

/* @group Opacity */

.transblack {
     clear: both;
}

.opac7 {
     
}



.opac9 {
}

.transwhite {
}

/* @end Opacity */

.zlayer1 {
     position: relative;
     z-index: 10;
     border: thin groove green;
}

.zlayer2 {
     /*display: none;*/
     z-index: -1;
     position: relative;
}

.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 */

/*************************************/ 
/*- Town of Middlefield Calendar CSS -*/
/*--------- 7/28/08 3PM --------*/
#calendar {
     /*width: 99%;*/
     font-size: .8em;
     color: #000000;
}

/*- Needed to over ride img definition in mmaMain css -*/
#calendar img {
     float: none;
     margin: 0;
     border: none;
}

.calcurrentweek { 
     background-color: #FFFFCC; 
     color: #000000;
}

.calheaderdays { 
     background-color: #EDEAE3; 
     font-size: .9em;
     color: #000000;
}

.calheadermonth {
     background-color: #807E59; 
     color: white; 
     font-size: 1.8em;
     font-weight: bold;
     text-align: center;
}
 
.caltable {
     width: 100%;
     background-color: #EDEAE3; 
     margin-top: 1.5em; 
     /*clear: both;*/
}

.calendar_table a:link { 
     text-decoration: underline; 
     color: #B7274B; 
} 
.calendar_table a:hover { 
     text-decoration: none; 
     color: #000091;
} 

.caltoday  { 
     background-color: #D7D7D7; 
     color: black; 
     font-size: .8em; 
     font-weight: bold; 
} 
.calday { 
     width: 14%;
     height: 5em;
     background-color: #D0CAB8; 
     color: black;  
     font-size: .9em; 
     font-weight: normal; 
}

.caldaynmbr {
     color: white;
     width: 100%;
     display: block;
     margin: 0;
     padding: 0;
     text-align: center;
     background: #807E59;
}
/*--- calendar event control --*/
.calevent {
     width: 100%;
     text-align: center;
     background-color: #DEE6CF;
     margin: .3em 0 0;
     padding: 0;
}

.calevent a:link, .calevent a:visited {
     color: #3d1aec;
     line-height: 1.2em;
     font-size: 1.2em;
}

.calevent a:hover, .calevent a:active {
     color: #900; 
}

/* @group Event Detail Stuff */

/*-- calendar event detail stuff --*/

#caleventdtl {
     width: 39em;
     margin: 0 auto;
     padding: 0;
     background-color: silver;
     border: medium inset olive;
     font-family: "Comic Sans MS", sans-serif;
     font-size: 95%;
}

/*--cal event detail header --*/
.eventdtlheader {
     background-color: #807E59;
     padding: .5em 0;
     text-align: center;
}

.eventdtlprevlink, .eventdtlnextlink {
     font-size: .8em;
     font-weight: bold;
     text-transform: uppercase;
     color: #B7A07F;
     background-color: #DEE6CF;
     border: thin solid #7B2E00;
     padding: .3em 1em;
}

.eventdtlprevlink {
     float: left;
}

.eventdtlnextlink {
     float: right;
}

.eventdtltitle {
     color: #807E59;
     text-align: center;
     padding: 0;
     margin: .5em 0;
     font-size: 1.7em;
}

.calevententer {
     display: block;
     text-align: center;
}
/*---- Button Classes ----*/

.calevententer a:link, .calevententer a:visited {
     font-size: 1em;
     border-top: thin solid #CCCCCC;
     border-right: medium solid #666;
     border-bottom: thin solid #666;
     border-left: medium solid #CCCCCC;
     color: #3d1aec;
     background-color: silver;
     padding: .1em 5em;
}

.calevententer a:hover, .calevententer a:active {
     color: white;
     background-color: #807E59;
     border-top-color: #666;
     border-right-color: #CCC;
     border-bottom-color: #CCC;
     border-left-color: #666;
}

span.calevententerw a:link, .calevententer a:visited {
     font-size: .85em;
     border-top: thin solid #CCCCCC;
     border-right: medium solid #666;
     border-bottom: thin solid #666;
     border-left: medium solid #CCCCCC;
     color: #3d1aec;
     background-color: silver;
     padding: .1em 5em;
}

span.calevententerw a:hover, .calevententer a:active {
     color: white;
     background-color: #807E59;
     border-top-color: #666;
     border-right-color: #CCC;
     border-bottom-color: #CCC;
     border-left-color: #666;
}

.eventdtlcallink a {
     font-size: 1em;
     color: white;
     text-decoration: none;
     padding: .3em;
     font-weight: bold;
}
/*--- cal event detail specs --*/
.eventdtlspecs {
     float: left;
     width: 52%;
}

/*--- event detail descrition stuff ---*/
.eventdtldescription {
     float: right;
     width: 46%;
     color: #807E59;
}

.eventdtldescription h2 {
     font-size: 1.3em;
     margin: 0 0 .5em;
}

/* @end Event Detail Stuff */
/*****************************/
/* @group Form Stuff */
#errormsg p {
     clear: both;
     padding-top: .5em;
     color: red;
     text-align: center;
}
div.row {
     clear: both;
     padding-top: .5em;
}
div.row1 {
     clear: both;
     padding-top: .5em;
     text-align: center;
}
div span.label {
     float: left;
     width: 32%;
     text-align: left;
     font-size: .8em;
  }

div span.labeladd {
     float: left;
     width: 26%;
     text-align: right;
     font-size: .8em;
}

div.row1 span.labeladd {
     float: left;
     width: 38%;
     text-align: right;
     font-size: .8em;
}

div.row span.formw {
     float: right;
     width: 63%;
     text-align: left;
} 
div span.formadd {
     float: right;
     width: 72%;
     text-align: left;
     color: #3d1aec;
} 

div.row1 span.formadd {
     float: right;
     width: 60%;
     text-align: left;
     color: #3d1aec;
}

div.rowbttns {
     clear: both;
     padding-top: .5em;
     text-align: center;
}

/*-- Form Stuff --*/

/* @end Form Stuff */
/****************************/
/* @group General Classes */

.year {   
     font-size: 12px;
     font-weight: bold;
     color: #743E3E;
     background-color: #F7F0E0;
}

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

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

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

.clearfix {
     display: inline-table;
}

/* Hides from IE-mac \*/

* html .clearfix {
     height: 1%;
}

.clearfix {
     display: block;
}

/* End hide from IE-mac */
/*--- End ClearFix ---*/
/* @end General Classes */
     
/*------ End DDG Calendar CSS -----*/
/************************************/
.bk-box-head {font-weight: normal;font-size: 18px;color: #000000;font-family: Arial, Helvetica, sans-serif;text-decoration: none;}
.bk-formG { font-size: 12px; color: #000000; font-style: normal; font-family: Arial, Helvetica, sans-serif; font-variant: normal; text-decoration: none;}
.bk-form100wd {font-size: 12px;width: 100px;color: #000000;font-style: normal;font-family: Arial, Helvetica, sans-serif;font-variant: normal;text-decoration: none;}
.bk-form150wd {font-size: 12px;width: 150px;color: #000000;font-style: normal;font-family: Arial, Helvetica, sans-serif;font-variant: normal;text-decoration: none;}
.bk-form200wd {font-size: 12px;width: 200px;color: #000000;font-style: normal;font-family: Arial, Helvetica, sans-serif;font-variant: normal;text-decoration: none;}
.bk-form50wd {font-size: 12px;width: 50px;color: #000000;font-style: normal;font-family: Arial, Helvetica, sans-serif;font-variant: normal;text-decoration: none;}
.bk-form60wd {font-size: 12px;width: 60px;color: #000000;font-style: normal;font-family: Arial, Helvetica, sans-serif;font-variant: normal;text-decoration: none;}
.bk-dashline { text-align: center; width: 90%; border-top: 1px dashed #c0c0c0; border-bottom: 1px dashed #c0c0c0; color: #ffffff; background-color: #ffffff; height: 1px;}
.bk-bodyHEAD {font-family: Arial, Helvetica, sans-serif;font-size: 14px;font-style: normal;text-decoration: none;font-weight: bold;}
.bk-body {font-family: Arial, Helvetica, sans-serif;font-size: 12px;font-weight: normal;color: #000000;}
.bk-top-table-color-txt{font-weight: bold;font-size: 18px;color: #000000;font-family: Arial, Helvetica, sans-serif;}
.bk-hotel-head {font-family: Arial, Helvetica, sans-serif;font-size: 20px;font-weight: bolder;font-style: normal; color: #000000;}
.labels-result {font-family: Arial, Helvetica, sans-serif;font-size: 11px;font-style: normal;text-decoration: none;font-weight: normal;}
.labels {font-family: Arial, Helvetica, sans-serif;font-size: 12px;font-style: normal;text-decoration: none;font-weight: bold;}
.bk-form20wd {font-size: 12px;width: 20px;color: #000000;font-style: normal;font-family: Arial, Helvetica, sans-serif;font-variant: normal;text-decoration: none;}
.err1 {font-weight: bold;font-size: x-small;color: #ff0000;font-family: Arial, Helvetica, sans-serif;}
.err2 {font-weight: normal;font-size: xx-small;color: #ff0000;font-family: Arial, Helvetica, sans-serif;}
.arlink { font-family: Arial, Helvetica, sans-serif; font-size: 9pt; font-weight: bold;}
.availLink { font-family: Arial, Helvetica, sans-serif; font-size: larger; font-weight: bold; color: Blue; text-decoration: underline}
.uatext { font-family: Arial, Helvetica, sans-serif; font-size: larger; color: Blue; font-variant:normal ;text-decoration: none;}
.bk-but {font-family: Arial, Helvetica, sans-serif; font-size: 12px; color:Black; font-variant:normal; text-decoration: none; }
.bk-newSearch {font-family: Arial, Helvetica, sans-serif; font-size: 14px;  text-decoration: none; font-weight: bold;}
.labels-small {font-family: Arial, Helvetica, sans-serif; color: #333333; font-size: 9px;font-style: normal;text-decoration: none;font-weight: normal;}
.tableHeader {font-family: Arial, Helvetica, sans-serif;font-size: 11px;font-style: normal;text-decoration: none;font-weight: bold;}
.tableResult {font-family: Arial, Helvetica, sans-serif;font-size: 11px;font-style: normal;text-decoration: none;font-weight: normal;}
.morePhoto {background-color:white;}
.photoBorder {display:inline-block;border-color:Black;border-width:1px;border-style:Solid;}
.labels a {color: #333333;}
.labels-small a {color: #333333;}
#aspnetForm {float: left;   width: 96%; min-height: 430px;  }
body {scrollbar-base-color:#74A6B7;}