/****************/
/*** TEMP.css ***/
/****************/
body.headlines div#main_wrap {
  background-color: #000; }

div.headline_wrap {
  position: relative; } /* ensures absolute child DIVs stay inside this container. */

div.headline_shaper {
  line-height: 0; } /* removes phantom padding */

div.headline_preload {
  background: url("../images/rada_loader_drops48_black.gif") no-repeat center #000;
  opacity: 0;
  position: relative;
  z-index: 6; }

div.headline_scroller,
div.headline_root {
  position: absolute; /* overlaps news articles and splash screen */
  top: 0; }

div.headline_scroller {
  line-height: 0; /* removes phantom padding from splash image (possibly induced by HTML whitespace) */
  z-index: 5;
  width: 100%; /* Safari fix for splash image */ }

/*** HEADLINES ***/
div.blogheadlines img {
  width: 100%; }

/* rolling gallery (these elements are generated with JavaScript) */
div.headline_root {
  color: #888;
  overflow: hidden;
  width: 100%; /* Safari fix for headline slides */
}

div.headline_root img.headline_shaper {
  float: left; /* jumps image out of document order, allowing subsequent DIVs to sit on top. Pos: absolute/relative would not work, because the image would no longer be able to act as shaper. */
  opacity: 0.4; }

div.headline_wrapper,
div.headline_navigation {
  position: absolute; /* Wrapper allows entire content to sit over shaper image, navigation allows nav to sit at bottom of text content. */
}
  
div.headline_wrapper {
  height: 100%; /* Fixes height of wrapper to size of shaper. */
  width: 100%; }

div.headline_content {
  background-color: #000;
  float: left; /* Allows image to float beside content. */
  position: relative;
  width: 25%;
  height: 100%; /* Fixes height of text content to size of wrapper (which, in turn, is size of shaper). */
}
  
div.headline_description {
  padding: 2em 2em; }

h2.headline_title {
  color: #CC0033;
  margin: 0 0 1em;
  padding: 0; }

div.headline_navigation {
  bottom: 0; /* positions navigation div to bottom of parent DIV. */
  width: 100%; /* stretches link div to full width (important if links span less than one line). */
}
  
div.headline_gradient {
  background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);
  height: 5em; /* Sets height of gradient overlay. */
}

div.headline_link {
  background-color: #000;
  padding: 1em 2em; }

div.headline_link a:link,
div.headline_link a:visited {
  border: none;
  color: #FFF;
  font-style: italic; }

div.headline_link a:hover,
div.headline_link a:active {
  color: #CC0033; }

div.headline_select_overlay_wrap { /* The overlay wrap is the parent container of the master navigation. */
  background-color: #000;
  position: absolute;
  bottom: 0;
  z-index: 4;
  text-align: right;
  width: 25%; }

div.headline_select_overlay, /* Container for links of master navigation. */
div.headline_select { /* Container for dummy links (acts as shaper against content column link and gradient). */
  background-color: #000;
  line-height: 0; /* removes HTML whitespace */
  margin: 0 2em;
  padding: 0 0 1em;
  text-align: right; }

div.headline_select_overlay a, /* Master navigation link. */
div.headline_select a { /* Shaper navigation link. */
  background-image: url('../images/buttons_radio.png');
  background-position: -22px 0px;
  background-repeat: no-repeat;
  cursor: pointer; /* ensures that pointer is displayed on hover (webkit browsers will NOT do this by default if link does not contain HREF.) */
  display: inline-block;
  height: 22px;
  width: 22px;
  border: none; }

div.headline_select_overlay a.selected {
  background-position: -88px 0px;
  cursor: default; }

div.headline_select_overlay a.selected.autoplay {
  background-position: -44px 0px;
  cursor: default; }

div.headline_select_overlay a:hover.selected {
  background-position: -110px 0px;
  cursor: default; }

div.headline_select_overlay a:hover.selected.autoplay {
  background-position: -66px 0px;
  cursor: default; }

div.headline_select_overlay a:hover {
  background-position: 0px 0px; }

div.headline_image {
  float: left; /* Floats image beside content. */
  width: 75%; }

div.headline_image img {
  width: 100%; }

div.headline_root img.slide, /* Hide injection field from generated output */
div.headline_root h2.title, /* Hide injection field from generated output */
div.headline_root a.link, /* Hide injection field from generated output */
div.carousel_images, /* Hide list of carousel images (RADA Trains) */
body.headlines div.items-row /* Hides articles generated by category blog layout (body#headlines limits this to the home page). */
{
  display: none; }

div.headline_root.current {
  z-index: 3; }
  
div.headline_root.previous {
  z-index: 2; }



/* Experimental hover styling for video page [JED] */
/* To be re-written at some point (usage is convoluted) */
.videogroup {
  clear: both;
  padding: 1em 0 0;
  float: left;
  margin: 0 2em 3em;
  width: 100%; }

#main_wrap a.videolink {
  text-decoration: none; }

