/* Introducción Post */
#introPost {
  width: 100%;
  height: auto;
  background: #ffffff;
  background-color: #ffffff;
  padding: 100px 10% 50px 10%;
  position: relative;
  overflow: hidden;
  transition: all .3s ease;
}

.introHeader {
  width: 100%;
  height: auto;
  padding: 0 0 0 0;
  text-align: justify;
}

.introHeader h1 {
  font-family: 'Roboto';
  font-weight: normal;
  font-style: normal;
  font-size: 20px;
  color: #c1996a;
  letter-spacing: 2px;
  padding: 0 0 0 0!important;
  margin: 0 0 0 0!important;
  transition: all .3s ease;
}

.introHeader h2 {
  font-size: 55px;
  color: #737373;
  letter-spacing: 4px;
  font-weight: normal;
  font-style: normal;
  padding: 0 0 0 0!important;
  margin: 0 0 0 0!important;
  transition: all .3s ease;
}
.introHeader p {
  font-family: 'Roboto';
  font-weight: normal;
  font-style: normal;
  text-align: justify;
  font-size: 16px;
  color: #8c8b8b;
  padding: 0 0 0 0;
  transition: all .3s ease;
}

.introInfo {
  width: 100%;
  height: auto;
  padding: 25px 20% 25px 20%;
  text-align: justify;
}
.introInfo p {
  font-family: 'Roboto';
  font-weight: normal;
  font-style: normal;
  text-align: justify;
  font-size: 16px;
  color: #8c8b8b;
  padding: 15px 0 0 0;
  transition: all .3s ease;
}

.introFooter {
  width: 100%;
  height: auto;
  padding: 35px 0 0 0;
  text-align: center;
  position: relative;
  transition: all .3s ease;
}
.introContacto {
  font-family: 'Roboto';
  font-weight: bold;
  font-style: normal;
  font-size: 16px;
  color: #4b4a66;
  text-transform: uppercase;
  border: 2px solid #4b4a66;
  padding: 10px 60px 10px 60px;
  letter-spacing: 8px;
  text-align: center;
  line-height: 30px;
  text-align: center;
  width: auto;
  height: 30px;
  margin: 0 auto;
  transition: all .3s ease;
}
.introContacto:hover {
  color: #ffffff;
  background: #c49a6c;
  background-color: #c49a6c;
  border: 2px solid #c49a6c;
}
/*  */

/* Playlist Podcast */
#playlist {
  width: 100%;
  height: auto;
  padding: 50px 0 50px 26%;
  position: relative;
  transition: all .3s ease;
}

.playlistContainer {
  width: 100%;
  height: auto;
  padding: 0 0 0 0;
  position: relative;
  transition: all .3s ease;
}

.videoFooter {
  width: 100%;
  height: 55px;
  padding: 25px 0 0 0;
  position: relative;
}

.videoBtn {
  height: 30px;
  transition: all .3s ease;
}
.logoYoutube {
  width: 70px;
  height: 30px;
  float: left;
  text-align: left;
  position: relative;
}
.youtubeImg {
  max-height: 30px!important;
  width: auto!important;
}

.videoText {
  height: 30px;
  text-align: left;
  line-height: 30px;
  float: left;
}
.videoText p {
  font-family: 'Roboto';
  font-weight: normal;
  font-style: normal;
  font-size: 16px;
  color: #55566f;
  padding: 0 0 0 0!important;
  margin: 0 0 0 0!important;
  text-transform: uppercase;
}

