/**
 *
 * NAME   main.css
 * DATE   2016-02-25
 * AUTHOR Fabio Marciano
 *
**/

/*

  Open Sans weight table:
  -----------------------
  Light ............. 300
  Normal ............ 400
  Semi-Bold ......... 600
  Bold .............. 700
  Extra-Bold ........ 800
  -----------------------

*/

/* NORMALIZATION */

* {
  margin:0px;
  padding:0px;
  border:0px;
  outline:none;
}

HTML {
  font-family:"Open Sans", sans-serif;
}

BODY {
  font-size:10px;
  background:#fff;
  padding-top:70px;
}

A {
  text-decoration:none;
}

P {
  margin-bottom:1.5em;
}

P > A {
  color:#000;
  background:#FF0;
  font-weight:normal;
  padding:0px 5px;
}

VAR, ADDRESS {
  font-style:normal;
}

UL {
  list-style-type:none;
}

OL {
  list-style-position:inside;
}

/* STRUCTURE */

#main > DIV, #header, #header > DIV, #content, #content > DIV, #footer, #footer > DIV {
  position:relative;
}

#header, #header > DIV {
  z-index:3;
}

#content, #content > DIV {
  z-index:2;
}

#footer, #footer > DIV {
  z-index:1;
}

/* HEADER */

#header {
  position:fixed;
  background:#000;
  top:0px;
  right:0px;
  left:0px;
}

#header > DIV {
  width:1340px;
  height:70px;
  margin:0px auto;
}

#header-magazine-title, #header-site-title, #header-navigation, #header-share {
  position:absolute;
}

#header-magazine-title {
  left:0px;
  top:20px;
}

#header-magazine-title A {
  display:block;
  width:102px;
  height:27px;
  background:url("/assets/media/logo-ep.png") center center no-repeat;
}

#header-site-title {
  left:128px;
  top:20px;
  border-right:solid 2px #FF0;
  border-left:solid 2px #FF0;
  font-size:2.2em;
}

#header-site-title A {
  float:left;
  color:#FF0;
  width:229px;
  font-weight:bold;
  height:30px;
  line-height:30px;
  text-align:center;
}

#header-navigation {
  left:391px;
  top:25px;
}

  #header-navigation LI {
  float:left;
  margin-left:15px;
}

#header-navigation LI:first-child {
  margin-left:0px;
}

#header-navigation LI A {
  display:inline-block;
  font-size:1.3em;
  height:18px;
  line-height:18px;
  text-transform:uppercase;
  color:#FFF;
  padding:0px 6px;
}

#header-navigation LI A:hover {
  text-decoration:underline;
}

#header-navigation LI.active A {
  background-color:#FF0;
  color:#000;
  text-decoration:none;
  font-weight:700;
}

#header-share {
  right:0px;
  top:20px;
}

#header-share LI {
  float:left;
  margin-left:3px;
}

#header-share LI:first-child {
  margin-left:0px;
}

#header-share LI A {
  display:block;
  width:29px;
  height:29px;
  background-color:#FF0;
}

#header-share-facebook A {
  background:url("/assets/media/ico-share.png") left center no-repeat;
}

#header-share-twitter A {
  background:url("/assets/media/ico-share.png") -29px center no-repeat;
}

#header-share-email A {
  background:url("/assets/media/ico-share.png") -58px center no-repeat;
}

/* FOOTER */

#footer {}

#footer > DIV {
  width:1340px;
  height:100px;
  margin:0px auto;
  padding-top:50px;
}

#footer H3 {
  font-size:3.0em;
  font-weight:800;
  text-transform:uppercase;
}

#footer H3 A {
  display:block;
  color:#FFF;
  height:42px;
  line-height:42px;
  padding-top:17px;
}

#footer SMALL A {
  color:#FF0;
}

#footer UL {
  width:100%;
}

#footer UL LI {
  position:relative;
  height:60px;
}

