/*Custom colours*/
.inner.bg-black{
	background: rgba(0, 0, 0, 0.25);
}
.inner-colour{
	width: 100%;
	height: 100%;
	float: left;	
	padding: 10px;
  min-height: 100%;
}
.inner-colour{
	background: rgba(0, 0, 0, 0.0);
	}

.inner-colour a{
  float: left;
  }

.inner-colour:hover{
	background: rgba(0, 0, 0, 1);
}
.intl .inner-colour{
	background: rgba(245, 89, 29, 0);
}
.intl .inner,
.intl .inner:hover,
.intl .inner-colour:hover{
	background: rgba(245, 89, 29, 1);
}

.text-date{
	color: #00c7a7;
}
.intl .text-date{
	color: #12199b;
}

.inner.bg-red:hover .text-navy,
.inner.bg-green:hover .text-navy
{color: #00c7a7;}


.programme-wrapper {
  margin: 0 auto 0 auto;
  width: 1010px;
  max-width: 100%;
}

@media only screen and (max-width: 580px) {
.container.bg-navy.programme-grid {
  padding-left: 0px;
  padding-right: 0px;
  width: 100%;
}
}

ul.masonry * {
  word-break: break-word;
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

ul.masonry {
  width: 100%;
  max-width: 100%;
  padding: 0px;
  margin-bottom: 100px;
  margin-left: 30px;
  float: left;
  opacity: 0;
  min-height: 400px;
}

@media only screen and (max-width: 1024px) {
ul.masonry {
  margin-left: 0;
}
}

.masonry-wrap {
  float: left;
  width: 100%;
  max-width: 100%;
}

ul.nav-bar.loading {
  background-image: url(../images/site/loader.gif);
  background-repeat: no-repeat;
  background-position: 16% center;
  background-size: 30px 30px;
}

ul.masonry li {
  width: 19%;
  min-height: 300px;
  max-width: 100%;
  list-style: none;
  margin: 0;
  overflow: hidden;
}
ul.masonry li .inner-colour {
  min-height: 300px;
}

@media only screen and (max-width: 1024px) {
ul.masonry li {
  width: 50%;
  min-height: 200px;
}  
ul.masonry li .inner-colour {
  min-height: 200px;
  padding: 20px;
}
}

@media only screen and (max-width: 580px) {
ul.masonry li {
  width: 100%;
}  
}

ul.masonry li a {
  float: left;
  border: 0;
  padding: 0;
  margin: 0;
}

ul.masonry li .favorites {
  float: left;
}

ul.masonry li .padded-wrap .inner .h2 {
  margin: 0;
  word-break: break-all;
}

ul.masonry li .inner {
  width: 100%;
  max-width: 100%;
  position: relative;
  height: 100%;
  min-height: 100%;
  background-size: cover;
  background-position: center center;
  float: left;
}

ul.masonry li .padded-wrap {
  width: 100%;
  max-width: 100%;
  padding: 10px;
  float: left;
}

@media only screen and (max-width: 580px) {
ul.masonry li .padded-wrap {
  padding: 0;
}  
ul.masonry li .padded-wrap.gap-bottom-s {
  margin-bottom: 1px;
}  
}

ul.masonry li .favorites {
  width: 100%;
  max-width: 100%;
  padding: 10px;
  float: left;

}

.grid-sizer { width: 19%; }

@media only screen and (max-width: 1024px) {
.grid-sizer { 
  width: 50%; 
  }
}


ul.masonry li.grid-s {
  width: 19%;
  min-height: 200px;
  max-width: 100%;
  float: left;
  list-style: none;
}

ul.masonry li.grid-s .inner-colour {
  min-height: 200px;
}

@media only screen and (max-width: 1024px) {
ul.masonry li.grid-s {
  width: 50%;
  min-height: 200px;
}  
ul.masonry li.grid-s .inner-colour {
  min-height: 200px;
}
}

@media only screen and (max-width: 580px) {
ul.masonry li.grid-s {
  width: 100%;
}  
}

ul.masonry li.grid-m  {
  width: 19%;
  min-height: 300px;
  max-width: 100%;
  float: left;
  list-style: none;
}
ul.masonry li.grid-m .inner-colour {
  min-height: 300px;
}

@media only screen and (max-width: 1024px) {
ul.masonry li.grid-m {
  width: 50%;
  min-height: 200px;
}  
ul.masonry li.grid-m .inner-colour {
  min-height: 200px;
}
}

@media only screen and (max-width: 580px) {
ul.masonry li.grid-m {
  width: 100%;
}  
}

ul.masonry li.grid-l {
  width: 38%;
  min-height: 400px;
  max-width: 100%;
  float: left;
  list-style: none;
}
ul.masonry li.grid-l .inner-colour {
  min-height: 400px;
}

@media only screen and (max-width: 1024px) {
ul.masonry li.grid-l {
  width: 100%;
  min-height: 200px;
} 
ul.masonry li.grid-l .inner-colour {
  min-height: 200px;
} 
}

/* Pagination */
ul.masonry ul.pagination.pagination-lg {
  position: absolute;
  bottom: -70px;
  width: 100%;
  max-width: 100%;
  color: white;
  text-align: center;
}

ul.masonry ul.pagination.pagination-lg strong{
  padding: 0 5px;
  text-decoration: underline;
}

ul.masonry ul.pagination.pagination-lg a{
  color: white;
  padding: 0 5px;
}

ul.masonry ul.pagination.pagination-lg li {
  width: auto;
  min-height: 30px;
}

ul.masonry ul.pagination.pagination-lg li a {
  color: white;
}


/* Over ride Font sizes on mobile */

@media only screen and (max-width: 1024px) {
ul.masonry .text-white.text-thin.text-xl, 
ul.masonry .text-date.text-thin.text-xl, 
ul.masonry .text-white.text-thin.text-xxl, 
ul.masonry .text-date.text-thin.text-xxl, 
ul.masonry .text-white.text-thin.text-m, 
ul.masonry .text-date.text-thin.text-m,
ul.masonry .text-white.text-thin.text-s
ul.masonry .text-date.text-thin.text-s {
  font-size: 28px;
  line-height: 30px;
  font-weight: 300;
}  
}


@media only screen and (max-width: 767px) {
ul.masonry .text-thin 
{
  font-size: 20px!important;
  line-height: 25px!important;
  font-weight: 400!important;
}  
}




/* Filter Styling */

#filters {
float: left;
width: 100%;
max-width: 100%;
padding: 0px 0;
position: relative;
z-index: 2;
text-align: left;
}






@media only screen and (max-width: 1024px) {
#filters {
display: none;
}
}

