/*
Theme Name:         Teresa de Leão
Theme URI:          http://teresa-de-leao.com/
Description:        Página oficial de Teresa de Leão
Version:            0.0.1
Author:             Fábio Barbosa
Author URI:         http: //fabiobarbosa.net/

License:            MIT
License URI:        http: //www.opensource.org/licenses/MIT
*/

@import url(http://fonts.googleapis.com/css?family=Buenard:400,700|Alegreya:700italic);

/*#########################################################
# Site Defaults (html, body, headings, links, other tags) #
#########################################################*/

/* Base
--------------------------------------- */

html,
body {
	margin: 0;
	padding: 0;
	height: 100%;
}

html {
	font-size: 100%;
	background: #0a0605 url(img/bg.jpg) fixed no-repeat;
	background-size: cover;
}

body {
	-webkit-font-smoothing: antialiased;
	font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

body,
button,
input,
select,
textarea {
	font: 1em/1.625 Buenard,Georgia,Times,serif;
	color: #fff;
}

article, aside, details, div, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section,
p,small,
ul,ol,
button,
input,
select,
textarea,
form{
	margin: 0;
}

blockquote,q,pre,address,hr,code,samp,dl,form,table,fieldset {
	margin: 0 0 26px;
}
 
p { 
	padding: 0;
}

article p {
	padding: 0 0 26px;
}


/* Headings and small
--------------------------------------- */

h1, h2 {
	font-weight: normal;
	margin: 0;
}

article h1 {
	font-size: 3em;
	line-height: 1.09;
	padding: 0 0 26px;
}

article h2 {
	padding: 28px 0 14px;
}

h3 {
	text-transform: lowercase;
	letter-spacing: 0.1em;
	padding: 23px 0 11px;
	margin: 0;
}


h4, h5, h6 {
	letter-spacing: -.05em;
	padding: 8px 0 18px;
	margin: 0;
}

small {
	font-size: 13px;
	line-height: 26px;
	padding: 18px 0 8px;
}


/* Code
--------------------------------------- */

pre {
	white-space: pre;
	white-space: pre-wrap;
	word-wrap: break-word;
}

pre, code, kbd, samp, tt {
	font: 1em/1.625em Menlo, Consolas, Monaco, 'DejaVu Sans Mono', monospace;
}


/* Tables
----------------------------------------- */

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

th {
	text-align: left;
}

tr, th, td {
	padding-right: 1.625em;
	border-bottom: 1px solid #333;
}


/* Forms
----------------------------------------- */

fieldset {
	border: 0;
}

button,
input,
select,
textarea {
	vertical-align: baseline;
}

textarea {
	overflow: auto;
	vertical-align: top;
}

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
	cursor: pointer;
	-webkit-appearance: button;
	-moz-appearance: button;
	appearance: button;
}

input[type="checkbox"],
input[type="radio"] {
	box-sizing: border-box;
}

input[type="search"] {
	-webkit-appearance: textfield;
	-moz-appearance: textfield;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}

input[type="search"]: : -webkit-search-decoration {
	-webkit-appearance: none;
	-moz-appearance: none;
}

button: : -moz-focus-inner,
input: : -moz-focus-inner {
	border: 0;
	padding: 0;
}

button {
	width: auto;
	overflow: visible;
}


/* Quotes
--------------------------------------- */

blockquote, q {
	quotes: none;
}

blockquote: before, blockquote: after, q: before, q: after {
	content: '';
	content: none;
}

blockquote, q, cite {
	font-style: italic;
}

blockquote {
	padding-left: 1.625em;
	border-left: 3px solid #ccc;
}

blockquote > p {
	padding: 0;
}


/* Lists
--------------------------------------- */

ul,
li {
	list-style-position: inside;
}

ul {
	list-style-type: none;
	padding: 0;
}

ol {
	list-style: decimal;
	padding: 0;
}

.content ol {
	padding: 0 0 1.625em 1.625em;
}

li ul,
li ol {
	padding: 0 1.625em;
}

dl dd {
	margin: 0 0 0 1.625em;
}


/* Anchor tags
--------------------------------------- */

a {
	position: relative;
	text-decoration: none;
	color: #fff;
	-webkit-transition: all .2s ease-out;
	-moz-transition: all .2s ease-out;
	-ms-transition: all .2s ease-out;
	-o-transition: all .2s ease-out;
	transition: all .2s ease-out;
}

a:focus,
a:hover,
a:active {
	color: #d71313;
}

a:focus {
	outline: thin solid;
}

a:hover,
a:active {
	outline: none;
}


/* Images
--------------------------------------- */

img {
	border: 0;
	margin: 0;
	vertical-align: bottom;
	-ms-interpolation-mode: bicubic;
}

.content img {
	margin: 0 0 26px;
}


/* Abbreviations
---------------------------------------- */
abbr[title],
dfn[title] {
	border-bottom: 1px dotted #333;
	cursor: help;
}


/* Marked/inserted and deleted text
---------------------------------------- */
mark,
ins {
	background: #ff0;
	color: #333;
	text-decoration: none;
}

del {
	text-decoration: line-through;
}


/* Others
---------------------------------------- */
strong,
b,
dt,
th {
	font-weight: bold;
}

dfn {
	font-style: italic;
}

var,
address {
	font-style: normal;
}


sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	top: -0.5em;
}

