/*CONTENTS OF BOILERPLATE PLUGIN*/
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; }
audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; }
audio:not([controls]) { display: none; }
[hidden] { display: none; }
html { font-size: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
html, button, input, select, textarea { font-family: serif; color: #222; }
body { margin: 0; font-size: 1em; line-height: 1.4; }
a { color: #00e; }
a:visited { color: #551a8b; }
a:hover { color: #06e; }
a:focus { outline: thin dotted; }
a:hover, a:active { outline: 0; }
abbr[title] { border-bottom: 1px dotted; }
b, strong { font-weight: bold; }
blockquote { margin: 1em 40px; }
dfn { font-style: italic; }
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
ins { background: #ff9; color: #000; text-decoration: none; }
mark { background: #ff0; color: #000; font-style: italic; font-weight: bold; }
pre, code, kbd, samp { font-family: monospace, serif; _font-family: 'courier new', monospace; font-size: 1em; }
pre { white-space: pre; white-space: pre-wrap; word-wrap: break-word; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
small { font-size: 85%; }
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
sup { top: -0.5em; }
sub { bottom: -0.25em; }
ul, ol { margin: 1em 0; padding: 0 0 0 40px; }
dd { margin: 0 0 0 40px; }
nav ul, nav ol { list-style: none; list-style-image: none; margin: 0; padding: 0; }
img { border: 0; -ms-interpolation-mode: bicubic; vertical-align: middle; }
svg:not(:root) { overflow: hidden; }
figure { margin: 0; }
form { margin: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
label { cursor: pointer; }
legend { border: 0; *margin-left: -7px; padding: 0; white-space: normal; }
button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; }
button, input { line-height: normal; }
button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; -webkit-appearance: button; *overflow: visible; }
button[disabled], input[disabled] { cursor: default; }
input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; *width: 13px; *height: 13px; }
input[type="search"] { -webkit-appearance: textfield; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; box-sizing: content-box; }
input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }
button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top; resize: vertical; }
input:valid, textarea:valid {  }
input:invalid, textarea:invalid { background-color: #f0dddd; }
table { border-collapse: collapse; border-spacing: 0; }
td { vertical-align: top; }
.chromeframe { margin: 0.2em 0; background: #ccc; color: black; padding: 0.2em 0; }
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; *line-height: 0; }
.ir br { display: none; }
.hidden { display: none !important; visibility: hidden; }
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
.invisible { visibility: hidden; }
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }
@media print {
  * { background: transparent !important; color: black !important; box-shadow:none !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}
/*CONTENTS OF BOILERPLATE PLUGIN*/
html {min-height: 100%; 
	height:100%;}

body {min-height: 100%;
	height:100%;}



/* if a link requires java to run, hide the link if java is disabled in the browser */
.no-js .java {
	display:none;	
}

.no-java{
	display:none;	
}

.no-js .no-java{
	display:block;	
}

#noJava,
.unsupported {
	margin-top:0;
	padding-left:10px;	
	padding-right:10px;	
}

img,
picture {
	max-width:100%;
}

/*hide lazyload low quality images when java is disabled */
.no-js picture img.lazyload {
    display: none;
}


/* do not display if using a supported browser*/
.unsupported{
	display:none;	
}

/*display if using an supported/outdated browser*/
.ie6 .unsupported,
.ie7 .unsupported {
	display:block;	
}

#headerImg {
	display:none;
}

.ie6 #noSlider #headerVideo,
.ie7 #noSlider #headerVideo,
.ie8 #noSlider #headerVideo {
	display:none;	
}

.ie6 #noSlider #headerImg,
.ie7 #noSlider #headerImg,
.ie8 #noSlider #headerImg {
	display:block;	
}


/* SHARED ------------------------------------------------------------*/

.textleft{
	text-align:left;
}

.textright{
	text-align:right;
}

.textcenter{
	text-align:center;
}

/*set the maximum width of the displayed content */
.home-featured,
.footer-content {
	max-width:1232px;
	margin:auto;	
	clear:both;
}

/* END SHARED ------------------------------------------------------------*/



/*START Page loading gif------------------------------------------------------------*/
.loadImg {
  position: absolute;
  top:50%;
  left:50%;
  margin-left:-50px;
  margin-top:-50px;
}

/*If java is disabled in browser just show the content*/
.no-js #bodyContent {opacity:1;}

/*If someone is using an unsupported browser do not show the content*/
.ie6 #bodyContent {opacity:1;}

.no-js #loader { display: none;  }

/*If java is enabled in browser hide the content until loaded*/
.js #bodyContent {opacity:1;}

.js #bodyContent {position:absolute;}
	 
.js #loader {
 display:none;
 width:100%;
 height:100%;
 text-align:center;
}
/*END Page loading gif------------------------------------------------------------*/



/* START footer elements ------------------------------------------------------------*/
footer{
	display:block;
	clear:both;
	
  padding-bottom:20px;
}


#footer-container {
  margin:0;
  padding:0;
}

