/*CCBot/1.0 (+http://www.commoncrawl.org/bot.html)*/
* { box-sizing: border-box; margin: 0; padding: 0; vertical-align: baseline;}
body { font-size: 10px; text-align: center; font-family: "Liberation Sans", Helvetica, Arial, sans-serif !important; text-align: left}

div#header {  position: fixed; top: 0ex; font-size: 2em;  padding: 0; margin: 0; background-color: rgba(255,255,255,0.8);  background-image: url(http://www.coreymwamba.co.uk/bgimg/cmwalk.jpg);background-repeat: no-repeat; background-size: 100%;background-position: 0% 0%; z-index: 1000;}
#header h1 {color: #000; background-color: rgba(255,255,255,0.6); height: 100%;}
#header > #about {font-size: 0.72em;  margin-top: -7em; margin-left: 1em; font-weight: 700;}
div#marginalia  {  width: 30%; float: left; margin-left: 3.4em; font-size: 1.6em;  padding: 0.7ex; min-height: 20em;}
div#content {width: 50%; 
min-height: 20em; 
font-size: 1.75em; 
float: left; 
padding: 0.8ex; 
margin-left: 0.3em; 
line-height: 145%;}
@media all and (color) {
div#header {height: 8em;  width: 100%; }
div#content {margin-top: 13em;width: 55%;  }
div#marginalia  {margin-top: 13em; width: 34%;}
#header > #about {}
}

