/* -------------------------------------------------------------- 

	Theme Name: Jason Andrews Music Portfolio
	Theme URI: http://www.jasonandrewsmusic.com
	Description: Classical Composer Jason Andrews' Wordpress Theme. Powered by WPESP.
	Author: Jason Andrews & Víctor García Cuenllas.
	Author URI: http://wpesp.com
	Version: 2.0
	Tags: portfolio, theme, wpesp
	General comments/License Statement if any.

-------------------------------------------------------------- */

/* -------------------------------------------------------------- 

	Eric Meyers Reset v1.0 | 20080212 - http://meyerweb.com/eric/tools/css/reset/index.html

-------------------------------------------------------------- */


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, sup, tt, var, b, u, i, center, 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-size: 100%; /* letter-spacing: 0; Problems with FF3 s*/ vertical-align: baseline; background: transparent; }
body { line-height: 1em; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none; }

/* remember to define focus styles! */
:focus { outline: 0; }

/* remember to highlight inserts somehow! */
ins { text-decoration: none; }
del { text-decoration: line-through; }

/* tables still need 'cellspacing="0"' in the markup */
table { border-collapse: collapse; border-spacing: 0; }


/* -------------------------------------------------------------- 

	TYPOGRAPHY
	
	Font families:
		- Sans-serif: Arial, Helvetica, sans-serif
		- Serif: Georgia,"Times New Roman",Times,serif
	
	Font size:
		28px -> 2.333em
		24px -> 2em
		20px -> 1.666em
		16px -> 1.333em
		14px -> 1.166em
		12px -> Deafult (body{font-size: 75%})
	
	Colors:
		- Darker: #000
		- Dark: #333
		- Midel-light: #666
		- Light: #999

-------------------------------------------------------------- */


/* --------------------------------------------------------------

	DEFAULT
	
-------------------------------------------------------------- */


body{font: 75%/1.5em Arial, Helvetica, sans-serif;} /* font-size: 12px; line-height: 18px; */


/* -------------------------------- 
	Links
-------------------------------- */

