/* Use this when Stackla is down
.home-column-main h2.tabbed{
	visibility: hidden;
}
*/

.stacklafw{
	min-height: 150px;
}

/* End of use this when Stackla is down */


.buttonLarge:hover{
	color: white;
	text-decoration: underline;
}



.extra-space{
	margin-top: 2em;
}

.buttonLargeHolder.right{
	width: 12em;
	margin-bottom: 0.5em;
	float: right;
}


/* Large "search this site" box, e.g. on page-not-found */
.searchHolderLarge.searchSite{
	margin-left: 0;
}

.searchHolderLarge.searchSite label{
	display:block;
	font-size: 16px;
	
}


.theme-default .nivoSlider {
border-top-right-radius: 40px;
border-bottom-left-radius: 40px;
}

/* Openable headings for sections of a page, e.g. Course details */

h2.accordion-header:hover, h3.accordion-header:hover{
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
	text-decoration: underline;
}

h2.accordion-header, h3.accordion-header {
	border-bottom: 1px solid #bababa;
	padding-top: 0.3em;
	padding-bottom: 0.2em;
	cursor: pointer;
	background-image: url(images/chevron-minor.png);
	background-position: 99% 50%;
	background-repeat: no-repeat;
	padding-right:30px;
}

h3.accordion-header {
	font-size: 90%;
}

h2.accordion-header.opennow, h3.accordion-header.opennow{
	background-image: url(images/chevron-minor-alt.png);
}

div.start-closed{
	display: none;
}

table{
	font-size: 1em;
	max-width: 100%;
}


#fat-footer div.section {
	width:21%;
}

/* Course details */

.summary-block{
	color: #600;
	padding-left: 89px;
	background-repeat: no-repeat;
	background-position: top left;
	min-height: 78px;
	clear: both;
	list-style: none;
}

.summary-block.course-time{
	background-image: url(images/course-time.png);
}

.summary-block.course-cost{
	background-image: url(images/course-cost.png);

}

.summary-block.course-careers{
	background-image: url(images/course-careers.png);
}

.summary-block li{
	display: inline-block;
	width: 90%;
}

.summary-block .left-side, .summary-block .right-side{
	display: block;
	width: 10em;
	max-width: 45%;
	float:left;
}

.summary-block .left-side, .summary-block .right-side{
	display: block;
	width: 10em;
	max-width: 45%;
	float:left;
}

.summary-block .right-side{
	width: 80%;	
}

.unit-code{
  display: inline-block;
  min-width: 8em;

}

.unit-title{

}

.unit-extra{
  font-style: oblique;
  color: #999999;
  font-size: smaller;

}

/* More course details styles, for popover */
                /* the overlayed element */
.simple_overlay {

    /* must be initially hidden */
    display:none;

    /* place overlay on top of other elements */
    z-index:10000;

    /* styling */
    background-color:#fff;

    width:675px;
	max-width: 80%;
    min-height:200px;
    border:1px solid #666;

    /* CSS3 styling for latest browsers */
    -moz-box-shadow:0 0 90px 5px #000;
    -webkit-box-shadow: 0 0 90px #000;
}

/* close button positioned on upper right corner */
.simple_overlay .close {
    background-image:url(images/overlay-close.png);
    position:absolute;
    right:-15px;
    top:-15px;
    cursor:pointer;
    height:35px;
    width:35px;
}

.simple_overlay .overlayContent{
	padding: 0.4em;
}

  /* styling for elements inside overlay */
  .details {
  position:absolute;
  top:15px;
  right:15px;
  font-size:11px;
  color:#fff;
  width:150px;
  }

  .details h3 {
  color:#aba;
  font-size:15px;
  }            


#overlayMyProfiler{
	position: fixed; top: 100px; padding: 1em; left: 40px; display: none; width: 900px; max-width: 80%;	
}

#overlayMyProfiler #myFrame{
	height: 800px;
	max-height: 100%;
}

/* Course details page --------------- */
.course-summary-area{
	float: left;
	width: 100%;
}
.image-holder{
	width: 35%; 
	float: right;
}

.addThisArea{
	float: left;
	width: 100%;
}

.addThisArea .buttonSmall.left{
	max-width: 30px;
	float: left;
}

.addThisArea .buttonSmall.right{
	max-width: 30px;
}

