/* Website template by freewebsitetemplates.com */
@font-face {
	font-family: 'Muli';
	src: url('../fonts/Muli-Regular.eot');
	src: local('☺'),  url('../fonts/Muli-Regular.woff') format('woff'),  url('../fonts/Muli-Regular.ttf') format('truetype'),  url('../fonts/Muli-Regular.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Muli-Light';
	src: url('../fonts/Muli-Light.eot');
	src: local('☺'),  url('../fonts/Muli-Light.woff') format('woff'),  url('../fonts/Muli-Light.ttf') format('truetype'),  url('../fonts/Muli-Light.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'NixieOne';
	src: url('../fonts/NixieOne-Regular.eot');
	src: local('☺'),  url('../fonts/NixieOne-Regular.woff') format('woff'),  url('../fonts/NixieOne-Regular.ttf') format('truetype'),  url('../fonts/NixieOne-Regular.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}


/*-------------------------- WRAPPER -----------------------------------*/

body {
	background-color: #f6f6f6;
	font-family: 'Muli-Light';
	margin: 0;
}
#page {
	width: 960px;
	margin: 0 auto;
	padding: 96px 0 0;
}
img {
	border: 0;
}
/*------------------------------ Sprites ------------------------------*/
#header span.shadow {
	background: url(../images/shadowsWithOrange.png) repeat-x;
}
#footer span.shadow, #sidebar li.selected > a, #sidebar li > a:hover {
	background: url(../images/shadows.png) repeat-x;
}
.btn, .previous, .next, #performances #sidebar span.more {
	background: url(../images/buttons.png) no-repeat;
}
.frame1, .frame2, .frame4 { /* frame3, */
	background: url(../images/frames.png) no-repeat;
}
#sidebar, #sidebar .section, #sidebar .section > div, #contactbox, #contactbox > div, #contactbox > div > div {
	background-image: url(../images/bg-sidebar.png);
	background-repeat: no-repeat;
}
#footer div.section, #contact > div {
	background: url(../images/separators.png) no-repeat;
}
#blogs li, #blogs div.header, #blogs div.details {
	background-image: url(../images/bg-blog-content.png);
	background-repeat: no-repeat;
}
#connect > a {
	background: url(../images/icons.png) no-repeat;
}
.frame1 {
/*	float: right;
	background-position: 0 bottom;
	height: 510px;
	width: 444px;
	margin: 0 4px 30px 36px;
	padding: 18px 18px 32px 33px;
	overflow: hidden;
*/
	background-position: 0 bottom;
	height: 230px;
	width: 180px;
	margin: 0 auto;
	padding: 18px 0px 28px 44px;
	overflow: hidden;
}
.frame2 {
	background-position: 0 -259px;
	height: 379px;
	width: 547px;
	margin: 0 0 12px;
	padding: 17px 40px 30px 18px;
	overflow: hidden;
}
.frame3 {
	margin: 0 0 12px;
	padding: 8px 19px 15px 9px;
	overflow: hidden;
}

#contactbox {
	background-position: -323px bottom;
	margin: 0 0 30px;
	padding: 0 0 8px;
}
#contactbox > div {
	background-position: -643px 0;
	padding-top: 8px;
 *padding-bottom: 1px; /** Needed for IE7 **/
}
#contactbox > div > div {
	background-position: 0 0;
	background-repeat: repeat-y;
	padding: 24px 40px 0 20px;
}

/*------------------------------ HEADER ------------------------------*/
#header {
	background-color: #303030;
	width: 100%;
	float: none;
	position: absolute;
	left: 0;
	top: 10px;
	text-align: left;
    /* shadow */
    -webkit-box-shadow: 0 0 10px #888;
       -moz-box-shadow: 0 0 10px #888;
            box-shadow: 0 0 10px #888;
}
/* #header > div {
	height: 116px;
	width: 960px;
	margin: 0 auto;
	padding: 0 10px;
}
*/
#header span.shadow {
	background-position: 0 -20px;
	display: block;
	height: 8px;
	width: 100%;
	position: absolute;
	bottom: -8px;
	z-index: 199;
}

/** Ribbon from github **/

#ribbon {
/*  background-color: #a00; */
  background-color: #FF6103;
  overflow: hidden;
  white-space: nowrap;
  /* top left corner */
  position: absolute;
  left: -55px;
  top: 12px;
  /* 45 deg ccw rotation */
  -webkit-transform: rotate(-45deg);
     -moz-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
       -o-transform: rotate(-45deg);
          transform: rotate(-45deg);
  /* shadow */
  -webkit-box-shadow: 0 0 10px #888;
     -moz-box-shadow: 0 0 10px #888;
          box-shadow: 0 0 10px #888;
		  z-index: 200;
}
#ribbon a {
  border: 1px solid #faa;
  color: #fff;
  display: block;
  font: bold 81.25%; /* 'Helvetica Neue', Helvetica, Arial, sans-serif; */
  margin: 1px 0;
  padding: 20px 50px;
  text-align: center;
  text-decoration: none;
  /* shadow */
  text-shadow: 0 0 5px #444;
}

