/*  
Theme Name: quire2
Theme URI: http://www.quirecleveland.org/
Version: 2.0
Author: David Simmons-Duffin
*/

/*
thanks to: redsilwp
Author: John Boardley
*/

* { margin: 0; padding: 0; }
html, body { background: #fff; color: #333; text-align: center; } 
body{
    font-family: Georgia, "Times New Roman", Times, serif;
    font-size: 14px;
    font-weight: normal;
}

h1,h2,h3,h4,h5 { font-weight: normal; }

h1 { 
    text-align: left;
    text-transform: lowercase;
    font-style: italic;
    font-size: 18px;
    padding-top: 3px;
    padding-bottom: 2px;
    margin-bottom: 30px;
    color: #888;
    padding-left: 44px;
    background: url(img/section-fl.gif) left 0px no-repeat;
}
h2 {
    font-size: 24px;
    text-align: center;
    width: 100%;
    display: block;
    color: #333;
    margin-bottom: 3px;
    margin-top: 4px;
    line-height: 30px;
}
h2 a:hover { color: #c00; }

h3 {
    font-size: 16px;
    color: #c00;
    font-family: "XXXXXXXXX", "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", helvetica, sans-serif;
}

a { color: #333; text-decoration: none; }
a:hover { color: #c00; }

sub { font-size: .8em; vertical-align: baseline; line-height: 0; }
sup { font-size: .8em; vertical-align: super;    line-height: 0; }

hr { 
    border: none;
    border-bottom: 1px solid #e2e2e2;
    height: 1px;
    margin-bottom: 40px;
    margin-top: 32px;
}

#wrap {
    text-align:left;
    width:957px;
    margin: 0 auto 20px;
}

#nav { 
    width: 993px;
    height: 138px;
    margin-left: -12px;
    margin-bottom: 35px;
    list-style-type: none;
}
#nav li { float: left; }
#nav a { 
    background: url(img/header.gif) no-repeat;
    height: 138px;
    display: block;
    text-indent: -999px;
    overflow: hidden;
}
#nav li#about a { width: 597px; background-position: 0 0; }
#nav li#singers a { width: 120px;  background-position: -597px 0; }
#nav li#listen a { width: 112px; background-position: -717px 0; }
#nav li#concerts a { width: 164px; background-position: -829px 0; }
#nav li#about.current a { background-position: 0 -138px; }
#nav li#about a:hover { background-position: 0 -276px; }
#nav li#singers.current a { background-position: -597px -138px; }
#nav li#singers a:hover { background-position: -597px -276px; }
#nav li#listen.current a { background-position: -717px -138px; }
#nav li#listen a:hover { background-position: -717px -276px; }
#nav li#concerts.current a { background-position: -829px -138px; }
#nav li#concerts a:hover { background-position: -829px -276px; }


#content {
    width: 935px;
    margin-left: 8px;
}
#main{
    float:left;
    width:520px;
    margin: 0;
    padding-top: 10px;
}

h1 #searchform input {
    font-size: 18px;
    border: none;
    border-bottom: 2px dotted #ccc;
}
fieldset { border: none; }

#sidebar {
    color:#666;
    float:right;
    width: 377px;
    line-height:1.3em;
    margin: 0;
    padding: 10px;
    padding-right: 0px;
    padding-top: 0px;
}

#sidebar img.group-pic {
    border: 1px solid #ccc;
    margin-bottom: 20px;
    width: 375px;
    height: 250px;
}

#sidebar ul { list-style: none; }

#sidebar #searchform { 
    margin-bottom: 20px;
    margin-left: 5px;
}

#biglinks { margin-bottom: 19px; }
#biglinks strong {
    display: inline;
    font-size: 18px;
    font-weight: normal;
}
#biglinks ul li { 
    padding: 9px 0px 8px 0px;
    line-height: 20px;
    overflow: hidden;
    font-weight: lighter;
    border-bottom: 1px solid #e2e2e2;
}

#biglinks small { color: #888; font-size: 14px; }
#biglinks a:hover small .more { color: #c00; }
#biglinks a small .more {
    color: #333;
    border-bottom: 1px dotted gray;
}
#biglinks ul li.last { border-bottom: none; }