#footer-container figure {
  float: left;
  padding:0;
  margin:0;
}

/* Social media image link div */
#socialLINKS{
	text-align:center;
	padding-top:10px;
	padding-bottom:0px;
	width:100%;
}

/* Control how the social media links are displayed */
#socialLINKS a{
	display:inline-block;
	clear:none;
	height:30px;
	width:30px;
	margin:0px;
	margin-left:10px;
	padding:0px;
}
/*END footer elements------------------------------------------------------------*/






/* START top menu NAVIGATION BAR (teen camps / locations /about / admissions)  ------------------------------------------------------------*/
#nav {
  float: right;
  position:relative;
  z-index:999;
}


#nav > li {
  margin: 0 10px;
}

	
#nav > li:first-child {
  margin-left: 0px;
  padding-left:10px;
}


#nav li.last-child {
  border-right: none;
  padding-right: 10px;
  margin-right:0;
}

#nav > li:last-child {
  border-right: none;
  padding-right: 10px;
  margin-right:0;
}

#nav > li:hover > a {
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

/* (teen camps / locations /about / admissions */
#nav > li > a {
  display: block;
  overflow: hidden;
  line-height: 30px;
  border-top: 3px solid transparent;
}
/* sub navigation - (filmmaking / acting / dance / photography / etc.) */
.sfHover ul {
  display: block;
  margin-top: 0px;
  margin-left: 0px;
  text-shadow: none;
  -webkit-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
  -o-box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
}
#nav ul li a {
  display: block;
  padding: 7px 10px;
  display: block;
}

#nav span:hover {
  -webkit-transform: translate(-10px, -3px);
  -moz-transform: translate(-10px, -3px);
  -o-transform: translate(-10px, -3px);
  transform: translate(-10px, -3px);
}


/* END top menu NAVIGATION BAR (teen camps / locations /about / admissions)  ------------------------------------------------------------*/


/* START filter pages and filter content on program and info pages ----------------------------------------------------*/
isotope-item {
  z-index: 2;
}
.isotope-hidden.isotope-item {
  pointer-events: none;
  z-index: 1;
}

#filter-buttons {
 text-align:center;
  margin: 0;
  margin-bottom:20px;
  margin-top:20px;
  padding:0;
}

#filter-buttons li {
  display: inline-block;
  margin: 0;
  padding:0;
  padding-bottom:5px;
 
}

.ie6 #filter-buttons li,
.ie7 #filter-buttons li {
  /*ensures proper formating of inline elements in ie7*/
  zoom: 1;
  *display: inline;
  }
  
#filter-buttons li a {
  display: block;
  padding: 5px 20px;
  margin-bottom: 0px;
}

.ie6 #filter-buttons li a,
.ie7 #filter-buttons li a,
.no-js #filter-buttons li a {
  display: none;
}

#filter-container {
  margin-bottom: 60px;
  /*do not apply z-index because it will cause text to flash in Safari and Chrome*/
}

#filter-container figure .thumb {
  display: block;
  width: 100%;
  text-align:center;
}
#filter-container figure .thumb img {
  max-width: 100%;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

#filter-container figure .thumb:hover img {
  /*opacity: 0.1;*/
}
#filter-container figure figcaption {
  margin: 18px 10px 20px 10px;
  text-align: left;
}
#filter-container figure figcaption .heading {
  margin-bottom: 13px;
  display: block;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  text-align:center;
}
#filter-container figure figcaption .readmore {
  display: block;
  margin: 10px 0px;
}


