/***************************************************
    		    BODY                 
/***************************************************/



body {
	font: 400 15px Lato, sans-serif;
	line-height: 1.3em;
	color: #818181;
	}
	a:focus, a:hover{
		text-decoration: none;
	}
	h2 {
		font-family: "Titillium Web","Helvetica Neue",Helvetica,Arial,sans-serif;
		/*font-size: 24px;
		font-weight: 600;*/
		text-transform: uppercase;
		color: #203e5a;
		margin-bottom: 40px;
		font-size: 2em;
		font-weight: 200;
		}
	h4 {
	    font-family: "Titillium Web","Helvetica Neue",Helvetica,Arial,sans-serif;
	    font-size: 19px;
	    line-height: 1.3em;
	    color: #203e5a;
	    font-weight: 300;
	    margin-top: 0px;
	    margin-bottom: 15px;
		}
	p{
		font-family: "Titillium Web","Helvetica Neue",Helvetica,Arial,sans-serif;
		font-weight: 300;
		color:#555;
		line-height: 1.3;
	}
	.container {
	    padding-right: 15px;
	    padding-left: 15px;
	    margin-right: auto;
	    margin-left: auto;
	    padding-top: 40px;
	    padding-bottom: 40px;
	    margin-bottom: 20px;
	    border-top: 1px solid #EEE;
		}
		.noborder{
			border: none;
		}
	.container-fluid {
		padding: 60px 50px;
	  	}


  @media (max-width: 768px) {
  	.container{
	    padding-bottom: 10px;
	    margin-bottom: 5px;
  	}
	.container-fluid {
		padding: 20px 15px;
	  	}
  }



	.bg-grey {
		background-color: #f6f6f6;
		}
	.logo {
		color: #2598D0;
		font-size: 200px;
		}
		.logo-small {
		    color: #2598D0;
		    font-size: 50px;
			}


     .max-width500{
     	max-width: 500px;
     	margin-left:auto;
     	margin-right: auto;
	     }
     .max-width650{
     	max-width: 650px;
     	margin-left:auto;
     	margin-right: auto;
	     }

	.thumbnail {
		padding: 0 0 15px 0;
		border: none;
		border-radius: 0;
		}
		.thumbnail img {
			width: 100%;
			height: 100%;
			margin-bottom: 10px;
			}


/***************************************************
    		    List Wrapper
/***************************************************/
.listWrapper{}
	.listWrapper .expand{
		display: none;
		}

  @media (max-width: 768px) {
  	.listWrapper{
	    max-height: 600px;
	    overflow: hidden;
	    position: relative;
	  	}
	  	.listWrapper .expand{
		    position: absolute;
		    height: 50px;
		    width: 100%;
		    line-height: 50px;
		    bottom: 0px;
		    display: block;
		    color: #FFF;
		    text-align: center;
		    text-transform: uppercase;
		    cursor: pointer;
		    border: 1px solid #CCC;
		    background: #2598D0;
		  	}
	  	.listWrapper.expanded{
  		    max-height: initial;
		    overflow: initial;
		  	}
	  	.listWrapper.expanded .expand{
	  		display: none;
		  	}

  }


/***************************************************
    		    Top Navigation Bar
/***************************************************/

.sidebar-nav {
    padding: 9px 0;
}

.dropdown-menu{
	top:97%;
	}
	.dropdown-menu .sub-menu {
	    left: 100%;
	    position: absolute;
	    top: 0;
	    visibility: hidden;
	    margin-top: -1px;
		}

	.dropdown-menu li:hover .sub-menu {
	    visibility: visible;
		}
	.dropdown:hover .dropdown-menu {
	    display: block;
		}

.nav-tabs .dropdown-menu, .nav-pills .dropdown-menu, .navbar .dropdown-menu {
    margin-top: 0;
	}
.navbar .sub-menu:before {
    border-bottom: 7px solid transparent;
    border-left: none;
    border-right: 7px solid rgba(0, 0, 0, 0.2);
    border-top: 7px solid transparent;
    left: -7px;
    top: 10px;
	}
.navbar .sub-menu:after {
    border-top: 6px solid transparent;
    border-left: none;
    border-right: 6px solid #fff;
    border-bottom: 6px solid transparent;
    left: 10px;
    top: 11px;
    left: -6px;
	}