#main_wrap .videocontainer img {
  margin: 0; }

.videocontainer {
  font-size: 0.85em;
  color: #FFF;
  font-family: Arial, Verdana, "Century Gothic", "Trebuchet MS", Tahoma, Arial, sans-serif;
  text-transform: uppercase;
  line-height: 1.15em;
  background-color: #000;
  float: left;
  margin: 0 0.3em 2em 0;
  padding: 4px 4px 4px 4px; }

div:hover.videocontainer {
  background-color: #C03; }

.videocontainer a:hover {
  color: #FFF; }

.videolink img {
  float: left; }

#main_wrap span.videobottom {
  color: #FFF;
  float: left;
  clear: both;
  width: 272px;
  height: 50px;}

#main_wrap span.videobottom_238 {
  color: #FFF;
  float: left;
  clear: both;
  width: 238px;
  height: 30px;}

#main_wrap span.videobottom span {
  display: block;
  font-size: 1em;
  margin: 0.5em 1em; }

/* -- Modification to Video Box to use on THE Screen @ RADA -- */
/* -- AristeidsK: 16/08/2011 --------------------------------- */
#main_wrap span.videobottom_scr {
  color: #FFF;
  float: left;
  clear: both;
  width: 200px;
  height: 40px;}

#main_wrap span.videobottom_scr span {
  display: block;
  font-size: 1em;
  margin: 0.5em 1em; }
/* -- End of Modification ------------------------------------ */



/* Profile page layout */
div.prof_zero p {
  margin: 0 1.2em 1.5em 1.55em;
  padding: 0; }

div.prof_zero h5 {
  margin: 0 1em 0.3em 1em;
  padding: 0; }

div.prof_zero {
  margin: 0;
  padding: 0; }

div.allwrap {
  margin: 0;
  padding: 0;
  float: left; }

div.prof_clearheader {
  clear: both; }

div.prof_productions {
  margin: 0;
  padding: 0;
  width: 275px;
  float: right; }

div.prof_middlewrap {
  margin-right: 275px; }

div.prof_biocoursewrap {
  margin: 0 0 2em;
  float: left;
  width: 65%; }

div.prof_bcwtop, #contentdivwrap div.prof_bcwbottom {
  margin: 0 0 2.5em; }

div.prof_picturecontainer {
  float: left;
  width: 35%; }

div.prof_picturehandler {
  float: right;
  max-width: 200px; }

div.prof_picturehandler img {
  margin: 0;
  padding: 0;
  width: 100%;
  float: right; }

span.prof_cliplink {
  margin-left: 14.3em;
  padding: 0; }

span.prof_cliplink img {
  margin: 0;
  padding: 0.3em 0 1.2em; }

div.prof_lowertext {
  margin: 0 0 5em;
  clear: left; }



/* Profile page indentation (WIP) */
.prof_middlewrap .prof_biocoursewrap p {
  margin: 0 0 0 12em; }

.prof_indenttext {
  clear: left;
  float: left;
  margin: 0 !important;
  color: #999;
  font-size: 1em !important;
  font-weight: bold;
  line-height: 120%; }
      