#filter-container figure {
  float: left;
}

.figureoverlay {
	position: relative;
	text-align:center;
	left:-9999px;
	overflow:hidden;
	border: 0;
	margin:0;
	height:0;
}

#filter-container figure:hover .figureoverlay{
	position: relative;
	left:0;
	height:auto;
	padding:5px;
}


/* END filter buttons on program and info pages ----------------------------------------------------*/






/* START Top Login Menu ----------------------------------------------------*/

#menu_tr ul {
	margin: 0;
	list-style: none;
	line-height: normal;
	
}

#menu_tr li {
	float: right;
	padding: 1px 1px 5px 5px;
	
}

#menu_tr a {
	margin-right: 1px;
	
}
/* END  Top Login Menu ----------------------------------------------------*/


/* START Main Containter for three column pages like index.php ----------------------------------------------------*/
#main-container {
  margin-bottom: 60px;
  margin-top:20px;
  /*do not apply z-index because it will cause text to flash in Safari and Chrome*/
}

#main-container figure .thumb {
  display: block;
  width: 100%;
  text-align:center;
}

#main-container figure .thumb img {
  max-width: 100%;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

#main-container figure figcaption {
	
  margin: 18px 10px 20px 10px;
  text-align: left;
}
#main-container figure figcaption .heading {
  margin-bottom: 13px;
  display: block;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  text-align:center;
}

#main-container figure {
  float: left;
  border-color: hsla(0, 0%, 0%, 0.7);
   -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4);
  -o-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4);
  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4);
}



#main-container .width2 h2{
  text-align:center;
  margin:0;
}

#main-container h2{
  text-align:center;
  margin:0;
}

.bgoverlay figcaption h1,
#main-container .project figcaption h1{
 	 padding:0;
	 margin:0;
}


#main-container figcaption h1{
 	 padding:0;
	 margin:0;
}

.bgoverlay figcaption,
#main-container .project figcaption {
 	 padding:10px;
	 margin:0;
}

#main-container figure .innerBlock{
 	 padding:5px;
	 margin:0;
	 margin-bottom:10px;
}


#main-container figure h3{
 	 padding:0;
	 margin:0;
}


/* END Main Containter for three column pages like index.php ----------------------------------------------------*/


/* START SIde Containter content on two column pages (includes sidebar nav) ----------------------------------------------------*/
#side-container {
  margin-bottom: 60px;
  /*do not apply z-index because it will cause text to flash in Safari and Chrome*/
}

#side-container figure .thumb {
  display: block;
  width: 100%;
  text-align:center;
}

#side-container figure .thumb img {
  max-width: 100%;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

#side-container figure .thumb:hover img {
  opacity: 0.2;
}
#side-container figure figcaption {
  margin: 18px 10px 20px 10px;
  text-align: left;
}
#side-container figure figcaption .heading {
  margin-bottom: 13px;
  display: block;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  text-align:center;
}

#side-container figure {
  float: left;
  border-color: hsla(0, 0%, 0%, 0.7);
   -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4);
  -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4);
  -o-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4);
  box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4);
}
/* END SIde Containter content on two column pages (includes sidebar nav) ----------------------------------------------------*/

/* START Main Containters for two column pages (info and program page content) ----------------------------------------------------*/
.infoPage h1,
.programPage h1{
	text-align:left;
	line-height:35px;
	padding: 10px 0px 10px 10px;	
	margin:0;
}

.infoPage h2,
.programPage h2{
	padding:0;
	margin:0;
}

.programHeader{
	margin-bottom:0px;
	-webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4);
   -o-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4);
   box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4);	

}

/*keeps the small header text on program and info pages together when page shrinks*/
.HeaderSM {
	line-height:30px;
	display:inline-block;
	clear:none;
}

.programHeader .title{
	display:inline-block;
	float:left;
	
}

.programHeader .weeks{
	display:inline-block;
	clear:right;
	float:right;
	padding: 15px 10px 0 10px;	
}

