/*********************************************************************************************************************
                                              General Styles
 *********************************************************************************************************************/

  body{font-size: 16px; color: #000; font-family: 'Playfair Display', serif; line-height: 1.2em !important; position: relative;overflow: hidden;background-color: #fafafa;}
  a{color: #111;}
  a:hover{color: #888; text-decoration: none;}
  .section{padding-top: 9rem;}

  #Nota {margin: 10px 0;}
  #Nota .titulo-nota{}
  #Nota .titulo-nota a.section-note{color: #CA2328; font-family: sans-serif; text-transform: uppercase;}
  #Nota h1{font-family: 'Playfair Display', serif; font-size: 3rem; font-weight: 900; line-height: 3rem;}
  #Nota h2{font-family: sans-serif; font-size: 1.25rem; font-weight: 400; line-height: 1.5rem; margin: 15px 0; color: #777;}
  #Nota h3{font-family: sans-serif; font-size: 1.5rem; font-weight: 900; line-height: 1.5rem; margin: 15px 0; color: #CA2328;}
  #Nota .data-note { display: flex; justify-content: space-between; align-items: center; border-top: 1px dotted #CA2328; padding-top: 10px; padding-bottom: 10px; width: 100%; flex-wrap: wrap; border-bottom: 1px dotted #CA2328;}
  #Nota .data-note ul{display: flex; justify-content: flex-start; align-items: center; width: 80%;}
  #Nota .data-note ul li {margin: 0 5px; font-weight: 500; font-family: sans-serif;}
  #Nota .data-note ul li .redaccion{color: #CA2328; margin-right: 5px;}
  #Nota .data-note ul li span{color: #999;}
  #Nota .data-note ul li a{ margin: 0 15px; font-weight: 500; font-family: sans-serif; color: #1dcaff}
  #Nota .data-note ul li:first-child{margin-left: 0;}
  #Nota .data-note ul li:last-child{margin-right: 0;}
  #Nota .data-note .btn-secundary { display: flex; justify-content: center; align-items: center; width: 20%;}
  #Nota .data-note .btn-secundary .text-size {width: 40%; display: flex; justify-content: center;}
  #Nota .data-note .btn-secundary .text-size ul li i { color: #999; transition: all 0.25s; font-size: 0.85rem;}
  #Nota .data-note .btn-secundary .text-size ul li:hover i{color: #CA2328; transition: all 0.25s}
  #Nota .data-note .btn-secundary .audio-note{width: 60%; display: flex; justify-content: center; align-items: center;}
  #Nota .data-note .btn-secundary .audio-note ul li i{color: #999; transition: all 0.25s; font-size: 0.85rem;}
  #Nota .data-note .btn-secundary .audio-note ul li:hover i{color: #CA2328; transition: all 0.25s}
  /** line 31**/  #Nota p.paragraph {font-family: sans-serif; margin-bottom: 20px; line-height: 1.5rem;}
  #Nota .data-photo {background-color: #CA2328; padding: 0.25rem; color: #fff; font-size: 0.75rem; font-family: sans-serif; font-weight: bold;}
  #Nota .note-graphic {margin-bottom: 30px; display: flex; align-items: center;justify-content: center;}


  #Nota .-side {float: left; width: calc(60% + 1rem); margin-right: 0.5rem; margin-bottom: 0.5rem; margin-left: calc(-13% - 1rem); padding: 0 0.75rem;}
  #Nota .note-related {width: 84%; padding: 12px; background-color: #f6f6f6; border-bottom: 2px solid #CA2328; display: flex; justify-content: center; align-items: center; flex-wrap: wrap;}
  #Nota .related-title {color: #CA2328; font-family: sans-serif; font-weight: 600; font-size: 1.125rem; width: 100%; margin-bottom: 10px; text-transform: uppercase;}
  #Nota .main-related { display: flex; justify-content: center; align-items: center;}
  #Nota .img-related {width: 70%; margin-right: 15px;}
  #Nota .main-related p {color: #000; font-family:sans-serif;}

  #Nota .share_bottom_1 {}
  #Nota .share_bottom_1 .share-sm {padding: 10px; color: #aaa; width: 50px;}
  #Nota .share_bottom_1 .share-sm ul{}
  #Nota .share_bottom_1 .share-sm ul li{margin: 10px 0; width: 30px; height: 30px; display: flex; justify-content: center; align-items: center; border-radius: 50%;}
  #Nota .share_bottom_1 .share-sm ul li:first-child{margin-top: 0;}
  #Nota .share_bottom_1 .share-sm ul li:last-child{margin-bottom: 0;}
  #Nota .share_bottom_1 .share-sm ul li a{}
  #Nota .share_bottom_1 .share-sm ul li a i { font-size: 1rem; color: #fff}

  #Nota .share_bottom_1 .uk-card-body { padding: 0px 30px; display: flex; justify-content: center;}

  #Nota .bottom-share {color: #aaa}
  #Nota .bottom-share ul {display: flex; justify-content: space-around; margin-bottom: 10px;}
  #Nota .bottom-share ul li{ margin:0; width: 30px; height: 30px; display: flex; justify-content: center; align-items: center; border-radius: 50%;}
  #Nota .bottom-share ul li a{ color: #fff;}

  #Nota blockquote {margin: 20px 0; padding: 15px; padding-left: 90px; position: relative; border-bottom: 1px dotted #CA2328; border-top: 1px dotted #CA2328;}
  #Nota .icono-block{position: absolute; top: 20px; left: 0; font-size: 4rem; line-height: 1em; color: #CA2328; opacity: 0.20;}
  #Nota .texto-block {width: 100%}
  #Nota .texto-block p{display: flex; width: 100%; font-weight: 900; justify-content: flex-end; margin-bottom: 6px;}
  #Nota .texto-block p span{color: #CA2328; text-align: right; font-size: 0.85rem;}

  /** line 65**/  #Nota .-side {float: left; width: calc(60% + 1rem); margin-right: -3.5rem; margin-bottom: 0.5rem; margin-left: calc(-13% - 1rem); padding: 0 0.75rem;}
  /** line 65**/  #Nota .principale-graphic {margin-top: 0; margin-bottom: 0;}
  /** Añadir clase **/  .banner.m-b-10 {margin: 20px 0;}
  /** Añadir clase **/  .social-embed {display: flex; justify-content: center; width: 100%; max-width: 100%; margin: 20px 0;}
  /** Añadir clase **/  iframe#instagram-embed-0 {max-width: 100% !important;}
  /** Añadir clase **/  .twitter-widget {width: 100% !important; max-width: 100%; margin: 0 auto !important; display: flex !important; justify-content: center;}

  /** Añadir clase **/ .embed-container {position: relative; padding-bottom: 56.25%; height: 650px; overflow: hidden;}
  /** Añadir clase **/ .embed-container iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

  #Nota .video-nota{margin-bottom: 20px;}

  #Especial-Nota .data-special {position: relative; width: 100%}
  #Especial-Nota .main-special {background-color: rgba(0,0,0,0.65); padding: 30px; position: absolute; bottom: 30px;}
  #Especial-Nota h1.title-special {font-size: 2.85rem; font-weight: 900; line-height: 1.2em; color: #fff; margin-top: 15px; margin-bottom: 15px; font-family: 'Playfair Display';}
  #Especial-Nota .section-note a {color: #CA2328; font-size: 1.5rem; line-height: 1rem; text-transform: uppercase; font-family:sans-serif; font-weight: 600; font-style: italic;}
  #Especial-Nota h2.sumary-special {color: #fff;font-size: 1.35rem; line-height: 1.2em;}

  .face-bg{background-color: 	#3b5998}
  .twit-bg{background-color: 	#1dcaff}
  .yout-bg{background-color: 	#ff0000}
  .inst-bg{background: #d6249f;background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%,#d6249f 60%,#285AEB 90%);}
  .what-bg{background-color: 	#25d366}
  .tele-bg{background-color: 	#0088cc}

  .pd-0{padding: 0;}
  .widget_face{margin-top: 20px; margin-bottom: 10px;}
  picture img{width: 100%}


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

  /********** FullHD **********/
    @media screen and (min-width: 1440px){
    }

  /********** Widescreen **********/
    @media screen and (max-width: 1439px){
      #Nota h1 { font-size: 2.75rem; line-height: 1.1em;}
      #Nota .data-note ul {width: 80%; font-size: 0.85rem;}
      #Nota .data-note .btn-secundary {width: 20%;}
      #Nota .data-note .btn-secundary .text-size {width: 45%;}
    }

  /********** Desktop **********/
    @media screen and (max-width: 1199px){
      #Nota h1 { font-size: 2.75rem; line-height: 1.1em;}
      #Nota h2 { font-size: 1.15rem;}

      #Nota .data-note ul { width: 100%; font-size: 0.9rem; justify-content: space-between;}
      #Nota .data-note .btn-secundary { width: 100%; margin-top: 10px; justify-content: flex-start;}
      #Nota .data-note .btn-secundary .text-size { width: 20%; justify-content: flex-start;}
      #Nota .data-note .btn-secundary .text-size ul {width: 50%;}
      #Nota .data-note ul li { margin: 0;}
      #Nota .data-note ul li i {font-size: 0.75rem;}
      #Nota .main-related p {color: #000; font-family: sans-serif; font-size: 0.85rem;}
    }

    /********** Tablet **********/
    @media screen and (max-width: 1007px){
      #Nota h1 { font-size: 2.25rem; line-height: 1em;}
      #Nota h2 { font-size: 1.15rem; line-height: 1.1em;}

      #Nota .data-note ul {width: 80%; font-size: 0.75rem;}
      #Nota .data-note .btn-secundary { width: 20%; font-size: 0.85rem; margin-top: 0;}
      #Nota .data-note .btn-secundary .text-size { width: 70%; justify-content: center;}
      #Nota .data-note .btn-secundary .text-size ul li i {font-size: 0.75rem;}
      #Nota .data-note .btn-secundary .audio-note {width: 20%;}
      #Nota .-side { float: none; width: 100%; margin-left: 0; margin-right: 0; padding: 0; margin-bottom: 30px;}
      #Especial-Nota .main-special {padding: 15px; bottom: 15px;}
      #Nota blockquote {padding-left: 15px;;}
    }

    /********** Mobile **********/
    @media screen and (max-width: 767px){
      #Nota p.paragraph-last{margin-bottom: 10px !important;}
      #Nota h1 { font-size: 1.75rem; line-height: 1.2em;}
      #Nota h2 { font-size: 0.9rem; line-height: 1.2em;}
      #Nota h3 { font-size: 1.35rem;}
      #Nota p.paragraph { margin-bottom: 15px; line-height: 1.45rem;}
      #Nota .data-photo { padding: 3px; font-size: 0.5rem;}
      #Nota .principale-graphic { margin: 0;}
      #Nota .data-note ul { width: 100%; font-size: 0.85rem; flex-wrap: wrap;}
      #Nota .data-note ul li { margin: 0; margin-bottom: 5px; width: 100%}
      #Nota .data-note ul li.w-m{width: 100%}
      #Nota .data-note ul li a {margin: 0;}
      #Especial-Nota .section-note a {font-size: 1rem;}
      #Especial-Nota h1.title-special { font-size: 1.85rem;}
    }