﻿@charset "UTF-8";
/* Colours
Black: 000000
Dark Grey: 5E5F5F
Mid Grey: 999999
Light Grey: D3D3D3
Dark Orange: DC4A26
Mid Orange: EFA89A
Light Orange: EDCBC5
Dark Blue: 6486BC
Light Blue: AFC6E7
*/

/* ---- MAIN  -------------------------------------------------------- */

h1 {
    font-size: 36px;
    text-align: left;
    font-weight: bold;
    margin-top: 5px;
    margin-left: 20px;
    margin-right: 20px;
    margin-bottom: 10px;
    width: 90%;
    color: #fff;
}
h2 {
    font-size: 25px;
    text-align: left;
    font-weight: normal;
    margin-top: 5px;
    margin-left: 20px;
    margin-right: 20px;
    margin-bottom: 10px;
    width: 90%;
    color: #fff;
}
h3 {
  font-size: 25px;
  margin-top: 35px;
  margin-bottom: 5px;
  color: #000000;
  text-align: left;
}
h4 {
    font-size: 20px;
    margin-top: 18px;
    margin-bottom: 5px;
    color: #000000;
    text-align: left;
}
h5 {
    margin-top: 15px;
    margin-bottom: 5px;
    color: #333333;
    text-align: left;
    font-size: medium;
    font-weight: bold;
}
h2black {
    text-align: left;
    font-weight: normal;
    font-size: 25px;
    margin-top: 5px;
    margin-left: 0px;
    margin-right: 20px;
    margin-bottom: 10px;
    width: 90%;
    color: #000;
}