#biglinks form input.submit { 
    font: 18px Georgia;
    color: #333;
    background-color: #fff;
    border: none;
}
#biglinks form input.submit:hover { 
    color: #c00;
    cursor: pointer; cursor: hand;
}

#links {
    color:#4E4E30;
    float:right;
    width:150px;
    line-height:1.3em;
    margin-top: 5px;
    margin-right: 10px;
    margin-bottom: 0;
}
#links ul { margin:3px 0 19px 5px; }
#links h3 {
    margin-left: 5px;
    color: #c00;
}
#links h3 a { color: #c00; }
#links ul li {
    font-size: 11px;
    font-family: "XXXXXXXXX", "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", helvetica, sans-serif;
    line-height: 20px;
    margin: 0 0 -1px 0;
    padding: 0;
}
#links ul li a {
    display: block;
    color: #444;
    border-bottom: 1px solid #e2e2e2;
}
#links ul li a:hover { color: #c00; }

#links { 
}

#quotes {
    background: black url(img/acclaim.gif) 0 0 no-repeat;
    float:left;
    width:160px;
    margin: 7px 7px 0 1px;
    padding: 15px; 
    padding-top: 47px;
    font-size: 1.1em;
    line-height:1.4em;
    text-decoration: none;
    color:#f4f4f4;
}
#quotes h2 { display: none; }
#quotes blockquote { 
    font-style: italic;
    border-top: 1px dotted #444;
    padding-top: .7em;
}
#quotes a { display: block; }
#quotes cite { 
    font-style: normal;
    display: block;
    text-align: right;
    font-family: "XXXXXXXXX", "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", helvetica, sans-serif!important;
    font-weight: lighter;
    font-size: 11px;
    line-height: 1.3em; 
    color: #aaa;
    padding-top: 1em;
    padding-bottom: 1.5em;
}
#quotes a span { 
    border-bottom: 1px dotted gray;
    font-size: .8em;
    text-transform: none;
    color: #aaa;
}
#quotes a { color: #f4f4f4; }
#quotes a:hover span { color: #b22; border-bottom: 1px dotted #b22; }

.post { margin:0 0 52px 0; }

.entry {
    line-height: 20px;
}
.entry h3 {
    line-height: 20px;
    margin: 11px 0 9px 0;
}
.entry p { margin: 0 0 10px 0; }
.entry a {
    text-decoration: none;
    border-bottom: 1px dotted gray;
}

#main>blockquote {
    padding-top: 2px;
    margin-top: 10px;
    padding-left: 35px;
    margin-left: -20px;
    margin-bottom: 40px;
    font-size: 18px;
    line-height: 25px;
    font-style: italic;
    background: url(img/left-brace.gif) left 3px no-repeat;
}
#main>blockquote .more {
    font-size: 14px;
    color: #888;
}
#main>blockquote cite { 
    display: block;
    text-align: right;
    font-size: 11px;
    font-style: normal;
    font-family: "XXXXXXXXX", "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", helvetica, sans-serif;
    color: #888;
}
#main>blockquote a { display: block;
    padding-left: 20px;
    margin-left: -20px;
}
#main>blockquote a:hover {
    color: #222;
}
#main>blockquote a:hover .more { color: #c00; }

.entry ul { margin:0 2.5em 0; }
.entry ul li { margin-bottom:7px; }
.entry ol { margin:0 1em 0 3em; }
.entry ol li { margin:0 0 7px 0; }
.entry img, .entry a img {
    border: 1px solid #ddd;
    text-decoration: none!important;
}
.noborder{ border: none!important; }

.entry h4.byline+p:first-letter,
.entry p.lead:first-letter { 
    color:#c00;
    display:inline;
    float:left;
    font-size:4.2em;
    line-height:0.8em;
    text-transform:uppercase;
    margin:0.07em 0.09em 0pt 0pt;
}

.entry p.lead:first-line,
.entry h4.byline+p:first-line { 
    font-size: 110%;
    letter-spacing: 1px;
    font-variant: small-caps;
}

