/*  09/12/06 CSS Layout - Denver Art Museum  */

html body {
	padding:0px;
	margin:0px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color:#787878;
	background-color:#ffffff;
	width:100%;
}

table{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color:#787878;
	margin:0px 0px 10px 0px;
	padding:0px;
	clear:both;

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

td {
	font-size: 11px;
}

h1 {
	margin:0px 0px 0px 20px;
	font-size: 21px;
}

h2 {
	font-weight:bold;
	margin:0px 0px 0px 0px;
	padding:0px;
	font-size: 11px;
	clear:both;
}

h3 {
	font-weight:bold;
	margin:0px 0px 0px 0px;
	padding:0px;
	font-size: 11px;
	clear:both;
}

p {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color:#787878;
	margin:0px;
	padding:0px;
	font-size: 11px;
}

a:link,
a:visited,
a:hover,
a:active {
	color: #f85600;
}

input.textfield  {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color:#666666;
	background-color: #fff;
	padding:0px;
	border: solid 1px #e0e0e0;
	margin:0px;
	height: 18px;
	width:146px;
}

OL.alpha {list-style-type: upper-alpha;}
OL.decimal {list-style-type: decimal;}
OL {list-style-type: decimal;}

#outer_wrapper {
	z-index:1;
	margin:0px;
	padding:0px;
	background-image:url(../images/new_css/tm_9_5_main_bg.jpg);
}

#wrapper {
	width:984px;
	padding:0px;
	margin:0px;
	background-image:url(../images/new_css/tm_9_5_wrapper_background.gif);
	background-repeat:repeat-y;
}

/* CONTENT CONTENT CONTENT*/

#contentWrapper{
	width:692px;
	margin-left:294px;
	min-height:605px;
}
#contentWrapperUtility{
	width:692px;
	margin-left:244px;
	min-height:605px;
}
/*___Content Area Styles________*/

/*___This class creates text that will span the entire content area ________*/



/*___This class creates text that will span the entire content area ________*/
#content_100 {
	float:left;
	width:675px;
	padding:15px 0px 10px 0px;
}
#content_100 p , #content_100 h2{
	width:645px;
	padding:0px 10px 0px 20px;
	float:left;
}


/*___class for a image that spans the entire content area ________*/
.contentFullPhoto {
	width:675px;
	margin-left:0px;
}

.contentFullPhotoDetail {
	width:675px;
	margin-left:0px;
	padding-top:15px;
}

/*___Content 66 has a width of 66% of the content area. It play well with the smaller promo boxes________*/
#content_66 {
	float:left;
	width:385px;
	padding:15px 12px 0px 21px;
}

#content_66 div{
	width:370px;
	margin:0px 0px 10px 0px;
	padding:0px 0px 20px 15px;
	clear:both;
	background-image: url(../images/new_css/events_bottom3.gif);
	background-position: bottom left;
	background-repeat:no-repeat;
}

#content_66 div h2{
	width:370px;
	background:url(../images/new_css/events_corner2.gif);
	background-position:top right;
	background-repeat:no-repeat;
	display:block;
	margin:0px;
	padding:18px 0px 10px 0px;
	font-weight:bold;
}

#content_66 div a {
	width:68px;
	float:left;
}

#content_66 div img{
	padding:0px 5px 0px 0px;
}

#content_66 div p {
	float:left;
	padding:0px 15px 0px 10px;
	width:260px;
}

#content_66 div a.detail{
	clear:both;
	float:none;
	width:350px;
	text-align:right;
	padding-bottom:0px;
	display:block;
}
#content_66 div.contentNode_adminInnerDiv p, #content_66 div.contentNode_adminInnerDiv p{
	padding:0px 0px 0px 0px;
	width:100%;
}

/*___Content 66 has a width of 66% of the content area. It play well with the smaller promo boxes It is used on the calandar page________*/
#content_66_cal {
	float:left;
	width:385px;
	padding:0px 12px 0px 21px;
}

