/*
Title: Perkins Center for the Arts
Author: Tome Wilson - tome@creativewebgroup.net
Last Updated: April 23, 2009
*/

/* ---[ css reset ]--------------------- */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline}
:focus {outline: 0}
body {line-height: 1; color: black; background: white}
ol, ul {list-style: none}
/* tables still need 'cellspacing="0"' in the markup */
table {border-collapse: separate; border-spacing: 0}
caption, th, td {text-align: left; font-weight: normal}
blockquote:before, blockquote:after,
q:before, q:after {content: ""}
blockquote, q {quotes: "" ""}
em, .em {font-style: italic}
strong, .strong {font-weight: bold}
.big {font-size: 110%}
.l {float: left}
.r {float: right}
.clear {clear: both; display: block}
.center {text-align: center}


/* ---[ structure ]--------------------- */
html, body {behavior: url(hover.htc); background: #fff url(../images/shell/background.png) repeat-x; height: 100%; min-width: 760px; text-align: center; font: normal 13px/1.45em Arial, Helvetica, sans-serif; color: #666}
#center-on-page {width: auto; text-align: center}

	#header {margin: 0 auto; width: 760px; height: 122px; display: block; text-align: left}
	#header #logo {float: left}

/* ---[ top-navigation buttons - tNav ]--------------------- */

	#tNav-background {height: 122px; width: 397px; background: url(../images/shell/navigation/under-top-navigation.png) no-repeat bottom 0; display: block; float: left}

	ul#tNav-buttons {width: 397px; display: block; background: url(../images/shell/navigation/top-navigation.png) no-repeat; text-align: left}
	ul#tNav-buttons li {float: left; list-style-type: none}
	ul#tNav-buttons li a {height: 44px; display: block; text-indent: -9000px; outline: none}
	li#tNav-home a, li#tNav-gift-certificates a, li#tNav-contact-us a, li#tNav-login a, li#tNav-shopping-cart a {background: url(../images/shell/navigation/top-navigation.png) no-repeat}

	li#tNav-home a {width: 62px; left: 0; background-position: 0 0}
	li#tNav-home a:hover {background-position: 0 -44px}
	li#tNav-home a:active {background-position: 0 -88px}

	li#tNav-gift-certificates a {width: 101px; left: 62px; background-position: -62px 0}
	li#tNav-gift-certificates a:hover {background-position: -62px -44px}
	li#tNav-gift-certificates a:active {background-position: -62px -88px}

	li#tNav-contact-us a {width: 75px; left: 163px; background-position: -163px 0}
	li#tNav-contact-us a:hover {background-position: -163px -44px}
	li#tNav-contact-us a:active {background-position: -163px -88px}

	li#tNav-login a {width: 47px; left: 238px; background-position: -238px 0}
	li#tNav-login a:hover {background-position: -238px -44px}
	li#tNav-login a:active {background-position: -238px -88px}

	li#tNav-shopping-cart a {width: 105px; left: 285px; background-position: -285px 0}
	li#tNav-shopping-cart a:hover {background-position: -285px -44px}
	li#tNav-shopping-cart a:active {background-position: -285px -88px}


/* ---[ middle-navigation buttons - mNav ]--------------------- */

#mNav-bar-background {margin: 0 auto; height: 50px; background: url(../images/shell/navigation/green/bar.png) repeat-x; display: block}

	ul#mNav-buttons {margin: 0 auto; width: 760px; display: block; background: url(../images/shell/navigation/green/navigation-buttons.png) no-repeat; text-align: left}
	ul#mNav-buttons li {float: left; list-style-type: none}
	ul#mNav-buttons li a {height: 50px; display: block; text-indent: -9000px; outline: none}
	li#mNav-about-us a, li#mNav-events-and-news a, li#mNav-what-we-offer a, li#mNav-artist-opportunities a, li#mNav-membership-and-support a {background: url(../images/shell/navigation/green/navigation-buttons.png) no-repeat}

	li#mNav-about-us a {width: 108px; left: 7px; background-position: 0 0}
	li#mNav-about-us a:hover {background-position: 0 -50px}
	li#mNav-about-us a:active {background-position: 0 -100px}

	li#mNav-events-and-news a {width: 134px; left: 108px; background-position: -108px 0}
	li#mNav-events-and-news a:hover {background-position: -108px -50px}
	li#mNav-events-and-news a:active {background-position: -108px -100px}

	li#mNav-what-we-offer a {width: 138px; left: 242px; background-position: -242px 0}
	li#mNav-what-we-offer a:hover {background-position: -242px -50px}
	li#mNav-what-we-offer a:active {background-position: -242px -100px}
	
	li#mNav-artist-opportunities a {width: 172px; left: 380px; background-position: -380px 0}
	li#mNav-artist-opportunities a:hover {background-position: -380px -50px}
	li#mNav-artist-opportunities a:active {background-position: -380px -100px}
	
	li#mNav-membership-and-support a {width: 201px; left: 545px; background-position: -545px 0}
	li#mNav-membership-and-support a:hover {background-position: -545px -50px}
	li#mNav-membership-and-support a:active {background-position: -545px -100px}


/* ---[ middle-navigation dropdowndowns - based on "Son of Suckerfish" ]--------------------- */

	/* hides lists when not selected by positioning them off screen */
	ul#dropdown1, ul#dropdown2, ul#dropdown3, ul#dropdown4, ul#dropdown5 {position: absolute; left: -999em; z-index: 10}

	/* brings lists back on-screen and overrides the mNav list style */
	ul#dropdown1 li a, ul#dropdown2 li a, ul#dropdown3 li a, ul#dropdown4 li a, ul#dropdown5 li a {background: #bed61c; font-size: 11px; font-weight: bold; color: #fff; height: auto; width: 160px; padding: 7px 0; text-indent: 0; text-decoration: none; line-height: 1.25em; text-align: center}

	ul#dropdown1 {margin-left: 7px}

/*
	ul#dropdown1 {width: 108px; margin-left: 7px}
	ul#dropdown2 {width: 134px}
	ul#dropdown3 {width: 138px}
	ul#dropdown4 {width: 172px}
	ul#dropdown5 {width: 201px}
*/

	/* rollover style */
	ul#dropdown1 li a:hover, ul#dropdown2 li a:hover, ul#dropdown3 li a:hover, ul#dropdown4 li a:hover, ul#dropdown5 li a:hover {background: #f90; border-top: 2px solid #fff; border-bottom: 2px solid #fff}

	/* second-level lists */
	#mNav-buttons li ul {position: absolute; width: 160px; left: -999em}

	/* third-and-above-level lists */
	#mNav-buttons li ul ul {margin: -27px 0 0 160px}
	#mNav-buttons li ul ul.classes {margin: -27px 0 0 160px}
	#mNav-buttons li ul ul.classes a {padding: 7px 0}
	#mNav-buttons li:hover ul ul, #mNav-buttons li:hover ul ul ul, #mNav-buttons li.sfhover ul ul, #mNav-buttons li.sfhover ul ul ul {left: -999em}
	#mNav-buttons li:hover ul, #mNav-buttons li li:hover ul, #mNav-buttons li li li:hover ul, #mNav-buttons li.sfhover ul, #mNav-buttons li li.sfhover ul, #mNav-buttons li li li.sfhover ul {left: auto}

	/* javascript trigger */
	#mNav-buttons li:hover ul, #mNav-buttons li.sfhover ul {left: auto}


/* ---[ content structure ]--------------------- */
#content-area {margin: 0 auto; background: url(../images/shell/content-area/background.png) repeat-y; width: 746px; display: block; padding: 0 7px; behavior: url("iepngfix.htc")} 
#sandbox {text-align: left; padding: 7px;min-height:400px;}
#gallery{width:99%;margin:auto;}
#gallery img{max-width:140px;}

/* ---[ copyright area ]--------------------- */
#copyright-area {margin: 0 auto; background: url(../images/shell/content-area/background-footer.png) no-repeat; padding: 7px 0 0 7px; width: 753px; height: 10px; display: block; text-align: left; color: #666; font-size: 12px; behavior: url("iepngfix.htc")} 
#copyright-area a:link, #copyright-area a:visited {color: #666; text-decoration: none}
#copyright-area a:hover {color: #e14378; text-decoration: none}
#ADA {behavior: url("iepngfix.htc")}

#news_data {float:left;width:301px;}
#news_content {float:left;display:inline;clear:right;width:421px;margin:10px 0 0 10px;}
.news-box {margin:15px auto;width:90%px;height:121px;clear:right;}
.news-box-image {display:block;float:left;width:120px;}
.news-box-image img {max-width:120px;}
.news-quickview {display:inline;clear:none;float:left;min-width:550px;width:550px;margin-left:5px;}

.testimonial-box {margin:15px auto;width:90%px;clear:right;}
.testimonial-box-image {display:block;float:left;width:151px;}
.testimonial-quickview {display:inline;clear:none;float:left;min-width:550px;width:550px;margin-left:5px;}

/* ---[ content styles ]--------------------- */
/*
.class-list {width: 95%; margin: auto}
.class-list ul {width: 65%; margin: auto}
.class-list ul li {list-style-type: none; display: block; border: 1px dashed #f90; margin: .5em; padding: .5em; line-height:25px}
*/
hr.oline{font-size: 1px; border: 1px dashed #f90; margin: 10px 0}
hr.olineev{font-size: 1px; border: 1px dashed #f90; margin: 10px 0;width:95%;}

table.event-tickets{padding:3px;margin:5px;float:right;clear:both;border: 1px dashed #f90;}
	table.event-tickets td,table.event-tickets th {padding:3px;}

	#sandbox a {color: #069}
	#sandbox a:hover {color: #f90; text-decoration: underline}
	#sandbox p {padding: .35em 0; line-height: 1.5em}
	#sandbox .pdf {background: #fff url(../images/icons/pdf.png) no-repeat top left; padding: 1px 0 1px 21px; margin: .35em 0}
	#sandbox .arrow {background: #fff url(../images/icons/arrow.gif) no-repeat 0 10px; padding-left: 16px}
	#sandbox .hr {font-size: 1px; border-bottom: 1px dotted #000; margin: 10px 0}
	#sandbox .photoL {float: left; margin: 3px 8px 0 0}
	#sandbox .photoR {float: right; margin: 3px 0 0 10px}
	#sandbox .photoCaptionL {float: left; margin: 1em 8px 0 0; font-size: 75%; text-align: center}
	#sandbox .photoCaptionR {float: right; margin: 1em 0 0 8px; font-size: 75%; text-align: center}
	.border {border: 1px solid #ccc}
	.dotted-border {border: 2px dotted #ccc}

	#sandbox ul {padding: .35em 0 .35em 1em; line-height: 1.35em; list-style-type: none; text-align: left}
	#sandbox li {padding: .35em 0 .35em 1.15em; background: transparent url(../images/icons/square.gif) 0 .8em no-repeat}
	#sandbox li .arrow {padding: .35em 0 .35em 1em; background: transparent url(../images/icons/arrow.gif) 0 .4em no-repeat}

	.column1, .column2 {width: 350px; display: block; float: left; margin-right: 10px}
	.column2 {margin-right: 0}

	.column-one, .column-two, .column-three {width: 230px; display: block; float: left; margin: 0 9px 9px 0; text-align: center}
	.column-three {margin-right: 0}

	.rss-right {float: right; padding-right: 5px; display: block; clear: none}

/* ---[ heading styles ]--------------------- */
	h1 {font: normal 26px/1em Arial, Helvetica, sans-serif; color: #bed61c; padding: 0 0 .15em 0}
	h2 {font: normal 20px/1.25em Arial, Helvetica, sans-serif; color: #f90; padding: .35em 0}
	h3 {font: normal 18px/1.25em Arial, Helvetica, sans-serif; color: #f90; padding: .35em 0}
	h4 {font: bold 15px/1.25em Arial, Helvetica, sans-serif; color: #e50278; padding: .35em 0}

/* ---[ colors ]--------------------- */
.black {color: #000 !Important}
.blue {color: #069 !Important}
.green {color: #bed61c !Important}
.grey {color: #666 !Important}
.orange {color: #f90 !Important}
.pink {color: #e50278 !Important}
.purple {color: #609 !Important}
.teal {color: #066 !Important}
.white {color: #fff !Important}
.yellow {color: #fff200 !Important}


/* ---[ Calendar styles ]--------------------- */
#calendar {display: block;}
	table.grid {margin: auto; width: 700px}
	
	table.grid th, table.grid td {width: 100px; border: 1px solid #ccc}
	table.grid th {background-color: #c96; color: #fff}
	
	table.grid th.cal_top {background: #bed61c; font-size: 16px; line-height: 16px;height: 16px; width:700px;}
	.grid-left{float:left;display:inline;text-align:left;width:171px;padding-left:5px;}
	.grid-center{float:left;display:inline;text-align:center;width:342px;}
	.grid-right{float:right;display:inline;width:170px;text-align:right;padding-right:5px;}
	table.grid th.days_of_week {background-color: #f90; color: #fff; font-size: 14px; padding: 6px 0; text-align: center; font-weight: bold}

	table.grid td {height:80px;font: normal .8em/.8em Arial, Calibri, Helvetica, sans-serif; color: #333;}
	table.grid td a {color: #000 !Important}
	table.centered td {text-align: left}
	table.grid td.day {background-color: #f3f3f3}
	.detail_of_day {margin-top:5px;}
	.detail_of_day a {text-decoration: none;}
	#event-ajax{width:95%;margin:auto;}
	.event-listing{width:95px;min-height:20px;margin:auto;padding:3px;}
	ol.color-box{list-style-type:none;display:inline;height:15px;margin:5px;padding:5px;text-align:left;}
	#color-chart{display:block;margin:5px auto 10px 0;text-align:center;}
	
/*--------------[MODAL WINDOW Settings] ---------------*/
.modalDialog_transparentDivs{filter:alpha(opacity=40);opacity:.3;background-color:#aaa;z-index:2;position:absolute;z-index:10000000000000790;}
.modalDialog_contentDiv{padding:0;z-index:10000000000000990;position:absolute;background:#fff;overflow:auto;}
.modalDialog_contentDiv_shadow{z-index:10000000000000090;position:absolute;filter:alpha(opacity=40);opacity:.3;}
.closeMessage{text-align:center;bottom:100%;}
.closeMessage a{text-decoration: none;color: #bed61c !Important}

/*--------------[DHTML WINDOW Settings] ---------------*/
.dhtmlwindow{position: absolute;border: 2px solid #2B4613;visibility: hidden;background-color: #bed61c;}
.drag-handle{padding: 1px;text-indent: 3px;font: bold 14px Arial;background-color: #bed61c;color: #000;cursor: move;overflow: hidden;width: auto;}
.drag-handle .drag-controls{position: absolute;right: 1px;top: 2px;cursor: hand;cursor: pointer;}
.drag-contentarea{border-top: 1px solid 1D508F;background-color: white;color: black;height: 150px;padding: 2px;overflow: auto;}
.drag-contentarea a:hover{color:#75ABBF;}
.drag-statusarea{border-top: 1px solid 2B4613;background-color: #bed61c;height: 13px;}
.drag-resizearea{float: right;width: 13px;height: 13px;cursor: nw-resize;font-size: 0;}

/*--------------[Shopping Cart Settings] ---------------*/
table.shopping-cart{width:100%;margin-top:25px;padding:0;}
	table.shopping-cart th{font-weight:bold;text-align:center;padding:0;margin:0;}
	table.shopping-cart td{padding-left:5px;text-align:center;}
	table.shopping-cart td.desc{text-align:left;}
	table.shopping-cart td.remove a{font-weight:bold;text-align:center;color:#f00;}
	table.shopping-cart tr.color td{background:#f3f3f3 ;}
	table.shopping-cart tr.break_level{height:5px;}
	table.shopping-cart td.break_down{border-bottom: 1px solid #bed61c;height:5px;}
#perkins-cart {float:right;font-weight:normal;text-align:center;color:#fff;margin:10px 5px 0;line-height:15px;height:15px;}
#perkins-cart img {vertical-align:middle;}
#perkins-cart a {text-decoration:none;color:#fff;}
#perkins-cart a:hover {text-decoration:none;color:#F071B3;}
table.admin-shopping-cart td {vertical-align:text-top;}
table.admin-shopping-cart th {text-align:left;}

table.donatenow{width:580px;margin:auto}
/* ---[ gift cards styles ]--------------------- */
.gift-cards{padding: 10px; margin: 1em; display: block; border: 1px dashed #f90;}
	.gift-cards img{float: left; vertical-align:text-top;padding:0 10px 0 0;}
	
/* ---[ class styles ]--------------------- */
.class {padding: 10px; margin: 1em; display: block; border: 1px dashed #f90}
	.indent {padding-left: .45em}
	.classTitle {font: normal 1.45em/1em Verdana, Helvetica, sans-serif; display: block; color: #069}
	.classAge {color: #f90; font-weight: bold; padding: .35em 0}
	.classDescription {padding-bottom: .7em}
	.classArrow {font-size: 1.4em; color: #ccc; padding-right: .15em}
	.classDataTitle {color: #069; padding-right: .25em; font-weight: bold}
	.classColumn1, .classColumn2, .classColumn3 {float: left; min-height: 110px}
	.classColumn2 {border-left: 1px dashed #f90; margin-left: 1.25em; padding-left: 1.25em}
	.classColumn3 {border-left: 1px dashed #f90; margin-left: .65em; padding-left: .65em}
	.classColumn4 {border-left: none; margin-left: 1.25em; padding-left: 1.25em}
	.classNotes {clear: both;margin-top: .55em; padding-top: .55em}
.dot {padding: 0 .5em}
.class-button {}
.card-class {padding:0 10px; margin: 1em; display: block; border: 1px dashed #f90}
.req {color: #f90}
table.ccard{padding:0;}
table.ccard td{text-align:left;vertical-align:top;padding:0 5px 0 5px}

#card-process {display:none;padding:0 10px; margin: 1em; border: 1px dashed #f90;height:250px;}