/*	--------------------------------------------------
   	Nav Bar with Dropdowns
	-------------------------------------------------- */
	
	.nav-bar {
    padding-left: 110px;
	}	
	.nav-bar>li { 
	float: left; display: block; position: relative; padding: 0; margin: 0; 
	background: #12199b;
	padding: 6px;
	height: 22px;
	border: 1px solid #fff;
	border-left: none;
  /*border-right: none;*/
		}
	.nav-bar>li:hover{ 
	background: #fff;
	border: 1px solid #fff;
		border-left: none;
	
	/*border-right: none;*/
  }
  .nav-bar>li:first-child{
  	border-left: 1px solid #fff;
  	
  }

  .nav-bar>li:last-child,
  .nav-bar>li:nth-last-child(1){ 
  border: 1px solid transparent;
    	padding: 8px 0 10px 10px;
  
  /*border-right: none;*/
  }

  .nav-bar>li:last-child:hover,
  .nav-bar>li:nth-last-child(1):hover{ 
  border: 1px solid transparent;
  background: transparent;
  
  /*border-right: none;*/
  }

  .nav-bar>li:last-child:hover>a.main,
  .nav-bar>li:nth-last-child(1):hover>a.main{ 
  color: #ffffff;
  }

	.nav-bar>li:hover>a.main{
	color: #12199b;
	}
	.nav-bar>li:hover.has-flyout>a.flyout-toggle span { 
	 content: ""; width: 0; height: 0; 
	 border-left: 4px solid transparent;border-right: 4px solid transparent; border-top: 4px solid #12199b; display: block; }
	
	/*.nav-bar>li:last-child{
		background: #fff;
		padding: 10px;
		height: 30px;
		color: #12199b;
 		border: 1px solid #fff;
		border-left: 1px solid #fff;
		}*/

	.bg-navy button.nav-bar-button {
		padding-top: 0px!important;
		color: #12199b;
    border: 0;
		}
	.nav-bar>li>a.main { 
	position: relative; 
  padding: 0 10px; 
  margin-top: 2px;
  display: block; 
  text-decoration: none;
	color: white;
		
	 }
	.nav-bar>li>input { margin: 0; }
	.nav-bar>li ul { margin-bottom: 0; }
	.nav-bar>li li { }
	.nav-bar>li.has-flyout>a.main { padding-right: 30px; }
	.nav-bar>li.has-flyout>a.flyout-toggle { position: absolute; right: 0; top: 0; padding: 15px 17px; z-index: 2; display: block; }
	.nav-bar>li.has-flyout>a.flyout-toggle span { 
	 content: ""; width: 0; height: 0; 
	 border-left: 4px solid transparent;border-right: 4px solid transparent; border-top: 4px solid #ffffff; display: block; }
	.flyout { background: #ffffff; margin: 0; padding: 20px; position: absolute; top: 34px; left: -1px; width: 300px; z-index: 40; }
  .flyout ul li {margin-bottom: 0;}
	.flyout.small { width: 175px; }
	.flyout.large { width: 550px; }
	.flyout.right { left: auto; right: 0; }
	.flyout p:last-child { margin-bottom: 0; }
	.nav-bar>li .flyout { display: none; }

.nav-bar {
  text-align: center;
  border: 0;
  margin: 0;
  font-size: 0;
}

.nav-bar > li {
  display: inline-block;
  float: none;
  text-align: left;
  vertical-align:top;
}
.flyout label{	font-size: 12px;		color: #12199b;
font-weight: 600;

}