﻿/* =========================================================================================================
   HOME STYLESHEET FOR TELESTREAM HOME - RESPONSIVE; THESE CLASSES / AMEND THE BASIC BOOTSTRAP CSS AND TS-STYLE (/styles/bootstrap.css)     
   ========================================================================================================= */



@font-face {
	font-family: 'SourceSansPro-Regular';
	src: url('/assets/fonts/SourceSansPro-Regular-webfont.eot');
	src: url('/assets/fonts/SourceSansPro-Regular-webfont.eot?#iefix') format('embedded-opentype'),  url('/assets/fonts/SourceSansPro-Regular-webfont.woff') format('woff'),  url('/assets/fonts/SourceSansPro-Regular-webfont.ttf') format('truetype'),  url('/assets/fonts/SourceSansPro-Regular-webfont.svg#SourceSansPro-Regular') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'SourceSansPro-Semibold';
	src: url('/assets/fonts/SourceSansPro-Semibold-webfont.eot');
	src: url('/assets/fonts/SourceSansPro-Semibold-webfont.eot?#iefix') format('embedded-opentype'),  url('/assets/fonts/SourceSansPro-Semibold-webfont.woff') format('woff'),  url('/assets/fonts/SourceSansPro-Semibold-webfont.ttf') format('truetype'),  url('/assets/fonts/SourceSansPro-Semibold-webfont.svg#SourceSansPro-Semibold') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'SourceSansPro-Light';
	src: url('/assets/fonts/SourceSansPro-Light-webfont.eot');
	src: url('/assets/fonts/SourceSansPro-Light-webfont.eot?#iefix') format('embedded-opentype'),  url('/assets/fonts/SourceSansPro-Light-webfont.woff') format('woff'),  url('/assets/fonts/SourceSansPro-Light-webfont.ttf') format('truetype'),  url('/assets/fonts/SourceSansPro-Light-webfont.svg#SourceSansPro-Light') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Glyphicons Halflings';
	src: url('/assets/fonts/glyphicons-halflings-regular.eot');
	src: url('/assets/fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('/assets/fonts/glyphicons-halflings-regular.woff') format('woff'), url('/assets/fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('/assets/fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg');
}


/*CSS FOR FULLSCREEN VIDEO BACKGROUND*/             

.fullscreen-bg {
	position: absolute;
	top: 81px;
	right: 0;
	bottom: 0;
	left: 0;
	overflow: hidden;
	z-index: -100;
    /*z-index: 0;*/
	/*background: url('/images/home/Hero-Background-2017-WithArc-2x.jpg') no-repeat;*/
    background: url('/images/home/Hero-Background-2018.jpg') no-repeat;
	background-size: cover;
    height: 600px;
}
.fullscreen-bg__video {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 400px;
     
}
 @media (min-aspect-ratio: 16/9) {
 .fullscreen-bg__video {
 height: 190%;
 /*top: -114%;*/
/*top: -100%;*/
top: -70%;
/*width: 200%;*/
}
}
 @media (max-aspect-ratio: 16/9) {
 .fullscreen-bg__video {
 width: 300%;
 left: -100%;
}
}
 @media (max-width: 767px) {
 .fullscreen-bg {
 /*background: url('/images/home/Hero-Background-2017-WithArc-2x.jpg') center center / cover no-repeat;*/
 background: url('/images/home/Hero-Background-2018.jpg') center center / cover no-repeat;
}
 .fullscreen-bg__video {
 display: none;
}
}



.image-bg-fluid-height,
.image-bg-fixed-height {
    text-align: left;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

.image-bg-fluid-height {
	/*background: url('http://lorempixel.com/g/1920/500/') no-repeat center center scroll;*/
    /*background: url('/images/home/Hero-Background-2017-WithArc-2x.jpg') no-repeat center center scroll;*/
    
    
    
    /*background: url('/slides/TS-Hero-2017.gif') no-repeat center center scroll;*/
    
    
    /*background: url('/slides/TS-Hero-2017.mp4') no-repeat center center scroll;*/

    
    /*background: url('/images/home/Hero-BackgroundColor.jpg') no-repeat center center scroll;*/
    padding: 100px 0;
    /*height: 60%;*/

    max-height: 340px;
    overflow: hidden;


    background-size: 80% 80%;
    background-size: cover;
}

.image-bg-fixed-height {
	/*background: url('http://lorempixel.com/g/1920/500/') no-repeat center center scroll;*/
    /*background: url('/images/home/Hero-Background-2017-1.png') no-repeat center center scroll;*/
    background-color: #dee7f5;
     background-size: 100% 100%;
    height: 400px;
}


.foreground {
  width: 600px;/*adjust*/
  height: 600px;/*adjust*/
  /*animation-name: spin;
  animation-duration: 208.00s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;*/
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


#loading {
		-webkit-animation: rotation 145s infinite linear;
}

@-webkit-keyframes rotation {
		from {
				-webkit-transform: rotate(0deg);
		}
		to {
				-webkit-transform: rotate(359deg);
		}
}




.glyphicon.glyphicon-chevron-left {
    font-size: 36px;
}

.fa.fa-angle-left {
    font-size: 36px;
}

.fa.fa-angle-right {
    font-size: 36px;
}





.carousel, .item, .active {
	/*height: 100%;*/
}
.carousel-inner {
	height: 100%;
}
.fill {
	width: 100%;
	height: 100%;
	background-position: center;
	background-size: cover;
}
/* faster sliding speed */
/*.carousel-inner > .item {
	-webkit-transition: 0.6s ease-in-out left;
	-moz-transition: 0.6s ease-in-out left;
	-o-transition: 0.6s ease-in-out left;
	transition: 0.6s ease-in-out left;
}*/
.carousel-control {
	position: absolute;
	/*top: 40%;*/
	top: 42%;
	/*left: 15px;*/
	left: -20px;
	width: 40px;
	height: 40px;
	/*margin-top: -20px;*/
	/*font-size: 40px;*/
    font-size: 80px;
	font-weight: 100;
	line-height: 30px;
	/*color: #ffffff;*/
    color: #009bdf;
	text-align: center;
	/*background: #009bdf;
	border: 3px solid #ffffff;*/
	-webkit-border-radius: 23px;
	-moz-border-radius: 23px;
	border-radius: 23px;
	opacity: 0.7;
	filter: alpha(opacity=70);
}
.carousel-control.right {
	/*right: 0;*/
	right: -20px;
	left: auto;
	background-repeat: repeat-x;
 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1);
}
.carousel-fade .carousel-inner .item {
	/*-webkit-transition-property: opacity;
  opacity: 0;
  transition-property: opacity;
  transition-duration: 4s;
  transition-timing-function:linear;*/
	transition-property: opacity;
	transition-duration: 9s;
	transition-timing-function: linear;
	-webkit-transition: opacity 0.9s ease-in-out;
	-moz-transition: opacity 0.9s ease-in-out;
	-ms-transition: opacity 0.9s ease-in-out;
	-o-transition: opacity 0.9s ease-in-out;
	transition: opacity 0.9s ease-in-out;
	opacity: 0;
}
.carousel-fade .carousel-inner .item, .carousel-fade .carousel-inner .active.left, .carousel-fade .carousel-inner .active.right {
	opacity: 0;
	filter: alpha(opacity=0);
	transition-duration: 9s;
	-webkit-transition: opacity 0.5s ease-in-out;
	-moz-transition: opacity 0.5s ease-in-out;
	-ms-transition: opacity 0.5s ease-in-out;
	-o-transition: opacity 0.5s ease-in-out;
	transition: opacity 0.5s ease-in-out;/*transition-property: opacity;
  transition-duration: 4s;
  transition-timing-function:linear;*/
}
.carousel-fade .carousel-inner .active, .carousel-fade .carousel-inner .next.left, .carousel-fade .carousel-inner .prev.right {
	opacity: 1;
}
.carousel-fade .carousel-inner .next, .carousel-fade .carousel-inner .prev, .carousel-fade .carousel-inner .active.left, .carousel-fade .carousel-inner .active.right {
	left: 0;
	opacity: 0;
	z-index: 1;
	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);
}
.carousel-fade .carousel-control {
	z-index: 2;
}
.carousel-indicators .active {
	width: 17px;
	height: 17px;
	margin-top: 0;
	background-color: #009BDF;
}
.carousel-indicators li {
	display: inline-block;
	width: 15px;
	height: 15px;
	/*margin: 1px;*/
  /*margin: 100px 0px 0px 0px;*/
	text-indent: -999px;
	cursor: pointer;
	background-color: #CCC;
	/*border: 1px solid #fff;*/
	border-radius: 10px;
	border: none;
}