.prof_allwrap h5 {
  color: #999;
  margin: 0.25em 0 !important;
  font-size: 1.5em;
  text-transform: uppercase; }
  
.prof_productions h5 {
  color: #999;
  margin: 0 0 0.5em 1em !important;
  font-size: 1.5em;
  text-transform: uppercase; }

.prof_bcwhearmespeak h5 {
  margin: 1.5em 0 0 0 !important; }

.prof_cliplink {
  margin: 0 0 0 12em !important; }



/* Temporary fix in order to force the width of profile pages.  Might come in handy for general footers, too, though there must be a more elegant way of maintaining the width, surely ... */
.forcewidth {
  line-height: 1%; }

/* Tidies search results when new search field appears beside a couple of profile results */
div.searchdb {
  clear: both;
  margin-top: 5em; }

/* Adds a little bottom margin to the search criteria results box of the profile search */
.searchcriteria {
  margin-bottom: 2em; }

/* Search criteria styling */
.criterialabel {
  float: left;
  width: 12em;
  font-weight: bold; }

/* Search criteria styling */
.criteriatext {
  float: left;
  text-transform: uppercase;
  color: #888; }

/* Profile page indentation (WIP) */
.prof_middlewrap .prof_biocoursewrap p {
  margin: 0 0 0 12em; }

.prof_indenttext {
  float: left;
  margin: 0 0 0 1.55em;
  color: #999;
  font-size: 1.2em;
  font-weight: bold;
  line-height: 120%; }


/* PROFILES Gallery */
h2.db_course_title {
  clear: both; }

ul.inside_db_menu {
  list-style-type: none;
  margin: 0;
  padding: 0; }

ul.inside_db_menu li {
  margin: 0 2%;
  padding: 0;
  float: left; }

.profilegallery_zero {
  display: block;
  margin: 0;
  padding: 0;
  width: 10em; }

.profilegallery_photo {
  margin: 0;
  padding: 0;
  background-image: url("../../../rada_files/images/no_photo_background.png");
  background-position: center center;
  background-repeat: no-repeat;
  overflow: auto;
  display: block; }

.profilegallery_photo img {
  border: 7px solid #000;
  display: block;
  margin: 0 auto; padding: 0;
  width: 120px;
  height: 150px; }

.profilegallery_name {
  margin: 0.75em 0 0; padding: 0;
  font-size: 1.5em;
  font-weight: normal;
  text-align: center;
  height: 4em;
  display: block; }

a:link .profilegallery_name,
a:visited .profilegallery_name {
  color: #888; }

a:hover .profilegallery_name,
a:active .profilegallery_name {
  color: #CC0033; }



/* Temporary styling of DB menu */
#leftnav ul li.selected a {
  background: #CC0033; }

#leftnav ul.topmenu {
  padding-bottom: 2.5em; }

#contentdivwrap ul.inside_db_menu {
  list-style-type: none;
  padding-bottom: 3em; }
  
  
  
/* Productions Whilst at RADA */
.prodwar_header {
  font-weight: bold;
  color: #999; }

.prodwar_productions {
  list-style: none;
  margin: 0 0 1.5em 0; padding: 0; border: 0; }

.prodwar_productions li {
  margin: 0 1.5em 0 1.5em; padding: 0; border: 0; }



/* Red Button Link (as used on Big Give page) */
p.red-button {
  overflow: auto; }

p.red-button a {
  background-color: #CC0033;
  border: 0;
  border-radius: 2px;
  display: block;
  font-size: 1.5em;
  margin: 1em 0;
  overflow: auto;
  padding: 0.3em 0;
  text-align: center;
  text-transform: uppercase; }

p.red-button a:link,
p.red-button a:visited {
  color: #FFF; }

p.red-button a:hover,
p.red-button a:active {
  background-color: #DDD;
  color: #000; }

p.red-button.onblack a:hover,
p.red-button.onblack a:active {
  background-color: #FFF;
  color: #000; }