sub {
	bottom: -0.25em;
}


/*#########################################################
# Generic Styles (reusable style tools, sets of styles)   #
#########################################################*/

.image {
	display: block;
	text-indent: -999em;
	background-repeat: no-repeat;
	text-align: left;
}


/*#########################################################
# Audio JS                                                #
#########################################################*/

.audiojs audio {
	position: absolute;
	left: -1px;
}

.audiojs {
	position: relative;
	height: 52px;
}

.audiojs p {
	display: none;
	width: 52px;
	height: 52px;
	padding: 0;
	cursor: pointer;
}

.audiojs .play-pause {
	overflow: hidden;
	position: absolute;
	top: -52px;
	right: 0;
}

.audiojs .play {
	display: block;
}

.audiojs .scrubber {
	position: relative;
	width: 100%;
	height: 6px;
	border-bottom: 1px solid #73653c;
}

.audiojs .progress {
	position: absolute;
	top: 0; left: 0;
	height: 6px;
	width: 0;
	background: #53492b;
	z-index: 1;
}

.audiojs .loaded {
	position: absolute;
	top: 0; left: 0;
	height: 6px;
	width: 0;
	border-bottom: 1px solid #897948;
}

.audiojs .time {
	overflow: hidden;
	width: 100%;
}

.audiojs .time em /* elapsed time */ {
	float: left;
	font-weight: bold;
	font-style: normal;
}

.audiojs .time strong /* total time */ {
	float: right;
}

.audiojs .error-message {
	display: none;
	margin: 0 10px;
	width: 100%;
	white-space: nowrap;
}

.audiojs .error-message a {
	white-space: wrap;
}

.audiojs .play-pause p {
	background-image: url(img/navigation.png);
	background-repeat: no-repeat;
}

.audiojs .play { background-position: -52px -52px; }
.audiojs .loading { background-position: -104px 0px; }
.audiojs .error { background-position: -158px -52px; }
.audiojs .pause { background-position: -104px -52px; }

.playing .play, .playing .loading, .playing .error { display:none; }
.playing .pause { display: block; }

.loading .play, .loading .pause, .loading .error { display:none; }
.loading .loading { display: block; }

.error .time,
.error .play,
.error .pause,
.error .scrubber,
.error .loading { display: none; }
.error .error { display: block; }
.error .play-pause p { cursor: auto; }
.error .error-message { display: block; }


/*#########################################################
# Shell                                                   #
#########################################################*/

.container {
	min-height: 100%;
}

header[role="banner"],
section[role="main"],
.inner-footer {
	margin: 0 auto;
}

header[role="banner"],
.inner-footer {
	width: 1024px;
}

header[role="banner"] {
	height: 78px;
	padding: 52px 0;
	text-shadow: 0 0 6px #000;
}

header[role="banner"] a:active {
	top: 2px; left: 2px;
}

.logo-title {
	font-size: 1em;
	line-height: 1em;
}

.logo,
nav[role="navigation"] {
	position: relative;
	float: left;
	font-size: 1.8em;
	letter-spacing: -.05em;
	line-height: 2.7;
	z-index: 50;
}

.logo {
	display: inline-block;
	float: left;
	height: 78px;
	width: 78px;
	font-weight: bold;
	background-image: url(img/logo.png);
	background-repeat: no-repeat;
	background-position: -9px -9px;
}

nav[role="navigation"] {
	margin-left: 14px;
	text-transform: lowercase;
}

nav[role="navigation"] li {
	float: left;
	padding-left: 16px;
}

nav[role="navigation"] a {
	text-shadow: 0 0 6px #000;
}

nav[role="navigation"] .current-menu-item a {
	color: #d71313;
}

section[role="main"] {
	width: 916px;
	padding: 0 0 26px 108px;
}