.navbar li.dropdown:hover a{
	color: #203e5a !important;
	background-color: #fff !important;
	}

	.navbar {
	    padding: 0px 20px;
		margin-bottom: 0;
		/*background-image: url(../images/header_bg.png);*/
	    background-color: rgba(0,124,194,0.9);
		background-size:cover;
		background-position: center;
		background-repeat: no-repeat;
		z-index: 9999;
		border: 0;
		font-size: 12px !important;
		line-height: 1.42857143 !important;
		letter-spacing: 4px;
		border-radius: 0;
		/*font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;*/
		}
		.navbar li a, .navbar .navbar-brand {
			color: #fff !important;
			}
			.navbar-brand {
			    padding: 8px 0px;
				}
				.navbar-brand img{
					width: 150px;
					}

	.navbar.affix{
		background-image: url(../images/header_bg.png);
		}
	.navbar-nav li a:hover, .navbar-nav li.active a {
		color: #203e5a !important;
		background-color: #fff !important;
		}
	.navbar-default .navbar-nav>li>a {
		text-transform: uppercase;
	    letter-spacing: 0.1em;
		}
	.navbar-default .navbar-toggle {
		border-color: transparent;
		color: #fff !important;
		}
	.navbar-default .open .dropdown-toggle {
		color: #fff !important;
		background-color: #007CC2 !important;
		}
	.navbar-default .dropdown-menu li img {
		margin-right: 5px;
		}
	.navbar-default .dropdown-menu li a {
	    color: #203e5a !important;
	    font-family: inherit;
	    /*text-transform: uppercase;*/
	    letter-spacing: 0.1em;
	    font-size: 0.9em;
	    line-height: 1.8em;
		}
		.navbar-default .dropdown-menu li a:hover {
			color: #ffffff !important;
			background-color: #203e5a !important;
			}



/***************************************************
    		    Secondary Navigation Bar
/***************************************************/

.nav2-wrapper{
	min-height: 30px;
	}

  @media (max-width: 768px) {
  	.nav2-wrapper{
  		display: none;
	  	}
  }

.nav2{
  top:59px;
  left:0px;
	  /*background: rgba(0,168,182,0.9);*/
	  /*background: rgba(0,124,194,0.9);*/
	  /*background: rgba(37,152,208,0.9);*/
	margin-left: auto;
	margin-right: auto;
	width: 100%;
  /*background: rgba(20,20,20,0.9);*/
  background-color: #3d4045;
  font-size: 0.9em;
  /*border-top: 1px solid rgba(0,124,194,0.3);*/
  box-shadow: 0px 0px 5px rgba(0,0,0,0.3);
  z-index:4;
  }
  .nav2 .container-flow{
  	width: 1170px;
  	margin-left: auto;
  	margin-right: auto;
	  }
  .nav2.navbar-default .navbar-nav>li{
    transition: background 0.3s linear;
  }
  .nav2.navbar-default .navbar-nav>li>a{
    color: #FFF;
    font-weight: 600;
    padding: 5px 10px !important;
    transition: background 0.3s linear;
    }
    .nav2.navbar-default .navbar-nav>li>a:hover{
      color: #FFF !important;
      background-color: rgba(255,255,255,0.3) !important;
      }
    .nav2.navbar-default .navbar-nav>li.active {
      /*background-color: rgba(255,255,255,0.9) !important;*/
      transition: background 0.3s linear;
      }
    .nav2.navbar-default li a:hover, .navbar-nav li.active a {
      color: #203e5a !important;
      background-color: rgba(255,255,255,1) !important;
      }



/***************************************************
    		    	Lead Banner Image
/***************************************************/


#leadImage{}
  .bigBanner{
    position: relative;
    width: 100%;
    overflow: hidden;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    height: 450px;
    padding-top: 10%;
    padding-left: 5%;
    margin-top: 30px;
    }
    .bigBanner:before{
      content: "";
      display: block;
      position: absolute;
      top: 0px;
      left: 0px;
      height: 100%;
      width: 100%;
      background-color: rgba(0,0,0,0);
      z-index: 0;
      }
    .bigBannerContent{
      position: absolute;
      text-align: left;
      z-index: 4;
      }

    .bigBannerContent{
		font-size: 47px;
		font-weight: 500;
		color: #FFF;
		text-shadow: 0px 1px 20px rgba(0,0,0,1);
		font-family: "Gotham SSm A","Gotham SSm B","Helvetica Neue",Arial,sans-serif;
	    }

  @media (max-width: 800px) {
	.bigBanner{
		height: 300px;
		padding-top: 13%;
		}
	    .bigBannerContent{
	    	font-size: 30px;
		    }
  }
  @media (max-width: 550px) {
  	.bigBanner{
		height: 210px;
		padding-top: 18%;
		}
	    .bigBannerContent{
	    	font-size: 22px;
		    }	
  }

/***************************************************
    		    	Carousel
/***************************************************/

