
/* =================================== */
/* /css/grid.css */
/* ----------------------------------- */

/* using techniques takern from
 * http://github.com/nathansmith/960-Grid-System/blob/master/code/css/uncompressed/960.css
 */

.container_4 {
  margin-left: auto;
  margin-right: auto;
  width: 888px;
}

.container_3,
.container_2,
.container_1,
.grid_1,
.grid_2,
.grid_3,
.grid_4 {
	display: inline;
	float: left;
	position: relative;
	margin-left: 10px;
	margin-right: 10px;
  /* outline: dotted 1px orange; */
}

.container_3,
.container_2,
.container_1 {
  margin-left: 0;
  margin-right: 0;
}

.container_1 {
  width: 222px;
}
.container_2 {
  width: 444px;
}
.container_3 {
  width: 666px;
}
.container_1 .grid_1,
.container_2 .grid_1,
.container_3 .grid_1,
.container_4 .grid_1 {
  width: 202px;
}

.container_2 .grid_2,
.container_3 .grid_2,
.container_4 .grid_2 {
  width: 424px;
}

.container_3 .grid_3,
.container_4 .grid_3 {
  width: 646px;
}

.container_4 .grid_4 {
  width: 868px;
}

.padded {
	padding-left: 10px;
	padding-right: 10px;
}
.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}
.alpha{margin-left:0}
.omega{margin-right:0}
.clearfix:after {
	clear: both;
	content: ' ';
	display: block;
	font-size: 0;
	line-height: 0;
	visibility: hidden;
	width: 0;
	height: 0;
}

* html .clearfix,
*:first-child+html .clearfix {
	zoom: 1;
}




/* =================================== */
/* /css/our-space.css */
/* ----------------------------------- */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin:0; padding:0; }
table { border-collapse:collapse; border-spacing:0; }
fieldset,img { border:0; }
address,caption,cite,code,dfn,em,strong,th,var { font-style:normal; font-weight:normal; }
ol,ul { list-style:none; }
caption,th { text-align:left; } h1,h2,h3,h4,h5,h6 { font-size:100%; font-weight:normal; }
q:before,q:after { content:''; }
abbr,acronym { border:0; }


body, html {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  color: #fff;
}
body, html, button {
  font: normal 14px/20px Helvetica, Arial, sans-serif;
}
body {
  background: #014394 url(/i/stars-2.png) 50% 0 repeat-y;
}

h2 {
  font-size: 20px;
  color: #8bc540;
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-bottom: 16px;
  font-weight: bold;
  zoom: 1;
}

a {
  color: #35add4;
  text-decoration: none;
  font-weight: bold;
}
a:hover {
  text-decoration: underline;
  color: #fff;
}

#lines {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: -1;
  background: transparent url(/i/lines-2.png) 50% 0 no-repeat;
}

#outer {
  width: 980px;
  display: table;
  margin: 0 auto;
  padding-top: 30px;
  padding-bottom: 30px;
}

#inner {
  width: 980px;
  display: table;
  margin: 0 auto;
}
#inner #inner-top {
  background: transparent url(/i/inner-top.png) 0 0 no-repeat;
  height: 45px;
}
#inner #inner-bottom {
  background: transparent url(/i/inner-bottom.png) 0 0 no-repeat;
  height: 45px;
}
#inner #inner-content {
  background: transparent url(/i/inner-middle.png) 0 0 repeat-y;
  padding-bottom: 50px;
}

#inner #inner-content #content {
  padding: 0 10px;
}

#head {
  height: 45px;
  position: relative;
}
#home #head {
  height: 142px;
  position: relative;
}
#logo {
  position: absolute;
  display: table;
  margin: 0 auto;
  padding: 0;
  width: 100%;
  height: 74px;
  top: -55px;
  background: transparent url(/i/logo.png) 50% 0 no-repeat;
}
#logo a {
  display: block;
  height: 74px;
  text-indent: -9999px;
}
#home #logo {
  height: 176px;
  background: transparent url(/i/logo-home.png) 50% 0 no-repeat;
  top: -55px;
}
#home #logo a {
  height: 176px;
}