p {
    margin-top: 1em;
    margin-bottom: 30px; 
}
pre {
  color: #303030;
  background: #eeeee6; 
  padding: 4px;
  display: block;
  white-space: pre-wrap ;
  margin-left:2em;
  margin-right:2em;
  font-size:1.1em;
}
pre span.yel {color:#000000; background:#E0FF00}

pre.prettyprint {
    color: #ebe7e7;
    background-color: #eeeeee;
  padding: 4px;
  display: block;
  white-space: pre-wrap ;
  margin-left:2em;
  margin-right:2em;
}

pre.code {
  padding-top:2em;
  padding-bottom:2em;
  color:#222222;
}

/* unvisited link */
a:link {
  color: #DC4A26;
  text-decoration:none;
}

/* visited link */
a:visited {
  color: #DC4A26;
}

/* mouse over link */
a:hover {
  color: #5E5F5F;
}

/* selected link */
a:active {
  color: #DC4A26;
}



/* unvisited link */
.intro a:link {
  color: #EDCBC5;
  text-decoration:none;
}

/* visited link */
.intro a:visited {
  color: #EDCBC5;
}

/* mouse over link */
.intro a:hover {
  color: black;
}

/* selected link */
.intro a:active {
  color: #EDCBC5;
}

.padimg {
  
  padding: 4px;
  margin-left:2em;
  margin-right:2em;
  max-width: 100%
}
.indent{    
  padding: 4px;
  margin-left:2em;
  margin-right:2em;
  max-width:90%;
}

/* Body */
body {
	font-family: Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, "sans-serif";
	background-color: #FFFFFF;
	margin: 0;
}
/* Container */
.container {
	width: 90%;
  max-width:1200px;
	margin-left: auto;
	margin-right: auto;
	background-color: #FFFFFF;
}

/* Header */
header {
    margin-top: 5px;
    width: 100%;
    /*height: 8%;*/
    background-color: #fff;
    /*border-bottom: 1px solid #353635;*/
}

.title {
	width: 100%;
	display: inline-block;
	background-color: #fff;
  padding-bottom: 5px;
}
.logo {
	color: #fff;
	font-weight: bold;
	margin-left: auto;
	letter-spacing: 4px;
	margin-right: auto;
	/*padding-top: 10px;*/
  margin-top:0px;
  margin-bottom:0px;
  	max-width:100%;
}
.mainlogo {
    float:left;
}
.menu {
    color: #333333;
    font-weight: normal;
    font-style: normal;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    padding-right: 50px;
    /*padding-top: 10px;*/
    line-height: 2em;
    font-size: 18px;
    float: left;
    vertical-align: text-bottom;
    text-decoration: none;
}
.menu:hover {
	color: #DC4A26;
	cursor: pointer;
}


.button:hover {
	background-color: #6DC7D0;
	color: #FFFFFF;
	cursor: pointer;
}
/* Intro Panel */
.intro {
    width: 100%;
    display: inline-block;
    background-color: #DC4A26;
    padding-bottom: 20px;
}
.resourceintro {
    width: 100%;
    display: inline-block;
    background-color: #339999;
    padding-bottom: 20px;
}
.intrologo {
  padding-top: 10px;
	padding-left:10px;
	padding-right:10px;
	max-width:90%;


	/*width: 50%;*/
}
.intrologo2 {
  padding-top: 10px;
  padding-bottom: 10px;
	padding-left:10px;
	padding-right:10px;
	max-width:90%;
	float:right;
	width: 90%;
}
.introtitlecolumn {
	width: 50%;
	text-align: center;
	padding-top: 10px;
	float: left;
}
.introtitle {
  text-align: left;
  font-weight: bold;
  font-size: 36px;
  margin-top: 5px;
  margin-left: 20px;
  margin-right: 20px;
  margin-bottom: 10px;
  width: 90%;
  color: #fff;
}
.introsubtitle {
  text-align: left;
  font-weight: normal;
  font-size: 25px;
  margin-top: 5px;
  margin-left: 20px;
  margin-right: 20px;
  margin-bottom: 10px;  
  width: 90%;
  color: #fff;
}
.introcolumn {
	width: 50%;
	text-align: center;
	padding-top: 10px;
	float: left;
}
.introcolumn p {
  text-align: justify;
  line-height: 25px;
  font-weight: normal;
  margin-top: 5px;
  margin-left: 20px;
  margin-right: 20px;
  width: 90%;
  color: #fff;
}
.introtitlecolumn p {
  text-align: justify;
  line-height: 25px;
  font-weight: normal;
  margin-top: 5px;
  margin-left: 20px;
  margin-right: 20px;
  width: 90%;
  color: #fff;
}
.courseblurb p {
    text-align: justify;
    line-height: 25px;
    font-weight: normal;
    margin-top: 15px;
    margin-top: 15px;
    margin-top: 15px;
    margin-left: 20px;
    margin-right: 20px;
    width: 90%;
    color: #fff;
}
.profilelogo img{
  padding-top: 10px;
	padding-left:10px;
	padding-right:10px;
	max-width:90%;
}
.profilelogo {
	width: 25%;
	text-align: center;
	padding-top: 10px;
	float: left;
  padding-right: 20px;
}


/* ---- Gallery  -------------------------------------------------------- */

.gallery {
	clear: both;
	display: inline-block;
	width: 100%;
	background-color: #FFFFFF;
	/* [disabled]min-width: 400px;
*/
	padding-bottom: 35px;
	padding-top: 0px;
	margin-top: -5px;
	margin-bottom: 0px;
}
.gallerythumbnail {
    width: 23%;
    text-align: center;
    float: left;
    margin-top: 10px;
    background-color: #D3D3D3;
    padding-bottom: 20px;
    margin-left: 7px;
    margin-right: 7px;
    border-radius: 3px;
    padding-top: 5px;
    border-bottom: 4px solid 333333;
    border:2px solid #D3D3D3;
}
.gallerythumbnail2 {
    width: 23%;
    text-align: center;
    float: left;
    margin-top: 10px;
    padding-bottom: 20px;
    margin-left: 1%;
    margin-right: 1%;
    border-radius: 3px;
    padding-top: 5px;
    border-bottom: 4px solid 333333;
}
.gallerythumbnailfull {
    width: 100%;
    text-align: center;
    float: left;
    margin-top: 10px;
    background-color: #EDCBC5;
    padding-bottom: 20px;
    margin-left: 8px;
    margin-right: 8px;
    border-radius: 3px;
    padding-top: 5px;
    border: 1px solid #333333;
}
.gallerythumbnailfullexternal {
    width: 100%;
    text-align: center;
    float: left;
    margin-top: 10px;
    background-color: #FFFFFF;
    padding-bottom: 20px;
    margin-left: 1%;
    margin-right: 1%;
    border-radius: 3px;
    padding-top: 5px;
    border: 1px solid #333333;
}

.gallerythumbnailshort {
    width: 23%;
    text-align: center;
    float: left;
    margin-top: 10px;
    background-color: #D3D3D3;
    padding-bottom: 20px;
    margin-left: 8px;
    margin-right: 8px;
    border-radius: 3px;
    padding-top: 5px;
    border-bottom: 4px solid 333333;
}
.gallery a {
  text-decoration: none;
}
.gallerythumbnail img
{
    max-width: 100%;
  max-height: 100%;
  display: block;
  width: 100%;
  height: auto;
}
.gallerythumbnail2 img
{
    max-width: 100%;
  max-height: 100%;
  display: block;
  height: auto;
}
.galleryheader {
    margin-top: 5px;
    margin-bottom: 5px;
    color: #333333;
    text-align: left;
    padding-left: 20px;
    padding-right: 20px;
}

.gallerytext {
    width: 90%;
    text-align: left;
    font-weight: normal;
    line-height: 25px;
    float: left;
    padding-left: 20px;
    padding-right: 20px;
    color: #333333;
}
.galleryreadmore {
    width: 90%;
    text-align: left;
    font-weight: normal;
    line-height: 25px;
    float: left;
    padding-left: 20px;
    padding-right: 20px;
    color: #DC4A26;
}
.gallerytext2 {
    text-align: left;
    font-weight: normal;
    line-height: 25px;
    padding-left: 20px;
    padding-right: 20px;
    color: #333333;
}
.gallerytag {
	color: #5D5E5D;
	padding-bottom: 4px;
	padding-top: 4px;
	text-align: left;
	padding-left: 20px;
	padding-right: 20px;
}
.gallerycard {
	width: 100%;
	height: auto;
	max-width: 400px;
	max-height: 200px;
	opacity: 1;
}

/* ---- NEWS  -------------------------------------------------------- */

.news {
    width: 98%;
    text-align: center;
    float: left;
    margin-top: 10px;
    background-color: #D3D3D3;
    padding-bottom: 20px;
    margin-left: 1%;
    margin-right: 1%;
    border-radius: 3px;
    padding-top: 5px;
    border-bottom: 4px solid 333333;
}
.newsheader {
    margin-top: 5px;
    margin-bottom: 5px;
    color: #333333;
    text-align: left;
    padding-left: 20px;
    padding-right: 20px;
    clear: both;
}

.newstext {
    width: 100%;
    text-align: left;
    font-weight: normal;
    line-height: 25px;
    float: left;
    padding-left: 20px;
    padding-right: 20px;
    color: #333333;
    border: 4px solid #990000;
}
.alertcontainer {
    width: 100%;
    display: inline-block;
    padding-bottom: 20px;
}
.alerttext {
    /*
    width: 100%;
    text-align: left;
    font-weight: bold;
    line-height: 25px;
    //padding: 20px;
    color: #990000;*/
    padding-left: 20px;
    padding-right: 20px;
    border: 4px solid #DC4A26;
}


/* ---- CONTENT  -------------------------------------------------------- */

.content {
	clear: both;
	display: inline-block;
	width: 100%;
	background-color: #FFFFFF;
	/* [disabled]min-width: 400px;
*/
	padding-bottom: 35px;
	padding-top: 0px;
	margin-top: -5px;
	margin-bottom: 0px;
	padding-left: 20px;
}
.contentheader {
	margin-top: 5px;
	margin-bottom: 5px;
	color: #6486BC;
	text-align: left;
	padding-left: 20px;
	padding-right: 20px;
}
.content p {
    margin: 0;
    color: #333333;
    text-align: left;
    padding-right: 20px;
    margin-bottom: 1em; 
}
.content ul {
    color: #333333;
    text-align: left;
    padding-right: 20px;
}
/*
.text_content {
	width: 90%;
	text-align: left;
	font-weight: lighter;
	line-height: 25px;
	padding-left: 20px;
	padding-right: 20px;
	color: #A3A3A3;
}
*/
.contentlogo {
	width: 50%;
	text-align: center;
	padding-top: 10px;
	float: right;
  padding-right: 20px;
}

.contentlogo2 {
	width: 25%;
	text-align: center;
	padding-top: 10px;
  	padding-bottom: 10px;
	float: right;
  padding-right: 20px;
  
  padding-left: 20px;
}

/* ---- BOOKINGS  -------------------------------------------------------- */

.coursedates {
  float: left;
	background-color: #FFFFFF;
	/* [disabled]min-width: 400px;
*/
	padding-bottom: 35px;
	padding-top: 0px;
	margin-top: 0px;
	margin-bottom: 0px;
}

.coursedate {
    clear: both;
    max-width: 500px;
    text-align: center;
    float: left;
    margin-top: 20px;
    background-color: #D3D3D3;
    padding-bottom: 20px;
    margin-left: 20px;
    margin-right: 20px;
    border-radius: 3px;
    padding-top: 20px;
    border-bottom: 4px solid 333333;
}
    .coursedate p {
        clear: both;
        display: inline-block;
        text-align: left;
        font-weight: normal;
        line-height: 25px;
        float: left;
        padding-left: 20px;
        padding-right: 20px;
        color: #333333;
    }

.book {
    width: 90%;
    text-align: center;
    float: left;
    margin-top: 20px;
    background-color: #D3D3D3;
    padding-bottom: 20px;
    margin-left: 20px;
    margin-right: 20px;
    border-radius: 3px;
    padding-top: 20px;
    border-bottom: 4px solid 333333;
}
    .book p {
        display: inline-block;
        text-align: left;
        font-weight: normal;
        line-height: 25px;
        float: left;
        padding-left: 20px;
        padding-right: 20px;
        color: #333333;
        margin: 2px;
    }

.bigfeetext {
    clear: both;
    display: inline-block;
    text-align: left;
    font-weight: bolder;
    line-height: 25px;
    float: left;
    padding-left: 20px;
    padding-right: 20px;
    color: #333333;
    font-size: 20px;
    margin: 2px;
}
.smallfeetext {
    clear: both;
    display: inline-block;
    text-align: left;
    font-weight: bolder;
    line-height: 25px;
    float: left;
    padding-left: 20px;
    padding-right: 20px;
    color: #333333;
    font-size: unset;
    margin: 2px;
}

.bigfee {
    display: inline-block;
    text-align: right;
    font-weight: bolder;
    line-height: 25px;
    float: right;
    padding-left: 20px;
    padding-right: 20px;
    color: #333333;
    font-size: 30px;
    margin: 2px;
}

.smallfee {
    text-align: right;
    font-weight: bolder;
    line-height: 25px;
    float: right;
    padding-left: 20px;
    padding-right: 20px;
    color: #333333;
    font-size: 20px;
    margin: 2px;
}

.action {
  width:130px;
  background-color: #DC4A26;
	color: #fff;
	font-weight: bold;
    font-style: normal;
    margin-top: 5px;	
	margin-right: 20px;	
    margin-left: 20px;	
    text-align: center;
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 10px;
	padding-bottom: 10px;  
	font-size: 20px;
  float:right;
  vertical-align: top;
  text-decoration: none;
	border:1px solid #DC4A26; 
  
  clear:both;
}
.action:link {
  color:white;
}

.action:hover {
  background-color: #fff;
	color: #DC4A26;
	cursor: pointer;
}
.action:visited {
  color:white;
}
.action:active {
  color:white;
}


.actionexternal:link {
  color:white;
}
.actionexternal:visited {
  color:white;
}
.actionexternal:active {
  color:white;
}

.actionexternal {
    width: 130px;
    background-color: #2AA09D;
    color: #fff;
    font-weight: bold;
    font-style: normal;
    margin-top: 5px;
    margin-right: 20px;
    margin-left: 20px;
    text-align: center;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 20px;
    float: right;
    vertical-align: top;
    text-decoration: none;
    border: 1px solid #2AA09D;
    clear: both;
}

.actionexternal:hover {
    background-color: #fff;
    color: #2AA09D;
    cursor: pointer;
}

.more {
    //width: 200px;
    background-color: #fff;
    color: #000;
    font-weight: bold;
    font-style: normal;
    margin-top: 5px;
    margin-right: 20px;
    margin-left: 20px;
    text-align: center;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 20px;
    float: left;
    vertical-align: top;
    text-decoration: none;
    border: none;
    clear: both;
}

.more:hover {
    background-color: #fff;
    color: #DC4A26;
    cursor: pointer;
}

.prevnext {
  width:130px;
  background-color: #2AA09D;
	color: #fff;
	font-weight: bold;
    font-style: normal;
    margin-top: 5px;	
	margin-right: 20px;	
    margin-left: 20px;	
    text-align: center;
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 5px;
	padding-bottom: 5px;  
	font-size: 16px;
  vertical-align: top;
  text-decoration: none;
	border:1px solid #2AA09D; 
  
  clear:both;
}
.prevnext:hover {
  background-color: #fff;
	color: #2AA09D;
	cursor: pointer;
}

.toc p {
  font-size: 20px;
  text-transform: uppercase;
  color: #2AA09D;
}

.toc div {
  margin:10px
}

.toc li {
  color: #2AA09D;
  text-align: left;
  padding-right: 20px;
}

.toc li a {
  color: #2AA09D;
  text-align: left;
  padding-right: 20px;
  text-decoration: none;  
}

.toc li a:hover {
  color: #000;
  text-align: left;
  padding-right: 20px;
  text-decoration: none;  
}

.nav{
  margin:10px
}

/* unvisited link */
.nav a:link {
  color: #ffffff;
  text-decoration:none;
}

/* visited link */
.nav a:visited {
  color: #ffffff;
}

/* mouse over link */
.nav a:hover {
  color: #5E5F5F;
}


.nicelink {
  color: #2AA09D;
  text-align: left;
  padding-right: 20px;
  text-decoration: none;  
}

.nicelink:hover {
  color: #000;
  text-align: left;
  padding-right: 20px;
  text-decoration: none;  
}

.nicelink:visited {
  color: #2AA09D;
  text-align: left;
  padding-right: 20px;
  text-decoration: none;  
}
.justdiv {

}
.just {
    background-color: #fff;
    color: #000;
    font-weight: bold;
    font-style: normal;
    margin-top: 5px;
    margin-right: 5px;
    margin-left: 5px;
    padding-left: 17px;
    padding-right: 17px;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 16px;
    float: left;
    vertical-align: top;
    text-decoration: none;
    border: none;
}

.just:hover {
    background-color: #fff;
    color: #DC4A26;
    cursor: pointer;
}
.full {
    width: 130px;
    background-color: #333333;
    color: #fff;
    font-weight: bold;
    font-style: normal;
    margin-top: 5px;
    margin-left: 20px;
    margin-right: 20px;
    text-align: center;
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 20px;
    float: right;
    vertical-align: top;
    text-decoration: none;
    border: 1px solid #333333;
    clear: both;
}

/* ---- FOOTER  -------------------------------------------------------- */

.copyright {
	text-align: center;
	padding-top: 20px;
	padding-bottom: 20px;
	background-color: #333333;
	color: #FFFFFF;
	text-transform: uppercase;
	font-weight: lighter;
	letter-spacing: 2px;
	border-top-width: 2px;
}
footer {
	background-color: #B3B3B3;
  width:100%;
	clear: both;
	display: inline-block;
  padding-top: 20px;
  padding-bottom:20px;
}

.footermessage {
	color: #FFFFFF;
	text-align: center;
	margin: 0;
	letter-spacing: 4px;
}

.footermenucolumn {
    width: 20%;
    text-align: center;
    float: left;
    margin-left: 20px;
    margin-right: 20px;
    border-radius: 3px;
}
.footermenu {
    color: #333333;
    font-weight: normal;
    font-style: normal;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    /*padding-top: 10px;*/
    line-height: 2em;
    font-size: 12px;
    float: left;
    vertical-align: text-bottom;
    text-decoration: none;
    clear: both;
}
/* unvisited link */
.footermenu:link {
  color: black;
  text-decoration:none;
}

/* visited link */
.footermenu:visited {
  color: black;
}

/* selected link */
.footermenu:active {
  color: black
}
.footermenu:hover {
	color: white;
	cursor: pointer;
}

.inlinelink {
    color: #ffffff;
    font-style: normal;
}

.inlinelink:hover {
    color: #000000;
    cursor: pointer;
}

.faqs p {
    width: 80%;
    text-align: left;
    font-weight: normal;
    line-height: 25px;
    padding-left: 20px;
    padding-right: 20px;
    color: #333333;
}

.contact p {
    width: 80%;
    text-align: left;
    font-weight: normal;
    line-height: 25px;
    padding-left: 20px;
    padding-right: 20px;
    color: #333333;
}

.bookingform input[type=text], textarea
{
  
  width:100%;
  max-width: 400px;
}

video
{
  width:50%;
}
.tallimage {
  width:50%
}

.box-div {
  background-color: #efa89a;
  margin-left:2em;
  margin-right:2em;
  padding:10px;
  display: inline-block;
	clear: both;
  max-width:90%;
}
.box-icon {
  background-color: #efa89a;
  width:50px;
  float:left;  
  color:white;
  padding-right:10px;
  font-style: italic;
  font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
  font-size: 30pt;
}
.box {
  background-color: #efa89a;
  color: white;
  font-weight:600;
    width:auto;
    overflow:hidden;
}

.factoid-div {
  background-color: #99cccc;
  margin-left:2em;
  margin-right:2em;
  padding:10px;
}
.factoid-icon {
  background-color: #99cccc;
  width:20px;
  float:left;  
  color:white;
  padding-right:10px;
  font-style: italic;
  font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
  font-size: 30pt;
}
.factoid {
  background-color: #99cccc;
    width:auto;
    overflow:hidden;
}

/*
.factoid-div {
  background-color: #99cccc;
  display:inline-block;
overflow: hidden;
height: 1%;
}
.factoid-icon {
  width:50px;
  overflow:hidden;
  color:white;
  padding-right:10px;
  font-style: italic;
  font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";
  font-size: 30pt;
  float:left;
  border:5px solid;
}.factoid {
  width:auto;
  background-color: #99cccc;
  float:left;
  border:5px solid ;
}
*/
/*
.factoid-icon {
  background-color: #99cccc;
  color:white;
  font-style: italic;
  font-size: 30pt;
  font-weight:bold;
  font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif"
  float:left;
  margin: 0px;
  width:50px;
}
.factoid {
  background-color: #99cccc;
  float:left;
}
*/

.videoWrapper {
  position: relative;
  padding-bottom: 300px; /*56.25%;*/ /* 16:9 */
  
  width:500px;
  max-width:100%;
  height: 0;
}
.videoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width:500px;
  max-width:100%;
}


