.cinema-view-wrapper,
.film-record { display: flex; flex-flow: row wrap; background:linear-gradient(#313634, #474C55); margin-bottom: 1em}
.film-record { padding:12px; height:auto; width:auto; position:relative; z-index:999; transition: width 1s, height 1s, top 1s, left 1s, margin 1s, max-width 1s; }
.film-record-container { width: 100%; height:auto; position:relative; transition: width 1s, height 1s, top 1s, left 1s, margin 1s, max-width 1s;}
.film-record-container img, .film-record-container object { max-width:100%; }
.film-record-container a.player { display:block; width:100%; height:100%; }
.film-metadata-wrapper { padding: 1em; width:100%; background-color: #3A3A36; }
.cinema-view-expanded .film-metadata-wrapper { }
.film-metadata { padding:0; }
.film-metadata, .film-metadata a { color:#EEEEEE; }
.film-metadata dt:after {content:": ";}
.film-metadata dt, .film-metadata dd, .film-metadata p { font-size:84.62%; }
.film-metadata .notice-black {background-color:#1B192C; border-color:#272246;color:#B4B4B4; font-size:0.92em; padding-left:28px;}
.film-metadata dt { float:left; font-weight:bold; margin-right:0.5em; }
.film-metadata dd { margin:0 0 0.5em 0px; padding:0 0 0.5em 0px; border-bottom:1px dotted #475158;}
.film-metadata h3 {font-size:0.95em; color:rgb(152,163,167); font-weight:normal; padding:0 0 0.5em 0; margin:0 0 0.5em 0; }

/*-- Sprite icons ---*/
.film-metadata .expand-heading,
.cinema-view-button .icon,
.film-metadata .technical-info .icon { /*background:url('../components/sprite_bufvc_player_icons.png') no-repeat 100% -1100px*/}
.film-metadata .expand-heading.arrow-up { background-position:100% -1100px; }
.film-metadata .expand-heading.arrow-down { background-position:100% -1150px; }

.metadata.technical-info {margin-bottom:24px;}
.cinema-view-button:hover {color:#B4B4B4;}
.cinema-view-button { color:#B4B4B4; text-decoration:none; position:absolute; bottom:16px; right:16px; z-index:2; }
.cinema-view-button span { display:inline-block; height:16px; vertical-align:bottom; }
.cinema-view-button .icon {  width:37px; background-position: 0% -1301px; text-decoration:none; margin-top:10px;}
.cinema-view-button:hover .icon { background-position:0% -1317px; }
.cinema-view-expanded .cinema-view-button .icon { background-position:0% -1333px; }
.cinema-view-expanded .cinema-view-button:hover .icon { background-position:0% -1349px; }
.cinema-view-button:hover .label {text-decoration:underline;}
.cinema-view-button .label { height:24px; margin-left:0.5em; }
.cinema-view-wrapper { display:block; height:500px; margin:-13px -12px 0 -12px; padding:13px 12px 0 12px; }
.cinema-view-wrapper.hidden { display:none; }
.cinema-view-expanded { position: absolute; left:0; right:0; top:0; z-index:0; flex-flow: column nowrap; padding-top: 1.5em}
.cinema-view-expanded .film-record-container { max-width: 1080px; left:50%; transform:translate(-50%)}
.film-metadata .arrow-down a, .cinema-view-button.cv-opened { color:#FAC800; }
.film-metadata .technical-info .icon {display:inline-block; width:16px; height:16px; text-indent:-99999px; background-position:0% -1200px; }
a.player {cursor:pointer;}
#interview-info-link { color:#D66E4E; position:absolute; right:4px; top:6px; font-size:0.92em}
.cinema-view-expanded .film-metadata-wrapper {width: auto}
.cinema-view-expanded .film-metadata { display: flex; flex-flow: row nowrap; width: 1080px; margin: 0 auto }
.cinema-view-expanded .film-metadata > div {width: 33%;}
.cinema-view-expanded .film-metadata > div:first-of-type {margin-right:30%}
.cinema-view-expanded .metadata{ margin-bottom: 0; margin-top: 16px}


/*-- hack to solve cinema-view button positioning ---*/
dl.clearfix.expand-content:after{ clear:none; }
.please-login-message-mask { position:absolute; background:rgba(33,33,33,0.5); width:100%; height:100%; }
.please-login-message { color:white; margin: 18% 0 0 0; padding: 3em 0 4em; text-align:center;}
.please-login-message span.icon { display:block; margin:0 auto 0.5em auto; width:32px; height:32px; text-indent:-99999px; background:url('../components/sprite_bufvc_player_icons.png') no-repeat 0% -1465px; }
.please-login-message span.text { color:white; }
.please-login-message span a {color:#FEE732; font-weight:bold;}

/*-- Oral Histories -----*/
/*  #D3DAD6  */
.audio-transcript-display{ position:relative; background:#F0F3DD; padding:1em; border:1px solid #E7ECEB; padding-bottom:0.5em; border-bottom-width:0; }
.audio-transcript-display {background:#CDD6D0; }
#oh-metadata {margin-bottom:0.5em;margin-top:0.5em}
#transcript-rolling-screen {margin-top:1em}
#oh-metadata .oh-metadata-title {border:none;color:#3A3A36; margin-bottom:0.5em; text-align:left; margin-left:30px; font-weight:bold; margin-top:0px; padding-top:0px}

#oralhistories-player-wrapper {margin-bottom:1em; background:#FFFFFF; padding:6px; border-radius:6px; border-bottom-left-radius:0px; border-bottom-right-radius:0px }
#oralhistories-player-wrapper #playlist-container { width:100%; color:#3A3A36}
#oralhistories-player-wrapper #playlist-container .chapter-title {width:54%;}
#oralhistories-player-wrapper #playlist-container .chapter-number {width:5%; text-align:right; }
#oralhistories-player-wrapper #playlist-container .chapter-time {width:13%}
#oralhistories-player-wrapper #playlist-container .chapter-section {width:18%; text-align:right;}
#oralhistories-player-wrapper #playlist-container td.chapter-section{padding-right:2%}
#oralhistories-player-wrapper #playlist-container .chapter-description {width:10%; text-align:center}
#oralhistories-player-wrapper #playlist-container tr, #oralhistories-player-wrapper #playlist-container td { background:transparent; padding:0; margin:0 }
#oralhistories-player-wrapper #playlist-container td { padding:4px }
#oralhistories-player-wrapper #playlist-container th {background:#C2D2C7; color:#3A3A36}
#oralhistories-player-wrapper #playlist-container .chapter-sections th{background:#A6A697;}
#oralhistories-player-wrapper #playlist-container a { color:#3A3A36 }
#oralhistories-player-wrapper #playlist-container a.playing { font-weight:bold; }
#oralhistories-player-wrapper #playlist-container a span.icon {text-indent:-100em; overflow:hidden; display:inline-block; width:16px; height:16px; margin-left:0.5em; font-style:italic; color:#D66E4E; display:none; background:url('../components/icons-audio-player.png') no-repeat 0% -48px }
#oralhistories-player-wrapper #playlist-container a span.icon:before{content:"..."}
#oralhistories-player-wrapper #playlist-container a.playing span.icon{display:inline-block}

#oralhistories-player-wrapper #playlist-container .chapter-section a {text-decoration:none}
#oralhistories-player-wrapper #playlist-container .chapter-section a span.icon:before {content:""}
#oralhistories-player-wrapper #playlist-container .chapter-section a span.icon{  vertical-align:bottom;display:inline-block; width:16px; height:16px; text-indent: 50em; overflow:hidden; background:url(../components/icons-audio-player.png) no-repeat 0% -16px}
#oralhistories-player-wrapper #playlist-container .expanded .chapter-section a span.icon {background-position:0% -32px}

.chapter-section-trigger{ cursor:pointer }
/*#oralhistories-player-wrapper #oh-metadata {position:absolute; display:none}*/
#oh-transcrip-display .interview-metadata {margin:0;padding:0; background:transparent}
#oh-transcrip-display .interview-metadata dt { padding: 3px 10px 3px 3px; width:25% ;float:left; text-align:right;font-weight:bold}
#oh-transcrip-display .interview-metadata dd { padding: 3px 3px 3px 5px; margin-left:27%}
#oh-transcrip-display .interview-metadata dt, #oh-transcrip-display .interview-metadata dd {border-width:0}
#oh-transcrip-display .interview-metadata dt:first-child + dd, #oh-transcrip-display .interview-metadata dt:first-child {border-color:#F0F3DD}
#playlist-container p.chapter-description-content { text-align:left;width:190px; background:#3A3A36; color:#F0F3DD; padding:1em; z-index:999999999999; border:2px solid #FFFFFF; border-top-right-radius:8px; border-bottom-right-radius:8px}
#oralhistories-player-wrapper #playlist-container tr.odd { background:#F7F7F7}
#oralhistories-player-wrapper #playlist-container tr.even { background:#E7ECEB}

#oralhistories-player-wrapper #playlist-container tr.chapter-content.expanded { background:#3A3A36 }
#oralhistories-player-wrapper #playlist-container tr.chapter-content.expanded a,
#oralhistories-player-wrapper #playlist-container tr.chapter-content.expanded { color:white }

#oralhistories-player-wrapper .subsection-items th {  }
#oralhistories-player-wrapper #playlist-container td.subsection-wrapper { padding:0; }
#oralhistories-player-wrapper #playlist-container .subsection-items {border:1px solid #A6A697; border-top-width:0; width:100%}
/*#oralhistories-player-wrapper #playlist-container .subsection-items th {background:#7C7C71; color:#C4C6BF}*/
#oralhistories-player-wrapper #playlist-container .subsection-items tr { border-top:1px solid #C4C6BF }
#oralhistories-player-wrapper #playlist-container .subsection-items tr:first-child { border-top-width:0px }
#oralhistories-player-wrapper #playlist-container .subsection-items tr {background:#F0EDE6}

#oralhistories-player-wrapper #playlist-container .subsection-items .section-time {width:20%; text-align:center}
#oralhistories-player-wrapper #playlist-container .subsection-items .section-title {width:64%}
#oralhistories-player-wrapper #playlist-container .subsection-items .section-year {width:10%; text-align:center}

#oralhistories-player-wrapper #playlist-container tr.chapter-content-hover,
#oralhistories-player-wrapper #playlist-container tr.section-content-hover { background:#D94F2C; background:#E1663D; background:#D66E4E}
#oralhistories-player-wrapper #playlist-container tr.chapter-content.chapter-content-hover a,
#oralhistories-player-wrapper #playlist-container tr.chapter-content.chapter-content-hover,
#oralhistories-player-wrapper #playlist-container tr.section-content.section-content-hover a,
#oralhistories-player-wrapper #playlist-container tr.section-content.section-content-hover {color:white}
#oralhistories-player-wrapper #playlist-container tr.chapter-content.chapter-content-hover a.playing span.icon,
#oralhistories-player-wrapper #playlist-container tr.section-content.section-content-hover a.playing span.icon {color:#E7B957;}
#oralhistories-player-wrapper #playlist-container tr.chapter-content.chapter-content-hover a.playing span.icon {background-position:0% -64px}
#oralhistories-player-wrapper #playlist-container tr.chapter-content.expanded a.playing span.icon {background-position:0% -48px}

#oralhistories-player-wrapper #playlist-container .chapter-description-trigger { display:block; margin:0 auto; width:16px; height: 16px; background:url(../components/icons-audio-player.png) no-repeat 0% 0%; overflow:hidden; text-indent:-5em}

#playlist-container p.chapter-description-content:before, #playlist-container p.chapter-description-content:after {
content: "";
position: absolute;
border-bottom: 10px solid transparent;
border-right:10px solid transparent;
top: 50%;
left: 0%;
margin-left: -10px;
}

#playlist-container p.chapter-description-content:before {
border-top: 10px solid #FFFFFF;
border-bottom: 0px solid #FFFFFF; 
border-right:10px solid #FFFFFF;
border-top: 10px solid transparent;
border-left: 10px solid transparent;
border-bottom:10px solid transparent;
margin-left: -20px;
z-index: 1;
}

#playlist-container p.chapter-description-content:after{
border-top: 10px solid #3A3A36;
border-bottom: 10px solid #3A3A36; 
border-right:10px solid #3A3A36;
border-top: 10px solid transparent;
border-left: 10px solid transparent;
border-bottom:10px solid transparent;
margin-left: -17px;
z-index: 1;
}

.audio-transcript-display {background: #F0F3DD;
background-color: #F0F3DD;
background-image: -moz-linear-gradient(top, #F4F5E9, #F0F3DD);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#F4F5E9), to(#F0F3DD));
background-image: -webkit-linear-gradient(top, #F4F5E9, #F0F3DD);
background-image: -o-linear-gradient(top, #F4F5E9, #F0F3DD);
background-image: linear-gradient(to bottom, #F4F5E9, #F0F3DD);
background-repeat: repeat-x;
filter: progid:dximagetransform.microsoft.gradient(startColorstr='#F4F5E9', endColorstr='#F0F3DD', GradientType=0);}

/*#oralhistories-player-wrapper {
background: #272246;
background-color: #272246;
background-image: -moz-linear-gradient(top, #191820, #272246);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#191820), to(#272246));
background-image: -webkit-linear-gradient(top, #191820, #272246);
background-image: -o-linear-gradient(top, #191820, #272246);
background-image: linear-gradient(to bottom, #191820, #272246);
background-repeat: repeat-x;
filter: progid:dximagetransform.microsoft.gradient(startColorstr='#191820', endColorstr='#272246', GradientType=0);
}*/