.bio .meta { 
    overflow: hidden;
    border-top: 1px solid #eee;
    padding-top: 5px;
    line-height: 20px;
    margin-bottom: 5px;
}
.bio .meta dt { float: left; }
.bio .meta dd { float: right; }
.bio .meta dd a { color: #666; }
.bio .meta a:hover { color: #c00; }


.post.bio { margin-bottom: 25px; }
.bio .entry strong,
.bio .entry b {
    color: #c00;
    font-family: "XXXXXXXXX", "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", helvetica, sans-serif;
    font-weight: normal;
}
.bio .entry img.bio-pic { 
    width: 100px;
    float: left;
    margin: 3pt 10px 4px 0;
}

p.concert-info { 
    font-size: 1.2em;
    line-height: 1.5em;
    padding-left: 60px;
    background: url(img/par-fleuron.gif) 20px 15px no-repeat;
}

.more-link { margin-top: 10px; }

.comm-count { 
    padding-left: 25px;
    background: url(img/speechbubble.gif) 1px 2px no-repeat;
}

.byline,
.bio .meta { 
    font-family: "XXXXXXXXX", "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", helvetica, sans-serif;
    font-size: 10px;
    font-weight: lighter;
    font-variant: normal;
    font-style: normal;
    text-transform: uppercase;
    color: #666666;
    letter-spacing: 0.3em;
}
.byline {
    width: 520px;
    text-align: center;
    display: block;
    background-image: url(img/qbyline.gif);
    background-repeat: no-repeat;
    background-position: center bottom;
    margin-top: 0px;
    margin-bottom: 11px;
    padding-bottom: 22px;
}

.amp {  
    font-family:Baskerville,"Goudy Old Style","Palatino","Book Antiqua",serif;
    font-size:110%;
    font-style:italic;
    line-height: 0;
}

/* style comments and inputs */
#comments h3 { margin-bottom:20px; }
#comments h3 small { 
    font-size: 12px;
    color: #666;
    margin-bottom: 30px;
}
#comments h3 small a { }
#comments { margin-bottom: 40px; }
#comments ol {
    font-size: 18px;
    color: #aaa;
    font-style: italic;
}
#comments li { margin-bottom: 20px; }
#comments dl { 
    line-height: 20px;
    font-size: 14px;
    font-style: normal;
    color: #222
}
#comments cite { font-size: 15px; color: #222; }
#comments dt.author {
    text-transform: none;
    letter-spacing: 0;
    font: 14px Georgia, serif;
}
#comments dt.author a { color: #222; }
#comments dt { 
    font: 11px "XXXXXXXXX", "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", helvetica, sans-serif;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #777;
    padding-top: 2px;
}
#comments dt a { color: #777; }
#comments dt a:hover { color: #c00; }
#comments dd { margin-top: 10px; }
#comments dd p { margin-bottom: 10px; }

#respond h3{ 
    float: left;
    background: url(img/comments.gif) right top no-repeat;
    padding-bottom: 10px;
    padding-top:15px;
    padding-right: 80px;
    margin-bottom: 20px;
}
#respond {
    overflow: hidden;
}
/* edit post link */
#respond small {
    float: right;
    color: #ccc;
    font: 11px "XXXXXXXXX", "Lucida Grande", "Lucida Sans", "Lucida Sans Unicde", helvetica, sans-serif;
    margin-top: 20px;
    padding-right: 10px;
}

#commentform p { margin-bottom: 5px; }
#commentform p a{ border-bottom: 1px dotted gray; }
#commentform label { 
    font: 11px "XXXXXXXXX", "Lucida Grande", "Lucida Sans", "Lucida Sans Unicde", helvetica, sans-serif;
    color: #888;
    padding-left: 5px;
}
#author,
#email,
#url,
#comment{
    border:1px solid #ccc;
    padding:2px;
    font-family: "XXXXXXXXX", "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", helvetica, sans-serif;
    font-size: 1.1em;
}
#comment{ width: 500px; overflow:auto; margin-top: 10px;}
#commentform p small { font-size:10px;color:#7F7F7F; }

#footer { 
    width: 960px;
    margin: 0 auto;
    padding: 40px 0 20px 10px;
    overflow: hidden;
    color: #888;
    font-size: 12px;
    font-style: italic;
    line-height: 15px;
}   
#footer a {
    font-style: normal;
    font-size: 1.1em;
}
#footer p { 
    width: 300px;
    margin-right: 30px;
    float: left;
}
#footer p.last{ margin-right: 0; }
#footer a.wordpress { 
    font-variant: small-caps;
}