/** Header contents **/

#headercontent {
	width: 960px;
	margin: 0 auto 0;
	padding: 0;
	text-align: right;
}

/** Navigation **/

.headernavigation {
	display: inline-block;
    margin: 0 auto;
	padding-top: 30px;
}

/*------------------------------ CONTENTS ------------------------------*/
#contents {
	padding-top: 12px;
}


#contents > div {
	display: inline-block;
	width: 100%;
	padding-top: 42px;
}

#contents > div.welcome {
	width: 950px;
	padding-left: 10px;
/*	padding-top: 60px; */
}

#contents > div.body {
	width: 950px;
	padding-left: 10px;
}
#contents h2, #contents h3 {
	color: #000;
	font-family: 'NixieOne';
	font-weight: normal;
	line-height: 24px;
	margin: 0 0 24px;
	text-transform: uppercase;
}
#contents p {
	color: #606060;
	font-size: 13px;
	line-height: 24px;
	margin: 0;
	padding: 0 0 24px;
}
#contents p a {
	color: #606060;
}
#contents p a:hover {
	color: #000;
}


/* Main */
#main {
	float: right;
	min-height: 1000px;
	width: 606px;
	margin: 0 20 30px;
	padding: 66px 0 0;
}
#main p em a {
	text-decoration: none;
}
/* Sidebar */
#sidebar {
	float: left;
	background-position: 0 0;
	background-repeat: repeat-y;
	color: #606060;
	width: 316px;
}
#sidebar .section {
	background-position: -323px bottom;
	margin: 0 0 30px;
	padding: 0 0 8px;
}
#sidebar .section > div {
	background-position: 0 0;
	background-repeat: repeat-y;
	padding: 0 7px 0 0;
}
#sidebar h3 {
	padding: 0 40px 0 20px;
}
#sidebar ul {
	list-style: none;
	margin: 0;
	padding: 0 0 12px;
}
#sidebar ul li {
	display: inline-block;
	width: 100%;
	font-size: 13px;
}
#sidebar ul li > a {
	color: #606060;
	display: block;
	font-size: 13px;
	padding-left: 20px;
	text-decoration: none;
}

/** Schedules **/
#contents #schedules {
	width: 940px;
	padding: 0 10px;
}
#contents #schedules {
	padding: 0 10px;
}
#schedules #sidebar {
	background: none;
}
#schedules #sidebar .section > div {
	padding-top: 42px;
 	*padding-bottom: 1px; /** Needed for IE7 **/
}
#schedules #sidebar ul {
	padding-bottom: 30px;
}
#schedules #sidebar ul li > a {
	line-height: 43px;
}
#schedules #sidebar ul li.selected > a, #schedules #sidebar ul li > a:hover {
	background-position: 0 -42px;
}
#schedules #sidebar #contactbox h3 {
	padding: 0;
}
#schedules #sidebar #contactbox li {
	display: inline-block;
	width: 100%;
	padding: 0;
}
#schedules #sidebar #contactbox li p {
	padding: 0 0 0 70px;
}
#schedules #contactbox span {
	float: left;
	display: inline-block;
	line-height: 24px;
	width: 70px;
}
#contents #schedules #main p {
	padding-left: 0px;
}
#contents #schedules #main p em {
	display: block;
	font-family: "NixieOne";
	font-style: normal;
	text-transform: uppercase;
}
#contents #schedules #main p span.age {
	display: block;
}
#schedules a.btn {
	background-position: 0 -199px;
	color: #fff;
	display: block;
	font-family: "Muli";
	font-size: 13px;
	height: 36px;
	line-height: 31px;
	width: 166px;
	margin-left: 8px;
	text-align: center;
	text-decoration: none;
}

/** Hover States **/
#schedules a.btn:hover, #performances #sidebar span.more:hover, #contact input.btn:hover {
	filter:alpha(opacity=90);
	opacity: 0.9;
}

/*------------------------------ FOOTER ------------------------------*/
#footer {
	background-color: #fff;
	color: #999;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 24px;
	width: 100%;
	position: absolute;
	left: 0;
}
#footer span.shadow {
	background-position: 0 0px;
	display: block;
	height: 12px;
	width: 100%;
	position: absolute;
	left: 0;
	top: -8px;
}
#footer h5 {
	font-size: 11px;
	font-weight: normal;
	line-height: 24px;
	margin: 0 0 12px;
	text-transform: uppercase;
}
#footer a {
	color: #999;
	text-decoration: none;
}
#footer a:hover {
	color: #000000;
}

#footer > div {
	width: 940px;
	margin: 0 auto;
	padding: 0 10px;
}
#footer > div:after {
	clear: both;
	content:"";
	display:block;
	height:0;
	line-height:0;
	visibility:hidden;
}