#content_66_cal div {
	width:370px;
	margin:0px 0px 10px 0px;
	padding:0px 0px 20px 15px;
	clear:both;
	background-image: url(../images/new_css/events_bottom3.gif);
	background-position: bottom left;
	background-repeat:no-repeat;
}

#content_66_cal div h2{
	width:355px;
	background:url(../images/new_css/events_corner2.gif);
	background-position:top right;
	background-repeat:no-repeat;
	display:block;
	margin:0px;
	padding:18px 15px 10px 0px;
	font-weight:bold;
}
#content_66_cal div h2 img.eventtype{
	float:left;
}
#content_66_cal div h2 span.etitle {
	display:block;
	width:325px;
	float:left;
}

#content_66_cal div a {
	width:68px;
	float:left;
}

#content_66_cal div img{
	padding:0px 5px 0px 0px;
}

#content_66_cal div p {
	float:left;
	padding:0px 20px 0px 23px;
	width:330px;
}

#content_66_cal div a.detail{
	clear:both;
	float:none;
	width:350px;
	text-align:right;
	padding-bottom:0px;
	display:block;
}




#content_100_cal {
	float:left;
	width:725px;
	padding:0px 12px 0px 21px;
}

#content_100_cal div {
	width:702px;
	margin:0px 0px 10px 0px;
	padding:0px 0px 20px 15px;
	clear:both;
	background-image: url(../images/new_css/events_bottom4.gif);
	background-position: bottom left;
	background-repeat:no-repeat;
	position: relative;
}

#content_100_cal div h2{
	margin:0px;
	padding:18px 15px 10px 0px;
	font-weight:bold;
}
#content_100_cal div h2 img.eventtype{
	float:left;
}
#content_100_cal div h2 span.etitle {
	display:block;

}

#content_100_cal div a {

}

#content_100_cal div img{
	padding:0px 5px 0px 0px;
}

#content_100_cal div p {
	padding:0px 20px 0px 23px;
}

#content_100_cal div img.topright {
	position: absolute;
	top: 0px;
	right: 10px;
}
#content_100_cal div a.detail {
	position: absolute;
	top: 13px;
	right: 29px
}



/*___Content 66 has a width of 66% of the content area. It play well with the smaller promo boxes________*/

#content_66_vbar {
	float:left;
	width:385px;
	padding:0px 12px 0px 12px;
	border-right:#999999 thin solid;
}

/*___Content 60 has a width of roughly 60% of the content area. It play well with the larger promo boxes________*/
#content_60 {
	float:left;
	width:336px;
	padding:15px 10px 30px 21px;
	background-position:bottom;
	background-repeat:no-repeat;
}



/*Content area with Two Coulumns split 50/50 This will class out two columns of box elements */
#content50_50 {
	float:left;
	width:675px;
	padding:0px 0px 5px 0px;
}

#content50_50 div {
	margin:10px 0px 0px 10px;
	width:308px;
	min-height:143px;/* */
	padding:0px 0px 15px 15px;
	float:left;
	background-image: url(../images/new_css/events_bottom2.gif);
	background-position: bottom left;
	background-repeat:no-repeat;
}
#content50_50 div .cap{
	background:url(../images/new_css/events_corner.gif);
	background-position:top right;
	background-repeat:no-repeat;
	margin:0px;
	padding:0px;
	width:298px;
	min-height:16px;
}
#content50_50 div h2{
	margin:0px;
	padding:0px 0px 10px 0px;
	width:278px;
	font-weight:bold;
}
#content50_50 div h2.textWidth{
	width:278px;
}
#content50_50 div a {
	width:93px;
	text-align:center;
	clear:left;
	float:left;
}

#content50_50 div img{
	text-align:left;
	padding:0px 5px 0px 0px;
}

#content50_50 div p {
	padding: 0px 15px 0px 0px;
	float:left;
	width:185px;
}

#content50_50 div a.detail{
	width:280px;
	text-align:right;
	padding-bottom:10px;
}

/*Content area with Two Coulumns split 50/50 This will not have the two columns of box elements */
#content50_50_boxless {
	float:left;
	width:675px;
	margin-top: 10px;
}