.programHeader figcaption {
	clear:both;
  margin: 0px 0px 0px 0px;
  padding: 0 10px 0 10px;
  /*-webkit-box-shadow: 0 8px 6px -6px rgba(0, 0, 0, .4);
    -moz-box-shadow: 0 8px 6px -6px rgba(0, 0, 0, .4);
   -o-box-shadow: 0 8px 6px -6px rgba(0, 0, 0, .4);*/
   box-shadow: 0 8px 6px -3px rgba(0, 0, 0,.4);	
  padding-bottom:0px;
  text-align: left;
}

.programHeader {
	
}

.programHeader figcaption #filter-buttons {
  margin: 0;
  border:none;
  margin-bottom:0px;
  padding:0;
}

/*Form Info type pages*/

.infoHeader{
	margin-bottom:20px;
	border-color: hsla(0, 0%, 0%, 0.7);
	   -webkit-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4);
   -o-box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4);
   box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4);
 
}

.infoHeader figcaption {
  margin: 0px 10px 20px 10px;
  padding-bottom:20px;
  text-align: left;
}

.infoHeader figcaption #filter-buttons {
  margin: 0;
  margin-bottom:20px;
  padding:0;
}
/* END Main Containters for two column pages (info and program page content) ----------------------------------------------------*/



/* START Schedule elements for program schedules ----------------------------------------------------*/
.schedule{
	width:100%;
}

.scheduleHeader{
	width:100%;
	text-align:center;
}

.schedule tr td:first-child{
	width:25%;	
	text-align:right;
}

.schedule tr td:last-child{
	width:75%;	
	text-align:left;
}
/* END Schedule elements for program schedules ----------------------------------------------------*/


/* START Dates and Costs elements for displaying (session / dates / age / supervision / dormatory) ----------------------------------------------------*/
.datescosts div{
	display:block;
	clear:both;
	border-top: #666 solid thin;
}

.datescosts div div{
	display:block;
	clear:none;
	float:left;
	border:none;
	text-align:center;
}

.datescostsHeader{
	padding:5px;
	padding-left:10px;
}

.datescosts{
	text-align:left;
	width:100%;
}

/*5 column veiw (if you have 5 columms to display)*/
.datescosts div .sessionNum5col{
	width:10%;
}
.datescosts div .dates5col{
	width:30%;
}
.datescosts div .ages5col{
	width:10%;
}
.datescosts div .supervision5col{
	width:25%;
}
.datescosts div .dorm5col{
	width:25%;
}

/*4 column veiw (if you have 4 columms to display)*/
.datescosts div .sessionNum4col{
	width:20%;
}
.datescosts div .dates4col{
	width:30%;
}
.datescosts div .ages4col{
	width:20%;
}
.datescosts div .supervision4col{
	width:50%;
}
.datescosts div .dorm4col{
	width:30%;
}

/*3 column veiw (if you have 4 columms to display)*/
.datescosts div .sessionNum3col{
	width:20%;
}
.datescosts div .dates3col{
	width:60%;
}
.datescosts div .ages3col{
	width:20%;
}


/*2 column veiw*/
.datescosts div .fifty2col{	width:50%; }
/* END Dates and Costs elements for displaying (session / dates / age / supervision / dormatory) ----------------------------------------------------*/

/*------START Flexslider for small slideshows like on sample work pages----------------------------------------------------*/
#slideshow-thumbs {
	margin:0;
	margin-top:5px;
	padding:0;	
}

#slideshow {
	margin:0;
	padding:0;
}
/*------END Flexslider for small slideshows like on sample work pages----------------------------------------------------*/



/*------START Small Video Popups----------------------------------------------------*/
img.videoSM:hover{
	border:#ccc solid medium;
	border-radious:5px;
}

img.videoSM{
	border:#666 solid medium;
	border-radious:5px;
	display:inline-block;
	clear:none;
	margin-bottom:10px;
}
/*------END Small Video Popups----------------------------------------------------*/



/* START Styled forms - selects / text inputs / submit buttons----------------------------------------------------*/
.styled-inputText{
	text-align:center;
	display:inline-block;
	clear:none;
	margin:5px;
	height:30px;
	width:150px;
}