.stlwindow{
  position:fixed;
  top:0;
  right:0;
  width:400px;
  visibility:hidden;
  background:ivory;
}

.stlwindow-inner{

  border:1px solid black;
  padding:4px;
}

.stlcontent{
  
  height:400px;
}

.stlviewer-header {
  font-size: 20px;
  font-weight: bold;
  color: #000000;
  text-align: left;
}

mono {
  font-family:monospace;
  font-size:18px;
  font-weight: bold;
}



/* ---- MEDIA Mobile -------------------------------------------------------- */

@media (max-width: 320px) {
.justdiv {
    padding: 0;
}
.just {
    margin-top: 0px;
    margin-right: 0px;
    margin-left: 0px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    font-size: 14px;
}
.logo {
    margin-left: 0px;
    margin-right: 0px;
    max-width: 80%;
}
.introtitlecolumn {
	width: 100%;
  }
.introtitle {
	width: 100%;
	font-size: 25px;
}
.introsubtitle {
	width: 100%;
}  
.introcolumn {
	width: 100%;
}
.gallerytext {
	width: 90%;
	text-align: left;
	padding-left: 20px;
	padding-right: 20px;
}
.gallerythumbnail {
	width: 100%;
  border:2px solid #D3D3D3;
}
.gallerythumbnailshort {
	width: 100%;
}
.footermenucolumn {
	width: 100%;
}
.footermessage {
	padding-left: 10px;
	padding-right: 10px;
	line-height: 22px;
	text-align: center;
}
.contentlogo2 {
	width: 90%;
}
video
{
  width:100%
}  
.tallimage {
  width:100%
}
.indent{    
  padding: 4px;
  margin-left:0em;
  margin-right:0em;
  max-width:100%;
}  
pre.prettyprint {
  margin-left:0em;
  margin-right:0em;
}
pre {
  margin-left:0em;
  margin-right:0em;
}

.box-div {
  margin-left:0em;
  margin-right:0em;
  max-width:100%;
}

.stlwindow{
  width:100%;
}


table {
  border-collapse: collapse;
  margin: 25px 0;
  font-size: 1.1em;
  font-family: sans-serif;
  min-width: 400px;
  border: 1px solid #000000;
}

thead tr {
  background-color: #000000;
  color: #ffffff;
  text-align: left;
}

th,td {
    padding: 12px 15px;
}


}