#content50_50_boxless div {
	width:304px;
	padding:10px 10px 15px 21px;
	float:left;
}

#tripleCallout {
	background:url(../images/tripleCalout8.gif);
	background-position:top;
	background-repeat:repeat-y;
	width:675px;
	margin:0px;
	padding:0px 0px 0px 0px;
	float:left;
}

/*Callouts - 	Callouts - 	Callouts - 	Callouts - 	Callouts - 	*/

/*-------- tripleCallout is used in template 2 they border the top of the image ------------*/
#tripleCallout div {
	float:left;
	width:195px;
	margin:0px 6px 0px 8px;
}
#tripleCallout div h2 {
	margin:10px 6px 03px 8px;
}
#tripleCallout div p {
	padding:0px 10px 0px 10px;
	margin:0px;
}

/* Promos - Promos - Promos - Promos - Promos - Promos - Promos -*/


/*------wideSidePromo is used in Template 2. It is wider than the usual side promos and the image used in them it's also wider---*/

#wideSidePromo {
	float:left;
	clear:right;
	width:320px;
	margin:0px;
	padding:0px 2px 0px 0px;
}

#wideSidePromo img{
padding:0px;
margin:0px;
}
#wideSidePromo span.head2{
	float:left;
	display:block;
	background:url(../images/wideH2.gif);
	background-repeat:no-repeat;
	height:46px;
	width:305px;
	padding:0;
	margin:0;
}
#wideSidePromo span.head2 h2{
	margin:22px 0px 0px 20px;
	font-size:16px;
}
#wideSidePromo div.plainText{
	float:right;
	background:none;
	background-image:none;
	background-repeat:no-repeat;
	padding:10px 42px 10px 22px;
	border:none;
}

#wideSidePromo div {
	width:260px;
	background:url(../images/new_css/temp02PromoBG.gif);
	background-repeat:repeat-y;
	background-position:left;
	padding:10px 39px 22px 22px;
	border-bottom: 1px solid #cccccc;
	border-top: 1px solid #cccccc;
	clear:both;
}

#wideSidePromo div h2 {
	color:#3c3b31;
	width:245px;
}

#wideSidePromo div p {
	color:#606356;
	width:245px;
}

/* promo is the normal sized promo that is used on the majority of the pages -*/

#promo {
	float:right;
	width: 261px;
	margin-top:-1px;
}

#promoFloatOver {
	z-index:2;
	position:absolute;
	left:755px;
	top:172px;
	float:right;
	width: 261px;
}
#plainText{
	float:right;
	width: 261px;
}
#promo div ,
#promoFloatOver div {
	background:url(../images/new_css/callout_corner.gif) no-repeat right top #dfe5c8;
	float:right;
	width:261px;
	padding:12px 0px 12px 12px;
	margin:0px 0px 2px 0px
}
#promo div h2,
#promoFloatOver div h2{
	color:#000000;
	font-size:9px
}
#promo div img,
#promoFloatOver div img  {
	float:left;
	margin:0px 9px 0px 2px;
}
#promo div p,
#promoFloatOver div p {
	color:#606356;
	clear:right;
	padding-right:5px;
}

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

#header {
	width: 969px;
	height: 106px;
	background-image:url(../images/head_bg.gif);
	background-repeat:no-repeat;
	margin: 0px;
	padding: 0px;
}

#damLogo{
	padding:44px 0px 0px 19px;
	float:left;
	width:254px;
}

#header_utility {
	padding:30px 0px 0px 0px;
	margin:0px;
	float:right;
	width:302px;
}

#header_utility_container_text {
	float:left;
	margin:0px;
	padding:0px;
	height:34px;
	width:72px;
}

#utility_container_search {
	float:right;
	margin:0px;
	padding:0px ;
	height:34px;
	width:228px
}

#searchTitle {
	text-align:left;
	float:left;
	padding:0px 0px 2px 0px;
	margin:0px;
}

#search_field {
	text-align:left;
	clear:left;
	margin-top:15px;
	padding:0px;
	height:18px;
}

#search_field form, #search_field input  {
	margin:0px;
	padding:0px;
}

