body {
	overflow-y: hidden;
}

*:focus {
    outline: none;
}
.siteFooter .section-underline {
    margin: 8px auto;
}
.siteFooter li {
    margin: 0 10px 10px 0;
}
.menu-section, .siteFooter .section {
    margin: 0 4% 10px 0;
}
.change-slide-prev-cta {
	font-size: 30px;
	width: 50px;
	height: 50px;
	border-radius: 25px;
	display: inline-block;
	position: fixed;
	background-color: #fff;
	z-index: 10;
	right: 5%;
	top: 13%;
	opacity: .9;
	-webkit-animation: floatBubble2 1s infinite;
    -webkit-animation-direction: alternate;
    cursor: pointer;
}
.change-slide-next-cta {
	font-size: 30px;
	width: 50px;
	height: 50px;
	border-radius: 25px;
	display: inline-block;
	position: fixed;
	background-color: #fff;
	z-index: 10;
	right: 5%;
	bottom: 5%;
	opacity: .9;
	-webkit-animation: floatBubble 1s infinite;
    -webkit-animation-direction: alternate;
    cursor: pointer;
}
@-webkit-keyframes floatBubble2{
 from{
        top: 13%;
        -webkit-animation-timing-function: ease-in;

   }


   to {
      top: 12%;
      -webkit-animation-timing-function: ease-out;
   }

}
@-webkit-keyframes floatBubble{
 from{
        bottom:4%;
        -webkit-animation-timing-function: ease-in;

   }


   to {
      bottom: 5%;
      -webkit-animation-timing-function: ease-out;
   }

}
.ui-loader {
	display: none;
}
.siteFooterWrap {
	padding: 0;
}
.body-content-container {
	margin-top: 0 !important;
}
.navbar-brand {
	height: auto;
}
.navbar-fixed-top, .navbar-fixed-bottom {
	position: relative;
}
.footer-container {
	margin-top: 0;
	padding: 100px 0;
	width: 100%;
	height: 100%;
}
.slick-initialized .slick-slide {
	border: 0;
	width: 100%;
	padding: 0;
}
.audience-slide-desc {
	padding: 30px 5% 0 4.5%;
	width: 35%;
	display: inline-block;
	vertical-align: top;
	color: #fff;
}
.audience-slide-diagram table {
	left: 60%;
    top: 45px;
    position: absolute;
}
.audience-slide-desc.black {
	color: #34353B;
}
.audience-slide-diagram {
	padding: 30px 0;
	width: 64%;
	display: inline-block;
	vertical-align: top;
}
.diagram-cont {
	width: 100%;
	max-width: 1000px;
	padding: 0 25px;
	margin: 0;
    position: absolute;
    z-index: 2;
    left: 0;
    right: 0;
    top: 0;
    margin-left: auto;
}

.slide-shadow {
	-webkit-box-shadow: 0px 5px 7px 0px rgba(0,0,0,0.25);
	-moz-box-shadow: 0px 5px 7px 0px rgba(0,0,0,0.25);
	box-shadow: 0px 5px 7px 0px rgba(0,0,0,0.25);
}