img#wpstats { width: 0px; height: 0px; overflow: hidden; }

/* float clearing: http://www.positioniseverything.net/easyclearing.html */
#nav, #content, #main, .entry { display:block; }
* html #nav, * html #content, * html #main, * html .entry { height:1%; }
#nav, #content, #main, .entry { display:inline-block; }
#nav:after, #content:after, #main:after, .entry:after
{ content:".";display:block;height:0;clear:both;visibility:hidden;}

.hide { display: none; }
.clear{ clear:both;}
.left{ float:left;}
.right{ float:right;}
.floatright{ float:right;margin:3px 0 0 7px;}
.floatleft{ float:left;margin:3px 7px 0 0;}

.alignleft   {  float: left;  margin: 3px 15px 5px 0; }
.alignright  {  float: right; margin: 3px 0 5px 15px; }
.aligncenter {  display: block; text-align: center; margin: 15px auto; }
img.noborder {  padding: 0; border: none; }

.entry .wp-caption .wp-caption-text { 
    text-align: center;
    color: #666;
    margin-top: 5px;
    padding-left: 5%;
    padding-right: 5%;
    line-height: 15px;
    font-size: 11px;
    font-family: "XXXXXXXXX", "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", helvetica, sans-serif;
}

.entry .wp-caption a { border: none; background: none; }

.wp-pagenavi span,
.wp-pagenavi a { 
    border-bottom: 1px solid #aaa;
    color: #c00;
    padding-left: 5px;
    padding-right: 5px;
    padding-bottom: 2px;
    padding-top: 2px;
}

div.wp-pagenavi { 
    margin-bottom: 30px;
}

.wp-pagenavi a:hover,
.wp-pagenavi span.current { 
    background-color: #eee;
    border-bottom-color: #bbb;
}
    
    
.wp-pagenavi span.pages,
.wp-pagenavi span.extend { 
    font-style: italic;
    font-size: 12px;
    text-transform: lowercase;
    color: #666;
    border: none;
}
.wp-pagenavi span.pages {  margin-right: 5px; }
.wp-pagenavi span.current {  color: #444; }

.entry .footnotes { 
    margin-top: 33px;
    margin-left: 0;
    line-height: 15px;
    font-size: 11px;
    font-family: "XXXXXXXXX", "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", helvetica, sans-serif;
    color: #666;
}

.entry .footnotes li { 
    margin-bottom: 5px;
}

.entry .audioplayer_container { 
    height: 30px;
    margin-bottom: 10px;
    padding-left: 15px;
}
.entry p.info { 
    font-size: 12px;
    font-style: italic;
    color: #666;
    padding: 0 25px 0 15px;
}
.entry .audioplayer_container+.info { 
    margin-top: -10px;
}

/* =================== Listen =================== */

.videoplayer { 
    margin: 20px 0;
}

.videoplayer object { 
    display: block;
    margin: 0 auto;
}

.entry .videolist { 
    margin-left: 2em;
    margin-bottom: 16px;
    margin-top: 17px;
}

.entry .videolist li { 
    margin-bottom: 3px;
}

.videolist li a { 
    font-size: 16px;
    border: none;
    display: block;
    padding: 3px 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

.videolist li a#quire-vp1-current,
.videolist li a#quire-vp2-current { 
    background: #ddd;
}

.videolist li i { 
    float: right;
    font-size: 14px;
}

.videolist li small { 
    font-size: 12px;
    color: #777;
}

form ul, form li { margin: 0!important; }
form li { 
    list-style-type: none;
    overflow: hidden;
    padding: 2px;
}
form ul input, form ul textarea { 
    padding: 2px;
    font: 14px "XXXXXXXXX", "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", helvetica, sans-serif;
    border: 1px solid #ccc;
    width: 280px;
    margin-right: 5px;
}
form p.submit { padding-left: 115px; }
form ul label { 
    float: left;
    width: 100px;
    margin-right: 15px;
    text-align: right;
}

form ul small { 
    font-size: 11px;
    font-family: "XXXXXXXXX", "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", helvetica, sans-serif;
    color: #888;
}

.wpcf7-response-output {
    margin-left: 116px;
    margin-top: 20px;
    padding: 3px;
    width: 278px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

.wpcf7-mail-sent-ok { border: 2px solid #5c5; background: #cfc; }
.wpcf7-mail-sent-ng { border: 2px solid #f8f; background: #fbb; }
.wpcf7-spam-blocked { border: 2px solid #fb4; background: #fec }
.wpcf7-validation-errors { border: 2px solid #fd2; background: #ffd; }

.wpcf7-form-control-wrap { position: relative; }

.wpcf7-not-valid-tip {
    position: absolute;
    left: 0;
    z-index: 100;
    width: 280px;
    padding: 2px;
    font: 14px "XXXXXXXXX", "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", helvetica, sans-serif;
    border: 1px solid #f00;
    background: #fbb;
}

.wpcf7-not-valid-tip-no-ajax {
    color: #f00;
    font-size: 10pt;
    display: block;
}

.wpcf7-display-none { display: none; }

/* always show fancybox navigation */
a#fancy_left  span {  left:  0px!important; }
a#fancy_right span {  right: 0px!important; }
a#fancy_right, a#fancy_left {  visibility: visible!important; }

a { outline: none; }

.ad img {
    border: none;
    width: 150px;
    height: 150px;
    margin-bottom: 3px;
}
.ad { 
    line-height: 20px;
    font-family: "XXXXXXXXX", "Lucida Grande", "Lucida Sans", "Lucida Sans Unicode", helvetica, sans-serif;
    font-size: 11px;
    text-align: center;
    display: block;
    margin-top: 1px;
    margin-bottom: 19px;
}

#page-home { 
/*    margin-left: -20px;*/
}
#page-home .entry {
    background: url(img/bigQ.gif) no-repeat;
    padding-left: 200px;
    padding-bottom: 20px;
    padding-top: 10px;
}
#page-home p:first-letter { 
    float: left;
    width: 0;
    color: #fff;
}
#page-home p:first-line { 
    font-variant: small-caps;
    font-size: 110%;
    letter-spacing: 1px;
}

#page-bios { 
    margin-bottom: 20px;
}
#page-bios .entry { 
    background: url(img/qbyline.gif) center top no-repeat;
    padding-top: 30px;
}

