/* ---------------------------------------- JUMBOTRON ---------------------------------------- */

.jumbotron.parallax {
	padding-top: 330px;
	background-image: url("/tts/solutions/digital-channels-data/assets/img/jumbotron/jumbotron-digital-security.jpg");
}
@media only screen and (-o-min-device-pixel-ratio: 5/4), only screen and (-webkit-min-device-pixel-ratio: 1.25), only screen and (min-device-pixel-ratio: 1.25), only screen and (min-resolution: 1.25dppx) {
	.jumbotron.parallax { 
		background-image: url("/tts/solutions/digital-channels-data/assets/img/jumbotron/jumbotron-digital-security-2x.jpg");
	} 
}


/* ---------------------------------------- THUMBNAIL HOVER OVERRIDES ---------------------------------------- */
a.hover-thumb>div {
	background: #ffffff;
}
a.hover-thumb  div.home-tile {
	display: block;
	max-width: 100%;
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
	-webkit-transform-origin: 50% 50%;
	transform-origin: 50% 50%;
	-webkit-backface-visibility: hidden;
}
a.hover-thumb:hover div.home-tile {
	-webkit-transform: scale3d(0.9, 0.9, 1) rotate(0.01deg);
	transform: scale3d(0.9, 0.9, 1) rotate(0.01deg);
}
a.hover-thumb figcaption {
	background-color:transparent !important;
	position:absolute;
	bottom:0;
}
a.hover-thumb h2 {
	font-size: 1.5rem !important;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
	padding-bottom: .5rem;
	font-weight:bold;
}
a.hover-thumb h4 {
	font-size: 1rem !important;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
	font-weight:bold;
}
a.hover-thumb h2,
a.hover-thumb h4,
a.hover-thumb span {
	color: #ffffff;
	text-transform: uppercase;
}
a.hover-thumb:hover h2,
a.hover-thumb:hover h4,
a.hover-thumb:hover span {
	color: #ffffff;
	opacity: 0.5;
}

/* ---------------------------------------- STYLES FOR TILES ---------------------------------------- */

.home-tile {
	background-size:cover;
	background-repeat: no-repeat;
	background-position:center;
		}

.tile-fade {
	height:300px;
	width:100%;
	position:relative;
	}
			
/* ---------------------------------------- TILE FADE COLORS ---------------------------------------- */

		
		.tile-fade-citi-blue {
  background-image: linear-gradient(to top, rgba(0,45,114,.6), rgba(0,45,114,.4), rgba(0,45,114,.1), rgba(0,45,114,.1));
		}
		.tile-fade-citi-blue-dark {
  background-image: linear-gradient(to top, rgba(0,45,114,.8), rgba(0,45,114,.6), rgba(0,45,114,.1));
		}

.tile-fade-cyan {
  background-image: linear-gradient(to top, rgba(1,189,242,.6), rgba(1,189,242,.4), rgba(1,189,242,.1), rgba(1,189,242,.1));
		}
		.tile-fade-teal {
  background-image: linear-gradient(to top, rgba(1,115,119,.6), rgba(1,115,119,.4), rgba(1,115,119,.1), rgba(1,115,119,.1));
}
		.tile-fade-olive {
  background-image: linear-gradient(to top, rgba(148,147,0,.6), rgba(148,147,0,.4), rgba(148,147,0,.1), rgba(148,147,0,.1));
}
		.tile-fade-tangerine {
  background-image: linear-gradient(to top, rgba(237,139,0,.6), rgba(237,139,0,.4), rgba(237,139,0,.1), rgba(237,139,0,.1));
}
		.tile-fade-burnt-orange {
  background-image: linear-gradient(to top, rgba(203,96,21,.6), rgba(203,96,21,.4), rgba(203,96,21,.1), rgba(203,96,21,.1));
}
		.tile-fade-plum {
  background-image: linear-gradient(to top, rgba(137,12,88,.6), rgba(137,12,88,.4), rgba(137,12,88,.1), rgba(137,12,88,.1));
}
		.tile-fade-purple {
  background-image: linear-gradient(to top, rgba(107,48,119,.6), rgba(107,48,119,.4), rgba(107,48,119,.1), rgba(107,48,119,.1));
}
		.tile-fade-purple-dark {
  background-image: linear-gradient(to top, rgba(107,48,119,.8), rgba(107,48,119,.6), rgba(107,48,119,.1));
}



/* ---------------------------------------- CUSTOM PADDING ---------------------------------------- */


.px-5 {
	padding-left: 5px !important;
	padding-right: 5px !important;
}
.py-5 {
	padding-top: 5px !important;
	padding-bottom: 5px !important;
}
.p-5 {
	padding-left: 5px !important;
	padding-right: 5px !important;
	padding-top: 5px !important;
	padding-bottom: 5px !important;
}