.videoBtn:hover .videoText p,
.videoBtn:active .videoText p,
.videoBtn:focus .videoText p {
  color: #c49a6c;
}
.plyr__control--overlaid {
  background: #acabab!important;
  background-color: #acabab!important;
}
.plyr__control--overlaid {
  color: #606365!important;
  color: var(--plyr-video-control-color,#606365)!important;
}
input[type=range]+.thumb {
  background: #c49a6c!important;
  background-color: #c49a6c!important;
}
.plyr--full-ui input[type=range] {
  color: #606365!important;
}
.plyr--video .plyr__control.plyr__tab-focus, .plyr--video .plyr__control:hover, .plyr--video .plyr__control[aria-expanded=true] {
  background: #c49a6c!important;
  background-color: #c49a6c!important;
}

.playlistControls {
  width: 60px;
  height: 120px;
  position: absolute;
  top: 35px;
  left: 22%;
  transition: all .3s ease;
}
.playlistControls li {
  width: 100%;
  height: 60px;
  border-top: 2px solid #c2996b;
  border-left: 2px solid #c2996b;
  border-right: 2px solid #c2996b;
  position: relative;
}
.playlistControls li:nth-child(2) {
  border-bottom: 2px solid #c2996b;
}
.playlistControls li a {
  width: 100%;
  height: 100%;
  font-size: 50px;
  color: #c2996b;
  text-align: center;
  line-height: 60px;
  position: absolute;
  top: 0;
  left: 0;
  transition: all .3s ease;
}
.playlistControls li a:hover {
  color: #ffffff;
  background: #c49a6c;
  background-color: #c49a6c;
}
/*  */

/* Contenido Post */
#contenidoPost {
  width: 100%;
  height: auto;
  background: #ffffff;
  background-color: #ffffff;
  padding: 50px 10% 100px 10%;
  position: relative;
  overflow: hidden;
  transition: all .3s ease;
}

.contenidoContainer {
  width: 100%;
  height: auto;
  padding: 0 20% 0 20%;
}
.contenidoContainer img {
  max-width: 100%!important;
  height: auto;
  margin: 0 auto;
  text-align: center;
  position: relative;
  -webkit-box-shadow: 0px 15px 5px -1px rgba(0,0,0,0.23);
  -moz-box-shadow: 0px 15px 5px -1px rgba(0,0,0,0.23);
  box-shadow: 0px 15px 5px -1px rgba(0,0,0,0.23);
  transition: all .3s ease;
}

.contenidoContainer h1, .contenidoContainer h2, .contenidoContainer h3,
.contenidoContainer h4, .contenidoContainer h5, .contenidoContainer h6 {
  font-family: 'Playfair Display'!important;
  color: #c1996a!important;
  padding: 0 0 0 0!important;
  margin: 0 0 0 0!important;
  transition: all .3s ease;
}

.contenidoContainer h1 {
  font-size: 55px!important;
}

.contenidoContainer h2 {
  font-size: 50px!important;
}

.contenidoContainer h3 {
  font-size: 45px!important;
}

.contenidoContainer h4 {
  font-size: 40px!important;
}

.contenidoContainer h5 {
  font-size: 35px!important;
}

.contenidoContainer h6 {
  font-size: 30px!important;
}

.contenidoContainer p, .contenidoContainer label, .contenidoContainer span {
  font-family: 'Roboto'!important;
  font-weight: normal;
  font-style: normal;
  text-align: justify;
  font-size: 16px;
  color: #8c8b8b;
  padding: 15px 0 0 0;
  transition: all .3s ease;
}

.contenidoFooter {
  width: 100%;
  height: auto;
  padding: 35px 0 0 0;
  text-align: center;
  position: relative;
  transition: all .3s ease;
}
.contenidoContacto {
  font-family: 'Roboto';
  font-weight: bold;
  font-style: normal;
  font-size: 16px;
  color: #4b4a66;
  text-transform: uppercase;
  border: 2px solid #4b4a66;
  padding: 10px 60px 10px 60px;
  letter-spacing: 8px;
  text-align: center;
  line-height: 30px;
  text-align: center;
  width: auto;
  height: 30px;
  margin: 0 auto;
  transition: all .3s ease;
}
.contenidoContacto:hover {
  color: #ffffff;
  background: #c49a6c;
  background-color: #c49a6c;
  border: 2px solid #c49a6c;
}
/*  */