#footer UL LI SMALL {
  position:absolute;
  font-size:2.0em;
  top:0px;
}

#footer UL LI#footer-item-prev {
  float:left;
}

#footer UL LI#footer-item-next {
  float:right;
}

#footer UL LI#footer-item-prev H3 A {
  padding-left:73px;
  background:url("/assets/media/ico-previous.png") left top no-repeat;
}

#footer UL LI#footer-item-prev SMALL {
  left:73px;
}

#footer UL LI#footer-item-next H3 A {
  padding-right:73px;
  background:url("/assets/media/ico-next.png") right top no-repeat;
}

#footer UL LI#footer-item-next SMALL {
  right:73px;
}

/* CAST */

#cast {
  background:#000;
  padding:50px 0px;
}

#cast > DIV {
  width:1322px;
  margin:0px auto;
  padding:64px 0px 0px 0px;
  background:url("/assets/media/ico-email.png") left top no-repeat;
}

#cast > DIV, #cast A {
  color:#FFF;
}

#cast H2, #cast ADDRESS {
  font-family:"Open Sans", sans-serif;
  font-size:2.4em;
  font-weight:700;
  margin:0px 0px 5px 0px;
}

#cast H3 {
  font-family:"Courier New", monospace;
  font-size:2.4em;
  font-weight:normal;
  margin:0px 0px 5px 0px;
}

#cast EM {
  font-style:normal;
}

#cast STRONG {
  font-family:"Courier New", monospace;
}

#cast ADDRESS {
  margin-bottom:30px;
}

#cast > DIV > DIV {
  padding-top:30px;
  border-top:solid 2px #999;
  font-size:2.4em;
}

/* CONTENT */

#content {
  min-width:1340px;
  background:#FFF;
  padding-top:60px;
}

#content > DIV {
  margin:0px auto;
  padding-bottom:50px;
}

/* FULL FRAME SETTINGS */

.full-frame {
  max-width:100%;
  background:#000;
}

.full-frame VIDEO, .full-frame VIDEO > IMG {
  position:relative;
  z-index:1;
  display:block;
  margin:0px auto;
  max-width:100%;
  width:100%;
  height:auto;
}

.full-frame > DIV {
  position:relative;
}

.full-frame > DIV > DIV {
  width:1340px;
  margin-left:-670px;
  position:absolute;
  z-index:2;
  left:50%;
  bottom:45px;
}

.full-frame > DIV > DIV SMALL {
  display:block;
  font-size:2.2em;
  margin-bottom:20px;
  color:#FF0;
}

.full-frame > DIV > DIV H1 {
  color:#FFF;
  font-size:8.0em;
  text-transform:uppercase;
  font-weight:800;
  letter-spacing:-0.05em;
  line-height:0.9em;
}

/* SUBTITLE */

#content > DIV > SECTION > H3 {
  width:1035px;
  margin:0px auto 150px auto;
  padding-right:305px;
  font-size:3.0em;
  line-height:1.2em;
  font-weight:700;
}

/* SECTION: TEXT BLOCK */

#content > DIV > SECTION {
  color:#252525;
}

#content > DIV > SECTION > DIV {
  width:560px;
  margin:0px auto;
  position:relative;
}

#content > DIV > SECTION > DIV > H2 {
  font-size:4.0em;
  font-weight:800;
  line-height:1.0em;
  text-transform:uppercase;
  margin-bottom:20px;
  letter-spacing:-0.05em;
}

#content > DIV > SECTION > DIV > H3 {
  font-size:2.0em;
  font-weight:700;
  line-height:1.3em;
  margin-bottom:20px;
}

#content > DIV > SECTION > DIV H4 {
  display:inline-block;
  background:#FF0;
  font-size:1.9em;
  font-weight:normal;
  text-transform:uppercase;
  color:#252525;
  line-height:1.6em;
  padding:0px 10px;
  margin-bottom:20px;
}

