body.home section.media {
	display: none;
}

body.int {
	width: 100%;
	max-width: 120em;
	background-color: rgb(37,46,59);
}

body.int,
#canvas.int {
	color: white;
}

body.int .bg,
#canvas.int .bg {
	background-image: url('images/bg-int-1920.jpg');
	position: fixed;
    background-attachment: scroll;
    background-position: center center;
    background-repeat: none none;
    background-size: cover;
    -o-background-size: cover;
    top: 0;
    left: 0;
    height: 100vh;
    width: 100%;
    z-index: 1;
}

#canvas.int .bg {
	position: absolute;
}

img {
	width: 100%;
}

body.int .bg::before,
#canvas.int .bg::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	height: 100vh;
	width: 100%;
	z-index: 2;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0.5+0,0+30,0.7+100 */
	background: -moz-linear-gradient(left,  rgba(0,0,0,0.5) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,0.7) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  rgba(0,0,0,0.5) 0%,rgba(0,0,0,0) 30%,rgba(0,0,0,0.7) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  rgba(0,0,0,0.5) 0%,rgba(0,0,0,0) 30%,rgba(0,0,0,0.7) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80000000', endColorstr='#b3000000',GradientType=1 ); /* IE6-9 */
}

.int h1,
.int h2,
.int h3,
.int h4,
.int h5,
.int h6,
.int p,
.int ul,
.int ol {
	color: white;
}

.int h1 {
	font-size: 4.5em;
    margin: 0 0 0.4em;
}

.int h2 {
	font-size: 3em;
}

.int button,
.int .button input {
	background: none;
	box-shadow: none;
	border-radius: 0;
	border: 1px solid white;
	font-size: 1.3125em;
	padding: 1em 2em;
	margin: 0;
	color: white;
	text-transform: capitalize;
}

.int button.centre {
	margin-left: auto;
    margin-right: auto;
    display: block;
}

.int .margin-top {
	margin-top: 4em;
}

.int .margin-bottom {
	margin-bottom: 4em;
}

.int .btn-row {
	margin-left: auto;
	margin-right: auto;
	max-width: 30.75em;
}

.int .btn-row button {
	float: left;
	margin: 0 1em;
}

.int section {
	background: none;
	padding: 0;
	margin-bottom: 10em;
}

.int section.shallow {
	margin-bottom: 4em;
}

.int section.micro-nav {
	padding-bottom: 1em;
    border-bottom: 1px solid rgba(255,255,255,0.4);
}

.int section.micro-nav button {
	font-size: 0.875em;
    padding: 0.5em 1em;
    border: none;
    background-color: rgba(255,255,255,0.2);
    border-radius: 0.28571428571429em;
}

.int .container.main-content {
	margin: 2em auto;
}

.int section.page-load {
	text-align: center;
	height: calc(100vh - 12.5em);
	margin-bottom: 4.25em;
	font-size: 80%;
}

.int section.page-load h1 {
	max-width: 6.94444444444444em;
	margin: 0 auto 0.4em;
}

