/* NOTE: The styles were added inline because Prefixfree needs access to your styles and they must be inlined if they are on local disk! */
      /* Font Family
================================================== */

@import url('https://fonts.googleapis.com/css?family=Oxygen:300,400,700');


/* Global Styles
================================================== */

html,body {
	-webkit-font-smoothing:antialiased;
	-webkit-text-size-adjust:100%;
	background: url(../../../img/bg_pag.png) #652F23;;
	color:#fff;
	font-size:1.05rem;
	font-family: Arial, sans-serif;
	font-weight:300;
	letter-spacing:.025rem;
	line-height:1.618;
	padding: 0;
	margin: 0;
}

*,::before,::after {
box-sizing:border-box;
}

* {
-webkit-tap-highlight-color:rgba(0,0,0,0);
-webkit-tap-highlight-color:transparent;
}

div#idioma { background: url(../../../img/bg_idioma.png) no-repeat #FFCC33; height: 19px; margin: 0; }
div#idioma p { font: 0.55em Lucida Sans Unicode, Helvetica, Arial, Sans-serif; text-transform: uppercase; margin: 0; float: left; border-left: 1px solid black; display: inline }
div#idioma a { display: inline-block; color: black; padding: 2px 10px 2px 10px; }
div#idioma p:hover, div#idioma p:active { background: #D44A2A; }
div#idioma p:hover a, div#idioma p:active a { color: white; text-decoration: none; }

div.header { border-bottom: 1px solid white; margin: 0; }
div.header img { width: 100%; height: 114px; margin-bottom: -7px; border: 0;}

div.titol { background: rgba(0,0,0,0.8); color: white; padding: 15px; }
h1 { font: 1.1em Helvetica Black, Arial Black, Sans-serif; color: white; }

div#peu { margin: 0; padding: 0 0 0 0; text-align: left; background: #00829b; color: white; height: 47px }
div#peu p { margin: 0; padding: 22px 20px 0 0; text-align: right; font: 0.65em Lucida Sans Unicode, Helvetica, Arial, Sans-serif }
div#peu a { color: white; }
/* Setup
================================================== */

.container { position:relative; margin:0 auto; max-width:758px; width:100%; background: rgba(0,0,0,0.3); box-shadow: 0 4px 12px rgba(0,0,0,0.5); }
.column { width:inherit; }


/* Typography / Links
================================================== */

p { color:#fff; display:block; font-size:.9rem; font-weight:400; margin:0 0 2px; }

a,a:visited { color:#8cc3e6; outline:0; text-decoration:none; }
a:hover,a:focus { color:#bbdef5; text-decoration: none; } }
p a,p a:visited { line-height:inherit; }


/* Misc.
================================================== */

.add-bottom { margin-bottom:2rem !important; }
.left { float:left; }
.right { float:right; }
.center { text-align:center; }
.hidden { display:none; }

.no-support {
margin:2rem auto;
text-align:center;
width:90%;
}


/* Audio Player Styles
================================================== */

audio {
display:none;
}

#audiowrap { background: rgba(0,0,0,0.3); }
#audiowrap, #plwrap { margin:0 auto; }

#tracks {
font-size:0;
position:relative;
text-align:center;
}

#nowPlay { display:block; font-size:0; background: rgba(0,0,0,0.3); }
#nowPlay span { display: inline-block; font-size:1.05rem; vertical-align:top; }
#nowPlay span#npAction { padding:21px; width:30%; text-align: right; color: #59c4fd; font-weight: bold; }
#nowPlay span#npTitle { padding:21px; text-align: left; width:70%; font-weight: bold; color: #FFCC33; font-size: 1.3rem; }

#plList { border-top: 1px solid rgba(255,255,255,0.5); margin-bottom: 0; }
#plList li {
cursor:pointer;
display:block;
margin:0;
padding:21px 0;
border-bottom: 1px solid rgba(255,255,255,0.5);
}

#plList li:hover {
	background-color:rgba(0,0,0,.6); color: #FFCC33;
}

.plItem {
position:relative;
}

.plTitle {
right:50px;
overflow:hidden;
position:absolute;
left:65px;
text-overflow:ellipsis;
top:0;
white-space:nowrap;
}

.plNum {
padding-right:21px;
width:25px;
}

.plLength {
padding-right:21px;
position:absolute;
left:21px;
top:0;
}

.plSel,
.plSel:hover {
background-color:rgba(0,0,0,.1);
color:#fff;
cursor:default !important;
}

#tracks a {
border-radius:3px;
color:#fff;
cursor:pointer;
display:inline-block;
font-size:2rem;
height:35px;
line-height:.175;
margin:0 5px 30px;
padding:10px;
text-decoration:none;
transition:background .3s ease;
}

#tracks a:last-child {
margin-left:0;
}

#tracks a:hover,
#tracks a:active {
background-color:rgba(0,0,0,.1);
color:#fff;
}

#tracks a::-moz-focus-inner {
border:0;
padding:0;
}


/* Plyr Overrides
================================================== */

.plyr--audio .plyr__controls {
background-color:transparent;
border:none;
color:#fff;
padding:20px 20px 20px 13px;
width:100%;
}

.plyr--audio .plyr__controls button.tab-focus:focus,
.plyr--audio .plyr__controls button:hover,
.plyr__play-large {
background:rgba(0,0,0,.1);
}

.plyr__progress--played,
.plyr__volume--display {
color:rgba(0,0,0,.1);
}

.plyr--audio .plyr__progress--buffer,
.plyr--audio .plyr__volume--display {
background:rgba(0,0,0,.1);
}

.plyr--audio .plyr__progress--buffer {
color:rgba(0,0,0,.1);
}


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

@media only screen and (max-width:600px) {
	div.header img { height: auto;}
  #nowPlay span#npAction { display:none; }
  #nowPlay span#npTitle { display:block; text-align:left; width:100%; }
  div#peu { height: auto; }
}