/***************************
VIRTUAL ORCHESTRA GRID
***************************/

h1 { width: 100%; }
h4 { padding: 0 10px 2px; min-height: 20px; }

/* FRAMEWORK */
.virtual_orchestra_single { float: left; position: relative; width: 98%; margin: 0 auto; margin-left: 1%; }

.box_B { box-shadow: 0 0 1px 0 #D0D0D0; }

.top { margin-top: 5%!important; }
.bottom { margin-bottom: 5%!important; }	

.half-top { margin-top: 3.5%!important; }
.half-bottom { margin-bottom: 3.5%!important; }	

.quarter-top { margin-top: 2%!important; }
.quarter-bottom { margin-bottom: 2%!important; }

section { float: left; width: 100%; box-sizing: border-box; }
section.spacer { height: 20px; }
.text_padding { padding: 0 20px 10px; }

article { background: #EEE; margin-top: 20px; }
article.event_landscape { padding: 0 0 20px 0; }
article.event_portrait { padding: 0; }

.col_12 { box-sizing: border-box; }

.col9 { float: left; position: relative; width: 69.5%; overflow: hidden; box-sizing: border-box; }
.col3 { float: left; position: relative; width: 30%; overflow: hidden; }
.col4 { float: left; position: relative; width: 60%; overflow: hidden; box-sizing: border-box; }
.colmargin { margin-right: 0.5%; }

.responsive_img_landscape { padding-bottom: 25%; }
.responsive_img_portrait_large { padding-bottom: 35%; margin-bottom: -35%;  }
.responsive_img_portrait_medium { padding-bottom: 35%; margin-bottom: -35%;  }
.responsive_img_portrait_small { padding-bottom: 35%; margin-bottom: -15%;  }

.responsive_img_bg { background-position: center center!important; background-repeat: no-repeat!important; background-size: cover!important; }
.responsive_img_bg2 { background-position: top left!important; background-repeat: no-repeat!important; background-size: cover!important; }


q { font-weight: 700; font-style: italic; color: #555!important; }
sup { font-size: 13px; top: 0; }

.article_title { height: 60px; padding: 0 20px; }
.article_body { padding: 0 20px; }

.article_button { width: 115px; float: left; padding: 10px; font-size: 15px; margin-left: 5px; margin-top: 15px; }
.action { background: #FF2A58; color: #F9F9F9; transition: all .5s ease; }
.action:hover { background: #323232; transition: all .5s ease; }
.disabled { background: #F9F9F9; color: #FF2A58; cursor: default; }

.r_adjust { float: right!important; }

.new_image { display: none; }

.film_box { width: 31%; height: 250px; margin: 1%; float: left; }
.film_box iframe { width: 100%; height: 200px; }

/* e additions */
.virtual_orchestra_single #virtualOrchestraH { 
	width: 100%; 
	margin-top: 15px;
	background: url("http://www.philharmonia.co.uk/assets/vr_page/VO_header.jpg");
	background-position: center center!important; 
	background-repeat: no-repeat!important; 
	background-size: cover!important;
	padding-bottom: 30%;
}
@media only screen and (max-width : 760px) {
	.virtual_orchestra_single #virtualOrchestraH { 
		padding-bottom: 55%;
		background: url("http://www.philharmonia.co.uk/assets/vr_page/VO_header_sm.jpg");
	}
}

.virtual_orchestra_single h1 {
	border-top: none;
	margin-top: 30px;
}
.virtual_orchestra_single hr {
	margin-top: 30px;
}
.virtual_orchestra_single h2 {
	margin-bottom: 0px;
}
.virtual_orchestra_single .article_button {
	margin-bottom: 10px;
}

.virtual_download,.virtual_download a {
color: #FF2A58!important;
}

/* e additions end */


@media only screen  
and (max-width : 1024px) {
	.article_button { width: 80px; }
}

@media only screen  
and (max-width : 760px) {
	.article_title { width: 49%!important; }
	.col3,.col9 { width: 100%; }
	
	.responsive_img_bg { background-position: center center!important; background-repeat: no-repeat!important; background-size: cover!important; }
	
	.second_image { display: none; }
	.responsive_img_landscape { padding-bottom: 45%; }
	.new_image { display: block; }
	.responsive_img_portrait_large { padding-bottom: 35%; margin-bottom: 0; }
	.responsive_img_portrait_medium { padding-bottom: 35%; margin-bottom: 0; }
	.responsive_img_portrait_small { padding-bottom: 35%; margin-bottom: 0; }
	
	.article_title { height: 65px; }
	h4 { padding-bottom: 5px; height: auto; }
	
	.film_box iframe { height: 130px; }
}

@media only screen  
and (max-width : 640px) {
	.article_title { height: 90px; }
	.film_box { width: 48%; height: 250px; margin: 1%; float: left; }
	.film_box iframe { width: 100%; height: 200px; }
}

@media only screen  
and (max-width : 480px) {
	.article_button { width: 48%; }
	.article_title { width: 100%!important; text-align: left; margin-top: -10px; }
	.col3.article_title { margin-top: -40px!important; margin-bottom: -20px!important; }
	.col4 { width: 100%; }
	
	.article_title { padding: 0 5px; }
	.article_body { padding: 0 5px; }
	.text_padding { padding: 0 5px 10px; }
	
	.film_box iframe { height: 150px; }
	
}