#content > DIV > SECTION > DIV > H5 {
  font-size:2.2em;
  font-weight:800;
  line-height:1.8em;
  margin-bottom:20px;
}

#content > DIV > SECTION > DIV P {
  font-size:2.2em;
  line-height:1.8em;
}

.cap:first-letter {
  float:left;
  font-family:"Open Sans", sans-serif;
  font-weight:800;
  font-size:4.2em;
  color:#000;
  border-bottom:solid 60px #000;
  margin-right:20px;
  padding:0px 87px 10px 0px;
  letter-spacing:0em;
  text-indent:0em;
  height:95px;
  line-height:95px;
}

#content > DIV > SECTION > DIV .lst-num {
  position:absolute;
  width:90px;
  height:90px;
  background:#FF0;
  text-align:center;
  line-height:90px;
  left:-110px;
  color:#252525;
  font-size:3.5em;
}

/* ASIDE SECTION: TEXT BLOCK */

#content > DIV > SECTION.aside > DIV {
  color:#252525;
  width:1040px!important;
  padding:0px 0px 0px 300px!important;
}

#content > DIV > SECTION.aside > DIV > P {
  max-width:560px;
}

#content > DIV > SECTION.aside ASIDE {
  float:right;
  width:590px;
  margin:0px 0px 0px 50px;
}

#content > DIV > SECTION.aside H4 {
  font-weight:bold;
  font-size:2.6em;
  line-height:40px;
  height:40px;
  letter-spacing:0.05em;
  margin-bottom:30px;
}

#content > DIV > SECTION.aside ASIDE VIDEO {
  width:590px;
  margin-bottom:40px;
}

/* FIGURE 1 */

#content > DIV FIGURE.fig-1 {
  width:1340px;
  margin:0px auto 50px auto;
  position:relative;
  background-attachment:fixed;
  background-size:1080px auto;
  background-position:right center;
  background-repeat:no-repeat;
}

#content > DIV FIGURE.fig-1 IMG {
  position:relative;
  float:right;
}

#content > DIV FIGURE.fig-1 FIGCAPTION {
  position:absolute;
  top:40%;
}

#content > DIV FIGURE.fig-1 FIGCAPTION P {
  display:block;
  float:left;
  clear:both;
  margin:0px 0px 10px 0px!important;
  padding:0px 10px;
  background:#FF0;
  font-size:3.6em;
  line-height:1.5em;
  font-weight:800;
}

/* FIGURE 2 */

#content > DIV FIGURE.fig-2 {
  width:1040px;
  margin:0px auto 50px auto;
  position:relative;
  padding-right:300px;
}

#content > DIV FIGURE.fig-2 IMG {
  display:block;
  float:right;
}

#content > DIV FIGURE.fig-2 FIGCAPTION {
  position:absolute;
  bottom:0px;
  right:80px;
  width:200px;
  font-size:1.6em;
  line-height:1.4em;
  font-weight:700;
  margin:0px;
  color:#252525;
}

/* FIGURE 3 */

#content > DIV FIGURE.fig-3 {
  width:1040px;
  margin:0px auto 50px auto;
  position:relative;
  padding-left:300px;
}

#content > DIV FIGURE.fig-3 IMG {
  display:block;
  float:left;
}

#content > DIV FIGURE.fig-3 FIGCAPTION {
  position:absolute;
  text-align:right;
  bottom:0px;
  left:80px;
  width:200px;
  font-size:1.6em;
  line-height:1.4em;
  font-weight:700;
  margin:0px;
  color:#252525;
}

/* INFO BLOCK */

.info-block {
  background:#000;
}

.info-block > DIV {
  width:1440px;
  margin:0px auto 50px auto;
  color:#FFF;
  text-align:center;
}

.info-block > DIV IFRAME {
  display:block;
  margin:0px auto;
}

/* GALLERY */