footer[role="contentinfo"] {
	clear: both;
	height: 26px;
	padding: 13px 0;
	border-top: 1px solid #150d0b;
	text-transform:	uppercase;
	font-weight: bold;
	text-shadow: 0 0 3px #000;
	box-shadow: 0 0 8px #000;

	background: #0a0605;
	background-image: -webkit-linear-gradient(top, rgb(10,6,5) 30%, rgb(4,2,2) 85%);
	background-image: -moz-linear-gradient(top, rgb(10,6,5) 30%, rgb(4,2,2) 85%);
	background-image: -ms-linear-gradient(top, rgb(10,6,5) 30%, rgb(4,2,2) 85%);
	background-image: -o-linear-gradient(top, rgb(10,6,5) 30%, rgb(4,2,2) 85%);
	background-image: linear-gradient(top, rgb(10,6,5) 30%, rgb(4,2,2) 85%);
}

.alias,
.credits {
	margin-left: 108px;
}

.alias li {
	display: inline-block;
}

.alias li:first-child {
	margin-right: 12px;
}

.alias a {
	width: 26px;
	height: 26px;
	opacity: .75;
	background-image: url(img/alias.png);
	-webkit-transition: opacity .2s ease-out;
	-moz-transition: opacity .2s ease-out;
	-ms-transition: opacity .2s ease-out;
	-o-transition: opacity .2s ease-out;
	transition: opacity .2s ease-out;
}

.alias a:focus,
.alias a:hover {
	opacity: 1;
}

.alias a[href^="http://behance.net"] {
	background-position: -26px 0;
}

.alias a[href^="http://cargocollective.com"] {
	background-position: -52px 0;
}

.alias a[href$="ultra-book.com"] {
	background-position: -78px 0;
}

.alias a[href^="http://flickr.com"] {
	background-position: -104px 0;
}


.credits .name {
	color: #d11f1a;
}

.credits .rights {
	color: #7f6059;
	margin-right: 16px;
}


/*#########################################################
# Layout                                                  #
#########################################################*/

.title {
	font-size: 3em;
	letter-spacing: -.05em;
}

.title-section {
	position: relative;
	float: right;
	margin-top: -128px;
	font-size: 4.8em;
	line-height: 1;
	text-transform: lowercase;
	text-shadow: #000 0 0 12px;
	z-index: 60;
}

article {
	width: 33.3em;
}

.link-more {
	color: #121212;
	margin-left: .25em;
}

.album img {
	margin: 0;
	box-shadow: 0 0 12px #000;
	-webkit-transition:  all .3s linear;
	-moz-transition:  all .3s linear;
	-ms-transition:  all .3s linear;
	-o-transition:  all .3s linear;
	transition:  all .3s linear;
}


/*#########################################################
# Page overrides                                          #
#########################################################*/

/* ID */
.page-id body {
	background: url(img/bg-id.jpg) center bottom repeat-x;
}

.page-id article {
	width: 40em;
}

.page-id .content {
	margin-bottom: 350px;
}


/* Diarium */
.page-diarium body {
	height: auto;
	background: url(img/bg-diarium.png) bottom right no-repeat;
}

.body-diarium {
	width: 45.5em;
	margin-left: -128px;
	padding: 78px 0 26px;
	background: #c9c4be url(img/bg-notes.jpg) repeat-y;
	color: #211f1b;
	border-radius: 6px;
	box-shadow: 0 0 12px #000;
}

.inner-diarium {
	background: url(img/bg-lines.png);
}

.body-diarium a {
	color:#121212;
	-webkit-transition: all .2s ease-out;
	-moz-transition: all .2s ease-out;
	-ms-transition: all .2s ease-out;
	-o-transition: all .2s ease-out;
	transition: all .2s ease-out;
}

.body-diarium a:focus,
.body-diarium a:hover,
.body-diarium a:active {
	color: #d71313;
}

.body-diarium article,
.body-diarium .navigation-archive {
	margin-left: 128px;
	width: 33.3em;
}

.body-diarium header {
	position: relative;
}

.body-diarium time {
	position: absolute;
	left: -110px;
	bottom: 26px;
	font: italic bold 1.05em/1.625 Alegreya;
	text-transform: lowercase;
	color: #D11F1A;
}

.body-diarium .thumbnail {
	float: right;
	margin-right: -235px;
}

.body-diarium .thumbnail img {
	float: right;
	margin-left: 26px;
	margin-top: -10px;
	border: 10px solid #fff;
	box-shadow: 0 0 6px #36332c;
}