#page-bios .lead:first-letter { 
    color: #222;
}

#roster { 
    overflow: hidden;
    line-height: 20px;
    margin-bottom: 30px;
    margin-left: -20px;
   /* background: url(img/roster.gif) 0 60px no-repeat; */
    background: url(img/roster.gif) 0 20px no-repeat;
}
#roster p { 
    margin-bottom: 20px;
    padding-left: 20px;
}
#roster a { font-style: italic; }
#roster ul+p { 
    text-align: right;
    padding-right: 30px;
}
#roster ul { 
    list-style-type: none;
    overflow: hidden;
    margin-bottom: 20px;
    padding-left: 120px;
}
#roster li { 
    width: 190px;
    float: left;
}
#roster dt { 
    font-variant: small-caps;
    font-size: 18px;
    margin-bottom: 4px;
}
#roster dt a { font-style: normal; }

.entry .concert-buttons { 
    list-style-type: none;
    overflow: hidden;
    padding: 0;
    margin: 15px 0;
}
.entry .concert-buttons li { margin: 0;  padding: 0; }
.entry .concert-buttons li a { 
    float: left;
    height: 77px;
    text-indent: -999px;
    background: url(img/concert-buttons-carols.gif) no-repeat;
    text-decoration: none;
    border-left: 1px solid #ccc;
    border-bottom: none;
}

.concert-buttons #tickets a { width: 93px; background-position: -5px 0px; border-left: none; }
.concert-buttons #map     a { width: 98px; background-position: -98px 0px; }
.concert-buttons #contact a { width: 98px; background-position: -196px 0px; }
.concert-buttons #thanks  a { width: 221px; background-position: -303px 0px; }
.concert-buttons #tickets a:hover { background-position: -5px -87px; }
.concert-buttons #map     a:hover { background-position: -98px -87px; }
.concert-buttons #contact a:hover { background-position: -196px -87px; }
.concert-buttons #thanks  a:hover { background-position: -303px -87px; }