.styled-submit{
	text-align:center;
	height:30px;
	border:none;
}
		
		
.styled-select select::-ms-expand {
    display: none;
}
	   
.styled-submit {
	display:inline-block;
	width:200px;
   height: 34px;
   text-align:center;
   overflow: hidden;
   margin:auto;
   margin-bottom:5px;
   margin-top:5px;
   }
   
.styled-submit input {
   background: transparent;
	width:200px;
   padding: 5px;
   font-size: 16px;
   line-height: 1;
   border: 0;
   border-radius: 0;
   color:white;
   height: 34px;
   -webkit-appearance: none;
   text-align:center;
}

   .styled-select {
	display:inline-block;
	  width:200px;
   height: 34px;
   text-align:center;
   overflow: hidden;
   margin:auto;
   margin-bottom:5px;
   margin-top:5px;
   }
   
.styled-check{
	clear:none;
	display:inline-block;
	
	
}

.styled-check input{
	margin:5px;
}

.styled-select select {
   background: transparent;
	width:200px;
   padding: 5px;
   font-size: 16px;   
   line-height: 1;
   height: 34px;
   -webkit-appearance: none;
   text-align:center;
    -moz-appearance:window;
   }
/* END Styled forms - selects / text inputs / submit buttons----------------------------------------------------*/

/* START .cf - responcive grid styling not to be altered ----------------------------------------------------*/
.cf:after,
.cf:before {
  content: "";
  display: table;
}
.cf:after {
  clear: both;
}
.cf {
  zoom: 1;
}
/* END .cf ----------------------------------------------------*/

/* START quotation boxes-------------------------------------------------------*/
.sidebarNews,
.comment_box{
	padding-bottom:10px;
}

.comment_box p{
	margin:0;
	text-align:center;
}

#google_translate_element{
	display:none;	
}


/* END quotation boxes-------------------------------------------------------*/


/* START mobile and sidebar navigation menus-------------------------------------------------------*/
#sidenav {
	width:100%;
	display:block;
	top:40px;
	clear:none;
	margin:auto;
	padding:0;
	text-align:left;
	z-index:999;}




.accordianNav a{
  padding-left:5%;
	width:95%;
	height:100%;
}

.accordianNav .root{	
	width:95%;
	height:100%;
	display:block;
}

/*inlineblock to perseve margin when there is a new line*/
.accordianNav li span{
  display:inline-block;
  margin-left:10px;
  margin-right:20px; /*was 20*/
  margin-top:12px;
  margin-bottom:12px;}


/*inlineblock to perseve margin when there is a new line*/
.accordianNav li ul li a{
  display:inline-block;
 /* margin-left:10px;
  margin-right:20px;was 20*/
  padding-top:12px;
  padding-bottom:12px;
}



.accordianNav li {
	list-style:none;
	line-height:1em;
}

.accordianNav ul {
	float:none;
	clear:both;
	list-style:none;
	display:block;
	padding:0;
	margin:0;
}

.accordianNav ul li {
	display:block;
	text-align:left;
	margin:0;
	padding:0;
}

.accordianNav ul li ul li{
	display:block;
	margin:0;
	padding:0;
}
.accordianNav ul li ul li ul li{
	display:block;
	margin:0;
	padding:0;

}

.accordianNav > li > a {
  line-height:2.4em;
}
.accordianNav > li:hover > a {
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;

}

.accordianNav li ul li a:hover:not(.toggle){
  background-color:#f80;
}

.accordianNav .nolink:hover{
  background-color:none;
}

.accordianNav .togglelink{
	width:80%;
	height:100%;
}

/* Used in Mobile and Sidebar navigation menus */
.accordianNav .toggle{
	position:relative;
	display:inline-block;
	text-align:center;
	/*the offset accounts for the link margin-right:20px; in the accordian*/
	/*right:-15px;
	width:20px;*/
	margin:0;
	padding:0;
	width:15%;
	height:100%;
}


/* Used in Mobile and Sidebar navigation menus */
.no-js .toggle{
	display:none;
}