div#footer { border-top: 2px solid #993206; width: 99.5%; font-size: 1.2em; text-align: left; padding: 0.5em; font-weight: 700; float: left; height: 3em;}
ul#menu { position: fixed; top: 7.2em; width: 100%; font-size: 1.9em; text-align: center; vertical-align: middle; background-color: rgba(240,240,240,0.6); border-bottom: 4px solid #ddd; height: auto; z-index: 2000}
a:link, a:visited { color: #993206;}
a:hover {color: #fff; background-color: #993206; }
hr { margin: 1.8ex auto; }
#header h1 > a:link, #header h1 > a:visited {color: #a80303; text-decoration: none;  }
#header h1 > a:hover {color: #000; background-color: transparent; }
#marginalia * {font-size: 0.95em;}
.more {text-align: right;}
.lastfm { width: 48px; content: url(http://www.coreymwamba.co.uk/styles/icons/lastfm.png); margin-right: 6px; vertical-align: middle; }
.twitter { width: 48px; content: url(http://www.coreymwamba.co.uk/styles/icons/twitter.png); margin-right: 6px; vertical-align: middle;  }
.facebook {  width: 48px; content: url(http://www.coreymwamba.co.uk/styles/icons/facebook.png); margin-right: 6px; vertical-align: middle; }
.bandcamp {width: 48px; content: url(http://www.coreymwamba.co.uk/styles/icons/bc.png);vertical-align: middle;}
.soundcloud { width: 48px; content: url(http://www.coreymwamba.co.uk/styles/icons/soundcloud.png); margin-right: 6px; vertical-align: middle;}
.jazzservices { width: 48px; content: url(http://www.coreymwamba.co.uk/styles/icons/js.png); margin-right: 4px; vertical-align: middle;}
.createculture { width: 48px; content: url(http://www.coreymwamba.co.uk/styles/icons/ccult.png); margin-right: 3px; vertical-align: middle; }
.myspace { width: 48px; content: url(http://www.coreymwamba.co.uk/styles/icons/myspace.png); vertical-align: middle; }
#marginalia iframe {text-align: center; z-index: -10}


label { display: block;}




dt, h2 {color: #888; font-variant: small-caps;}
h2 {font-size: 225%; margin-bottom: 0.3em; line-height: 1.05}
h3 {font-size: 125%; margin-bottom: 0.3em;}

ul#menu li {display: inline;  margin: 0.5ex; text-align: center; font-weight: 700;font-variant: small-caps; }
ul#menu li a {text-decoration: none;}
#marginalia ul {list-style-type: none;}
#marginalia ul li {margin-bottom: 6px;}
#marginalia:hover .comment {display: block; font-size: 9px; background-color: #ddd; border: 1px dotted; padding: 2em; max-width: 180px; position: absolute;  opacity: 0.7; left: 80%; top: 6em;}
dl#links {width: 18em; margin: 1em auto; }
dl#links dd a:link, dd a:visited {text-decoration: none;}
dl#links dd { display: inline-block; padding: 3px; text-align: center}

blockquote p cite { display: block; text-align: right;}



/*microformats*/
.value {visibility: hidden; font-size: 0px; height: 0; width: 0; opacity: 0;}
.vcard {font-size: 1.2em !important;}
.adr span {display: block;}


/* GIGS */
table.gigs { 
margin: 1em auto;
width: 80%;

border-collapse: collapse;
}
tr {
padding: 2em;
border-bottom: 1px solid #aaa;
}

thead tr > th { 
color: #250;
font-weight: 400;
font-size: 1.3em;
text-align: center;
/* border-bottom: 4px solid #520;*/
vertical-align: top;
}
td.det { 
vertical-align: top;
width: 40%;
}
td.det > span {
font-size: 1.1em;
}

td.ve {
font-size: 0.8em;
}

td.pr { 
text-align: center;
font-size: 1em;
color: #520;
font-weight: 700;
width: 5em;
}
th.da { 
font-weight: 700;
font-size: 1.1em;
color: #000;
text-align: left;
width: 8em;
border: 0px solid;
padding-left: 1ex;

}
td { 
padding: 4px;
}



/* categories */
th.gig_solo { border-left: 4px solid #090;}
th.gig_ag { border-left: 4px solid #009;}
th.gig_dae { border-left: 4px solid #900;}
th.gig_trio { border-left: 4px solid #990;}
th.gig_oth { border-left: 4px solid #000;}
th.gig_lyd { border-left: 4px solid #909;}
th.gig_rm { border-left: 4px solid #0c0;}
th.gig_or { border-left: 4px solid #cc0;}





/*SHOP*/

ul.shop { font-size: 0.8em; width: 100%; margin-left: 0em !important; }
ul.shop li {display: inline-block; width: 30%; padding: 0px; margin: 6px 3px; }
.photo {width: 100%; border: 2px solid #ddd; padding: 2px}
ul.shop li > a:link, ul.shop li > a:visited {text-decoration: none; background-color: transparent;}
ul.shop li > a:hover { background-color: transparent; color: #993206; }
ul.shop li > h3 {margin-bottom: 3px; font-size: 0.8em; text-align: center}
ul.shop li > p {background-color: #ccc; position: relative; bottom: 0px; padding: 0 !important; margin: 0 !important; font-size: 1em; font-weight: 700}





table.shop { border-spacing: 10px; }
table.shop thead {display: none;}
.thumb img {width: 170px;}
.photo img { width: 90px; border: 2px solid #223300}
tr.haudio .desc {font-size: 0.8em; width: 18em; }
tr.haudio .fn {font-size:1em; font-weight: 700; line-height: 1.1; text-decoration: none;}
tr.haudio a {text-decoration: none;}
tr.haudio .photo {width: 100px;  vertical-align: top;}
tr.haudio .price {font-size: 0.7em; font-weight:700; width: 20em;}


#cart > table, #mail_ord > table { border-spacing: 1px; border-collapse: collapse; height: auto; margin-bottom: 1ex;}
#mail_ord > table {font-size: 1em !important; width: 80%; margin: 1em auto;}
#cart table > tr, #mail_ord table > tr {height: auto; }
#cart table > tr > th[headers="item"] {width: 12em; font-size: 1em;}
#cart table > tr > th[headers="rem"] {width: 4em; font-size: 1.3em;}
td[headers="adesc"] {font-size: 0.9em;}
#cart table tr > th, #mail_ord table tr > th  {text-align: left; font-weight: 400; vertical-align: middle; padding-left: 1ex;}
#cart table tr > td, #mail_ord table tr > td { vertical-align: middle; padding: 1.5ex;}
.addbut, .rembut {text-decoration: none; font-size: 1.8em; font-weight: 700}
td > input[id^="qty"] { width: 2em;}

#cart input[type=submit] { margin: 1ex 1ex 3ex 1ex;}

#mail_ord input[type=text], #mail_ord label {margin: 1ex auto; display: block;} 
#mail_ord input[type=text] {font-size: 1.2em;}
label {color: #888; font-weight: 700; margin-bottom: 0.6ex}

.lipo {
border-bottom: 2px solid #000;
background-color: #280;

color: #fff;
}

.lito {
border-bottom: 2px solid #000;
font-size: 1.6em !important;
}
.ccbadge {width: 200px}

/*BLOG*/
.articles {list-style-type: none;}
#content p, #content > ol, #content > ul, #content > blockquote {margin: 1.2ex 2ex;}
#content > blockquote { border-left: 4px solid #a80303; font-size: 0.9em; width: 80%; margin: 1ex auto; background-color: #f6f6f6}

#content > blockquote > ul, #content > blockquote > ol { list-style-position: inside; margin-left: 1em}

.note {border: 3px solid #ccc; background-color: #ddd; width: 80%; font-size: 1em; margin: 1.3em auto; padding: 1em;}  


/*IMAGES*/
div.thumb {display: inline-block; width: 200px; margin: 0px 2px; text-align: center; vertical-align: top;}
div.thumb a {width: 200px; font-size: 0.4em}
div.thumb img {width:200px; }


/*COMMENTS*/
#comments {border-top: 1px solid #f30;margin: 4em auto; width: 80%;}
#comments blockquote {font-size: 1.1em; padding: 8px; font-style: normal; border-bottom: 3px dotted #ccc}
#comments blockquote:nth-of-type(odd) {background-color: #eee;}
#comments blockquote:last-of-type {border-bottom: 0px} 
blockquote:target:before {content: "<"; float: right;  left: 108px; position: relative; font-size: 128px; margin: 0; padding: 0; width: 72px;}
#comments blockquote h3 {font-size: 1em;}
#comments blockquote h3 address {display: inline; }
#comments blockquote h3 address + span {display: block; font-size: 0.8em;}
#comments .reply {text-align: right;}
#comments p {font-size: 0.85em;}
#comments h2 > .rss_sr {font-size: 0.5em;} 

/*CONTACT FORM*/
#contactform fieldset{border: 0;}
legend {display: none;}
#contactform input[type=submit] {font-size: 1.3em;}
#email, #mess, #subj, #nom {width: 100%; font-size: 1.1em; margin: 1ex auto;}
.err {background-color: #fff !important; width: 80%; }
.exa {border-color: #280; text-align: center !important; font-weight: 900; width: 65% !important; }


/*SIGN-IN*/

form#oidform, form#emailform {margin: 1em auto; font-size: 0.8em;}
form > fieldset {border: 0}
#signin:target + p#status #draw, #emailform:target + p#status #draw, #oidform:target + p#status #draw, p#status #dismiss {display: none}
#signin:target + p#status #dismiss, #emailform:target + p#status #dismiss, #oidform:target + p#status #dismiss {display: inline; }
#type {margin: 0 auto;}
#type > #send { text-align: left; float: right; font-size: 1.3em; }
#mark-box {text-align: left; border: 3px solid black; padding: 1ex; background-color: rgba(250, 270, 250, 0.85);margin: 4em auto; font-size: 0.8em; width: 20em;}

#mark-box ul {margin-left: 2em;}
.unc {margin-top: 18px;padding: 0; border-top: 2px solid #ccc; display: none; text-align: left;}
.unc * {margin: 0;padding: 0;text-align: left; font-size: 1.2em;}
.unc input {margin-top: 6px; display: inline; font-size: 1.2em;}
.unc input[type=submit] {font-size: 1.1em; padding: 1ex;}
input:checked ~ .unc {display: block;}
#aol_i:checked ~ .unc strong, #wordpress_i:checked ~ .unc strong, #facebook_i:checked ~ .unc strong, #blogger_i:checked ~ .unc strong, #claimid_i:checked ~ .unc strong, #verisign_i:checked ~ .unc strong, #myopenid_i:checked ~ .unc strong, #livejournal_i:checked ~ .unc strong, #google_i:checked ~ .unc label, #msn_i:checked ~ .unc label,  #twitter_i:checked ~ .unc label,  #facebook_i:checked ~ .unc label, #myspace_i:checked ~ .unc label, #yahoo_i:checked ~ .unc label, #google_i:checked ~ .unc input[type=text], #myspace_i:checked ~ .unc input[type=text],#msn_i:checked ~ .unc input[type=text], #facebook_i:checked ~ .unc input[type=text], #twitter_i:checked ~ .unc input[type=text], #yahoo_i:checked ~ .unc input[type=text], input:checked ~ .unc em {display: none;}
#openid_i:checked ~ .unc span {display:none;}
input[type=radio] {width:0px; display:none; margin: 0; padding: 0}
input[type=radio] + label {margin:1ex 1ex 1ex 0ex; padding: 0; color: #993206; font-weight: 700; min-width: 14em; text-align: left;  cursor: pointer; display: inline-block !important;}
input[type=radio]:checked + label {color: #f30; border: 1px solid #f60;}
input[type=radio] + label > span {display: none;}

#emailform label { font-size: 1.6em; text-align: left;}
#emailform input[type=text], #emailform input[type=number] {font-size: 1.8em; margin-bottom: 1.2em;}
#emailform input[type=text] {width: 16em;}
#emailform fieldset {margin: auto; display: inline-block; width: 52em; }

#login { font-size: 0.8em; list-style-type: none; padding:1ex; margin: 1ex;}
#login > li {margin: 1.5em auto; border-bottom: 1px solid #ddd; width: 95%; }


#login {display: none;}
#signin {display: none;}
#signin:target + #login {display: block; margin-bottom: 18em;}
#status {float: right !important; color: #b00; }



.small {font-size: 0.6em !important;}
.msmall {font-size: 0.8em !important;}
.medium {font-size: 1.3em !important; }
.mlarge {font-size: 1.5em !important; }
.large {font-size: 2.5em !important; }
.centre { text-align: center;}
object.centre, embed.centre { margin: 1ex auto; width: 600px; height: 480px;}
.rhs {text-align: right;}
.rf {float: right;}
.lf {float: left;}
.bold {font-weight: 700;}
.full {width: 90% !important;}
.thq {width: 70% !important;}
.thq + #marginalia {width: 20% !important}

/*buttons*/
.gr_but:link, .gr_but:visited, .gr_but {text-align: center; color: #fff;
font-weight: 700;
border: 1px solid darkgreen;
background-color: green;
border-radius: 4px;
box-shadow: inset 1px 6px 12px lightgreen, inset -1px -10px 5px darkgreen, 1px 2px 1px black;
padding: 0.5% 2%; text-decoration: none; text-shadow:0 0 8px #ffd;}
.gr_but:hover {padding: 0.7% 2.2%; text-shadow:0 0 18px #ff0; background-color:lightgreen; cursor: pointer}
.block { display: block; margin: 0.5em;}
.buybut {display: block; margin: 1.8ex auto;}

.ye_but:link, .ye_but:visited, .ye_but {text-align: center; color: #000;
font-weight: 700;
border: 1px solid darkyellow;
background-color: goldenrod;
border-radius: 4px;
box-shadow: inset 1px 6px 12px lightyellow, inset -1px -10px 5px darkyellow, 1px 2px 1px white;
padding: 0.5% 2%; text-decoration: none; text-shadow:0 0 8px #fdd;}
.ye_but:hover {padding: 0.7% 2.2%; text-shadow:0 0 18px #ddd; background-color:lightyellow; cursor: pointer}

@media all and (max-width: 400px) {
body {font-size: 40%;}
div#header, div#marginalia, div#content, div#signin { position: static; float: none; width: 100%; margin: auto; background-image: none; height: 100%;}
ul#menu {position: absolute;}
div#about {display: none;}
div#marginalia { width: 24em}
#marginalia * {font-size: 1.1em;}
div#content {min-height: 100%; height: auto; margin-top: 8em;}
.full {width: 100%;}
.thq {width: 100%;}
.thq + div#marginalia {width: 100%;}
dl#links {width: auto; margin: 1em auto; }
}