@charset "utf-8";
/* CSS Document */

body {
	padding-top: 51px;
}

/******************** BANNERS  (ALL PAGES)***********************
*****************************************************/
/*.jumbotron .container {
	padding-top: 10px;
}*/
.banner {
	color: #f5f5f5;
}
.steelblue {
	background-color: steelblue;
}
.seagreen {
	background-color: seagreen;
}
.teal {
	background-color: teal;
}
.slateblue {
	background-color: slateblue;	
}
.antiquewhite {
	background-color: antiquewhite;
}
.olivedrab {
	background-color: olivedrab;
}
.slategray {
	background-color: slategray;
}
.darkgoldenrod {
	background-color: darkgoldenrod;
}



/* Darker hr for use in jumbotrons*/
.container .jumbotron  hr {
	border-top: 1px solid #333;
	clear: left;
}

.jumbotron {
	overflow: hidden; /*needed to allow float:right to work on buttons within the jumbotron*/
}


/******************** HOME PAGE********************
****************************************************/
/*Make header banner side by side on desktop*/
.hjs-hero-banner {
	background-color: #FB8C00;
	text-align: center;
	position: relative;
	margin-bottom: 80px;
}

.hjs-hero-banner .img-responsive {
	display: inline;}
 
.header-left {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 20px;
}

.hjs-hero-banner {
    margin-bottom: 0; 
    margin-top: 51px
}
.hjs-hero-banner > .container {
    display: flex;
    flex-direction: column
}
.hjs-hero-banner .img-responsive {
    max-width: auto
}
.clients {
    width:100%; background-color: #D9D9D9; margin-bottom: 30px; text-align: center
}
.clients img {
    max-height:37px;
    max-width: 100%;
    margin-bottom: 10px;
    }
.clients .col-lg-4 {
    padding: 0 60px;
}
.header-left h1 {
    font-size: 55px
}
.clients > .row > hr {
    margin-left: auto; margin-right: auto; width:22%; margin: 5px auto 20px
}
.clients  hr {
    margin: 5px auto 20px
}


.container.marketing h2, .container.marketing h4 {
    font-style: italic;
    text-align: center;
    color: #fb8c00;
}
/* Page scroll mouse icon */
.mouse-down {
	background-image: url(../images/mouse-down.png);
	position: absolute;
	width: 30px;
	height: 30px;
	background-size: contain;
	bottom: 15px;
	left: 49%;
	  }

.mouse-down:hover {
		  background-image: url(../images/mouse-down-hover.png);
		  cursor:pointer;
	  }

/* Adjust branding to fit square logo*/
.navbar-brand {
	padding: 8px 15px;
}

/* Increase size of large buttons */
.btn-lg {
	min-width: 154px;
}



/* Style list inside expanding sections*/
#expand ul {
	font-size: 21px; 
}


/* Right justified buttons for the Jumbotron sections on home page and download page*/
.btn-jumbotron-action { 
	float: right;
	margin: 10px 30px 0px 0px;
	
}

/* Style Example Timeline Container*/
.container .jumbotron #timeline-container {
	background-color: #ffffff;
	border: thin solid #555555;
	border-spacing: 1px 1px;
}

/*Customise AddThis signUp Form*/
	#mc_embed_signup{background:none; clear:left; font:14px Helvetica,Arial,sans-serif;}
	#mce-EMAIL{
		color:black;
		display:inline;
		}
	#mc_embed_signup form {
    padding-top: 20px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
}
.jumbotron .container .row #mc_embed_signup #mc-embedded-subscribe-form #mc_embed_signup_scroll p {
	font-size: 12px;
	margin:0px 0px 10px 0px;
	
}
.jumbotron .container .row .col-lg-offset-0.col-lg-6 #mc_embed_signup #mc-embedded-subscribe-form #mc_embed_signup_scroll label {
	font-size: 28px;
	padding-bottom: 0px;
}
@media (min-width:1200px){
	
    .banner-logo {
        max-width: 200px;
    }
	.hjs-hero-banner > .container {
        flex-direction: row;
    }
}
    .hjs-hero-banner h3 {
        font-size: 20px;
    }

@media (min-width:1601px){
	
    .banner-logo {
	    max-width: none;
    }
    .hjs-hero-banner h3 {
	    font-size: 28px;
    }
}
/* Performance Example Timeline Container*/

#performance-event-number-input {
	width: 70px;
}


/****************DOCUMENTATION PAGE*****************
***********************************************/

/* HJS options and functions styling*/
:not(pre) > code[class*="language-"], pre[class*="language-"] {
    background: #f9f9f9;
}

pre.example-output-box {
	font-size: 18px;
	tab-size:5;
	background-color: #F9F9F9;
}

.function-content-section pre {
	border: 1px solid #EEE
}

.code-comment {
	color: #AAAAAA
}

.wide-table-container {
    overflow-x: auto;
}