.addThisArea .page-options{
	float: right;
}


.addThisArea .buttonSmall{
	padding-top: 0;
	padding-bottom: 0;
	margin-top: 3px;
	margin-bottom: 8px;
	font-size: 11px;
}

img.course-image{
	float: none;
	width: 100%;
	border-bottom-left-radius: 20px;
	border-top-right-radius: 20px;
}

.image-holder .buttonLarge, .image-holder .buttonSmall{
	width: 100%;	
	margin-right: 0;
	padding-right: 0;
	margin-top: 0.3em;
}



table.course{
	width: 60%;
	float: left;	
	border-color: #bababa;
	
}

table.course td, table.course th{
	border-color: inherit;
	padding: 0.6em;
}

table.course tr.alternating{
	background-color: #eeeeee;
}

table.course ul{
	margin: 0;
	padding-left: 0;
}

table.course ul li{
	list-style-type: none;
}

.fee-heading{
	display: block;
	min-width: 40%;
	float: left;
}

.fee-cost{
	
}




/* End of course details page --------------- */

/* Enquiry form and enrolment form styles */
form.styled label, form.styled h3{
	clear: both;
	font-weight: bold;
	display: block;
	margin-top: 0.7em;
}

div.separated input, div.separated select{
	clear: both;
	display: block;
}

form.styled input.long{
	width: 16em;
}

form.styled input.very-short{
	width: 5em;
}

form.styled input.medium{
	width: 10em;
}

 /*New form styles*/

.styled-form input, .styled-form select{
  border: 1px solid #CCC;
  color: #888;
  height: 2.5em;
  line-height: 15px;
  margin-bottom: 16px;
  margin-right: 6px;
  outline: 0 none;
  width: 40%;
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

label.opt-in {
    float: left;
    width: 100%;
}

.styled-form input.newsletter {
    width: 5%;
    float: left;
}

.styled-form textarea {
    width: 400px;
    resize: vertical;
    padding: 6px 5px;
    border: 1px solid #ccc;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    display: block;
}

.styled-form label {
    border-top: solid 1px #ccc;
    display: block;
    padding-top: 1em;
}


.styled-form label#no-line {
    border-top: 0;
}

.styled-form label.checkbox {
    display: inline;
    padding-top:0;
}

.styled-form input.submitbtn:hover {
    color: #333;
    background-color: #ebebeb;
    border-color:#adadad;
    cursor: pointer;
}

.styled-form p.field-note {
    margin-top: 0;
    font-size: 80%;
}


/* Aside */
.less-subtle{
	background:url(images/sidebar-bg.gif) repeat-y;
	background-size: cover;
}

img.contact-info{
	max-width: 100%;
	float: left;
	padding: 0.3em;
	clear: left;
}

.aside p.contact-info{
	padding-top:0;
	font-size: 150%;
	margin-top:0.7em;
}

/* Postcode search, only used on TAFE Qld itself */
.postcode-result.article{
	width: 90%;
	margin: 5%;
	margin-top: 0.4em;
	margin-bottom: 0.4em;
	padding: 0.4em;
	border:1px solid #a9a9a9;
	min-height: 7em;
	background-color: rgb(230,230,230);
	border-bottom-left-radius: 20px;
	border-top-right-radius: 20px;
	/*
	-webkit-box-shadow: 4px 4px 6px 0px rgba(50, 50, 50, 0.3);
	-moz-box-shadow:    4px 4px 6px 0px rgba(50, 50, 50, 0.3);
	box-shadow:         4px 4px 6px 0px rgba(50, 50, 50, 0.3);		
	*/

}

.postcode-message-box{
	margin-left: 5%;
	color: #333333;
	font-weight: bold;
}

.postcode-result.article img{
	width: 20%;
	max-width: 7em;
	float: left;
	padding: .4em;
}

.postcode-result.article p{
	width: 70%;
	float: left;
	color: #333333;
	padding: .4em;
	margin-top: 0;
	line-height: 130%;
}

.postcode-result.article p b{
	display: block;
	font-size: 120%;
	font-weight: bold;
	color: black;
	width: 100%;
	border-bottom: 1px solid black;
	margin-top: 4px;
	margin-bottom: 8px;
	
}

.postcode-result.article a.buttonSmall{
	margin-top: 8px;
}