#navigation {
  border-bottom: solid 1px #fff;
}
#navigation ul {
  width: 720px;
  margin: 0 auto;
}
#navigation ul li {
  float: left;
  width: 162px;
  height: 39px;
  position: relative;
  padding: 0 8px;
}
#navigation ul li.last {
  padding: 0 9px;
}
#navigation ul li a {
  display: block;
  text-align: center;
  color: #000;
  text-transform: uppercase;
  font-size: 20px;
  text-decoration: none;
  letter-spacing: 2px;
  background: transparent url(/i/tab-repeat.png) 0 0px repeat-x;
  padding-top: 9px;
  height: 30px;
}
#navigation ul li a:hover {
  color: #fff;
}
#navigation ul li.active a {
  color: #fff;
}
#navigation ul li span.end {
  position: absolute;
  display: block;
  left: 0;
  top: 0;
  width: 9px;
  height: 100%;
  background-image: url(/i/tab-ends.png);
  background-repeat: no-repeat;
  background-position: 0 1px;
}
#navigation ul li span.end.r {
  background-position: -9px 1px;
  left: auto;
  right: 0;
  width: 8px;
}
#navigation ul li.last span.end.r {
  width: 9px;
}


#sub-navigation {
  display: table;
  margin: 0 auto;
}
.sub-nav-wrap {
  padding-bottom: 10px;
  border-bottom: dashed 1px #bfc8c9;
  margin-bottom: 20px;
}
#sub-navigation li {
  float: left;
  margin-right: 10px;
  padding-left: 10px;
  border-left: solid 1px #fff;
}
#sub-navigation li.first {
  border-left: none;
}
#sub-navigation li a {
  text-transform: uppercase;
  font-size: 17px;
  color: #fff;
}
#sub-navigation li a:hover,
#sub-navigation li.active a {
  color: #8bc540;
}
.description {
  font-weight: bold;
  padding-top: 16px;
  padding-bottom: 16px;
  border-bottom: dashed 1px #bfc8c9;
  margin-bottom: 20px;
  zoom: 1;
}

.description strong {
  color: #8bc540;
  font-weight: bold;
}

.description p + p {
  margin-top: 10px;
}
.empty-description {
  height: 20px;
}
.theme-list .theme,
.video-list .video {
  font-size: 11px;
  line-height: 13px;
  margin-bottom: 20px;
  float: none;
  display: -moz-inline-stack;
  display: inline-block;
  vertical-align: top;
  width: 202px;
  *display: inline;
  /* outline: solid 1px orange; */
  margin-right: 2px;
}


.theme-list .theme .title a,
.video-list .video .title a {
  display: block;
  font-size: 16px;
  line-height: 18px;
  font-weight: bold;
  color: #fff;
  margin-bottom: 0;
  padding-bottom: 3px;
  text-decoration: none;
}
.theme-list .theme .title a img,
.video-list .video .title a img {
  border: solid 2px #35add4;
}
.theme-list .theme .title a:hover img,
.video-list .video .title a:hover img {
  border: solid 2px #fff;
}
.theme-list .theme .title a:hover,
.video-list .video .title a:hover {
  color: #35add4;
  text-decoration: underline;
}
.theme-list .theme .description,
.video-list .video .description {
  font-weight: normal;
  color: #cad9dc;
  margin: 0;
  padding: 0;
  border: none;
}
.video-list .video .tags {
  padding-top: 3px;
  font-size: 11px;
  line-height: 14px;
}

.video-list .video .tags strong {
  text-transform: uppercase;
  font-weight: bold;
  color: #8bc540;
}
#home .video-list .video h3 a {
  color: #fff;
  font-weight: bold;
  text-decoration: none;
}
#home .video-list .video h3 a:hover {
  text-decoration: underline;
}
#home .video-list .video .description,
#home .video-list .video .tags {
  display: none;
}

#home .introduction  {
  color: #cad9dc;
  font-size: 12px;
  line-height: 16px;
  /* margin-top: 8px; */
  padding-bottom: 8px;
  border-bottom: dashed 1px #bfc8c9;
  margin-bottom: 20px;
}

#home .introduction p {
  margin-bottom: 10px;
}
.copy ul,
#home .introduction ul {
  list-style-type: disc;
  list-style-position: outside;
  margin-bottom: 10px;
}
.copy ul li,
#home .introduction ul li {
  margin-bottom: 5px;
  margin-left: 16px;
}