/* Place the mobile (cell phone) navigation menu */
#mobileNav {
	width:100%;
	display:block;
	position:fixed;
	top:50px;
    bottom:0;
	clear:none;
	margin:auto;
	padding:0;
	text-align:left;
	z-index:9999;
	 overflow-y:scroll;
    overflow-x:hidden;}
/* END mobile and sidebar navigation menus-------------------------------------------------------*/

/* START course information list like dates, locations, ages (filmmaking_core.php)-------------------------------------------------------*/

.courseinfo {
	text-align:center;
	width:90%;
	margin-right:5%;
	margin-left:5%;
	margin-bottom:20px;
}
.courseinfo div  {
	text-align:center;
	width:30%;
	margin:1%;
	padding:0;
	margin-top:8px;
	margin-bottom:3px;
	clear:none;
	display:inline-block;
	vertical-align:top;
	
}	

.ie6 .courseinfo div,
.ie7 .courseinfo div {
  /*ensures proper formating of inline elements in ie7*/
  zoom: 1;
  *display: inline;
  }

.courseinfo ul{
	list-style:none;
	padding:0;
	margin:0;
	}
	
	
.programinfo {
	text-align:center;
	width:90%;
	margin-right:5%;
	margin-left:5%;
	margin-bottom:20px;
}
.programinfo div  {
	text-align:center;
	margin:1%;
	padding:0;
	margin-top:8px;
	margin-bottom:3px;
	clear:none;
	display:inline-block;
	vertical-align:top;
	
}	

.ie6 .programinfo div,
.ie7 .programinfo div {
  /*ensures proper formating of inline elements in ie7*/
  zoom: 1;
  *display: inline;
  }

.programinfo ul{
	list-style:none;
	padding:0;
	margin:0;
	}
/*END course information list like dates, locations, ages (filmmaking_core.php)-------------------------------------------------------*/



/* START RANDOM ITEMS ----------------------------------------------------*/

/* Compare boxes on program pages */
.outcomes{
	margin:auto;
	text-align:center;
	margin:0;
	padding:0;
}

/* Lists for Compare boxes on program pages */
.outcomes ul{
	text-align:left;
	list-style-image:url(../unused/bullets/check.png);	
}


/* Overlay something directly on top of something else */
.directOverlay{
	position: absolute;
	padding:10px;
	left:0;
	bottom:0;
	opacity:1;
}


/* Pop up Video that does not change in size */
.videoFixed{
	text-align:center;
	padding:0;	
	margin:0;
}

/*hidden div that allows videos to be centered on the screen*/	 
#ytube {
	width:100%;
	position:absolute;
	display:none;
	z-index:9999;
	   }
	  
/*------Facebook plugins-----------*/	  
.facebookSocial {
	height:200px;
	background-color:#000;
	text-align:center;	
}
  

/* Style for input box on form */
#contentForm.input{
	display:inline-block;
	clear:none;
	width:30%;	
}

/*------backNav for two column helpful navigation system (Home / film camps / 1wk filmmaking)-----------*/
#backNav_div{	
	margin-top:40px;
	
}

/*------alternative to flexslider - ensures faster loading of pages without multiple images-----------*/
#noSlider img{
	width:100%;
}


/* The dark background that popups up when clicking a popup */
#popup_background{
	display:none;
    opacity:0.7;
    position:fixed;/*need to be fixed to stretch on all IE after IE6*/
    top: 0;
    left: 0;
    width: 100%;
    z-index: 999;
	min-height: 100%;
      }


/*  span the whole avaliable width of a div */
.full{
	padding-top:10px;
	margin-bottom:20px;
	width:90%;
	text-align:center;
	margin:auto;
}


/* The main header for figures on pages like Alumni and Current Students */
.primarybox figcaption h3,
.primaryboxlink figcaption h3{
	text-align:center;
}


/* List elements used in figures like film-camps/index.php .courses  */
.list ul{
	margin-top:0px;	
	padding-top:0px;	
}

/* Make sure hte list element header does not have a space below it */
.list h4{
	margin:0px;	
	padding:0px;	
}
	

.basicLink{
	padding-left:15px;
	padding-right:15px;
}

.tinyTXT{
	line-height:1.1em;
}

.tinyLINK ul{
	list-style:none;
	padding:0;
	margin:0;
}