#leadCarousel{
	margin-top: 50px;
}

	.carousel{
		padding:0px 75px;
		}
		.carousel-control{
			opacity: 0.8;
			font-size: 30px;
			}
		/*.carousel-control.right, .carousel-control.left {
			background-image: none;
			color: #FFF;
			}*/
		  /*@media (min-width: 1232px) {*/
			.carousel-control.right, .carousel-control.left {
				background-image: none;
				color: #2598D0;
				}
				.carousel-control.left{
					margin-left: -40px;
					}
				.carousel-control.right{
					margin-right: -40px;
					}
			/*}*/
		.carousel-indicators{
			bottom: -50px;
			z-index: 3;
			}
		.carousel-indicators li {
			border-color: #2598D0;
			}
			.carousel-indicators li.active {
				background-color: #2598D0;
			}
		.carousel-inner{
		    margin-bottom: 50px;
		    padding: 20px;
		    padding-bottom: 120px;
		    border: 1px solid #CCC;
	        box-shadow: 0px 3px 3px -2px rgba(0,0,0,0.3);
			}
		.carousel-inner img {
			object-fit: cover;
			/*-webkit-filter: grayscale(90%);
			filter: grayscale(90%);*/

		    /*border: 1px solid #CCC;*/
			width: 100%; /* Set width to 100% */
			height: 500px !important;
			margin: auto;
			}
		.carousel-caption{
		    /*background-color: #F3F3F3;*/
		    position: absolute;
		    top: 500px;
		    left: 0px;
		    width: 100%;
		    text-shadow: none;
		    padding: 0px 0px;
		    /*border: 1px solid #CCC;*/
			}
		.carousel-caption h3 {
			color: #333 !important;
			}
		#culture .carousel-caption p{
			color: #666;
		    font-weight: 300;
		    }
			@media handheld, only screen and (max-width: 1170px){
				.carousel-inner img {
					height: 275px !important;
				}
				#culture .carousel-caption{
					top: 270px;
					}
			}
			@media handheld, only screen and (max-width: 550px){
				.carousel-inner{
					padding-bottom: 150px;
					}
				.carousel-inner img {
					height: 150px !important;
					}
				.carousel{
					padding: 0px 20px;
					}
				.carousel-control .glyphicon-chevron-left{
					margin-left: 0px;
					}
				.carousel-control .glyphicon-chevron-right{
					margin-right: 0px;
					}
					.carousel-control.left {
					    margin-right: -15px;
				        margin-top: 60px;
						}
					.carousel-control.right {
					    margin-right: -15px;
				        margin-top: 60px;
						}
				#culture .carousel-caption{
					top: 150px;
					}
				#culture .carousel-caption h3{
				    font-size: 1.3em;
					}
			}

	.item h4 {
		font-size: 19px;
		line-height: 1.375em;
		font-weight: 400;
		font-style: italic;
		margin: 70px 0;
		}
	.item span {
		font-style: normal;
		}
	.panel {
		border: 1px solid #203e5a;
		border-radius:0 !important;
		transition: box-shadow 0.5s;
		}
		.panel:hover {
			box-shadow: 5px 0px 40px rgba(0,0,0, .2);
			}
		.panel-heading {
			color: #fff !important;
			background-color: #203e5a !important;
			padding: 25px;
			border-bottom: 1px solid transparent;
			border-top-left-radius: 0px;
			border-top-right-radius: 0px;
			border-bottom-left-radius: 0px;
			border-bottom-right-radius: 0px;
			}
		.panel-footer .btn:hover {
			border: 1px solid #203e5a;
			background-color: #fff !important;
			color: #203e5a;
			}
			.panel-footer {
				background-color: white !important;
				}
				.panel-footer h3 {
					font-size: 32px;
					}
				.panel-footer h4 {
					color: #aaa;
					font-size: 14px;
					}
				.panel-footer .btn {
					margin: 15px 0;
					background-color: #203e5a;
					color: #fff;
					}



/***************************************************
    		    	Cards
/***************************************************/



.card{
  display: block;
  position: relative;
  color: rgb(84, 84, 87);
  text-decoration: none;
  border-image-source: initial;
  border-image-slice: initial;
  border-image-width: initial;
  border-image-outset: initial;
  border-image-repeat: initial;
  line-height: 1.4;
  border-style: solid;
  border-color: rgb(226, 226, 227);
  border-width: 1px 1px 2px;
  border-radius: 4px;
  background: rgb(255, 255, 255);
  transition: border-color 0.25s;
  padding: 3rem 3rem;
  height: 100%;
  max-width: 30rem;
  margin: 15px auto;
  background-color: #FFF;
  }
  .position__card .card:hover {
    margin-top: 13px;
    border-color: rgb(197, 197, 200);
    box-shadow: 0px 4px 10px -2px rgba(0,0,0,0.2);
    background-color: rgba(104,185,217,0.03);
    transition: 0.3s ease;
    }
  .card-grey{
    background: rgba(104,185,217,0.1);
  }