.goBtn {
	border:none;
	clear:right;
	width:55px;
	height:20px;
	padding:0px 0px 22px 0px;
}

#text_size {
	text-align:center;
	padding:0px 0px 4px 0px;
	margin:0px;
}

#text_size_btn {
	text-align:center;
	margin:0px;
	padding:2px 0px 0px 0px;
}

/* Padding added to parent. Margins on floated elements do not collapse.*/
#header_nav_container {
	width:400px;
	text-align:right;
	float:right;
	padding:11px 0px 0px 0px;
}
#header_nav  {
	padding:0px 23px 0px 0px;
	margin:0px;
}
#header_nav li {
	padding:0px;
	margin: 0px;
	margin-left: -3px;
	display:inline;
}

#header_nav a:link, #header_nav  a:visited {
	color:#666666;
	display:inline;
	text-decoration:none;
}

#header_nav  a:hover, #header_nav  a:active {
	color:#CCCCCC;
	display:inline;
	text-decoration:none;
	/* background-color:#666666; */
}

#shop_container a {
	position:absolute;
	left:622px;
	padding:11px 0px 0px 0px;

}
h2.imageDetail{
	font-size:12px;
	padding-left:20px;
}

a img {
	border:none;
}

#flashContent {
    position: absolute;
    left: 0px;
    top: 104px;
    z-index: 3;
}

/* left nav defs */
.left-nav  {
	position : relative;
	z-index : 1;
	width : 90px;
	padding : 0;
	margin : 0;
}

.left-nav ul  {
	padding : 0;
	margin : 0;
}

.left-nav li  {
	list-style-type : none;
	padding : 0;
	margin : 0;
	padding-bottom : 2px;
}

.left-nav li a  {
	text-decoration : none;
	font-weight : 500;
	color : #ffffff;
}

.left-nav li img  {
	border : 0;
}

.left-nav .ln-subnav-lev1  {
	position : absolute;
	top : 10px;
	left : 34px;
	height : 550px;
	width : 182px;
	padding-left : 78px;
	z-index : -1;
}
.left-nav .ln-subnav-lev1 ul {
	padding : 0 0 0 12px;
}

.left-nav .ln-subnav-lev1 li  {
	padding : 5px 0 10px 5px;
	text-indent : -10px;
}

.left-nav .ln-subnav-lev1 li li  {
	padding : 3px 0 0 5px;
}

.left-nav .ln-subnav-lev1 .ln-subnav-lev1-header  {
	padding-top : 0;
	margin-left : -73px;
	height : 46px;
}

.left-nav .ln-subnav-lev1 a,
	.left-nav .ln-subnav-lev1 span  {
	color : #ffffff;
}

.left-nav .ln-subnav-lev1 li a,
	.left-nav .ln-subnav-lev1 li span  {
	font-weight : 900;
	padding : 0 5px 5px 0;
	line-height : 16px;
}

.left-nav .ln-subnav-lev1 li ul li a,
	.left-nav .ln-subnav-lev1 li ul li span  {
	font-weight : 500;
	padding : 3px 5px 3px 0;
	line-height : 14px;
}

#ln_subnav_1  {
	background-color : #4c9620;
}

#ln_subnav_1 li a:hover,
	#ln_subnav_1 li.active span  {
	background-color : #416e27;
}

#ln_subnav_2  {
	background-color : #d68700;
}

#ln_subnav_2 li a:hover,
	#ln_subnav_2 li.active span  {
	background-color : #a06500;
}

#ln_subnav_3  {
	background-color : #9f1f15;
}

#ln_subnav_3 li a:hover,
	#ln_subnav_3 li.active span  {
	background-color : #77170f;
}

#ln_subnav_4  {
	background-color : #89336e;
}

#ln_subnav_4 li a:hover,
	#ln_subnav_4 li.active span  {
	background-color : #662652;
}

#ln_subnav_5  {
	background-color : #1a89a9;
}

#ln_subnav_5 li a:hover,
	#ln_subnav_5 li.active span  {
	background-color : #13667e;
}
/* end left nav defs */