.tinyLINK a{
	line-height:100%;
}


/*Makes a large clickable button*/
a.infoBTN,
a.moreBTN{
	line-height:2.5em;
	padding:5px;	
}

a.infoBTN{
padding-left:30px;
background:url(../img/icon/qm.png) no-repeat ;
background-position:5px 3px;
background-size:20px;
}

.ie6 a.moreBTN,
.ie6 a.infoBTN,
.ie7 a.moreBTN,
.ie7 a.infoBTN,
.no-js a.moreBTN,
.no-js a.infoBTN{
	display:none;
}


/*------Nav options for each menu------------------------------------------------------
#navOptions{
	display:block;
	width:100%;
	text-align:center;
	position:relative;
	top:-25px;	
	height:0;
}

#navOptions a{
	line-height:20px;
	margin:10px;
	background-color:#F7F7F7;
}*/

/*-------News Feed Banner like on homepage-----------------------------------------*/

#newsouter{
	position:absolute; margin:0;  z-index:2;
}



#newsbanner{
   width:100%;  margin:0;
}
#newsinner{
	width:100%; position:relative; overflow:hidden; margin:0; 
}
#newsbanner ul li{
	display:in-block;
	position:absolute;
	width:100%;
	opacity:.9;
	margin:0;
	list-style:none;
	
}

.wrapper{
	margin:0;
	padding:0px;
	width:100%;
}


#newsbanner ul:last-child li {
 
  -webkit-animation: slide 8s infinite linear;
  animation: slide 8s infinite linear;

}

.project_click{
	 width:50%;
	 margin-left:25%;
	text-align:center;
}

/*** ---------------- SUPER FISH STYLES ---------------- ***/

.sf-menu, .sf-menu * {
	margin:			0;
	padding:		0;
	list-style:		none;
}
.sf-menu {
	
}
.sf-menu ul {
	position:		absolute;
	top:			-999em;
	width:			10em; /* left offset of submenus need to match (see below) */
}
.sf-menu ul li {
	width:			100%;
}

.sf-menu ul a {
	padding-left:5px;
}


.sf-menu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
	float:			left;
	position:		relative;
}
.sf-menu a {
	display:		block;
	position:		relative;
}



.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
	left:			0;
	top:			33px; /* match top ul list item height */
	z-index:		99;
}

ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			10em; /* match ul width */

	top:			0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}

.sf-menu li.endRight:hover ul,
.sf-menu li.endRight.sfHover ul {
	left:			auto;
	right: 0;
	top:			33px; /* match top ul list item height */
	z-index:		99;
}


/*** ESSENTIAL STYLES ***/

.sf-mobilemenu, .sf-mobilemenu * {
	margin:			0;
	padding:		0;
	list-style:		none;
}
.sf-mobilemenu {
	
}
.sf-mobilemenu ul {
	position:		absolute;
	top:			-999em;
	width:			10em; /* left offset of submenus need to match (see below) */
}
.sf-mobilemenu ul li {
	width:			100%;
}
.sf-mobilemenu li:hover {
	visibility:		inherit; /* fixes IE7 'sticky bug' */
}
.sf-mobilemenu li {
	float:			left;
	position:		relative;
}
.sf-mobilemenu a {
	display:		block;
	position:		relative;
}



.sf-mobilemenu li:hover ul,
.sf-mobilemenu li.sfHover ul {
	left:			0;
	top:			33px; /* match top ul list item height */
	z-index:		99;
}

ul.sf-mobilemenu li:hover li ul,
ul.sf-mobilemenu li.sfHover li ul {
	top:			-999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}
ul.sf-mobilemenu li li:hover li ul,
ul.sf-mobilemenu li li.sfHover li ul {
	top:			-999em;
}
ul.sf-mobilemenu li li li:hover ul,
ul.sf-mobilemenu li li li.sfHover ul {
	left:			10em; /* match ul width */
	top:			0;
}

.sf-mobilemenu li.endRight:hover ul,
.sf-mobilemenu li.endRight.sfHover ul {
	left:			auto;
	right: 0;
	top:			33px; /* match top ul list item height */
	z-index:		99;
}