.card_header{
  font-size: 1.3em;
  text-transform: inherit;
  font-weight: 400;
  color: #444;
  min-height: 50px;
  }
  .card_subheader{
    position: relative;
    padding: 15px 0px;
    font-weight: 500;
    line-height: 1.4em;
    padding-top: 60px;
    color:#5B62AC;
    }
    .card_subheader:before{
      content: "\f041";
      font-family: "FontAwesome";
      font-size:1.1em;
      vertical-align: bottom;
      display: inline-block;
      margin-right: 5px;
      color: #5B62AC;
      display: none;
      }

  .card_content{
  	display: none;
    text-align: left;
    font-family: Helvetica, sans-serif;
    font-weight: 200;
    line-height: 1.3em;
    min-height: 100px;
  }
  .card_footer{}



/***************************************************
    		    	More
/***************************************************/

.more{
  display: inline-block;
  position: relative;
  height: auto;
  font-weight: 5 00;
  text-transform: uppercase;
  text-decoration: none;
  text-align: center;
  white-space: nowrap;
  color: #337ab7;
  line-height: 1.7em;
  }
  .more:after{
    content: "\f105";
    font-family: FontAwesome;
    font-size: 1.7em;
    vertical-align: bottom;
    display: inline-block;
    margin-left: 5px;
    }



/***************************************************
    		    	Icons
/***************************************************/

.icon{
	display: inline-block;
	position: relative;
	top: 1px;
	font-style: normal;
	line-height: 1;
	background-repeat: no-repeat;
	position: center;
	background-size: contain;
	fill: #F00;
	height: 50px;
	width: 50px;
	}
	.icon-large{
		height: 100px;
		width: 100px;
		}
	.icon-small{
		height: 30px;
		width: 30px;
		}
	.icon-mini{
		height: 20px;
		width: 20px;
		}
	.icon-micro{
		height: 15px;
		width: 15px;
		}


  footer .glyphicon {
	font-size: 20px;
	margin-bottom: 20px;
	color: #203e5a;
	}
	.slideanim {visibility:hidden;}
	.slide {
	animation-name: slide;
	-webkit-animation-name: slide;
	animation-duration: 1s;
	-webkit-animation-duration: 1s;
	visibility: visible;
	}
  @keyframes slide {
	    0% {
		opacity: 0;
		-webkit-transform: translateY(70%);
		}
	    100% {
		opacity: 1;
		-webkit-transform: translateY(0%);
		}
	}
  @-webkit-keyframes slide {
    0% {
	opacity: 0;
	-webkit-transform: translateY(70%);
		}
    100% {
	opacity: 1;
	-webkit-transform: translateY(0%);
		}
	}

	.btn-default{    
		color: #FFF;
	    background-color: #2598D0;
	    border:none;
	    box-shadow: 0px 4px 10px rgba(0,0,0,0.1);
	    border-radius: 0px !important;
		}
		.btn-default:hover,.btn-default:active,.btn-default:focus{
			color: #FFF !important;
		    background-color: #2598D0 !important;
		    box-shadow: 0px 4px 10px rgba(0,0,0,0.3) !important;
			}

  @media screen and (max-width: 768px) {
	.col-sm-4 {
	text-align: center;
	margin: 25px 0;
    }
    .btn-lg {
	width: 100%;
	margin-bottom: 35px;
    }

	.dropdown-menu li a {
	    color: #203e5a !important;
	    background-color: #EEE;
		}
		.dropdown-menu li a:hover {
			color: #203e5a !important;
			background-color: #DDD !important;
			}
  }
  @media screen and (max-width: 480px) {
    .logo {
	font-size: 150px;
    }
  }


.dataHub{}
.dataHubBottom.container-fluid{
	}
.dataHub .section h2{
	font-weight: 200;
	font-size: 2.0em;
	color: #FFF;
	}
.dataHub .section p{
	font-size: 1.3em;
	color: #AAA;
	font-family: "Titillium Web","Helvetica Neue",Helvetica,Arial,sans-serif;
	}
.dataHubTop{
	background-color: #333;
	box-shadow: inset 0px 0px 200px 0px rgba(0,0,0,1);
	background-image: url(../images/bg_lights.jpg);
	background-size: cover;
	background-position: center bottom;
	background-repeat: no-repeat;
	border-bottom: 1px solid #282828;

	}
.dataHubMiddle{
    position: relative;
    padding: 0px 50px;
    box-shadow: inset 0px 15px 10px -10px rgba(0,0,0,0.9);
	background-color: #222;
	background-image: url(../images/bg_geometric.png);
	}