/*FOR CENTER ALIGNED CONTENT IN THE CAROUSEL BANNER*/

@media screen and (min-width: 768px) {
.carousel-caption {
	right: 20%;
	left: 20%;
	padding-bottom: 70px;
}
}
.carousel-caption {
	position: absolute;
	right: 15%;
	/* bottom: 20px; */
	bottom: 0px;
	left: 15%;
	z-index: 10;
	padding-top: 20px;
	padding-bottom: 20px;
	color: #ffffff;
	text-align: center;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}

/*FOR LEFT ALIGNED CONTENT IN THE CAROUSEL BANNER*/
@media screen and (min-width: 768px) {
.carousel-caption-left {
	right: 20%;
	left: 20%;
	padding-bottom: 70px;
}
}
.carousel-caption-left {
	position: absolute;
	right: 15%;
	/* bottom: 20px; */
	top: 30px;
	left: 4%;
	z-index: 10;
	padding-top: 20px;
	padding-bottom: 20px;
	/*color: #ffffff;*/
	text-align: left;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}

.carousel-caption-left h1{
  font-size: 42px;
  font-family: 'SourceSansPro-Light', Helvetica;
  margin: 5px 0 5px 0px;
  line-height: 1em;
  /*color: #FFFFFF;*/
  -webkit-text-shadow: 0px 1px 0px rgba(0, 0, 0, 1);
  -moz-text-shadow: 0px 1px 0px rgba(0, 0, 0, 1);
  text-shadow: 0px 1px 0px rgba(0, 0, 0, 1);
}

