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

	Such Sweet Thunder
	Author: Murali, CSS Ninja Extraordinaire
	Last Updated: April 2010

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

/* @group 01 - GLOBAL BROWSER RESET */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin: 0; padding: 0; }

table { border-collapse: collapse; border-spacing: 0; }

fieldset,img { border: 0; }

address,caption,cite,code,dfn,em,strong,th,var { font-style: normal; font-weight: normal; }

ol,ul { list-style: none; }
caption,th { text-align: left; }

h1,h2,h3,h4,h5,h6 { font-size: 100%; font-weight: normal; }

q:before,q:after { content: ''; }
abbr,acronym { border: 0; }

/* @end */

/* @group 02 - COMMON STYLE */

h1 { font-size: 36px; margin-bottom: 15px;}
h2 { font-size: 1.7em; }
h3 { font-size: 1.5em; }
h4 { font-size: 1.2em; }
h5 { font-size: .8em; }

a { color: #fff; text-decoration: underline;}
a:hover { color: #3c8ccc;}

em { font-style: italic; }
b { font-weight: bold; 	}
br { line-height: 1em;}
p { margin-top: 1.5em; line-height: 1.5em; }

table { margin-top: 1.3em; }
th { font-weight: bold; text-decoration: underline; font-size: 1.1em; padding-bottom: 10px;}
td { padding-bottom: 10px; }
blockquote { margin: 5px 35px; text-align: justify; }

li { list-style: none;}

/* @end */



/* @group 03 - STRUCTURE */

body{ background: #0E305E url(/images/site/images/background.jpg) repeat-x 0 0; font: 75% "Lucida Grande", Lucida, Verdana, sans-serif; height: 100%; color: #fff; }

#container { display: block; min-height: 100%; width: 100%; position: absolute; top: 0px; left: 0px; z-index: 0; }

#wrapper { width: 675px; margin: 0 auto; font-size: 1em; }

#content { width: 630px; height: 450px; margin: 0 auto; padding: 15px 15px 35px; font-size: 12px;}


#footer{ position: absolute; left: 0px; bottom: 0px; width: 100%; display: block; height: 237px; z-index: 999; }

#rear, #mid, #front { width: 100%; height: 237px; }
#rear { background: transparent url(/images/site/images/bg-rear.png) repeat-x 20% 100px; }
#mid { background: transparent url(/images/site/images/bg-mid.png) 40% 0 repeat-x; }
#front { background: transparent url(/images/site/images/bg-front.png) 150% 100% repeat-x;}

h2.masthead{ background: url(/images/site/images/logo.png) no-repeat 0 0; width: 675px; height: 77px; margin: 0 auto;}
h2 span { display: none; }

#navigation{ height: 45px; width: 651px; margin: 0 auto; background: url(/images/site/images/navigation.png) no-repeat; }

#navigation li { float: left; }
#navigation a { height: 45px; display: block; }
#navigation li a:hover { background-image: url(/images/site/images/navigation.png); }
#navigation span { display: none;}
 
#navigation li.murali { width: 102px;}
#navigation li.news { width: 113px;}
#navigation li.recordings { width: 107px; }
#navigation li.works { width: 70px;}
#navigation li.projects { width: 146px; }
#navigation li.contactme { width: 105px; }

#navigation li.murali a { background-position: 0 -45px; }
#navigation li.news a:hover { background-position: -102px -45px;}
#navigation li.recordings a:hover { background-position: -215px -45px;}
#navigation li.works a:hover { background-position: -322px -45px;}
#navigation li.projects a:hover { background-position: -392px -45px;}
#navigation li.contactme a:hover { background-position: -538px -45px;}

/* @end */

/* @group 04 - HOMEPAGE ELEMENTS */

/* @end */

/* @group 05 - SUBPAGE ELEMENTS */

.news-clip { padding: 15px 0px 30px;}

#breadcrumb { display: none;float: right; color: #999; font: .75em Verdana, Tahoma, "Trebuchet MS"; }
#breadcrumb a { color: #999;}

#workslist li p { margin: 0;}
#workslist li p a { text-decoration: underline;}
#workslist li { margin: 1.25em 0;}
#workslist h4 { font-size: 1em;}

#portfolio li { margin: 1.25em 0; }
#portfolio h3 { margin-bottom: 1px; font-size: 1.4em;}
#portfolio h4 { font-size: 1em; }
#portfolio h4 a { color: #a7a7a7; text-decoration: none; font-weight: bold;}
#portfolio h4 a:hover { text-decoration: underline; }

#recordinginfo { margin-top: 25px;}

h4.location { font-size: 1em;}

.programnotes { padding: 15px 60px; text-align: justify;}

img.rss { float: right; }

h1.intro span { display: none; }
h1.intro { width: 385px; height: 173px; background: url(/images/site/images/intro.png) no-repeat; margin: 100px 100px 0 150px; }

/* @end */

/* @group 06 - FORM STYLES */

label { display: block; float: left; width: 100px;}
input.text { width: 200px; height: 15px; }
textarea { width: 400px; height: 150px; }
input.text, textarea { 
	padding: 3px; 
	border: 1px solid #666; 
	font: 1em "Trebuchet MS", Tahoma, Verdana, Helvetica, sans-serif;
}
input.submit { margin: 1.5em auto;}

/* @end */



/* @group 07 - UTILITY */

.line { border-bottom: 1px solid #e5e5e5; padding-bottom: 10px; margin-bottom: 10px; }
.stretcher { clear: both; height: 1px; visibility: hidden; }
.nomargin { margin-bottom: 0px; }
.floatl {float: left; margin: 0; padding: 0 10px 10px 0;}
.floatr {float: right; margin: 0; padding: 0 0 10px 10px;}
.floatl-nomargin { float: left; margin: 0; padding: 0;}
.floatr-nomargin { float: right; margin: 0; padding: 0;}
.clear {clear:both; height:0; margin:0; font-size: 1px; line-height: 0;}
.required { color: red; }

i, em { font-style: italic; }
b, strong { font-weight: bold; }

.cufon-loading h1 { visibility: hidden !important; }

sup, sub { height: 0; line-height: 1; vertical-align: baseline; _vertical-align: bottom; position: relative;}
sup { bottom: 1ex; }
sub { top: .5ex; }

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

/* @end */