.gallery-block {
  width:560px;
  margin:0px auto 50px auto;
  background:#000;
}

.gallery-block > DIV {
  padding:30px;
  position:relative;
  min-height:435px;
}

.gallery-block IMG {
  display:block;
  float:left;
  max-width:300px;
  max-height:433px;
  position:absolute;
  top:32px;
}

.gallery-block > DIV > DIV, .gallery-block FIGCAPTION, .gallery-block > DIV > UL {
  width:180px;
  position:absolute;
  right:30px;
}

.gallery-block > DIV > DIV {
  top:30px;
  font-size:2.8em;
  line-height:24px;
  height:24px;
  color:#d2232a;
  /*border-bottom:solid 20px #d2232a;*/
  padding-bottom:12px;
}

.gallery-block FIGCAPTION {
  top:98px;
  font-size:1.4em;
  color:#FFF;
}

.gallery-block UL {
  bottom:30px;
}

.gallery-block OL LI {
  display:none;
}

.gallery-block OL LI.active {
  display:block;
}

.gallery-block UL LI {
  display:block;
  float:right;
  width:50px;
  height:50px;
  margin:0px 10px 0px 0px;
  background-image:url("https://s3.amazonaws.com/cdn.infografiaepoca.com.br/siteEpoca/FTP/926/ico-gallery.jpg");
  background-repeat:no-repeat;
  cursor:pointer;
}

.gallery-block UL LI:first-child {
  margin:0px 0px 0px 0px;
}

.gallery-block UL LI.gallery-prev {
  background-position:left center;
}

.gallery-block UL LI.gallery-next {
  background-position:center center;
}

.gallery-block UL LI.gallery-zoom {
  background-position:right center;
}

/* FONT-FAMILY SETTINGS */

#content > DIV > SECTION > DIV > H2, #content > DIV > SECTION > DIV > H3, #content > DIV > SECTION > DIV > H5 {
  font-family:"Open Sans", sans-serif;
}

#footer UL LI SMALL, #header-site-title, .full-frame > DIV > DIV SMALL, .gallery-block > DIV > DIV, #content > DIV > SECTION > DIV H4, #content > DIV > SECTION > DIV .lst-num {
  font-family:"Oswald", courier;
  position:relative;
  top:345px;
  left:416px;
  width:71px;
  background-color:#d2232a;
  color:#fff;
  padding:5px;
}

#content > DIV SECTION > DIV {
  font-family:"Georgia", serif;
}

/* NEGATIVE INDENT */

#header-magazine-title, #header-share LI A, .gallery-block UL LI {
  text-indent:-9999em;
  font-size:0em;
  line-height:0em;
  overflow:hidden;
  color:transparent;
}

/* HAS LAYOUT FIX */

#header > DIV, #footer > DIV, #content > DIV, #header-navigation > DIV > UL, .full-frame > DIV, #content > DIV FIGURE, .gallery-block > DIV, .gallery-block UL, .gallery-block OL, .gallery-block OL LI, .info-block > DIV {
  zoom:1;
}

#footer > DIV:after, #header > DIV:after, #content > DIV:after, #header-navigation > DIV > UL:after, .full-frame > DIV:after, #content > DIV FIGURE:after, .gallery-block > DIV:after, .gallery-block UL:after, .info-block > DIV:after, .gallery-block OL:after, .gallery-block OL LI:after {
  display:block;
  clear:both;
  content:".";
  height:0px;
  visibility:hidden;
}

.dataaa{
  color:#d2232a;
  font-size:2.5em;
  font-family:'Oswald';
  position:relative;
  top:-31px;
  left:320px;
  border-bottom:solid 20px #d2232a;
  width:182px;
}

.titleee{
  font-family:'Oswald';
  font-size:3.4em;
  margin:0;
  margin-left:437px;
  width:560px;
  padding-bottom:15px;
  line-height:1.2em;
}