.carousel-caption-left h2{
  font-size: 20px;
  font-family: 'SourceSansPro-Light', Helvetica;
  margin: 5px 0 5px 0px;
  line-height: 1.3em;
  /*color: #FFFFFF;*/
  -webkit-text-shadow: 0px 1px 0px rgba(0, 0, 0, 1);
  -moz-text-shadow: 0px 1px 0px rgba(0, 0, 0, 1);
  text-shadow: 0px 1px 0px rgba(0, 0, 0, 1);
}
.img-fade {
	-webkit-animation: fadein 2.5s; /* Safari and Chrome */
	-moz-animation: fadein 2.5s; /* Firefox */
	-ms-animation: fadein 2.5s; /* Internet Explorer */
	-o-animation: fadein 2.5s; /* Opera */
	animation: fadein 2.5s;
}
 @keyframes fadein {
 from {
opacity: 0;
}
 to {
opacity: 1;
}
}

/* Firefox */
@-moz-keyframes fadein {
 from {
opacity: 0;
}
 to {
opacity: 1;
}
}

/* Safari and Chrome */
@-webkit-keyframes fadein {
 from {
opacity: 0;
}
 to {
opacity: 1;
}
}

/* Internet Explorer */
@-ms-keyframes fadein {
 from {
opacity: 0;
}
 to {
opacity: 1;
}
}
​ 
/* Opera */
@-o-keyframes fadein {
 from {
opacity: 0;
}
 to {
opacity: 1;
}



 /*FOR THE 3 COL SLIDER*/
.whatsnew{border:1px solid #000000;font-size:1.3em;}
.whatsnew-active{}
.whatsnew-image{} 
.align-c {}
.inner-tb-25{}
.image-inner{}
.whatsnew-content{}








    /* keep full widget on smaller screens */
    @media (max-width: 767px) { 
	    body {
		    padding-left: 0;
		    padding-right: 0;
	    }
    }

#wrap > .container {
  padding: 60px 15px 0;
}
.container .credit {
  margin: 20px 0;
}
#icon {
  width: 100%;
  top:-60px;
}
#icon.affix-top {
  position:fixed;
  top: 0px;
  -webkit-transition: all 0.8s ease;
}

#icon.affix {
  position:fixed;
  top:0;
  bottom:60px;
  -webkit-transition: all 1s ease;
}

/*CUSTOM RESPONSIVE iframe */
.wrapper {
	width: 96%;
	height: 100%;
	margin: 0 auto;
	background: #fff
} /*NOT USED RIGHT NOW*/
.h_iframe {
	position: relative;
}
.h_iframe .ratio {
	display: block;
	width: 90%;
	height: auto;
}
.h_iframe iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 90%;
	height: 100%;
}

        @media (max-width: 767px) {

            .font-size-24 {
                font-family: 'SourceSansPro-Light';
                font-size: 14px;
            }
        }


#div_demo {
    /*width: 100%;
    height: 40%;
    position: relative;*/
    position: absolute;
	top: 81px;
	right: 0;
	bottom: 0;
	left: 0;
	overflow: hidden;
	z-index: -100;
    /*z-index: 0;*/
	/*background: url('/images/home/Hero-Background-2017-WithArc-2x.jpg') no-repeat;*/
	width: 100%;
    background-size: cover;
    height: 300px;
}