#home #player {
  margin-bottom: 16px;
}
#video-search p {
  margin-bottom: 10px;
}
#video-search form {
  border-bottom: dashed 1px #bfc8c9;
  /* border-top: dashed 1px #bfc8c9; */
  /* padding-top: 10px; */
  margin-bottom: 16px;
}
#video-search .search-entry {
  position: relative;
  float: left;
}
#video-search .search-entry label {
  display: none;
  /* position: absolute; */
  /* z-index: 10; */
  /* left: 0; */
  /* top: 0; */
  /* width: 100%; */
  /* color: #ccc; */
}
#video-search .search-entry input.text {
  z-index: 9;
  border: none;
  line-height: 20px;
  padding: 2px 4px;
  height: 20px;
  width: 160px;
}

#video-search form button.submit {
  border: none;
  background: transparent url(/i/go-btn.png) 0 0 no-repeat;
  text-indent: -9999px;
  line-height: 24px;
  cursor: pointer;
  padding: 0;
  width: 38px;
  height: 26px;
  float: left;
}
#video-search form button.submit:hover {
  color: #35add4;
}
#video-search h2 {
  margin-bottom: 5px;
}
#video-search ul {
  border-bottom: dashed 1px #bfc8c9;
  border-top: dashed 1px #bfc8c9;
  padding-top: 10px;
  padding-bottom: 10px;
  margin-bottom: 10px;
}

.search-results p {
  margin-bottom: 16px;
}
.search-results p strong {
  color: #35add4;
  font-weight: bold;
}
.theme-subnav {
  padding-bottom: 16px;
}
.theme-subnav h2 {
  border-bottom: dashed 1px #bfc8c9;
  padding-bottom: 16px;
}
.theme-subnav ul li.active a {
  color: #fff;
}
.break {
  border-top: dashed 1px #bfc8c9;
  padding-top: 16px;
}

.individual-video {
  margin-top: 20px;
}
.individual-video .description {
  font-weight: normal;
  margin: 0;
  padding-top: 8px;
  padding-bottom: 8px;
  color: #cad9dc;
  border: none;
}
.individual-video h3 {
  font-weight: bold;
  color: #fff;
  font-size: 26px;
  line-height: 30px;
  margin-bottom: 0px;
}

#related-media {
  /* border-bottom: dashed 1px #bfc8c9; */
  /* padding-bottom: 10px; */
  margin-bottom: 16px;
}
#related-media .others {
  padding-bottom: 10px;
}
#related-media h4 {
  font-weight: bold;
  font-size: 18px;
  padding-top: 10px;
  border-bottom: dashed 1px #bfc8c9;
  padding-bottom: 10px;
  margin-bottom: 10px;
  width: 630px;
  position: relative;
}
#related-media h4 a {
  display: block;
  position: absolute;
  right: 10px;
  top: 17px;
  font-size: 14px;
  line-height: 14px;
}
.asset-group {
  padding-top: 16px;
  border-top: dashed 1px #bfc8c9;
}
.asset {
  /* margin-left: 10px; */
  /* margin-right: 10px; */
  width: 300px !important;
  vertical-align: top;
  float: none;
  display: -moz-inline-stack;
  display: inline-block;
  margin-bottom: 20px;
  zoom: 1;
  *display: inline;
}
.asset .info {
  padding-top: 0px;
  float: left;
  width: 210px;
}
.asset .info .download i {
  font-weight: normal;
  font-size: 11px;
  line-height: 18px;
  margin-left: 5px;
  color: #cad9dc;
  position: relative;
  top: -2px;
}
.asset .info em {
  font-weight: normal;
  font-size: 12px;
}
.asset p {
  margin-bottom: 6px;
  font-weight: bold;
}
.asset .icon {
  width: 78px;
  height: 78px;
  overflow: hidden;
  display: block;
  float: left;
  border: solid 2px #35add4;
  margin-right: 8px;
}
.asset .icon.empty {
  border: none;
}
.icon img {
  left: 0;
  top: 0;
  position: relative;
  z-index: 0;
}
.icon.page img {
  left: -60px;
  top: -15px;
}
.asset .icon.empty span {
  display: block;
  width: 78px;
  height: 78px;
  background: transparent url(/i/icon-video.png) 0 0 no-repeat;
}
.asset.video .icon.empty span {
  background-image: url(/i/icon-video.png);
}
.asset.audio .icon.empty span {
  background-image: url(/i/icon-audio.png);
}
.asset.image .icon.empty span {
  background-image: url(/i/icon-image.png);
}
.asset.doc .icon.empty span {
  background-image: url(/i/icon-doc.png);
}
.asset.ppt .icon.empty span {
  background-image: url(/i/icon-ppt.png);
}
.asset.mixed .icon.empty span {
  background-image: url(/i/icon-mixed.png);
}
.asset.link .icon.empty span {
  background-image: url(/i/icon-link.png);
}
.asset .download a {
  display: block;
  float: left;
  left: 0;
  height: 18px;
  line-height: 18px;
  color: #ed5b29;
  font-weight: normal;
  font-size: 12px;
  padding-left: 20px;
  background-image: url(/i/download-icon.png);
  background-repeat: no-repeat;
  background-position: 0 0;
  position: relative;
  z-index: 100;
}