a{color: #000; text-decoration: underline;}
a:hover{color: #666; text-decoration: underline;}
a:focus{background-color: #ccc;}


/* -------------------------------- 
	Heading
-------------------------------- */

h1, h2, h3, h5, h5, h6 {font-weight:bold; }

h1 {color: #333; font-size: 2.5em; letter-spacing: -.02em; line-height: 0.642857em; margin: .1em 0 1.385714em;}
	h1 a{color: #333; text-decoration: none;}
	h1 a:hover, h2 a:focus{color: #666; text-decoration: none;}

h2 {color: #333; font-size: 2.333em; letter-spacing: -.02em; line-height: 0.642857em; margin: .1em 0 1.385714em;}
	h2 a{color: #333; text-decoration: none;}
	h2 a:hover, h2 a:focus{color: #666; text-decoration: none;}
	
h3{color: #333;font-size:1.666667em; letter-spacing: -.01em; line-height: .9em; margin: 1.8em 0 .9em;}


/* -------------------------------- 
	Blocks
-------------------------------- */

p, dl, ul, ol{color: #333;}

p{margin-bottom: 18px;text-align: justify;}

abbr, acronym {border-bottom: 1px dotted #666; cursor: help;}


/* --------------------------------------------------------------

	TOP (header) CAMBIO
	
-------------------------------------------------------------- */


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

div#header div#intro p{color: #666;font: 1.2em/1.5em Georgia,"Times New Roman",Times,serif; font-style: italic; margin: 0;text-align: justify;}

/* -------------------------------- 
	Navigation
-------------------------------- */

div#navigation ol{margin: 0;}

	/* Vertical centring with line-height */
	div#navigation ol li a{color: #fff; font-weight: bold; letter-spacing: .05em; line-height: 45px; text-decoration: none;}
	div#navigation ol li a:focus{background: 0;}
	div#navigation ol li a:hover.active{color: #fff;}
		div#navigation ol li a small{color: #666; font-size: .85em; font-weight: normal; letter-spacing: 0;}
		div#navigation ol li a:hover small{color: #fff;}
		div#navigation ol li a.active small{color: #ccc;}
		div#navigation ol li a:hover.active small{color: #ccc;}


/* --------------------------------------------------------------

	WORK & CATEGORY PAGES
	
-------------------------------------------------------------- */


/* -------------------------------- 
	Featured
-------------------------------- */

div.featured dl, div.panel dl {margin-bottom: 1.5em;}


/* -------------------------------- 
	Works
-------------------------------- */

div#works h5 {color: #333; text-align:center; font-size:1.25em; letter-spacing: -.01em; line-height: .9em; margin: .5em;}
div#works h5 a{color: #333; text-decoration: none;}


/* -------------------------------------------------------------- 

	CONTENT

-------------------------------------------------------------- */


/* -------------------------------------------------------------- 
	CASE STUDY & ABOUT PAGES
-------------------------------------------------------------- */

	/* -------------------------------- 
		Posts
	-------------------------------- */

	div#content div#posts ul, div#content div#posts ol{color: #333;}
		div#content div#posts ul {list-style-position:outside; list-style-type:circle;}
			div#content div#posts ul li, div#content div#posts ol li{margin-bottom: 1.5em;}
		div#content div#posts ol {list-style-position:outside;list-style-type:decimal;}

	div#content div#posts blockquote, div#content div#posts q{color: #333; font-style: italic; margin: 36px 66px; padding: 0 14px; text-align: justify;}
		div#content div#posts blockquote p {color: #333;}


		/* -------------------------------------------------------------- 
			CONTACT
		-------------------------------------------------------------- */

		div#content div#posts div#contact div#usermessageb{color: #333; font-weight: bold;}

		div#content div#posts div#contact p.linklove{display: none;}

		div#content div#posts div#contact form{font-size: 1em;}
		
			div#content div#posts div#contact form legend{color: #333; font-size:1.666667em; font-weight: bold; letter-spacing: -.01em; line-height: .9em; padding-bottom: .9em; }

			div#content div#posts div#contact form p{color: #333;}

			div#content div#posts div#contact form fieldset label{color: #333; font-weight: bold;}
			
				div#content div#posts div#contact form fieldset span.reqtxt, div#content div#posts div#contact form fieldset span.emailreqtxt{color: #666; font-weight: normal; padding-left: 4px;}

				div#content div#posts div#contact form fieldset ol li.textonly{color: #333;margin-bottom: 18px; text-align: justify;}
					div#content div#posts div#contact form fieldset ol li input, div#content div#contact form fieldset ol li textarea {font-size: 1em; font-family: Arial, Helvetica, sans-serif;}


		/* -------------------------------------------------------------- 
			404
		-------------------------------------------------------------- */

		div#content div#error h2{background: none; padding-left: 0;}
		div#content div#error h3{font-weight: normal;}


	/* -------------------------------- 
		SIDEBAR
	-------------------------------- */

	div#content div#sidebar h2, div#content div#sidebar h3 {font-size:1.666667em; letter-spacing: -.01em; line-height: .9em;}
	div#content div#sidebar h2{margin: 0 0 .9em; padding: 0;}
	
	div#content div#sidebar h3 {margin-top: 1.6em;}
	
	div#content div#sidebar dl dd{margin-bottom:8px; padding-bottom:0.75em;} /* we have change margin-bottom:18px; by 8px (margin-bottom:18px-border-bottom:1px-padding-bottom:9px) */


/* -------------------------------------------------------------- 
	FOOTER
-------------------------------------------------------------- */

	div#footer div#foot ol#footnav li{color: #666; font-size: .9em;}
		div#footer div#foot ol#footnav li a{color:#ccc; text-decoration: none;}
		div#footer div#foot ol#footnav li a.active{color: #999;}
		div#footer div#foot ol#footnav li a:focus{color: #666;}
		
	div#footer div#foot p{color: #666; clear:left; font-size: .9em; margin: 0;}
		div#footer div#foot p a{color: #ccc; text-decoration: none;}
		
/* -------------------------------------------------------------- 

	LAYOUT

-------------------------------------------------------------- */

/* --------------------------------------------------------------

	DEFAULT
	
-------------------------------------------------------------- */


body{background: #efefef; background-image: url('http://www.jasonandrewsmusic.com/media/jstam-bg.png'); background-repeat: no-repeat; background-position:50% 250px;}


/* -------------------------------- 
	CLASSES
-------------------------------- */

	/* -------------------------------- 
		Float
	-------------------------------- */

	.fl{float: left;}
	.fr{float: right;}

	.alignleft{float: left; padding-right: 14px; margin-bottom: 18px;}
	.alignright{float: right; padding-left: 14px; margin-bottom: 18px;}

	/* -------------------------------- 
		Rounder Cornes (Just Firefox, Safari and Ie8 at this moment)
	-------------------------------- */

	.br-rd4{border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; -ms-border-radius: 4px;}
	.br-rd2{border-radius: 4px; -moz-border-radius: 2px; -webkit-border-radius: 2px; -ms-border-radius: 2px;}


/* -------------------------------- 
	CENTER ALL 946px
-------------------------------- */

	div#header, div#navigation div#menu, div#submenu ul, div.featured, div.postnav, div#compositions, div#works, div#content, div#foot{margin: 0 auto; overflow: hidden; width: 946px;}


/* -------------------------------------------------------------- 

	TOP (header)

-------------------------------------------------------------- */


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

	div#header{padding: 28px 0;}
	
		div#header div#logo {float: left; background: transparent url('http://www.jasonandrewsmusic.com/media/contemporary-composer.png') no-repeat;border: none;height: 86px;width: 226px;}

		div#header div#intro {float:right; width: 304px;}

		div#header div#social {float:right; clear:both; width: 304px; text-align:center;}
		div#header div#social ul{display: inline; margin:0px; padding:0px;}
		div#header div#social ul li{list-style: none; display: inline; margin:0px; padding:0px;}
		
		
/* -------------------------------- 
	Navigation
-------------------------------- */
	
	div#navigation {background-color: #333;}
		
		div#navigation div#menu {height: 56px; overflow: hidden;}
		
		div#navigation div#menu ol {float: left;}
		div#navigation div#menu ol li{border-left: 1px solid #666;float: left;}
		div#navigation div#menu ol li#menulast{border-right: 1px solid #666;}
			div#navigation div#menu ol li a {display: block; height: 56px; padding-left: 31px; width: 129px;}
					
				/* Vertical centring with line-height:0 and marging-top */
				div#navigation div#menu ol li a small{display: block; line-height:0; margin-top: -7px;}
				
		div#navigation div#menu div#feed{display: inline; float: right;}
			div#navigation div#menu div#feed a {background: transparent url('style/images/feed-nav.gif') no-repeat;display: block; height: 56px; width: 66px;}
			div#navigation div#menu div#feed a:hover{background-position: 0 -56px;}
				div#navigation div#menu div#feed a span{display:none;}


/* -------------------------------------------------------------- 

	WORK PAGES

-------------------------------------------------------------- */

/* -------------------------------- 
	Compositions
-------------------------------- */

	div#compositions{text-align:center; margin-top:5px;}
		div#compositions ul {margin:10px 0px 10px 0px;}
		div#compositions ul li{margin-bottom:10px;}


/* -------------------------------- 
	Pagenav
-------------------------------- */

	div.pagnav div.old{float:left;}
	div.pagnav div.new{float:right;}
	div.pagnav div.old, div.pagnav div.new{font-size:1.166em; font-weight:bold; font-style:italic;}


/* -------------------------------- 
	Featured
-------------------------------- */

	div.featured{margin: 56px auto;}
		div.featured div.info{float: left; width: 505px; position: absolute;}

			div.featured div.info dl dt{float: left; display: inline;}
				
			div.featured ul.view{margin-top: 285px; position: absolute; width: 505px;}
				div.featured ul.view li{display: inline; margin-right: 7px;}

		div.featured div.stick a{background-color: #fff;border: 1px solid #333; float: right; height: 269px; padding: 14px;width: 359px;}
		div.featured div.stick a:hover{border: 1px solid #999;}
		
			div.featured div.stick a img{background-color: #fff;opacity: 1; filter:alpha(opacity=100); width: 359px;}
			div.featured div.stick a:hover img{background-color: #fff;opacity: .5; filter:alpha(opacity=50); width: 359px;}


/* -------------------------------- 
	Works
-------------------------------- */
		
		div#works{margin-top: 56px; margin-left: -14px; overflow: hidden; width: 960px;}
		
		div#works div.mini{margin-left: 14px; padding-bottom: 28px; display: inline; float: left; width: 306px;}
			div#works div.mini div.thumb a{background-color: #fff;border: 1px solid #333; display: block; height: 115px; padding: 14px 0; text-align: center; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; -ms-border-radius: 4px;}
			div#works div.mini div.thumb a:hover{border: 1px solid #999;}
			
				div#works div.mini div.thumb a img{background-color: opacity: 1; filter:alpha(opacity=100); #fff; width: 276px;}
				div#works div.mini div.thumb a:hover img{background-color: #fff; opacity: .5; filter:alpha(opacity=50); width: 276px;}


/* -------------------------------------------------------------- 

	CONTENT

-------------------------------------------------------------- */


/* -------------------------------------------------------------- 
	CASE STUDY & ABOUT PAGES
-------------------------------------------------------------- */

div#content{padding: 56px 0;}

	/* -------------------------------- 
		Posts
	-------------------------------- */
	
	div#content div#posts{display: inline; float: left; width: 626px;}
		
		div#content div#posts a.brd{background-color: #fff; border: 1px solid #333;display: block;}
		div#content div#posts a.brd:hover{border: 1px solid #999;}
			div#content div#posts a.brd:hover img{background-color: #fff;opacity: .5; filter:alpha(opacity=50); width: 622px;}
		
		div#content div#posts img {margin: 0 0 -0.5em;} /* The height should be multiple of 18px */

		div#content div#posts ul, div#content div#posts ol {margin-left:66px; padding-left:14px;}
			div#content div#posts ul ul, div#content div#posts ol ol {margin-left:26px;}

		div#content div#posts div.thumb {background-color: #fff;border: 1px solid #333; float: left; width: 276px; height: 115px; padding: 14px; margin: 0px 10px 10px 0px;}

	/* -------------------------------- 
		Featured
	-------------------------------- */
	
	div.featured div.stick img.new{float: right; top: 241px; position: relative; z-index: 1000;}
	div.featured div.stick a.afternew{background-color: #fff;border: 1px solid #333; float: right; height: 269px; right: -66px;padding: 14px; position: relative; width: 359px;}
	
	
		/* -------------------------------------------------------------- 
			CONTACT
		-------------------------------------------------------------- */
	
		div#content div#posts div#contact{background-color: #ccc; margin: 0; padding: 52px 66px;}
	
			div#content div#posts div#contact div#usermessageb.failure{border: 2px solid #ccc; clear: both; padding: 4px;}

			div#content div#posts div#contact form legend {display: block;}
		
			div#content div#posts div#contact form fieldset.cf_hidden{display: none;}

			div#content div#posts div#contact form fieldset ol{margin: 0; padding: 0;}
			
				div#content div#posts div#contact form fieldset ol li{list-style: none; margin: 0;}
			
					div#content div#posts div#contact form fieldset ol li input {border: 0; margin-bottom: 14px; padding: 4px; width: 480px; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; -ms-border-radius: 2px;}
					div#content div#posts div#contact form fieldset ol li textarea{border: 0;  padding: 4px; width: 480px; margin-bottom: 18px; border-radius: 4px; -moz-border-radius: 4px; -webkit-border-radius: 4px; -ms-border-radius: 4px;}
			
				div#content div#posts div#contact form p input{background-color: #000; border: 0; color: #fff; cursor: pointer; height: 36px; width: 66px; border-radius: 2px; -moz-border-radius: 2px; -webkit-border-radius: 2px; -ms-border-radius: 2px;}
	
	
	/* -------------------------------- 
		Sidebar
	-------------------------------- */

	div#content div#sidebar{display: inline; float: right; margin-top: 4.2em; text-align: left; width: 264px;}
		div#content div#sidebar dl dt{float: left; display: inline;}
		div#content div#sidebar dl dd{border-bottom: 1px solid #333;}

		div#content div#sidebar ul {margin-top: -8px;} /* After dl */
				div#content div#sidebar ul li {display: inline; border-bottom: 1px solid #333; display: block; padding: 9px 0 8px;}
				
		div#content div#sidebar div.vcard img{margin-bottom: 1.6em;}

		div#content div#sidebar div.vcard a.card{background: transparent url('style/images/vcard.png') no-repeat 0 100%; padding-left: 24px;}

		div#content div#sidebar div.vcard span{margin: 0; padding: 0;}


/* -------------------------------------------------------------- 

	FOOTER

-------------------------------------------------------------- */

	div#footer{background: #333;height: 140px;}
		div#footer div#foot{padding: 0 14px;}
			div#footer div#foot ol#footnav{padding: 56px 0 9px; overflow: hidden;}
				div#footer div#foot ol#footnav li{display: inline;float: left; margin-right: 7px;}
				
	div#footer div#foot p.rss{background: url('style/images/feed-icon.gif') no-repeat 0 50%; padding-left: 18px;}


/* -------------------------------------------------------------- 

	CODA

-------------------------------------------------------------- */


div#slider {margin: 0 auto 28px; position: relative; width: 946px;}
	
	/* .SCROLL */
	div#slider div.scroll {clear: left;height: 301px; padding:56px 0 0; position: relative; /* fix for IE to respect overflow */width: 965px;}
		
		/* .PANEL */
		/* DIV.PANEL is close to DIV.FEATURED style from layout.css  */
		div#slider div.scroll div.scrollContainer div.panel {height: 301px; padding: 0 1px 0; width: 945px;} /* 1px padding for a good view */
			div#slider div.scroll div.scrollContainer div.panel div.info{float: left; width: 505px; position: absolute;}

				div#slider div.scroll div.scrollContainer div.panel div.info dl dt{float: left; display: inline;}

			div#slider div.scroll div.scrollContainer div.panel ul.view{margin-top: 285px; position: absolute; width: 505px;}
				div#slider div.scroll div.scrollContainer div.panel ul.view li{display: inline; margin-right: 7px;}
				
			div#slider div.scroll div.scrollContainer div.panel div.stick img.new{float: right; top: 241px; position: relative; z-index: 1000;}
			div#slider div.scroll div.scrollContainer div.panel div.stick a.afternew{background-color: #fff;border: 1px solid #333; float: right; height: 269px; right: -66px;padding: 14px; position: relative; width: 359px;}
			
			div#slider div.scroll div.scrollContainer div.panel div.stick a{background-color: #fff;border: 1px solid #333; float: right; height: 269px; padding: 14px; position: relative; width: 359px;}
			div#slider div.scroll div.scrollContainer div.panel div.stick a:hover{border: 1px solid #999;}
				
				div#slider div.scroll div.scrollContainer div.panel div.stick a:hover img{opacity: .5; filter:alpha(opacity=50);}

img#wpstats{display:none;}