.int .vertical-align {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.int section.int-first {
	padding-top: 1em;
}

.int .max700 {
	max-width: 43.75em;
	margin-left: auto;
	margin-right: auto;
}

.int .tile-images {
	margin-bottom: 1.875em;
}

.int .tile-images .tile {
	float: left;
	width: 32%;
	margin-right: 2%;
}

.int .tile-images .tile:nth-child(3n) {
	margin-right: 0;
}

.int .legal {
	margin: 15em auto 0;
}

.int .bd-title,
.int .bd-stage {
    font-size: 1.3125em;
    padding: 0.5em;
    margin: 0.5em;
    position: relative;
}

.int .bd-title {
    text-transform: uppercase;
    margin: 2em 0 1.5em;
    background: rgba(29,29,27,0.8);
}

.int .bd-title:first-child {
margin-top: 0;
}

.int .bd-title::after {
    content: "";
    border-top: 20px solid rgba(29,29,27,0.8);
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    position: absolute;
    left: calc(50% - 30px);
    bottom: -20px;
}

.int .bd-stage {
	background-color: rgba(256,256,256,0.2);
}

.int ::-webkit-input-placeholder {
   color: #386b78;
   font-style: italic;
}

.int :-moz-placeholder { /* Firefox 18- */
   color: #386b78;
   font-style: italic;
}

.int ::-moz-placeholder {  /* Firefox 19+ */
   color: #386b78;
   font-style: italic;
}

.int :-ms-input-placeholder {
   color: #386b78;
   font-style: italic;
}

.int :focus {
outline: #386b78 auto 5px;
}

.int .form-label {
	margin-bottom: 0.5em;
}

.form-hide {
	display: none;
}

.int .ui-datepicker {
    background: rgba(29,29,27,0.95);
    padding: 1em;
    width: 100%;
    max-width: 18.75em;
    margin: 0.3125em 0 0 0.625em;
}

.int .ui-datepicker::before {
    content: "";
    border-bottom: 10px solid rgba(29,29,27,0.95);
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    position: absolute;
    left: 1em;
    top: -10px;
}

.int .ui-datepicker-header {
	margin-bottom: 0.4em;
}

.int .ui-datepicker-header::after {
	content: "";
	clear: both;
}

.int .ui-datepicker-header a.ui-datepicker-prev {
	float: left;
	display: block;
}

.int .ui-datepicker-header a.ui-datepicker-next {
	float: right;
	display: block;
}

.int .ui-datepicker-title,
.int .ui-datepicker th {
	text-align: center;
}

.int .ui-datepicker-title {
    width: calc(100% - 80px);
    margin: 0 auto;
}

.int table.ui-datepicker-calendar {
    background: none;
    width: 100%;
    text-align: center;
}

.int table a:not(.btn),
.int .table a:not(.btn) {
    color: #E7AC09;
    text-decoration: none;
}

.int table a:not(.btn):hover,
.int .table a:not(.btn):hover {
    color: white;
}

.int .full-width table {
	width: 100%;
	background-color: transparent;
	border-collapse: separate;
    border-spacing: 0.2em;
}

.int.syllabus .full-width table td {
	background-color: rgba(256,256,256,0.2);
	padding: 0.5em 1em;
}

.int.syllabus .full-width table th,
.int.syllabus .full-width table tfoot td {
	background-color: rgba(29,29,27,08);
}

.int.syllabus .full-width table th {
	font-size: 1.3125em;
	font-weight: 400;
	padding: 0.5em 0.76190476190476em;
}

.int.syllabus .full-width table td:nth-child(1),
.int.syllabus .full-width table th:nth-child(1) {
	width: 80%;
	text-transform: uppercase;
}

.int.syllabus .full-width table td:nth-child(2),
.int.syllabus .full-width table th:nth-child(2) {
	width: 20%;
	text-align: center;
}



@media (max-width: 769px) {

	body.int header {
		height: 4em;
	}

	body.int header .logo {
		width: 7.5em;
		margin: 1em 0;
	}

	body.int header .phone {
		left: 3.75em;
		margin: 1.2em 0;
	}

	body.int header button.navbar-toggle {
		margin: 10px 20px 20px 10px !important;
	}

}


@media (min-width: 767px) {

	body.int header {
	position: fixed;
	width: 100%;
	top: 0;
}

.int section.int-first {
	padding-top: 8.25em;
}
	
.int .container.main-content {
	margin: 8.25em auto 2em;
}

	.int .tile-images {
		float: left;
		width: 33%;
		max-width: 13.75em;
	}

	.int .tile-images .tile {
		float: none;
		width: 100%;
		margin: 0 0 1.25em; 
	}

	.int .content {
		float: right;
		width: calc(66% - 1.25em);
	}

	.int section.page-load {
	font-size: 100%;
	height: calc(100vh - 14.5em);
	}

	.int .content {
	max-width: calc(100% - 13.75em - 1.875em);
	}

}

@media (min-width: 1400px) {

	.int section.int-first, section.int-second {
	position: absolute;
	right: 55%;
	width: 40vw;
	}

	.int section.int-second {
	left: 55%;
	padding-top: 8.25em;
	}

}