a.call-to-action{
	display: block;
	background-image: url(images/breadcrumb-triangle.png);
	background-position: center left;
	background-repeat: no-repeat;
	padding-left: 1.2em;

}

img.crest{
	max-height: 27px;
	max-width: 40%;
	margin-right: 0.5em;
	float: right;

}

#landingPage img.crest{
	max-height: 33px;
}

/* Side-block is made to give any h2 headings + something block a grey gradient background */
	
.side-block{
	background:url(images/sidebar-bg-whole.gif) repeat-y;
	background-size: cover;
}

/* The phone number used to be in the header.  This will hide any remaining stray ones */
#call-now{
	display: none;
}

/* For landing pages, so they have a nice gap even if they have no H2 at the top */
.singleColumn .article img.medium.left{
	margin-top: 1em;
}

/* Could just update the body{ declaration in agency.css when it's editable */
body{
	padding-left: 0.5em !important;
	padding-right: 0.5em  !important;
}

a[href^=tel]:hover, #searchHolder p a:hover{
    text-decoration:underline;
}

a[href^=tel], #searchHolder p a{
    color:inherit;
    text-decoration:none;
}

a[href^=tel].main, #searchHolder p a.main{
   font-size: 18px;
}

.evenColumns .landingBox img{
	margin-bottom: 1em;			/* Needed in case a paragraph is shorter than an image, to ensure space before footer */
	border-top-right-radius: 20px;
	border-bottom-left-radius: 20px;
}

/* Header tabs for Site Search and Course Search */

#tabSearchCourse{
	bottom-border-radius: 0;
}

#tabSearchSite{
	border-bottom-left-radius: .5em;
}

#search-query-site{
	padding: .1em .2em .1em .2em;
}

#searchHolder input[type=text]{
	width: 185px;
}

/* Testimonials */
.testimonial{
	margin-top: 1em;
}

.testimonial img{
	float: left;
	margin-right: 1em;
	max-width: 20%;
}

.quotes{
	background-image: url(images/quotation-marks-end.png);
	background-position: bottom right;
	background-repeat: no-repeat;
}

.home-column-main .quotes{
	font-size: 90%;
}


.with-image .quotes{
	margin-left: 20%;
}

.quotes p{
	background-image: url(images/quotation-marks-start.png);
	background-repeat: no-repeat;
	display: block;
	padding-left: 2.5em;
	padding-right: 2.5em;
	font-style: italic;
	color: #666666;
}

p.author{
	text-align: right;
}

p.author b{
	font-weight: bold;
}

.home-column-main p.author{
	font-size: 90%;
}


/* Main menu sub-items */
#nav-site ul li li.sub-item a{
	font-weight: normal;
	color: #666666;
	text-indent: 2em;			
}


/* Narrow */
@media screen and (max-width:43em){
	
	
		/* course details page */
	table.course{
		width: 100%;
	}
	
	img.course-image{
		display:none;
	}	
		
	.image-holder{
		float: left;
		width: 100%;
	}

	/* Main menu sub-items don't get to show on mobile main nav */
	#nav-site ul li li.sub-item{
		display: none;
	}

	.home-column-main .quotes{
		font-size: 80%;
	}

	.home-column-main p.author{
		font-size: 75%;
	}


	/* Show only contact details and social icons on mobile */

	#fat-footer h3 {
		display: none;
	}

	#fat-footer li {
		display: none;
	}

	#fat-footer li.mobile-only {
		display: block;
	}

	#fat-footer h3.mobile-only {
		display: block;
	}


	#fat-footer div.section {
		width: 100%;
	}

	#fat-footer .section {
		min-height: 0;
	}

	/* Contact form on mobile */

	.styled-form input, .styled-form select, .styled-form textarea {
		width:100%;
	}
	
}

@media print {

	#qg-coa img.print-version {
		margin-left: 0;
	}

  #searchHolder {
    display: none;
  }

  #header-container {
    max-height:100px;
  }	
	
  #header {
	border-bottom: none;
  }

  div#nav-section-menu {
    display: none;
  }

  div#breadcrumbs {
    display: none;
  }

  .crumb-block {
    background-image: none;
  }

  h1 {
  	background-color:#fff;
  	color:#000;
  	text-indent:0;
  }

   .page-options {
    display: none;
  }

  div#legal-footer {
  	display:none;
  }


}