.body-diarium .navigation-archive ul {
	overflow: hidden;
	font: italic bold 1em/1.625 Alegreya;
}

.body-diarium .navigation-archive li {
	float: left;
	height: 26px;
	width: 50%;
}

.body-diarium .navigation-next {
	text-align: right;
}


/* Onphae */
.archive-onphae body,
.single-onphae body {
	background: url(img/bg-onphae.png) top left repeat-x;
}

.list-onphae {
	display: inline-block;
	overflow: hidden;
	height: 624px;
	list-style: none;
	counter-reset: li;
}

.list-onphae li {
	position: relative;
	float:left;
	height: 624px;
	border-left: 1px dashed rgba(255,255,255,.6);
	-webkit-transition: width .2s ease-out;
	-moz-transition: width .2s ease-out;
	-ms-transition: width .2s ease-out;
	-o-transition: width .2s ease-out;
	transition: width .2s ease-out;
}

.list-onphae li .title:before {
	content: counter(li, decimal-leading-zero) '.';
	counter-increment: li;
	list-style-type: decimal-leading-zero;
	position: absolute;
	top: 472px;
	color: #D11F1A;
	-webkit-transition:  all .2s ease-out;
	-moz-transition:  all .2s ease-out;
	-ms-transition:  all .2s ease-out;
	-o-transition:  all .2s ease-out;
	transition:  all .2s ease-out;
}

.list-onphae li .title {
	overflow: hidden;
	padding: 52px 13px 13px;
	line-height: 1;
}