.diagram {
	height: 463px !important;
}
#slide-diagram-4 {
	background: transparent;
}
.diagram-cont li {
}
.diagram-card-cont {
	width: 19%;
	padding-top: 20px;
	text-align: center;
	vertical-align: middle;
	display: inline-block;
	position: relative;
}
.diagram-card-cont img {
    padding-top: 15px;
    width: 70%;
    height: 72%;
    padding-bottom: 8px;
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.card-small {
	width: 93%;
	height: 140px;
	font-size: .5em;
}
.card-medium {
	width: 94%;
	height: 160px;
	font-size: .6em;
}
.card-big {
	width: 95%;
	height: 180px;
	font-size: 1em;
}
.card-big, .card-medium, .card-small {
	border: 1px solid #34353B;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	margin-left: auto;
	margin-right: auto;
}
.card-text {
	line-height: 1.2em;
	padding: 3%;
}
.card-text-percentage {
    display: block;
    font-size: 24px;
    font-weight: 100;
    padding-top: 15%;
    padding-bottom: 10%;
}
.card-text-left {
    display: block;
    font-size: 12px;
    padding-bottom: 5%;
    padding-top: 8px;
    opacity: .8;
}
.card-text-info1 {
	display: block;
    font-size: 16px;
    padding-top: 5%;
    line-height: 130%;
}
.card-text-info2 {
    display: block;
    font-size: 16px;
    padding-bottom: 5px;
    line-height: 130%;
}
.diagram table {
	border: 0;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	margin: 0;
}
.diagram-subtitle-underline {
	line-height: 0;
	background-color: #fff;
}
.diagram-subtitle {
	text-align: center;
	cursor: pointer;
	font-size: 18px;
	background: #fff;
    padding-top: 5px;
    padding-bottom: 5px;
    color: rgba(43,61,82,.5);
    font-weight: 100;
}
.diagram td {
}
.thick-text {
	font-weight: 600;
    color: rgba(43,61,82,1);
}
.diagram-green-bar, .diagram-blue-bar, .diagram-orange-bar {
	height: 10px;
}
.third-width {
	width: 33.33%;
	display: inline-block;
	vertical-align: top;
}
.green-bottom {
	border-bottom: 2px solid #71CA2F;
}
.green-top {
	border-top: 2px solid #71CA2F;
}
.blue-bottom {
	border-bottom: 2px solid  #00B5F0;
}
.blue-top {
	border-top: 2px solid  #00B5F0;
}
.orange-bottom {
	border-bottom: 2px solid #FF6600;
}
.orange-top {
	border-top: 2px solid #FF6600;
}
.diagram-cta {
	height: 453px;
	background-color: #fff;
	cursor: pointer;
    padding-top: 7%;
}
.coming-soon {
	text-align: center;
	padding-top: 10px;
	color: rgba(42,61,83,.7);
}
.portrait-tab {
	border-right: 1px solid rgba(51,51,51,.15);
}
.competitors-tab {
	border-right: 1px solid rgba(51,51,51,.15);
}
.diagram-content {
	width: 100%;
	height: 380px;
	background-color: #fff;
}
.persona-content-wrap {
	height: 45%;
}

.gender-wrap {
	width: 33%;
	display: inline-block;
	vertical-align: top
}

.gender-title {
	padding: 25px 15px 5px 15px;
	text-align: center;
}

.gender-img {
	width: 40%;
	margin-left: auto;
	margin-right: auto;
}

.age-wrap {
	width: 33%;
	display: inline-block;
	vertical-align: top;
}

.age-img {
	width: 40%;
	margin-left: auto;
	margin-right: auto
}

.age-title {
	padding: 25px 15px 5px 15px;
	text-align: center;
}

.location-wrap {
	width: 33%;
	display: inline-block;
	vertical-align: top;
}

.location-title {
	padding: 25px 15px 5px 15px;
	text-align: center;
}

.location-img {
	width: 64%;
	padding: 10px 0;
	margin-left: auto;
	margin-right: auto
}

.interests-wrap {
	width: 49%;
	display: inline-block;
	vertical-align: top;
}

.interests-title {
	padding: 30px 15px 5px 15px;
	text-align: center;
}

.interests-img {
	width: 60%;
	padding-bottom: 15px;
	margin-left: auto;
	margin-right: auto;
}

.personas-wrap {
	width: 49%;
	display: inline-block;
	vertical-align: top;
}

.personas-title {
	padding: 30px 15px 5px 15px;
	text-align: center;
}

.personas-img {
	width: 60%;
	margin-left: auto;
	margin-right: auto
}

.benchmark-retention {
    padding-top: 5px;
    width: 62%;
    margin: auto;
}
.diagram-card-content {
	padding: 40px 0;
	text-align: center;
}
.no-visible {
	visibility: hidden;
}
.navy-plus {
	width: 12px;
	display: inline !important;
	position: relative;
	top: -1px;
	margin-right: 5px;
}
.diagram-footer {
	border-top: 2px solid #e4e4e4;
	font-size: 14px;
	line-height: .7em;
	background-color: #fff;
	padding-top: 20px;
	padding-bottom: 20px;
	height: 49px;
	text-align: center;
	width: 100%;
}
.diagram-header {
	height: 34px;
	background-color: #fff;
}
.card-content-title {
	padding-bottom: 20px;
	font-size: 1.5em;
	text-align: center;
}
.retention-content-title {
    padding-top: 3%;
    font-size: 1.5em;
    text-align: center;
}
.diagram-cta:hover {
	background-color: #f2f2f2;
}
.diagram-cta-text {
	text-align: center;
	font-size: 22px;
}
.product-desc {
	display: block;
	font-size: 14px;
	color: rgba(42,61,83,.7);
	padding-top: 3%;
}
.diagram-cta-img-cont {
	text-align: center;
	margin-bottom: 20px;
	margin-top: 70px;
}
.diagram-cta-img-cont img {
	height: 100px;
	display: inline-block;
}
.diagram-green-bar {
	background-color: #71CA2F;
}
.diagram-blue-bar {
	background-color: #00B5F0;
}
.diagram-orange-bar {
	background-color: #FF6600;
}
.audience-slide-cta {
	border-style: none;
	width: 100%;
	max-width: 300px;
	padding: 10px;
	border: 2px solid #fff;
	background: rgba(255,255,255,.15);
	color: #fff;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    font-weight: 600;
    font-family: "OpenSans","Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
}
.audience-slide-cta:hover, .audience-slide-cta:focus {
	background-color: rgba(255,255,255,.3);
}
.audience-slide-cta.black {
    color: #34353B;
    border: 2px solid #34353B;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    font-weight: 600;
    font-family: "OpenSans","Helvetica Neue", "Helvetica", Helvetica, Arial, sans-serif;
}
.audience-slide-cta.black:hover, .audience-slide-cta.black:focus {
	background-color: rgba(255,255,255,.5);
}
.audience-slide-text {
	color: #fff;
    font-size: 24px;
    line-height: 150%;
    padding-top: 5px;
    padding-bottom: 30px;
}
.audience-slide-text-pre {
	display: inline-block;
	color: #fff;
	font-size: 34px;
    border-bottom: solid 2px #ff9700;
    margin-bottom: 10px;
}

.audience-slide-text-post {
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 2;
    font-size: 16px;
    padding-bottom: 20px;
    margin-bottom: 30px;
    border-bottom: solid 3px #ff9700;
}
.audience-slide:focus {
	outline: none;
}
.audience-slide {
	background: url('../img/audience_bg.png');
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	/*background: url('../img/mobilebg_topleft.svg'), url('../img/mobilebg_topright.svg'), url('../img/mobilebg_bottomleft.svg'), url('../img/mobilebg_bottomright.svg'), url('../img/audience_bg.png');
	background-size: 30%, 30%, 30%, 30%, cover;
	background-repeat: no-repeat;
	background-position: left top, right top, left bottom, right bottom, center;*/
}
.audience-slide:nth-of-type(2) {
	background-image: url("../img/orange_gloves.png"), url("../img/orange_chess.png");
	background-repeat: no-repeat;
	background-position: left top, right bottom;
	background-size: 50%;
}
.audience-slide:nth-of-type(3) {
	background-image: url("../img/blue_car.png"), url("../img/blue_book.png");
	background-repeat: no-repeat;
	background-position: left bottom, right bottom;
	background-size: 40%;
}
.audience-slide:nth-of-type(4) {
	background-image: url("../img/green_bulb-on.png"), url("../img/green_bulb-off.png");
	background-repeat: no-repeat;
	background-position: left bottom, right center;
	background-size: 20%;
}
.dash-1 { /* Blue, off screen, sliding right */
	position: absolute;
	width: 120px;
	top: 86%;
	left: 400px;
	z-index: -1;
    
  /*animation-duration: 160s;
  animation-name: slideRight;
  animation-iteration-count: infinite;
    
  -moz-animation-duration: 160s;
  -moz-animation-name: slideRight;
  -moz-animation-iteration-count: infinite;*/
}
.dash-2 { /* Orange, top left, sliding right */
	position: absolute;
	width: 300px;
	top: 10%;
	right: 400px;
	z-index: -1;
    
    /*animation-duration: 200s;
  animation-name: slideRight;
  animation-iteration-count: infinite;
    
  -moz-animation-duration: 200s;
  -moz-animation-name: slideRight;
  -moz-animation-iteration-count: infinite;*/
}
.dash-3 { /* Orange, off screen, sliding left */
	position: absolute;
	width: 170px;
	top: 75%;
	right: 850px;
	z-index: -1;
    
    /*animation-duration: 160s;
  animation-name: slideLeft;
  animation-iteration-count: infinite;
    
  -moz-animation-duration: 160s;
  -moz-animation-name: slideLeft;
  -moz-animation-iteration-count: infinite;*/
}
.dash-4 { /* Blue, bottom/middle right, sliding left */
	position: absolute;
	width: 170px;
	top: 60%;
	right: -50px;
	z-index: -1;
    
    /*animation-duration: 200s;
  animation-name: slideLeft;
  animation-iteration-count: infinite;
    
  -moz-animation-duration: 200s;
  -moz-animation-name: slideLeft;
  -moz-animation-iteration-count: infinite;*/
}
.dash-5 { /* Blue, bottom center, sliding right */
	position: absolute;
	width: 230px;
	top: 75%;
	right: 100px;
	z-index: -1;
    
    /*animation-duration: 190s;
  animation-name: slideRight;
  animation-iteration-count: infinite;
    
  -moz-animation-duration: 190s;
  -moz-animation-name: slideRight;
  -moz-animation-iteration-count: infinite;*/
}
.dash-6 { /* Orange, top right, sliding left */
	position: absolute;
	width: 215px;
	top: 2%;
	right: -50px;
	z-index: -1;
    
    /*animation-duration: 150s;
  animation-name: slideLeft;
  animation-iteration-count: infinite;
    
  -moz-animation-duration: 150s;
  -moz-animation-name: slideLeft;
  -moz-animation-iteration-count: infinite;*/
}
.dash-7 { /* Blue, off screen, sliding right */
	position: absolute;
	width: 145px;
	top: 75%;
	left: -40px;
	z-index: -1;
    
    /*animation-duration: 300s;
  animation-name: slideRight;
  animation-iteration-count: infinite;
    
  -moz-animation-duration: 300s;
  -moz-animation-name: slideRight;
  -moz-animation-iteration-count: infinite;*/
}

.dash-8 { /* x */
	position: absolute;
	width: 170px;
	top: 6%;
	left: 180px;
	z-index: -1;
    
    /*animation-duration: 120s;
  animation-name: slideRight;
  animation-iteration-count: infinite;
    
  -moz-animation-duration: 120s;
  -moz-animation-name: slideRight;
  -moz-animation-iteration-count: infinite;*/
}
.dash-9 { /* x */
	position: absolute;
	width: 200px;
	top: 93%;
	left: 100px;
	z-index: -1;
    
    /*animation-duration: 200s;
  animation-name: slideRight;
  animation-iteration-count: infinite;
    
  -moz-animation-duration: 200s;
  -moz-animation-name: slideRight;
  -moz-animation-iteration-count: infinite;*/
}
.dash-10 { /* x */
	position: absolute;
	width: 150px;
	top: 48%;
	right: 150px;
	z-index: -1;
    
    /*animation-duration: 160s;
  animation-name: slideLeft;
  animation-iteration-count: infinite;
    
  -moz-animation-duration: 160s;
  -moz-animation-name: slideLeft;
  -moz-animation-iteration-count: infinite;*/
}
.dash-11 { /* x */
	position: absolute;
	width: 110px;
	top: 90%;
	right: 460px;
	z-index: -1;
    
    /*animation-duration: 200s;
  animation-name: slideLeft;
  animation-iteration-count: infinite;
    
  -moz-animation-duration: 200s;
  -moz-animation-name: slideLeft;
  -moz-animation-iteration-count: infinite;*/
}
.dash-12 { /* x */
	position: absolute;
	width: 160px;
	top: 55%;
	right: 600px;
	z-index: -1;
    
    /*animation-duration: 190s;
  animation-name: slideRight;
  animation-iteration-count: infinite;
    
  -moz-animation-duration: 190s;
  -moz-animation-name: slideRight;
  -moz-animation-iteration-count: infinite;*/
}
.dash-13 { /* x */
	position: absolute;
	width: 170px;
	top: 12%;
	right: 1600px;
	z-index: -1;
    
    /*animation-duration: 250s;
  animation-name: slideLeft;
  animation-iteration-count: infinite;
    
  -moz-animation-duration: 250s;
  -moz-animation-name: slideLeft;
  -moz-animation-iteration-count: infinite;*/
}
.dash-14 { /* x */
	position: absolute;
	width: 160px;
	top: 50%;
	left: -120px;
	z-index: -1;
    
    /*animation-duration: 300s;
  animation-name: slideRight;
  animation-iteration-count: infinite;
    
  -moz-animation-duration: 300s;
  -moz-animation-name: slideRight;
  -moz-animation-iteration-count: infinite;*/
}

@keyframes slideRight {
  from {
    -webkit-transform: translate(0,0);
  }

  to {
    -webkit-transform: translate(1920px,0);
  }
}

@-moz-keyframes slideRight {
  from {
    -moz-transform: translate(0,0);
  }

  to {
    -moz-transform: translate(1920px,0);
  }
}
@keyframes slideLeft {
  from {
    -webkit-transform: translate(1920px,0);
  }

  to {
    -webkit-transform: translate(0,0);
  }
}

@-moz-keyframes slideLeft {
  from {
    -moz-transform: translate(1920px,0);
  }

  to {
    -moz-transform: translate(0,0);
  }
}
.audience-slider {
	margin: 0;
	width: 100%;
}
.audience-slide-diagram table {
	position: static;
}
.diagram-slider-cont {
	width: 64%;
	position: absolute;
	z-index: 2
}
@media (max-width: 1000px) {

	.diagram-card-cont {
		width: 30%;
		padding-top: 0;
	}

	:last-of-type.diagram-card-cont {
		display: none;
	}

	:nth-of-type(2).diagram-card-cont {
		display: none;
	}

	.card-medium, .card-small {
		width: 95%;
    	height: 180px;
	}
}
@media (max-width: 800px) {

	.card-text-info1, .card-text-info2 {
		font-size: 14px;
	}

	.diagram-slider-cont {
		width: 100%;
	}
	.audience-slide-desc {
		padding: 0;
		padding-top: 20px;
		padding-bottom: 10px;
		width: 100%;
		text-align: center;
		font-size: 16px;
	}
	.diagram {
		font-size: 12px;
	}
	.audience-slide-diagram {
		display: none;
	}
	.audience-slide-text {
		padding-bottom: 10px;
		font-size: 18px;
	}
	.audience-slide-text-post {
		display: none;
	}
	.audience-slide-cta, .audience-slide-cta:hover {
		margin-bottom: 0;
		padding: 5px;
	}
	.traffic-content-title, .card-content-title {
	}
	.diagram-cont {
	    margin: auto;
	    left: 0;
	    right: 0;
	    top: 140px;
	    width: 100%;
	}
	.learn-more {
		display: none;
	}
	.audience-slide-text-pre {
		font-size: 22px;
	}
	.diagram-subtitle {
		font-size: 14px;
	}
	#slide-diagram-1 .diagram-footer {
		font-size: 14px;
		padding-top: 13px;
		line-height: 133%;
	}
	#slide-diagram-2 .diagram-footer, #slide-diagram-3 .diagram-footer {
		font-size: 14px;
		padding-top: 6px;
		line-height: 133%;
	}
	.benchmark-retention {
    width: 100% !important;
    margin-top: 1%;
	}
}
@media (max-width: 500px) {
	.diagram-cta-img-cont {
		margin-top: 15px;
	}
	.card-text-info1, .card-text-info2 {
		font-size: 12px;
	}
	.diagram {
		font-size: 10px;
	}
	.diagram {
		height: 333px !important;
	}
	.diagram-content {
		height: 250px;
	}
	.diagram-cta {
		height: 323px;
	}
	.diagram-card-content {
	    padding: 5px 0;
	}
	.traffic-content-title {
		padding: 10px 0;
	}
	.footer-container {
		padding: 0;
	}
	.diagram-cta-text {
		font-size: 16px;
	}
	.dash-1,.dash-2,.dash-3,.dash-4,.dash-5,.dash-6,.dash-7,.dash-8,.dash-9,.dash-10,.dash-11,.dash-12,.dash-13,.dash-14 {
		display: none !important;
	}
}
/* Landscape (hides white div content on landscape orientation on phones, but shows it on landscape tablets */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 767px)
  and (orientation: landscape) {
  	#slide-diagram-0,#slide-diagram-1,#slide-diagram-2,#slide-diagram-3,#slide-diagram-4 {
  		display: none !important;
  	}
  	.slick-list {
  		box-shadow: none;
  	}
}
@media (max-width: 1024px) {
	.siteFooter .additional-info {
	    margin: 10px 5% 0 5%;
	}
	.siteFooter .headerSection-title {
	    padding: 10px 0;
	}
}