.asset .download a span {
  z-index: 2000;
  display: none;
  position: absolute;
  top: 110%;
  left: 20px;
  width: 200px;
  font-weight: normal;
  font-size: 12px;
  line-height: 14px;
  text-decoration: none;
  color: #fff;
  background-color: #ed5b29;
  padding: 3px 5px;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
}

.asset .download.first a span {
  top: 210%;
}
.asset.link .download a,
.asset.mixed .download a {
  background-image: url(/i/visit-icon.png);
}
.asset .download a:hover span {
  display: block;
  text-decoration: none;
  z-index: 100;
  color: #fff;
}
.asset .download {
  margin-bottom: 0;
  position: relative;
  z-index: 1;
  width: auto;
  float: none;
  display: block;
}
.about .description {
  margin-bottom: 10px;
}
.copy {
  color: #cad9dc;
  padding-right: 20px;
}
.competition .copy {
  border-right: dashed 1px #bfc8c9;
}
.copy p {
  margin-bottom: 16px;
}

.copy img {
    border: solid 2px #0d7cc4;

}
.copy .image-left {
  float: left;
  margin-right: 16px;
}

.copy h3 {
  font-weight: bold;
  color: #fff;
  margin-bottom: 10px;
}
#home .introduction ol,
.copy ol {
  list-style-type: decimal;
  list-style-position: outside;
  margin-left: 20px;
  margin-bottom: 16px;
}
#home .introduction ol li,
.copy ol li {
    margin-bottom: 5px;
}

.copy strong,
.copy b {
  font-weight: bold;
}
.copy em,
.copy i {
  font-style: italic;
}
#competition-entry {
  border-left: dashed 1px #bfc8c9;
  padding-left: 10px;
}

#competition-entry h2 {
  border-bottom: dashed 1px #bfc8c9;
  padding-bottom: 8px;
}

#competition-entry .message,
#competition-entry .logged-in {
  color: #cad9dc;
  margin-bottom: 16px;
  line-height: 16px;
}
#competition-entry .message {
  background-color: #0d7cc4;
  padding: 10px;
  color: #fff;
  margin-bottom: 16px;
}
#competition-entry .message p {
  margin-bottom: 10px;
}
#competition-entry .logged-in em {
  color: #fff;
}
#competition-entry .logged-in a {
  font-weight: normal;
}

#competition-entry .error {
  font-size: 12px;
  line-height: 14px;
  margin-bottom: 16px;
  background-color: #c00;
  color: #fff;
  padding: 10px;
}
form .field {
  position: relative;
  margin-bottom: 8px;
}
form .field label {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 10;
  color: #666;
  font-weight: normal;
  font-size: 12px;
  font-style: italic;
}
#competition-submit form .field label {
  display: block;
  position: static;
  color: #cad9d1;
  padding: 0px;
  font-style: normal;
  font-weight: bold;
}
form .field label,
form .field input.text {
  padding: 2px 4px;
  line-height: 20px;
  height: 20px;
}
form .field input.text {
  position: relative;
  z-index: 0;
  zoom: 1;
}
form .field input.text,
form .field textarea {
  padding: 2px 4px;
  border: none;
  width: 183px;
}

form .field.file {
  background-color: #fff;
  padding: 4px 4px;
  width: 183px;
}

form .field.checkbox {
  border-bottom: dashed 1px #bfc8c9;
  padding-bottom: 8px;
}
form .field.select label,
form .field.checkbox label {
  display: inline !important;
  position: static !important;
  color: #cad9dc !important;
  font-style: normal !important;
  line-height: 14px !important;
  background-color: transparent !important;
}
form .field.select label {
  display: none !important;
}
form .field.select select {
  width: 191px;
}
form button.submit {
  border: none;
  background: transparent url(/i/submit-btn.png) 0 0 no-repeat;
  display: block;
  width: 58px;
  height: 12px;
  text-indent: -9999px;
  padding: 0;
  cursor: pointer;
}
form button.submit:hover {
  background-position: 0 -30px;
}