.list-onphae li:not(.item-active) .title {
	font-size: 2em;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.list-onphae li a {
	color: #fff;
}

.list-onphae .thumbnail img {
	box-shadow: 0 0 6px #000;
}

.single-onphae iframe {
	margin-bottom: 26px;
}


/* Photós */
.archive-photos .list {
	display: inline-block;
	margin-left: -8px;
}

.archive-photos article {
	float: left;
	overflow: hidden;
	width: 278px;
	height: 162px;
	margin-left: 10px;
	margin-bottom: 10px;
	background: #fff;
	border: 10px solid #fff;
	box-shadow: 0 0 6px #000;
}

.archive-photos .title-article {
	position: relative;
	top: 10px;
	width: 279px;
	height: 162px;
	font-size: 2.2em;
	line-height: 1.18;
	background: rgba( 255, 255, 255, .9 );
	z-index: 10;
	-webkit-transition:  all .3s ease-out;
	-moz-transition:  all .3s ease-out;
	-ms-transition:  all .3s ease-out;
	-o-transition:  all .3s ease-out;
	transition:  all .3s ease-out;
}

.archive-photos .title-article a {
	display: block;
	width: 266px;
	height: 149px;
	padding: 13px;
	color: #D11F1A;
	font-weight: bold;
}

.archive-photos article:hover .title-article {
	top: -162px;
}

.single-photos article {
	width: 916px;
}

.single-photos .title-article,
.single-artire .title-article {
	text-align: right;
	text-shadow: #000 0 0 12px;
}

.single-photos .album {
	width: 1024px;
	margin-left: -108px;
	padding-bottom: 52px;
}

.single-photos .album img {
	position: relative;
	cursor: move;
}

.single-photos .album img:hover {
	box-shadow: 0 0 12px #fff;
}


/* Estoria */
.archive-estoria body,
.single-estoria body {
	height: auto;
	background: url(img/bg-estoria.png) top right no-repeat;
}

.archive-estoria article {
	display: inline-block;
	width: auto;
	margin-bottom: 26px;
}

.archive-estoria .title-article {
	float: left;
	width: 268px;
	margin-right: 20px;
	box-shadow: 0 0 12px #000;
}

.archive-estoria .content {
	-moz-column-count: 2;
	-moz-column-gap: 26px;
	-webkit-column-count: 2;
	-webkit-column-gap: 26px;
	column-count: 2;
	column-gap: 26px;
	float: left;
	width: 588px;
	padding: 26px 20px;
	background: #e7e4da;
	color: #211f1b;
	border-radius: 6px;
	box-shadow: 0 0 8px #000;
}

.archive-estoria .content p {
	padding: 0;
}

.archive-estoria .content p:first-child:first-letter,
.single-estoria .content p:first-child:first-letter {
	float: left;
	font-size: 4em;
	line-height: .8;
	margin-right: 10px;
}

.single-estoria article {
	width: 33.3em;
	padding: 104px 52px 52px;
	background: #e7e4da;
	color: #211f1b;
	border-radius: 6px;
	box-shadow: 0 0 12px #000;
}

.single-estoria .title-article {
	padding-bottom: 52px;
	font-weight: bold;
	text-align: center;
}


/* Timbre */
.archive-timbre .audiojs {
	height: 7px;
}

.archive-timbre .audiojs .time {
	display: none;
}

.archive-timbre .title-article {
	padding: 26px 0 13px;
	font-size: 2em;
	line-height: 1;
}

.body-podcasts,
.body-sounds {
	float: left;
	width: 416px;
	padding: 26px 0 26px 84px;
}

.body-podcasts {
	overflow: hidden;
	margin-left: -138px;
	padding-left: 138px;
	color: #333;
	background: #b1a06d;
	box-shadow: 0 0 12px #000;
}

.body-podcasts article,
.body-sounds article {
	width: 416px;
}

.body-podcasts a {
	color: #333;
}

.body-podcasts .thumbnail {
	margin-bottom: 26px;
}

.body-sounds .audiojs .play { background-position: -52px -158px; }
.body-sounds .audiojs .loading { background-position: -104px -104px; }
.body-sounds .audiojs .error { background-position: -158px -158px; }
.body-sounds .audiojs .pause { background-position: -104px -158px; }
.body-sounds .audiojs .scrubber { border-bottom: 1px solid #580d0b; }
.body-sounds .audiojs .progress { background: #D11F1A; }
.body-sounds .audiojs .loaded { border-bottom: 1px solid #b31b16; }

.article-podcasts .thumbnail,
.article-podcasts .content {
	float: left;
	width: 416px;
}


/* Artire */

.archive-artire article {
	position: relative;
	float: left;
	width: 458px;
	margin-bottom: 26px;
}

.archive-artire .title-article {
	position: absolute;
	bottom: -13px;
	left: -26px;
	z-index: 5;
	text-shadow: #000 0 0 12px;
	-webkit-transition: left .2s ease-out;
	-moz-transition: left .2s ease-out;
	-ms-transition: left .2s ease-out;
	-o-transition: left .2s ease-out;
	transition: left .2s ease-out;
}

.archive-artire .title-article:focus,
.archive-artire .title-article:hover {
	left: -20px;
}

.archive-artire .thumbnail img {
	border-radius: 6px;
	box-shadow: 0 0 12px #000;
}

.single-artire article {
	width: 916px;
	margin-bottom: 52px;
}

.single-artire .album {
	position: relative;
}

.single-artire .album img {
	position: relative;
	cursor: move;
}


/*#########################################################
# Home Overrides                                          #
#########################################################*/

.home {
	background-image: url(img/bg-index.jpg);
	position: relative;
}

.home .logo {
	width: 248px;
	padding-left: 108px;
}

.home nav[role="navigation"] {
	float: right;
}

.home footer {
	position: fixed;
	bottom: 0;
	width: 100%;
}


/*#########################################################
# Media Queries                                           #
#########################################################*/

@media screen and (min-width: 1024px) {

	.alias {
		float: left;
	}

	.credits {
		float: right;
		margin-left: 0;
	}

}


/*#########################################################
# Lightbox                                                #
#########################################################*/

#jquery-overlay {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100% !important;
	height: 500px;
}

#jquery-lightbox {
	position: absolute;
	top: 0 !important;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
}

#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 52px auto 0;
}

#lightbox-container-image { padding: 10px; }

#lightbox-loading {
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}

#lightbox-nav {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}

#lightbox-container-image-box > #lightbox-nav { left: 0; }

#lightbox-nav a { outline: none;}

#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
	width: 49%;
	height: 100%;
	zoom: 1;
	display: block;
}

#lightbox-nav-btnPrev { 
	left: 0; 
	float: left;
}

#lightbox-nav-btnNext { 
	right: 0; 
	float: right;
}

#lightbox-container-image-data-box {
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: hidden;
	width: 100%;
	padding: 0 10px 0;
}

#lightbox-container-image-data {
	padding: 0 10px; 
	color: #666; 
}

#lightbox-container-image-data #lightbox-image-details { 
	width: 70%; 
	float: left; 
	text-align: left; 
}	

#lightbox-image-details-caption { font-weight: bold; }

#lightbox-image-details-currentNumber {
	display: block; 
	clear: left; 
	padding-bottom: 1.0em;	
}			

#lightbox-secNav-btnClose {
	width: 66px; 
	float: right;
	padding-bottom: 0.7em;	
}

#lightbox-image-details-caption {
	text-transform:uppercase;
}

#lightbox-image-details-currentNumber {
	visibility:hidden;
	height:0;
}