/* ---- MEDIA Small Tablet -------------------------------------------------------- */

@media (min-width: 321px)and (max-width: 767px) {
.just {
    margin-top: 0px;
    margin-right: 0px;
    margin-left: 0px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    font-size: 14px;
}
.logo {
    margin-left: 0px;
    margin-right: 0px;
    max-width: 100%;
}
.introtitlecolumn {
	width: 100%;
  }
.introtitle {
	width: 100%;
	font-size: 25px;
}
.introsubtitle {
	width: 100%;
}  
.introcolumn {
	width: 100%;
}
.gallerytext {
	width: 100%;
	text-align: left;
	padding: 0;
	padding-left: 20px;
	padding-right: 20px;
	width: 90%;
}
.gallerythumbnail {
	width: 100%;
  border:2px solid #D3D3D3;
}
.gallerythumbnail {
	width: 100%;
  border:2px solid #D3D3D3;
}
.gallerythumbnailshort {
    width: 100%;
}
.footermenucolumn {
	width: 40%; 
}
.introcolumn {
	width: 100%;
	margin-left: 0px;
	margin-right: 0px;
}
video
{
  width:100%
}  
.tallimage {
  width:100%
}

.indent{    
  padding: 4px;
  margin-left:0em;
  margin-right:0em;
  max-width:90%;
}  
pre.prettyprint {
  margin-left:0em;
  margin-right:0em;
}
pre {
  margin-left:0em;
  margin-right:0em;
}
.box-div {
  margin-left:0em;
  margin-right:0em;
  max-width:100%;
}  
.stlwindow{
  width:100%;
}

}

/* ---- MEDIA Small Desktop -------------------------------------------------------- */

@media (min-width: 768px) and (max-width: 1096px) {
.gallerytext {
	width: 100%;
}
.gallerythumbnail {
	width: 48%;
  border:2px solid #D3D3D3;
  margin-left: 4px;
  margin-right: 4px;
}
.gallerythumbnailshort {
    width: 48%;
}
.gallerytext {
	width: 90%;
	margin: 0;
	padding: 20px;
}
.footermenucolumn {
	width: 23%;
}
.tallimage {
  width:80%
}

video
{
  width:75%
}    
}
