* { margin: 0; padding: 0; }
/*resets & general stuff*/
html { direction: rtl; overflow: auto; overflow-y: scroll; }
img { border: 0; font-size: 0; line-height: 0; }
fieldset { border: 0; }
a { color: #000; outline: 0; text-decoration: none; }
a:hover { color: #666; }
a.current { font-weight: bold; }
a.current:hover, .footer a.orange { color: #000; }
a.orange:hover, .orange { color: #f26405; }
table { border: 0; border-collapse: collapse; border-spacing: 0; }
ul { list-style-type: none; }
h1 { font-weight: normal; font-size: 1.7em; }
.clear, a.img { clear: both; font-size: 0; line-height: 0; }
.left { float: left; }
.right { float: right; }
.last { padding: 0 !important; }
.first { padding-top: 0 !important; }
div { border: 0px solid red; }
body { color: #000; font: normal 100%/1.3 Arial, Helvetica, sans-serif; text-align: center; }

/*grid & menu*/
#grid { border: 0px solid red; width: 976px; margin: 14px auto 20px; background: url('/images/vertical_line.gif') repeat-y 126px 10px; font-size: 0.875em; text-align: right; position: relative; padding: 0 0 3px; }
.header { height: 125px; position: relative; }
.content .header { height: 123px; }
.header h1 { background: url('/images/horizontal_long.gif') no-repeat right bottom; position: absolute; width: 976px; padding: 47px 0 5px; top: 0; right: 0; }
.header h1.short { text-indent: 282px; }
.side { float: right; width: 107px; }
.menu { position: relative; }
.menu li { padding: 0 0 15px; position: relative; }
.menu ul { display: none; position: absolute; top: 0; width: 114px; right: -158px; text-align: left; }
.menu ul li { padding: 0 0 8px; }
.lang-bar { margin: 25px 0 0; }
.lang-bar li { padding: 0 0 15px; text-transform: capitalize; }
.lang-bar li a.not { font-weight: normal; }
.footer { width: 976px; background: url(/images/footer_line.gif) no-repeat top; margin: 50px 0 10px 0; padding: 20px 0 0px 0; }
.footer .text { width: 827px; float: right; }
.footer .credits { width: 107px; float: right; padding: 0 40px 0 0; }
.footer img { vertical-align: text-bottom; }
.footer a.orange:hover { font-weight: bold; }

/*homepage*/
div.home .gallery { float: right; width: 377px; }

div.home img {width: 377px;vertical-align: top;}
div.home ul { float: right; width: 250px; margin: 189px 26px 0 0; }
div.home ul li { padding: 0 0 40px 5px; }
div.home ul li p { padding: 0.6em 0 0; }

/*various lists*/
.list1 h2, div.home h2 { font-size: 1.125em; line-height: 24px; }
.list1 h3, div.home h3 { font-size: 0.875em; line-height: 20px; }
.list1 li { float: right; width: 490px; display: inline; margin: 0 132px 0 0; padding: 33px 0 0; }
.list1 h3 { padding: 0 0 1em; }
.list1 p { padding: 0 0 1em 50px; }
.list1 .img-container { width: 145px; margin: 6px 0 5px 26px; float: right; font-size: 0.8571em; }
.list1 .img-container span { display: block; margin: -5px 0 0; font-size: 0.9166em; }
.list2, .list3 { width: 674px; }
.list2 h2, .list3 h2, .list2 p { background: url('/images/archiveLine.gif') no-repeat scroll right bottom; }
.list2 h2 { font-size: 1.2857em; margin: 0 0 10px; padding: 15px 18px; }
.list2 p { padding: 0 18px 11px; margin: 0 0 11px; }
.list3 h2 { font-size: 1.2857em; padding: 10px 18px 12px; font-weight: normal; }

/*content*/
.content { float: right; width: 715px; margin: 0 0 0 154px; line-height: 1.5; }
.content-img { background-color: #fff; padding: 0 0 26px 26px; margin: -125px 0 0; float: right; position: relative; z-index: 2; }
.content .text p { padding: 0 0 1em 2em; }

/*plays / img gallery border*/
.plays { margin: 0 132px 0 0; width: 560px; }
.plays a {font-weight: bold;width: 176px;display: block;min-height: 234px;float: right;margin: 0 0 10px 15px;}
.plays a img, ul.gallery a img {border: 4px solid #ccc;height: 98px;/* object-fit: cover; *//* object-position: center; *//* max-width: 100%; *//* width: 168px; */display: block;/* min-height: 178px; */margin-bottom: 5px;margin: auto;}
.plays a:hover img, ul.gallery a:hover img { border: 4px solid #999; }
.plays a em { font-style: normal; color: #d35809; display: block; }
.plays .last { margin-left: 0; }
.plays:not(.inrow-2)  a:nth-child(3n) {
    margin-left: 0px;
    margin-right: 0px;
}
.plays.inrow-2 {
    width: 550px;
    margin-right: 172px;
}
/*gallery*/
div.gallery div {display: none;}
div.gallery img { cursor: pointer; }

/*play*/
.header h1.p { text-indent: 406px; background: url('/images/horizontal_play.gif') no-repeat left bottom; }
.play { float: right; width: 380px; margin: -125px 0 0; padding: 0 0 0 26px; background-color: #fff; z-index: 2; position: relative; }
.play .gallery { position: relative; width: 380px; height: 339px; overflow: hidden; }
.play .gallery div { position: absolute; bottom: 0; top: auto !important; }
.play-text { width: 308px; float: right; margin: -32px 0 0; }
.play-text p, .play-item p { padding: 0 0 1em 0; }
.play .nav { margin: 10px 0 0; text-align: right; }
.play .nav .index { padding: 0 20px; }
.play-nav a { text-decoration: underline; }
.play-nav p { padding: 1em 0 0; }
.play-intro { margin: 18px 0 0; }
h2.toggle, .play-intro { background: url('/images/playLine.gif') repeat-x scroll right 0 transparent; padding: 20px 0 0; }
h2.toggle { font-size: 1em; background-position: right bottom; padding: 0 0 10px; margin: 30px 0 20px; }

/*archive gallery*/
.galleryHeader { width: 590px; float: right; }
.galleryHeader h2 { font-size: 1.2857em; padding: 0 18px 35px; }
ul.gallery { margin: 0 18px 0 0; width: 690px; }
ul.gallery li {float: right;margin: 0 0 30px 25px;text-align: center;width: 143px;/* height: 90px; */}
.item-navigation { float: left; font-size: 1.2857em; margin: 0 0 0 30px; }
.item-navigation a { margin: 0 10px 0 0; padding: 0 10px; }

/*contact*/
.contact { margin: 119px 0 0; }
.contact .right { background: url('/images/contact_line.gif') repeat-y scroll left top transparent; padding: 0 130px 0 52px; width: 280px; }
.contact .left { width: 200px; }
.contact h1 { font-size: 1.714em; }
.contact h2 { font-size: 1em; font-weight: normal; padding: 5px 0 0; }
.contact fieldset { margin: 30px 0 0; }
.contact fieldset label { clear: right; cursor: pointer; float: right; padding: 0 0 10px; }
.contact fieldset input { border: 1px solid #999; float: left; font-family: Arial,Helvetica,sans-serif; height: 17px; margin: 0 0 10px; width: 195px; }
.contact fieldset label em, .msg { color: #d35809; }
.contact fieldset input.button { background: #dfdfdf; cursor: pointer; font-size: 1em; margin: 13px 0 0; outline: medium none; padding: 3px 0; width: 67px; height: auto; }
.contact .msg { padding: 10px 130px 0 45px; width: 280px; }
.thanku { margin: 30px 0 0; height: 130px; }
.contact .text { margin: 52px 0 0; }
.contact .text p { padding: 0 0 8px; }
.contact .text img { padding: 0 0 0 5px; vertical-align: middle; }

/*credits*/
.content .credits h1 { text-indent: 295px; background: none; }
.text-credits { background: url('/images/credits_line.gif') repeat-y scroll right top transparent; line-height: 1.5; margin: 0 265px 0 0; padding: 0 30px 0 0; }
.text-credits p { padding: 0 0 1.5em; }

a.current + ul.sub-menu {
    display: block;
}

.mobtop { display:none; }
body.page-template-page-progs .plays a img, body.page-template-page-shows .plays a img {
    width: 168px;
    min-height: 178px;
		object-fit: cover;
		object-position:center;
}
.img-container img {
    max-width: 100%;
}

@media all and (max-width: 767px)
{
	.mobtop { display:inline-block; }
	
	div#grid {
			max-width: 100%;
			width: 100%;
			margin: 0px;
			background: none;
			padding-top: 90px;
	}

	.content {
			width: 100%;
			max-width: 100%;
			margin: 0px !important;
			background: white;
			padding: 15px;
			max-width: calc(100% - 30px);
			min-height: calc(100vh - 230px);
	}

	.header {
	}

	.side {
			display: none !important;
	}

	.footer {
			max-width: calc(100% - 30px);
			background-position: top left !important;
			padding: 15px 15px;
			margin: 20px 0px 0px;
	}

	.footer .text {
			max-width: 100%;
	}

	.mobtop {
			position: fixed;
			display: inline-block;
			width: 100%;
			//max-width: 100vw;
			right: 0;
			/* height: 75px; */
			z-index: 22;
			background: white;
			background: #fefefe url(/images/footer_line.gif) no-repeat bottom left;
	}

	a.mob-logo {
			display: inline-block;
			float: right;
			margin: 10px 10px 5px 0px;
			background: #fefefe;
	}

	.mob-logo img {
		mix-blend-mode: multiply;
		width: 60px;
		backface-visibility: hidden;
		-webkit-backface-visibility: hidden;
	}

	body {
	}

	.gallery {
		width: 100% !important;
		text-align: center;
	}

	.gallery>div {
		left: 0 !important;
		right: 0 !important;
		margin: auto !important;
		max-width: 100%;
		left: -15px !important;
	}
	div.gallery img {
		max-width: 100%;
		display: block;
		margin: auto;
	}
	div.home {
		display: flex;
		flex-direction: column-reverse;
	}

	div.home ul {
		width: 100%;
		margin: 15px;
	}

	label>div {
		width: 35px;
		height: 4px;
		background: black;
		display: block;
		margin: 6px 0px;
		background: #fefefe url(/images/footer_line.gif) no-repeat bottom left;
	}

	label[for="mobtop"] {
		display: inline-block;
		float: left;
		margin: 14px 19px 10px;
	}

	ul.mobtop-menu {
		display: inline-block;
		width: 220px;
		position: absolute;
		top: 67px;
		background: white;
		z-index: 3;
		left: 0px;
		background: white url(../images/vertical_line.gif) repeat-y 100% 10px;
		height: 100vh;
		transform: translateX(-220px);
		transition: 0.5s all ease-out;
	}

	input#mobtop {
		display: none;
		/* width: 100%; */
		/* position: absolute; */
		/* top: 55px; */
	}

	input#mobtop:checked + label + .mobtop-menu {
		/* display: inline-block; */
		transform: translateX(0px);
		transition: 0.5s all ease-out;
		overflow-y: auto;
	}

	ul.mobtop-menu>li {
		text-align: right;
		//padding: 10px 20px !important;
		/* border-bottom: 1px solid #3e3e3e; */
	}

	ul.mobtop-menu .sub-menu {
		transition: 0.5s all ease;
		max-height: 0px;
		overflow: hidden;
	}
	input#mobtop:checked + label:after {content: '';position: fixed;left: 0;top: 0;width: 100%;height: 100%;z-index: 1;/* background: red; */}
	
	img.content-img {
		margin: 10px;
		padding: 0;
		max-width: 50%;
		float: left;
		margin-top: 0px;
		margin-left: 20px;
	}

	.header h1.short {
		text-indent: 0px;
		max-width: 100%;
		padding: 0px 10px 10px;
		max-width: calc(100% - 20px);
	}

	.content .header {
		height: 50px;
		display: inline-block;
		width: 100%;
	}


	.content .text p {
		text-align: justify;
		padding: 0 0 1em 0;
	}

	.header h1 {
		max-width: calc(100% - 20px);
		padding: 0px 10px;
		padding: 0px 10px 10px;
		max-width: calc(100% - 20px);
	}

	.plays {
		max-width: calc(100% + 20px);
		margin: 0px -10px;
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		position: relative;
	}

	.plays a {
		width: calc((100vw - 75px) / 2);
		margin: 10px !important;
		display: inline-block;
		min-height: auto !important;
	}

	.plays a img, ul.gallery a img {
		width: 100%;
		height: auto;
		object-fit: contain;
		object-position: center;
	}

	.footer .credits {
		float: left;
		padding: 0px;
		width: auto;
	}
	.list2, .list3 {
			width: 100%;
	}

	.galleryHeader {
		width: 100%;
		display: inline-block;
		float: none;
	}

	ul.gallery {
		width: 100% !important;
		margin: 0px !important;
		height: auto !important;
		display: inline-block !important;
	}

	ul.gallery li {
		width: 100% !important;
		height: auto !important;
		margin: 0px 0px!important;
		float: none !important;
		position: relative !important;
		left: auto !important;
		right: auto !important;
	}

	ul.gallery a img {
		max-height: auto;
	}

	span.item-navigation {
		float: none;
		margin: auto;
		display: block;
		margin: 0px auto !important;
		text-align: center;
	}

	.play {
		margin: auto;
		float: none;
		width: auto;
		padding: 25px 0px 10px;
		display: inline-block;
		width: 100%;
	}

	.header h1.p {
		text-indent: 0px;
	}

	.play .nav {
		text-align: center;
		margin: 10px 0px 0px;
	}

	.play .gallery {
		height: 250px !important;
	}

	.play-text {
		width: 100%;
		margin: 0px;
	}
	h2.toggle:first-of-type:before {
		content: '';
		width: 100%;
		display: inline-block;
		background: url(/images/horizontal_play.gif) no-repeat left bottom;
		height: 20px;margin-bottom:10px
	}

	label>div:nth-child(2) {
		background: #fefefe url(/images/footer_line.gif) no-repeat -60px 0px;
	}
	label>div:nth-child(3) {
		background: #fefefe url(/images/footer_line.gif) no-repeat -20px 0px;
	}
	div.home .gallery>div {
			left: 0px !important;
	}
	div.home ul {
			margin: auto !important;
	}
	body:not(.rtl) .mob-logo {float: left;margin: 10px 0px 5px 10px;}

	body:not(.rtl) label[for="mobtop"] {
			float: right;
			right: 0px;
			position: relative;
	}

	body:not(.rtl) ul.mobtop-menu {
			transform: translateX(220px);
			right: 0;
			left: auto;
			background: white url(../images/vertical_line.gif) repeat-y 0% 10px;
	}

	ul.mobtop-menu>li>a, ul.mobtop-menu>li>ul>li>a {
			padding: 10px 20px !important;
			display: inline-block;
			width: calc(100% - 40px);
	}

	body:not(.rtl) ul.mobtop-menu>li {
			text-align: left;
	}

	li.has-sub-menu:hover>.sub-menu {
		display: block;
		width: calc(100% - 40px);
		margin: auto;
		float: left;
		margin-left: 40px;
		max-height: 1000px;
	}
	
	body.rtl li.has-sub-menu:hover>.sub-menu {
		float: right;
		margin-right: 40px;
	}
	.list1 li {
			max-width: 100%;
			margin: 10px 0px !important;
			padding: 0px;
	}
	body:not(.rtl) .footer .credits {
		float: right;
		padding: 0px !important;
	}


	.contact .right {
		padding: 0px;
		margin: auto;
		display: block;
		width: 100%;
		background: none;
	}

	.contact {
		margin: 0px;
		width: 100%;
	}

	.contact .left {
		width: 100%;
	}

	.contact .text {
		margin: 10px 0px;
	}
}