/* Header Header Header Header Header Header Header Header Header Header Header Header*/

#title_sifr {
	width:410px;
	height:40px;
	float:left;
	margin:7px 8px 0px 0px ;
	padding:20px 0px 0px 0px;
}

buyTickets{
	float:right;
	width:267px;
	padding-right:10px
}

#flashContent {
	z-index:+3;
	float: left;
	width: 294px;
	height:560px;
	margin:0px;
}

#footerWrapper img{
	clear: both;
	margin-right: 15px;
	padding:0px;
}

#greybg{
	clear: both;
	display:block;
	width:100%;
	background:url(../images/footerBG.jpg);
	background-repeat:repeat-x;
	background-position:top;
	background-color:#959a98;
	height:168px;
}

#footer {
	margin: 0px;
	padding-top: 97px;
	background:url(../images/new_css/tm_9_5_foot_left_bg.jpg);
	background-repeat:no-repeat;
	background-position:top left;
}
#footer_btm {
	float:left;
	clear:both;
	width:970px;
	height: 70px;
	margin: 0px;
	display:block;
	background-color:#696D6C;
	background:url(../images/new_css/tm_9_5_footer_background.gif);
	background-repeat:repeat-y;
	background-position:left;
}

#footer_navbar_logo {
	display:block;
	float:left;
	width:970px;
	height: 22px;
	margin: 0px;
	text-align: left;
	padding: 0px;
	background-color:#2F2C2D;
	background-image:url(../images/new_css/tm_9_5_scfd_logo2.gif);
	background-position:right top;
	background-repeat:no-repeat;
}

#copyright {
	float:left;
	margin: 0px;
	text-align: left;
	padding:5px 3px 3px 34px;
	background:#2F2C2D;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color:#787878;
}

#footer_nav p{
	float:right;
	margin: 0px;
	text-align: left;
	padding:5px 0px 3px 0px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color:#787878;
}

#footer_nav a{
	color:#787878;
}


#clear {
    height: 0;
    clear: both;
}
.clear {

	display:block;
    height: 0px;
	width:100%;
    clear: both;
}
#searchDecorator {
	float:left;
	width:673px;
	padding:15px 0px 10px 0px;
}


.skiplink {
	display:none
}

img.left {
	padding: 4px;
	margin: 0 7px 2px 0;
	display: inline;
}
.error_text {
	color : #a90303;
}

#print, #printImage {
	display:none;
}

/**
popup classes **/
#formbox {
    position: absolute;
    background-color: #666666;
    width: 543px;
    z-index: 91;
    margin: 0 auto;
    border: solid 0px #AAAAAA;
}

#formbox p {
    color: #cccccc;
    padding: 0px 17px 17px 17px;
}

#formbox h1 {
    color: #d78601;
    font-size: 14px;
    font-weight: bold;
    padding: 0px 17px 0px 17px;
}

#formoverlay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 90;
    width: 100%;
    height: 500px;
    filter: alpha( opacity = 100 );
    background-color: #ffffff;
    -moz-opacity: 1.0;
    opacity: 1.0;
}

/* These are standard sIFR styles... do not modify */
.sIFR-flash {
            visibility: visible !important;
            margin: 0;
}
.sIFR-replaced {
            visibility: visible !important;
}

span.sIFR-alternate {
            position: absolute;
            left: 0;
            top: 0;
            width: 0;
            height: 0;
            display: block;
            overflow: hidden;
}

.job {
background-image:url(../images/get_involved/job_opp_bg3.gif);
background-position:bottom;
background-repeat:no-repeat;
clear:both;
}

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {
  display: none !important;
}

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash h1 {
		visibility: hidden;
		font-size:21px;
		line-height:2.85em;
}
.sIFR-hasFlash #wideSidePromo span h2 {
		visibility: hidden;
		font-size:14px;
		line-height:1.7em;
}

.sIFR-hasFlash #promoFloatOver h2,
.sIFR-hasFlash #promo h2 {
		visibility: hidden;
		font-size:10px;
		line-height:1.3em;
		margin:0px 0px 5px 3px;
}


