/* Welcome to Compass. In this file you should write your main styles. (or centralize your imports) Import this file using the following HTML or equivalent: <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */
div.aho-clear { clear: both; min-height: 15px; }

.help { font-size: 13px; margin: 10px 15px 0 0; font-weight: normal; }

a[rel="wordbreak"] { word-break: break-all; }

div.clear { clear: both; min-height: 15px; }

.podcast-display { float: left; width: 350px; padding: 10px 10px 0; margin-bottom: 5px; min-height: 130px; }

.podcast-display img { float: left; margin: 0 10px 30px 0; }

.aho-button { -moz-box-shadow: #ffffff 0 1px 0 0; -webkit-box-shadow: #ffffff 0 1px 0 0; box-shadow: #ffffff 0 1px 0 0; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf)); background: -moz-linear-gradient(center top, #ededed 5%, #dfdfdf 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf'); background-color: #ededed; border: 4px solid #dcdcdc; display: inline-block; color: #777777; font-size: 15px; padding: 6px 24px; text-decoration: none; text-shadow: 1px 1px 0 #ffffff; }

.aho-button:hover { background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed)); background: -moz-linear-gradient(center top, #dfdfdf 5%, #ededed 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed'); background-color: #dfdfdf; }

.aho-button:active { position: relative; top: 1px; }

.podcast-item img { display: inline-block; padding: 0 15px 15px 0; }

.img_wrapper img { border: 1px solid #ababab; }

/* Slider Volume */
.slider-volume { width: 300px; min-height: 5px !important; }

.slider-volume > .dragger { width: 16px; height: 16px; margin: 0 auto; border: 1px solid rgba(255, 255, 255, 0.6); background: #c5c5c5; -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; -moz-box-shadow: 0 0px 2px 1px rgba(0, 0, 0, 0.5), 0 2px 5px 2px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 0px 2px 1px rgba(0, 0, 0, 0.5), 0 2px 5px 2px rgba(0, 0, 0, 0.2); box-shadow: 0 0px 2px 1px rgba(0, 0, 0, 0.5), 0 2px 5px 2px rgba(0, 0, 0, 0.2); background: linear-radial-gradient(50% 50%, 200% 50%, #e6e6e6 5%, #d9d9d9 30%, #999999 100%); }

.slider-volume > .track, .slider-volume > .highlight-track { height: 11px; background: #787878; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzc4Nzg3OCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2EyYTJhMiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #787878), color-stop(100%, #a2a2a2)); background: -moz-linear-gradient(top, #787878, #a2a2a2); background: -webkit-linear-gradient(top, #787878, #a2a2a2); background: linear-gradient(to bottom, #787878, #a2a2a2); -moz-box-shadow: inset 0 2px 5px 1px rgba(0, 0, 0, 0.15), 0 1px 0px 0px rgba(230, 230, 230, 0.9), inset 0 0 1px 1px rgba(0, 0, 0, 0.2); -webkit-box-shadow: inset 0 2px 5px 1px rgba(0, 0, 0, 0.15), 0 1px 0px 0px rgba(230, 230, 230, 0.9), inset 0 0 1px 1px rgba(0, 0, 0, 0.2); box-shadow: inset 0 2px 5px 1px rgba(0, 0, 0, 0.15), 0 1px 0px 0px rgba(230, 230, 230, 0.9), inset 0 0 1px 1px rgba(0, 0, 0, 0.2); }

.slider-volume > .highlight-track { background-color: #c5c5c5; background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2M1YzVjNSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2EyYTJhMiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #c5c5c5), color-stop(100%, #a2a2a2)); background: -moz-linear-gradient(top, #c5c5c5, #a2a2a2); background: -webkit-linear-gradient(top, #c5c5c5, #a2a2a2); background: linear-gradient(to bottom, #c5c5c5, #a2a2a2); }

[class^=slider] { display: inline-block; padding-bottom: 10px; }

.output { color: #444; font-size: 14px; padding-top: 1px; margin-left: 5px; vertical-align: middle; }

span.output::after { content: " seconds"; }

label { vertical-align: middle; }

.help { text-align: right; font-size: 12px; }