form p.submit {
  margin-bottom: 16px;
  border-bottom: dashed 1px #bfc8c9;
  padding-bottom: 8px;
  padding-top: 4px;
}

form p.entry {
  font-weight: bold;
  padding-bottom: 8px;
  margin-bottom: 16px;
  border-bottom: dashed 1px #bfc8c9;
}
form p.or {
  text-align: center;
  font-weight: bold;
  padding-bottom: 8px;
}

#home .partners {
  background-color: #fff;
  padding-top: 10px;
  padding-bottom: 10px;
  display: table;
  margin: 0 auto;
}
#home .partners .partner {
  padding-left: 15px;
  padding-right: 15px;
  vertical-align: middle;
  display: table-cell;
}

.partners.about .partner {
  margin-bottom: 24px;
}
.partners.about .partner h3 {
  color: #fff;
  font-size: 16px;
  margin-bottom: 0;
}
.partners.about .partner h3 a {
  color: #fff;
}
.partners.about .partner .info,
.partners.about .partner .logo {
  /* float: left; */
}
.partners.about .partner .logo {
  background-color: #fff;
  text-align: center;
  padding: 10px;
  width: 182px;
}
.partners.about .partner .logo img {
  border: none;
}

#footer {
  position: relative;
  padding-bottom: 150px;
  font-size: 11px;
  color: #555;
  left: 32px;
}
#footer div {
  position: absolute;
  right: 0;
  width: 305px;
  height: 24px;
  line-height: 24px;
  background: transparent url(/i/footer-bg.png) 0 0 no-repeat;
  text-align: right;
  padding-right: 16px;
}
#footer a {
  color: #192d2a;
  /* color: #fff; */
  font-weight: bold;
}

#asset-nav {
  margin-bottom: 16px;
}
.back-to-top {
  border-top: dashed 1px #bfc8c9;
  margin-bottom: 16px;
  padding-top: 16px;
}

.theme .preview {
  position: relative;
  width: 198px;
  height: 111px;
  border: none;
  margin-bottom: 6px;
}
.theme-list .theme .title .preview a {
  position: absolute;
  display: block;
  width: 96px;
  height: 52px;
  overflow: hidden;
  border: 2px solid #35ADD4;
  padding-bottom: 0;
}
.theme-list .theme .title .preview:hover a {
  border-color: #fff;
}
.theme .preview a.pos_1 {
  left: 0;
  top: 0;
}
.theme .preview a.pos_1 img {
  left: 0;
  top: 0;
}
.theme .preview a.pos_2 {
  left: 102px;
  top: 0;
}
.theme .preview a.pos_2 img {
  left: -96px;
  top: 0;
}
.theme .preview a.pos_3 {
  left: 0;
  top: 58px;
}
.theme .preview a.pos_3 img {
  left: 0;
  top: -52px;
}
.theme .preview a.pos_4 {
  left: 102px;
  top: 58px;
}
.theme .preview a.pos_4 img {
  left: -96px;
  top: -52px;
}
.theme-list .theme .title .preview a img {
  border: none;
  position: absolute;
}


.player-overlay {
  position: relative;
  background-repeat: no-repeat;
}

.player-button {
  left: 0;
  top: 0;
  position: absolute;
  width: 92px;
  height: 85px;
  background: transparent url(/i/play.png) 0 0 no-repeat;
  cursor: pointer;
}

p.player {
	margin-bottom: 40px;
}

#home .video-list .asset {
	width: 202px !important;
	float: none;
	display: inline-block;
}
#home .video-list .asset .info {
	width: 102px !important;
}

#shortlist {

}
#shortlist .entry {
	padding-bottom: 20px;
	margin-bottom: 20px;
  border-bottom: dashed 1px #bfc8c9;
}
#shortlist .entry h2 {
	margin-bottom: 0;
}
#shortlist .entry h3 {
	color: #fff;
	font-size: 18px;
	margin-bottom: 10px;
}
#shortlist .entry h4 {
  color: #bfc8c9;
	margin-top: 20px;
	font-size: 12px;
}
#shortlist .entry h4 em {
	margin-right: 15px;
}
#shortlist .entry h4 em {
}
#shortlist .entry .entry-description {
	font-style: italic;
}