.dataHubBottom{
	background: #004b73;
	background: -moz-linear-gradient(top,  #004b73 0%, #202425 100%);
	background: -webkit-linear-gradient(top,  #004b73 0%,#202425 100%);
	background: linear-gradient(to bottom,  #004b73 0%,#202425 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#004b73', endColorstr='#202425',GradientType=0 );

    border-top: 2px solid rgba(104,185,217,0.5);
	}






	.dataHub .section{
		position: relative;
	}
	.dataHub .sectionHeader{
		position: absolute;
		text-align: left;
		max-width: 300px;
	    z-index: 99;
	    background-color: rgba(255,255,255,0.05);
	    border-radius: 5px;
	    padding: 2px 8px;
		}
		.dataHub .sectionInputs{
			padding-bottom: 30px;
			}
		.dataHub .sectionInputs .sectionHeader{
			bottom: -50px;
			right: 0px;
			}
		.dataHub .sectionOutputs{
			padding-top: 30px;
			}
		.dataHub .sectionProcessor .sectionHeader{
			display: none;
			top: 10px;
			right:0px;
			}
		.dataHub .sectionOutputs .sectionHeader{
			top: -50px;
			right: 0px;
			}
		.dataHub .sectionHeader h4{
			color: #FFF;
		    font-size: 1.05em;
		    font-weight: 200;
		    text-transform: uppercase;
		    margin-bottom: 0px;
			}
		.dataHub .sectionHeader p{
		    font-size: 0.9em;
		    line-height: 1.2em;
		    font-weight: 200;
		    color: rgba(255,255,255,0.7);
			}
	.dataHubInputs,.dataHubOutputs{
		display: inline-block;
		position: relative;
		vertical-align: top;
		margin-left: auto;
		margin-right: auto;
		}
		.dataHubInputs{
			margin-top: 75px; 
			}
		.dataHubOutputs{
			margin-bottom: 20px;
			}
		.dataHubObject{
			display: inline-block;
			vertical-align: top;
			width: 150px;
			margin: 0px 10px;
			    -webkit-transition: all 0.2s ease-in;
			       -moz-transition: all 0.2s ease-in;
			        -ms-transition: all 0.2s ease-in;
			         -o-transition: all 0.2s ease-in;
			            transition: all 0.2s ease-in;
			}
			.dataHubOutputs .dataHubObject{
				width: auto;
				margin: 0px 20px;
			}
/*			.dataHubOutputs .dataHubObject:first-child:before{
				content: "";
				position: absolute;
				width: 30%;
				height: 20px;
				margin-bottom: 10px;
				bottom: 100%;
				margin-left: 7.5%;
				left: 0px;
				border-top: 5px solid #4b7a92;
				border-left: 5px solid #4b7a92;
				border-radius: 10px 0px 0px 0px;
				}
			.dataHubOutputs .dataHubObject:first-child:after{
				content: "";
				position: absolute;
				width: 20%;
				height: 115px;
				margin-bottom: 10px;
				top: -140px;
				margin-left: 10%;
				right: 52%;
				border-right: 5px solid #4b7a92;
				border-bottom: 5px solid #4b7a92;
				border-radius: 0px 0px 10px 0px;
				}

			.dataHubOutputs .dataHubObject:last-child:before{
				content: "";
				position: absolute;
				width: 30%;
				height: 20px;
				margin-bottom: 10px;
				bottom: 100%;
				margin-right: 5.5%;
				right: 0px;
				border-top: 5px solid #4b7a92;
				border-right: 5px solid #4b7a92;
				border-radius: 0px 10px 0px 0px;
				}
			.dataHubOutputs .dataHubObject:last-child:after{
				content: "";
				position: absolute;
				width: 20%;
				height: 115px;
				margin-bottom: 10px;
				top: -140px;
				margin-right: 10%;
				left: 52%;
				border-left: 5px solid #4b7a92;
				border-bottom: 5px solid #4b7a92;
				border-radius: 0px 0px 0px 10px;
				}*/


			.dataHubObjectTitle{
				font-weight: 200;
				font-size: 0.9em;
				color: #FFF;
				z-index: 200;
				}
				.dataHubProcessor .dataHubObject .dataHubObjectTitle{
					color:#CCC;
					}
				.dataHubOutputs .dataHubObject .dataHubObjectTitle{
					opacity: 0.5;
					padding: 5px 0px;
					}
				.dataHubOutputs .dataHubObject.active .dataHubObjectTitle{
					opacity: 1;
					border-bottom: 2px solid rgba(255,255,255,0.9);
					}
			.dataHubObjectDescription{
				font-size: 0.8em;
				color: #AAA;
				}
				.dataHubInputs .dataHubObjectTitle{
					padding-top:5px;
					background-color: rgba(90,90,90,0.3);
					border-radius: 5px 5px 0px 0px;
					}
				.dataHubInputs .dataHubObjectDescription{
					padding-bottom:5px;
					background-color: rgba(90,90,90,0.3);
					border-radius: 0px 0px 5px 5px;
					}



			.dataHubObjectIcon{
				display: inline-block;
				height: 80px;
				width: 80px;
				border-radius: 80px;
				margin-left: auto;
				margin-right: auto;

			    -webkit-transition: all 0.2s ease-in;
			       -moz-transition: all 0.2s ease-in;
			        -ms-transition: all 0.2s ease-in;
			         -o-transition: all 0.2s ease-in;
			            transition: all 0.2s ease-in;
				}
				.dataHubProcessor .dataHubObjectIcon{
					height: 60px;
					width: 60px;
					border-radius: 60px;
					}
				.dataHubOutputs .dataHubObjectIcon{
					height: 60px;
					width: 60px;
					border-radius: 100%;
					background-color: rgba(255,255,255,1);
					}
				.dataHubObjectIcon:before{
					content: "";
					display: block;
					height: 100%;
					width: 100%;
					border-radius: 100%;
					background-size: 55%;
					background-position: center;
					background-repeat: no-repeat;
					opacity: 1;
				    -webkit-transition: all 0.2s ease-in;
				       -moz-transition: all 0.2s ease-in;
				        -ms-transition: all 0.2s ease-in;
				         -o-transition: all 0.2s ease-in;
				            transition: all 0.2s ease-in;
					}
					.dataHubProcessor .dataHubObject .dataHubObjectIcon:before{
						background-size: 50%;
						}
					.dataHubOutputs .dataHubObject .dataHubObjectIcon:before{
						padding:5px;
						}
					.dataHubOutputs .dataHubObject.active .dataHubObjectIcon:before{
						animation-duration:1.0s;
						animation-name:iconPulse;
						animation-iteration-count:infinite;
						}
						@keyframes iconPulse {
						  from {
						    box-shadow: 0px 0px 0px 0px rgba(0,168,182,0.2);
						  }

						  to {
							box-shadow: 0px 0px 0px 30px rgba(0,168,182,0.0);
						  }
						}


					.dataHubObjectIcon.connectors:before{background-image:url('../images/icon_connectors_white.svg');}
					.dataHubObjectIcon.mobile:before{background-image:url('../images/icon_mobile_white.svg');}
					.dataHubObjectIcon.plugins:before{background-image:url('../images/icon_plugins_white.svg');}
					.dataHubObjectIcon.developer:before{background-image:url('../images/icon_developer_white.svg');}
					.dataHubObjectIcon.devices:before{background-image:url('../images/icon_devices_white.svg');}

					/*.dataHubObjectIcon.web:before{background-image:url('../images/icons/icons_web.svg');}
					.dataHubObjectIcon.server:before{background-image:url('../images/icons/icons_server.svg');}
					.dataHubObjectIcon.cloud:before{background-image:url('../images/icons/icons_cloud.svg');}
					.dataHubObjectIcon.mobile:before{background-image:url('../images/icons/icons_mobile.svg');}
					.dataHubObjectIcon.iot:before{background-image:url('../images/icons/icons_iot.svg');}
					.dataHubObjectIcon.offline:before{background-image:url('../images/icons/icons_offline.svg');}*/


					.dataHubObjectIcon.rules:before{background-image:url('../images/icons/icons_rules.svg');}
					.dataHubObjectIcon.transform:before{background-image:url('../images/icons/icons_transform.svg');}
					.dataHubObjectIcon.calculate:before{background-image:url('../images/icons/icons_calculate.svg');}
					.dataHubObjectIcon.profile:before{background-image:url('../images/icons/icons_profile.svg');}
					.dataHubObjectIcon.segment:before{background-image:url('../images/icons/icons_segment.svg');}
					.dataHubObjectIcon.trigger:before{background-image:url('../images/icons/icons_trigger.svg');}


					.dataHubObjectIcon.content:before{background-image:url('../images/icons/icons_content.svg');}
					.dataHubObjectIcon.email:before{background-image:url('../images/icons/icons_email.svg');}
					.dataHubObjectIcon.push:before{background-image:url('../images/icons/icons_push.svg');}
					.dataHubObjectIcon.analytics:before{background-image:url('../images/icons/icons_analytics.svg');}
					.dataHubObjectIcon.helpdesk:before{background-image:url('../images/icons/icons_helpdesk.svg');}
					.dataHubObjectIcon.attribution:before{background-image:url('../images/icons/icons_attribution.svg');}
					.dataHubObjectIcon.warehouse:before{background-image:url('../images/icons/icons_warehouse.svg');}
					.dataHubObjectIcon.visualize:before{background-image:url('../images/icons/icons_visualize.svg');}



			.dataHubCutout{
			    position: absolute;
			    bottom: -50px;
			    left: 50%;
			    margin-left: -50px;
			    height: 50px;
			    width: 100px;
			    background-color: #222;
				background-image: url(../images/bg_geometric.png);
			    border-radius: 0 0 100px 100px;
			    border: 2px solid rgba(104,185,217,0.5);
			    border-top: none;
				}





	.dataHubProcessor{
		position: relative;
	    margin-top: 0px;
	    padding: 40px 0px 40px 0px;
	    clear: both;
		}
		.dataHubProcessor:before{
		    /*content: "";
		    position: absolute;
		    top: 0px;
		    display: block;
		    height: 10px;
		    width: 40%;
		    margin-left: 30%;
		    border-top: 1px solid #EEE;*/
			}


		.dataInAni{
			position: absolute;
			left: 50%;
			width: 0;
			top:-150px;
			height: 100px;
			background-color: transparent;
			z-index: 200;
			}
			.dataInAni:before, .dataInAni:after{
				content: "";
				position: absolute;
				left: -7px;
				height: 14px;
				width: 14px;
				border: 2px solid rgba(255,255,255,0.5);
				border-radius: 100%;
				animation-duration:1.4s;
				animation-name:dataIn;
				animation-iteration-count:infinite;
				opacity: 0.5;
					}
				.dataInAni:after{
					animation-delay:0.8s;
				}
				@keyframes dataIn {
				  from {
				  	top: 0%;
				  	opacity: 0.5;
				  }
				  to {
				  	top: 100%;
				  	opacity: 0.5;
				  }
				}


		.dataOutAni{
			position: absolute;
			left: 50%;
			width: 0;
			bottom:-100px;
			height: 50px;
			background-color: transparent;
			z-index: 200;
			}
			.dataOutAni:before, .dataOutAni:after{
				content: "";
				position: absolute;
				left: -7px;
				height: 14px;
				width: 14px;
				border: 2px solid rgba(255,255,255,0.5);
				border-radius: 100%;
				animation-duration:1.4s;
				animation-name:dataOut;
				animation-iteration-count:infinite;
				animation-timing-function:ease-in-out;
				opacity: 0.5;
					}
				.dataOutAni:after{
					animation-delay:0.8s;
				}
				@keyframes dataOut {
				  from {
				  	top: 0%;
				  	opacity: 0;
				  }
				  to {
				  	top: 100%;
				  	opacity: 0.5;
				  }
				}


		.dataHubIconWrapper{
		    position: absolute;
		    height: 100px;
		    width: 100px;
		    top: -50px;
		    left: 50%;
		    margin-left: -50px;
		    border-radius: 80px;
		    box-shadow: 0px 0px 3px rgba(0,0,0,0.5);
			background: #007cc2;
			background: -moz-linear-gradient(-45deg,  #007cc2 0%, #005787 100%);
			background: -webkit-linear-gradient(-45deg,  #007cc2 0%,#005787 100%);
			background: linear-gradient(135deg,  #007cc2 0%,#005787 100%);
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#007cc2', endColorstr='#005787',GradientType=1 );
			z-index: 300;
			cursor: pointer;
			}
		.dataHubIconWrapper:before{
			position: absolute;
			height: 100%;
			width: 100%;
			border-radius: 100%;
			content: "";
			box-shadow: 0px 0px 100px rgba(255,255,255,0.3);
			cursor: pointer;
			}
		.dataHubIcon{
			height: 100%;
			width: 100%;
		    display: inline-block;
		    background-image: url(../images/logo_tealium_icon.svg);
		    background-size: 40%;
		    background-position: center;
		    background-repeat: no-repeat;
			cursor: pointer;
			}
			.dataHubIcon:before{
				position: absolute;
				top: 0px;
				left: 0px;
				content: "";
				display: block;
				height: 100%;
				width: 100%;
				border-radius: 100%;
				border:4px solid #007CC2;
				border-top: none;
				border-right:none;
				opacity: 0;
				transform: rotate(-45deg);
				z-index: -1;
				cursor: pointer;
				}
			.dataHubIcon:after{
				position: absolute;
				top: 0px;
				left: 0px;
				content: "";
				display: block;
				height: 100%;
				width: 100%;
				border-radius: 100%;
				border:8px solid #007CC2;
				border-top: none;
				border-right:none;
				opacity: 0;
				transform: rotate(-45deg);
				z-index: -1;
				cursor: pointer;
				}
/*				.dataHubIcon.active:before{
					animation-duration:1.5s;
					animation-name:hubPulse;
					animation-iteration-count:infinite;
					}
				.dataHubIcon.active:after{
					animation-duration:1.5s;
					animation-name:hubPulseTwo;
					animation-iteration-count:infinite;
					}
				@keyframes hubPulse {
				  from {
				    height: 100%;
					width: 100%;
					margin-left: 0%;
					margin-top: 0%;
					opacity: 0.2;
				  }

				  to {
				    height: 300%;
					width: 300%;
					margin-left: -100%;
					margin-top: -100%;
					opacity: 0;
				  }
				}
				@keyframes hubPulseTwo {
				  from {
				    height: 0%;
					width: 0%;
					margin-left: 50%;
					margin-top: 50%;
					opacity: 0.2;
				  }

				  to {
				    height: 300%;
					width: 300%;
					margin-left: -100%;
					margin-top: -100%;
					opacity: 0;
				  }
				}*/


	.dataHub .sectionProcessor{
		display: none;
		}
	.dataHubContainer{
	    margin: 0px;
		}

	.sectionFooter{}
	.dataHub .section .sectionFooter h4{
		color: rgba(255,255,255,0.8);
		text-transform: capitalize;
		font-weight: 200;
		}


	.integrationSet{
		display: none;
		}
		.integrationSet.active{
			display: inline-block;
			margin-bottom: 20px;
			}







/* ---------   Integrations    --------*/

        ul.examples{
            margin: 0px;
            margin-top:20px;
            padding: 0px;
            }
        ul.examples li{
            display: inline-block; 
            margin: 5px !important;
            border: 1px solid #EEE;
            border-radius: 4px;
            position: relative;
            z-index: 1;
            overflow: hidden;
            -webkit-transition: 0.5s !important;
            transition: 0.5s !important;
            }
            ul.examples .logo_wrapper{
                display: block;
                height: 120px;
                width: 210px;
                padding:20px;
                }
                ul.examples .logo_wrapper:before{
                    content: "";
                    position: absolute;
                    top:0px;
                    left:0px;
                    height:100%;
                    width:100%;
                    z-index: -1;
                    background: #ffffff;
                    background: -moz-linear-gradient(-45deg,  #ffffff 34%, #fafafa 100%);
                    background: -webkit-linear-gradient(-45deg,  #ffffff 34%,#fafafa 100%);
                    background: linear-gradient(135deg,  #ffffff 34%,#fafafa 100%);
                    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#fafafa',GradientType=1 );
                    border-radius: 4px;
                    }
                ul.examples .logo_wrapper:after{
                    content: "";
                    position: absolute;
                    top: 0px;
                    left: 100%;
                    height: 100%;
                    width: 100%;
                    z-index: 2;

                    background: -moz-linear-gradient(-45deg,  rgba(255,255,255,0) 0%, rgba(255,255,255,0) 25%, rgba(255,255,255,0.9) 50%, rgba(255,255,255,0) 75%, rgba(255,255,255,0) 100%);
                    background: -webkit-linear-gradient(-45deg,  rgba(255,255,255,0) 0%,rgba(255,255,255,0) 25%,rgba(255,255,255,0.9) 50%,rgba(255,255,255,0) 75%,rgba(255,255,255,0) 100%);
                    background: linear-gradient(135deg,  rgba(255,255,255,0) 0%,rgba(255,255,255,0) 25%,rgba(255,255,255,0.9) 50%,rgba(255,255,255,0) 75%,rgba(255,255,255,0) 100%);
                    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=1 );
                }
                ul.examples .logo_wrapper:hover:after{
                    animation:sheen 0.75s;
                    -moz-animation:sheen 0.75s; /* Firefox */
                    -webkit-animation:sheen 0.75s; /* Safari and Chrome */
                    }

                    @keyframes sheen{
                        from {left: 100%;} 
                        to{left:-100%;} 
                        }
                    @-moz-keyframes sheen{
                        from {left: 100%;} 
                        to{left:-100%;} 
                        }
                    @-webkit-keyframes sheen{
                        from {left: 100%;} 
                        to{left:-100%;}  
                        }​
                    .endKeyframes{}

                ul.examples .logo_image {
                    display: block;
                    height: 50px;
                    width: 100%;
                    background-position: center;
                    background-repeat: no-repeat;
                    background-size: contain;
                    position: relative;
                    background-origin: content-box;
                    }
                ul.examples .logo_title {
                    display: block;
                    font-size: 12px;
                    color: #888;
                    text-align: center;
                    position: absolute;
                    bottom: 0px;
                    left: 0px;
                    width: 100%;
                    text-transform: capitalize;
                    padding: 8px 0px;
                    line-height: 1.0em;
                    background-color: #FAFAFA;
                    text-shadow: 0px 1px 0px #FFF;
                    border-top: 1px solid #f6f6f6;
                    }