.function-container { /*container for each function description block*/
	border: 1px solid #ccc;
	border-radius: 4px;
	margin: 12px 0px 12px 0px;
}

.btn-function-header { /*header for each function is also a button to expand/collapse the content*/
	width:100%;
	text-align: left;
	padding: 2px 15px;
	background-color: #F5F5F5;
	border-radius: 4px 4px 0px 0px;
    white-space: normal;
}

.btn-function-header.collapsed {
	border-radius: 4px;
}

.btn-function-header:hover {
	background-color: #EEE;
}

.function-title { /*main title within the expand/collapse button*/
	font-weight: bold;
	font-size: 1.5em;
	color: #0769ad;
	font-family: Monaco,Consolas,"Courier New",monospace;
	white-space: pre-wrap;
	word-break: break-word;
}

.function-content-section { /*section within the expandable content*/
	border-top:1px solid #CCC;
	padding: 10px 15px;
}

.function-content-section h4 {
	font-weight:bold;
}

.function-table tbody {
	vertical-align: top;
}

.function-table td, .function-table th  {
	border:1px solid #CCC;
}

.function-content-section table {
	margin-bottom: 11px;
}

.function-container .function-table td {
	border-left:none;
	border-right:none;
	border-top: 1px solid #EEE;
	border-bottom: 1px solid #EEE;
}

/* Customise Tooltip*/
.tooltip {
  font-size: 16px;
}
.tooltip-inner {
  max-width: 600px;
  padding: 8px 18px;
  text-align:left;
}
.tooltip.right {
  padding: 0 5px;
  margin-left: 50px; 
}
.container table tbody tr th {
	padding: 5px 15px;
}
.container table tbody tr td {
	padding: 5px 15px;
}

/* Banner nav-list links*/
.jumbotron .container .row .col-lg-3 ul a li {
	color: #ffffff;
}
.jumbotron .container .row .col-lg-3 ul a li:hover {
	color: #ffffff;
	text-decoration:underline;
}

/* Increase padding on default hr*/
/*.container hr {
	margin-bottom: 50px;
	margin-top: 50px;
}*/


/****************EXAMPLES PAGE*****************
***********************************************/
.example-timeline-container {
	background-color: #ffffff;
	border: solid 1px #ccc;
	}

.example pre.example-output-box {
	background-color: #fffeef;
	}
.example p {
	font-size:14px;
}

.example h4 {
	word-break:break-word;
	}

.example-option-box {
	background-color: aliceblue;
    padding: 20px;
    margin-top: 30px;
    margin-bottom: 20px;
    border: solid 1px #ccc;
}


.example-controls-container {
	
	background-color: antiquewhite;
	padding:10px;
	border: solid 1px #ccc;
	
}


.example-controls-container div {
	display: inline;
	margin-right:20px;
}



/****************** DEMOS PAGE ***************************/
/*body {padding-top:50px; padding-bottom: 0px}*/
	
	.demo-list-row {
	/* [disabled]text-align: left; */
	margin-top: 50px;
	margin-bottom: 100px;
}
	
.container .demo-list-row hr {
	width: 40%;
    border-top: 1px solid #bdbdbd;
	margin: 0;
	margin-top: 23px;
	}

	
.container  .hr-left {
	float: left;
}
.container .hr-right {
	float: right;
}
.demo-list-row .btn-lg {
	margin-top: 10px;
}
@media 	screen and (max-width:1200px)
{

.container .demo-list-row h1 {
	/* [disabled]display: flex; */
}
	}

/******************** DOWNLOAD PAGE ***********************
****************************************************/
/* Position Checkboxes*/
#Checkboxes1 {
	text-align: left;
	padding-left: 0px;
    padding-right: 0px;
}
/* Re-align checkbox for mobile*/
@media (min-width: 1200px) {
	#Checkboxes1 {
	text-align: right;
}
}





/******************** FOOTER ***********************
****************************************************/

.footer {
	min-width: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-color: #333333;
	padding-bottom: 60px;
	color: #C8C8C8;
	text-align: center;
}
  .pre-footer > .jumbotron {
	background-color: #333333;
	margin-bottom:0px;
	padding-bottom:20px;
}
.pre-footer > .jumbotron p {
	color: #FFFFFF;
	font-weight: 600;
	font-size: 16px;
} 
.pre-footer > .jumbotron h1 {
	margin-top: 0px;
	padding-top: 0px;
	text-align: left;
	font-size: 45px;
	padding-bottom: 0px;
	margin-bottom: 5px;
	 
}

.pre-footer > .jumbotron a {
	color: #E7E7E7;
}
.pre-footer > hr {
	padding-top:10px;
	padding-bottom:10px;
}
.pre-footer .jumbotron .container hr {
	margin-top: 20px;
	margin-bottom: 20px;
}

.social-links {	
	color:#F5F5F5;
	text-align: center;
}


.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari/Opera */
     -khtml-user-select: none; /* Konqueror */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  not supported by any browser */
}