/* typography */

body{
	/* font-family: 'Titillium Web', sans-serif; */
	font-family: 'titillium_webregular';
	color:#777;
	line-height:1.3;
}

h1, h2, h3, h4, h5{
    color:#555;
    margin:0 0 10px;
    font-weight: 600;
}

h2, .h2{
	font-size:26px;
}

h3, .h3{
	font-size:22px;
}

h4, .h4{
	margin:0 0 10px;
	font-size:20px;
}

h5, .h5{
	margin:0 0 10px;
	font-size: 17px;
}

@media(min-width:48rem){

	h1{
		font-size:38px;
	}
	
    h2, .h2{
        margin:0 0 20px;
        font-size: 32px;
    }

    h3, .h3{
        margin:0 0 15px;
        font-size:28px;
    }
}

p{
    margin:0 0 10px;
    padding:0;
}

a{
	color:#25a4eb;
	text-decoration:none;
}

abbr,
abbr[title]{
	text-decoration:none;
}

.subhead{
	font-size:20px;
}

.text-large{
	font-size:24px;
}

.font-light{
	font-weight:500;
}

.font-normal{
	font-weight:500;
}

.blue-light, .color-blue-light{
	color:#25a4eb;
}

.white, .color-white{
	color:#fff;
}

.color-orange{
	color:#ed7d27;
}

.bg-orange{
	background-color: #ed7d27;
}

.color-grey{
	color:#999;
}

.text-center{
    text-align:center;
}

.text-right{
	text-align:right;
}

.row-wide{
	max-width:1200px;
}

@media(min-width:48rem){
	.text-right-tablet{
		text-align:right
	}
}

@media(min-width:64rem){
	.text-right-desktop{
		text-align:right
	}
}
	
@media(max-width:40rem){
	.subhead{
		font-size:18px;
	}

	.text-large{
		font-size:20px;
	}
}


/* utils */

.clear:after,
.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

.b-lazy {
	-webkit-transition: opacity 500ms ease-in-out;
	   -moz-transition: opacity 500ms ease-in-out;
		 -o-transition: opacity 500ms ease-in-out;
			transition: opacity 500ms ease-in-out;
			 max-width: 100%;
			   opacity: 0;
}
.b-lazy.b-loaded {
	opacity: 1;
}

.bg-gray{
	background:#efefef;
}

.bg-blue-gradient-horo{
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#28287c+0,03befb+100 */
	background: #28287c; /* Old browsers */
	background: -moz-linear-gradient(left, #28287c 0%, #03befb 100%)!important; /* FF3.6-15 */
	background: -webkit-linear-gradient(left, #28287c 0%,#03befb 100%)!important; /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #28287c 0%,#03befb 100%)!important; /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#28287c', endColorstr='#03befb',GradientType=1 ); /* IE6-9 */
}

.bg-blue-gradient-horo2{
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#0058ac+0,009dde+100 */
	background: #0058ac; /* Old browsers */
	background: -moz-linear-gradient(left, #0058ac 0%, #009dde 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, #0058ac 0%,#009dde 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #0058ac 0%,#009dde 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0058ac', endColorstr='#009dde',GradientType=1 ); /* IE6-9 */
}

.bg-orange-gradient-horo{
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e04d0f+0,d36a2f+100 */
	background: #e04d0f; /* Old browsers */
	background: -moz-linear-gradient(left, #e04d0f 0%, #d36a2f 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, #e04d0f 0%,#d36a2f 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #e04d0f 0%,#d36a2f 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e04d0f', endColorstr='#d36a2f',GradientType=1 ); /* IE6-9 */
}

.bg-gray-gradient-horo{
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e9e9e9+0,f7f7f7+100 */
	background: #e9e9e9; /* Old browsers */
	background: -moz-linear-gradient(left, #e9e9e9 0%, #f7f7f7 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, #e9e9e9 0%,#f7f7f7 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, #e9e9e9 0%,#f7f7f7 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e9e9e9', endColorstr='#f7f7f7',GradientType=1 ); /* IE6-9 */
}

[class^="icomoon-"].circle{
	color:#fff;
	font-size:18px;
	display:inline-block;
	width:36px;
	height:36px;
	text-align:center;
	border-radius:50%;
	border:2px solid #fff;
	line-height:34px;
	margin:0 3px;
}

.hide-mobile{
	display:initial!important;
}

.area-link{
	position:absolute;
	width:100%;
	height:100%;
	top:0;
	left:0;
}

.no-margin{
	margin:0;
}

@media(min-width:40em){
	.force-right-tablet{
		float:right!important;
	}
	.force-left-tablet{
		float:left!important;
	}
	.hide-mobile{
		display:none!important;
	}
}

@media(min-width:64em){
	.force-right-desktop{
		float:right!important;
	}
	.force-left-desktop{
		float:left!important;
	}
	span.dropspan{
	   display:block; /* used for next line'in titles when large no wrap probs */ 
	}
}

.orbit-next,
.orbit-previous{
	background:none!important;
	outline:none;
	cursor:pointer;
}

.button.rounded{
    border-radius:20px;
}

.button{
    padding:9px 20px;
    text-decoration:none;
    font-weight:600;
}

.button.large{
	font-size:20px;
	padding:12px 30px;
}

.button.light{
    background:#55e0ff;
}

.button,
.button.secondary{
    color:#fff;
}

.button:hover,
.button.secondary:hover{
    color:#fff;
}

.button.border{
    border:1px solid #fff;
}

@media(max-width:48em){
    .button{
        font-size:14px;
    }
}

section{
    margin: 3% 0 10%;
    position: relative;
}

@media(min-width:64em){
    section{
		margin: 20px 0 80px;
		position: relative;
	}
	
	section.small-margin-section{
		margin: 3% 0 4%;
	}
}



/* overrides */

*:focus{
	outline:none;
}


/* reveal customization for outside close x */

.reveal{
	padding:30px;
}

.reveal .close-button{
	top: 0;
	right: 10px;
}

@media(min-width:40rem){

	.reveal.outerclose{
		padding:0;
		border:0;
		overflow: visible;
	}

	.reveal.outerclose .close-button{
		top: -30px;
		right: -20px;
	}

	.reveal.outerclose .close-button *{
		color:#a9a9a9
	}
}



/* cstm sections */

.page-hero{
	background:#27a4ec url(/img/gradient-header-bg.jpg)no-repeat center;
	background-size:cover;
	padding: 60px 50px 40px;
	margin:0 auto 50px;
	border-radius:20px;
	width: 96%;
}

.page-hero.orange{
	background-image:url(/img/gradient-header-bg-orange.jpg);
	background-color:#ed7d27;
}

.page-hero h1{
	color:#fff;
	font-weight:normal;
}

.page-hero .button{
	font-size:120%;
	padding:10px 20px 12px;
	}

@media(max-width:40rem){

	.page-hero{
		padding:50px 20px;
		max-width:96%;
		margin-bottom:25px;
	}

	.page-hero h1{
		font-size:26px;
	}
}

@media(min-width:48rem){
	.page-hero .button{
		min-width:300px;
	}
}


/* background triangle graphic */

.tribg-container{
	position:relative;
	max-width: 1200px;
	margin:0 auto;
}

.tribg{
	position:absolute;
	width:450px;
	height:1000px;
	margin-top: -460px;
	top:50%;
	left:0;
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center right;
	z-index:-1;
}

.tribg.right{
	right:0;
	left:auto;
}


@media(max-width:1200px){
	.tribg{
		width:40%;
		height:1000px;
		margin-top: -500px;
	}
}


@media(max-width:40rem){
	.tribg{
		width:36%;
		height:500px;
		margin-top:-280px;
	}
}


/* icon blurb itms */

.icon-features h3{
    font-weight:600;
}

.icon-features img{
    width:80%;
    max-width:160px;
}

.icon-features p{
    max-width: 280px;
    margin: 0 auto 20px;
    line-height: 1.7;
}

@media(min-width:48rem){
    .icon-features{
        margin:20px 0;
    }
}




/* switch */

.switch-container > div{
	display:inline-block;
	vertical-align:middle;
	line-height:50px;
	margin-bottom:0;
	font-weight: 500;
	color:#555;
	margin: 0 10px;
}

.switch-container .term-label{
	/* width:67px; */
	text-align:center;
	margin:0;
}

.switch-container > div.active{
	font-weight: 700;
}

.switch-container .switch label{
	border-radius:20px;
}

.switch-container .switch-paddle::after{
	border-radius:20px;
}

.switch-container .text-feature-yearly{
	color:#27a4ec;
	font-weight:bolder;
}

@media(min-width:64rem){
	.switch-container .text-feature-yearly{
		position:absolute;
	}
}





/* slide logos */

.brand-logos-container{
	height: 120px;
	margin: 10px auto 20px;
	position:relative;
}

.brand-logos{
	height:100%;
	background-size:auto 100%;
	-webkit-animation: brand-scroll 60s infinite linear;
	-moz-animation: brand-scroll 60s infinite linear;
	-o-animation: brand-scroll 60s infinite linear;
	animation: brand-scroll 60s infinite linear;
	position:absolute;
	width:100%;
	top:0;
	left:0;
}

.brand-logos.slide-active{
}

@-webkit-keyframes brand-scroll {
  0%   { background-position: 0% 0%; }
  100% { background-position: 200% 0%;  }
}
@-moz-keyframes brand-scroll {
  0%   { background-position: 0% 0%; }
  100% { background-position: 200% 0%;  }
}
@-o-keyframes brand-scroll {
  0%   { background-position: 0% 0%; }
  100% { background-position: 200% 0%;  }
}
@keyframes brand-scroll {
  0%   { background-position: 0% 0%; }
  100% { background-position: 200% 0%;  }
}

@media(max-width:700px){
	.brand-logos-container{
		height:80px;
	}
}





/* testimonials */

.testimonials{
	position:relative;
	max-width:1200px;
	margin: 10px auto 100px;
}

.testimonials .orbit-container{
	width:80%;
	margin: 0 auto 60px;
}

.testimonial{
	text-align:right;
}

.testimonial.row{
	max-width:900px;
	min-height: 350px;
}

.testimonial-upper{
	margin-top:40px;
}

.testimonial h3{
	margin-bottom:0;
	font-size: 24px;
}

.testimonial-title{
	text-transform:uppercase;
	font-size:18px;
}

.testimonial-lower{
	font-size:18px;
}	

.testimonial-icons{
	text-align:center
}

.testimonial-icons i{
	margin:0 10px!important;
}

.testimonials .orbit-previous i,
.testimonials .orbit-next i{
	font-size:50px;
}

.testimonials .orbit-previous i{
	color:#555;
}
.testimonials .orbit-next i{
	color:#fff;
}

@media(max-width:40rem){
	.testimonial{
		text-align:center
	}
	.testimonials{
		margin-bottom:0px
	}

	.testimonials .tribg{
		top:0;
		width:50%
	}

	.testimonials .orbit-container{
		width:80%;
	}

	.testimonial-upper{
		margin-top:10px;
	}
	
	.testimonial img{
		max-width:300px;
		width:100%;
	}
	.testimonial-icons i[class^="icomoon-"].circle{
		color:#555;
		border-color:#555;
	}

	.testimonial p{
		font-size:14px;
	}
}

.lower-cta-section{
	padding:10% 0;
	margin-bottom:0;
}

@media(min-width:64rem){

	.testimonial-section{
		margin-bottom: 100px;
		margin: 180px auto 100px;
	}
	.lower-cta-section{
		padding:100px 0;
		margin-bottom:0;
	}
}

.row.rds-row{
	margin:60px auto;
}

.rds-img-container{
	height:0;
	padding-bottom:60%;
	background:#27a4ec;
	border-radius:10px;
	margin-bottom:10px;
}

.rds-row .columns:not(.force-left-desktop){
	text-align:right;
}

@media(max-width:64rem){
	.row.rds-row .columns{
		max-width:500px;
		float:none;
		margin:0 auto;
		text-align:left;
	}
}

.faq-section{
	padding:50px 0;
}

.faq-section h3{
	font-size: 20px;
	line-height:1.3;
	margin:20px 0 0;
}

.connect-apps-section li{
	display:block;
	font-size:20px;
	padding-left:20px;
}

@media(max-width:48rem){
	.connect-apps-section li{
		font-size: 16px;
	}
}



/* why raven page */

.why-raven-intro{
	margin-bottom:10px;
}

.why-raven-intro p{
	line-height:2
}

.why-raven-intro img{
	width:115%;
	max-width:115%;
	margin-left:-15%;
}



/* infographic style section */

.infographic-section{
	padding:3.5%;
	max-width:800px;
	width:96%;
}	

.infographic-section h3{
	margin-bottom:20px;
	line-height:1.4;
}

.infographic-section p{
	line-height:1.8;
	margin-bottom:20px;
}	

.infographic-section.orange .button{
	background:#fff;
}

.infographic-section.orange .button{
	color:#e4570c;
}
.infographic-section.blue .button{
	color:#e4570c;
}

.infographic-section .icon-container{
	background:rgba(255, 255, 255, 0.87);
	border-radius:50%;
	width:100%;
	height:100%;
	max-width:220px;
	padding:30px;
	box-shadow:0 0 5px 5px rgba(0, 0, 0, 0.04);
	margin:0 auto 20px;
}

.infographic-section hr{
	background:#fff;
	border-color:#fff;
	margin:20px 0px 40px;
}


@media(min-width:64rem){

	.infographic-section .icon-container{
		margin:20px -20px 20px -110px;
	}

	.infographic-section .columns.force-right-tablet .icon-container{
		margin:20px -20px 20px 20px;
	}

	.infographic-section .icon-container{
		width:220px;
		height:220px;
	}
}



.card-items .columns.large-3{
	padding:5px;
}

.card-item{
	padding: 20px 30px;
	background:#fff;
	box-shadow: 0 0 20px 0px rgba(0, 0, 0, 0.14);
	margin:0;
	max-width:300px;
	margin:0 auto;
}

.card-item .icon-container{
	width:100px;
	margin:0 auto 15px;
}

.card-item .lower-container{
	max-width:150px;
	margin:0 auto;
}


.raven-promise-section{
	margin:0;
	padding:50px 0;
	
}

.raven-promise-section .section-icon{
	position:absolute;
	width:60px;
	top:-30px;
	left:50%;
	margin-left:-30px;
}

.raven-promise-section h2{
	padding:10px;
}

.raven-promise-section p{
	line-height:1.8;
}




/* large testimonial section */

.large-testimonial-section{
	padding:40px 0;
	margin-bottom:0
}

.large-testimonial-section .orbit-slide > .row{
	max-width:85%;
	margin:0 auto;
}

.large-testimonial-section .orbit-controls i{
	font-size:30px;
}

.large-testimonial-section .orbit-controls button{
	padding:0;
}

.testimonial-rating{
	margin-bottom:10px;
}

.testimonial-author-meta h4{
	font-weight:700;
	margin-bottom:0;
}

.testimonial-author-meta p,
.testimonial-author-meta a{
	margin-bottom:2px;
	font-size:14px;
	text-transform:uppercase;
	color: #777;
}

.testimonial-author-meta a{
	text-decoration:underline;
}

.testimonial-date{
	padding-left:10px;
}

.testimonial-author-image-wrapper{
	width:100px;
	height:100px;
	margin-left:auto;
	border-radius:50%;
	overflow:hidden;
}

.testimonial-author-image-wrapper img{
	width:100px;
	float:right;
}

.testimonial-content p{
	margin-bottom:15px;
	line-height:1.4;
}

@media(max-width:48rem){
	.large-testimonial-section h2,
	.testimonial-rating,
	.testimonial-author-meta{
		text-align:center;
	}

	.testimonial-author-image-wrapper{
		margin:0 auto;
	}

	.testimonial-author-meta{
		margin-bottom:20px;
	}
	.testimonial-author-meta img{
		float:none;
	}
}

/* END of large testimonial section */




/* original footer */
footer { margin:0;padding:1em 0 3em 0;background:#4d4d4d;color:#fff;font-weight:400  }
footer p { font-size:.9em;margin:0; }
footer a, footer h5, footer a abbr { color:#f1f1f1;text-decoration:none; }
footer a:hover, footer a:hover abbr { color:#ccc; }
footer ul {padding:0; margin:1em 0;list-style:none; }
footer li { font-size:90%;padding:.2em 0; }
footer p.copyright { margin-top:1em; }


/* quick blog partial start*/

.quick-blog-h2 {
	padding: 35px 0px 30px 0px;
 }
 .quick-blog-h5 {
	 padding-bottom: 10px;
	border-bottom: 1px solid #e7e7e7;
 }
 .quick-blog-a {
	font-size: 16px;
	font-weight: normal;
	line-height: 24px;
	letter-spacing: normal;
	text-align: left;
	text-decoration: none;
	padding-bottom: 15px !important;
	display: block;
}
.quick-blog-a:hover {
text-decoration: underline;
}

/* quick blog partial end */

/*video-popup-general-style-start*/
.video-thumb-holder {
	position: relative;
}

.video-thumb-holder img.play-video {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 10;
	transform: translate3d(-50%, -50%, 0);
	cursor: pointer;
}
/*video-popup-general-style-end*/

.accordion-item .bg-blue-gradient-horo2 {
    background: linear-gradient(to right, rgb(255, 255, 255) 0%, rgb(255, 255, 255) 100%);
    transition: all 0.3s ease;
}
.accordion-item.is-active .bg-blue-gradient-horo2,.accordion-item:hover .bg-blue-gradient-horo2 {
    background: linear-gradient(to right, rgb(0, 88, 172) 0%, rgb(0, 157, 222) 100%);
}
.accordion-item .bg-blue-gradient-horo2.white{
	color: rgb(0, 157, 222);
}
.accordion-item.is-active .bg-blue-gradient-horo2.white,.accordion-item:hover .bg-blue-gradient-horo2.white{
	color: white;
}
.footer_products{
	padding: 20px 0;
	margin-bottom: 20px;
	margin-top: 20px;
	border-bottom: 1px solid rgba(255,255,255,0.1);
	border-top: 1px solid rgba(255,255,255,0.1);

}
.footer_products img{
	-webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
	  filter: grayscale(100%);
	  transition: all 0.3s ease;
	  max-height: 50px;
	  margin-bottom: 10px;
	  width: auto;
}
.footer_products img:hover{
	-webkit-filter: grayscale(0%); /* Safari 6.0 - 9.0 */
	  filter: grayscale(0%);
}
@media (min-width: 40em){
	.text-center.medium-text-right{
		text-align: right;
	}
	.text-center.medium-text-left{
		text-align: left;
	}
}

/* Start: Footer - Social Media  */
.footer_social {
	display: flex;
	justify-content: space-around;
	max-width: 220px;
	padding: 0px 16px;
	margin: 0px auto;
}
@media (max-width: 48rem) { 
	.footer_social {
		padding: 0px;
	}
}

.footer_social img {
	height: 30px;
	padding: 5px
}

.footer_social li:first-child img {
	padding: 0px
}

.footer_social a {
	background: #fff;
    border-radius: 50%;
    padding: 4px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
	width: 30px;
	padding: 2px
}

.footer_social li:first-child  a {
	background: #4d4d4d;
	padding: 0px;
}

/* End: Footer - Social Media  */


/* Start: Hello bar */

.hello-bar {
	background-color: #2d69c7; /* For browsers that do not support gradients */
	background-image: linear-gradient(to right, #1348a0 0%, #2D69C7 100%);
	min-height: 90px;
	display: flex;
    align-items: center;
	justify-content: center;
	padding: 0px 12px;
	position: sticky;
	overflow: hidden;
    top: 0;
    z-index: 1000;
}

.hello-bar .hello-logo {
	height: 40px;
}

.hello-bar .hello-external {
    padding-left: 2px;
    height: 14px;
    position: relative;
    top: 5px;
    left: -8px;
}

.hello-bar .hello-link {
	background-color: #389aec;
    color: #fff;
	box-shadow: 0px 3px 6px 1px #14489f;
	padding: 15px 22px;
    border-radius: 42px;
    cursor: pointer;
    font-size: 17px;
    text-transform: uppercase;
	display: inline-block;
	margin-left: 20px;
	font-family: 'muli_extrabold';
	position: relative;
	z-index: 2;
}

.hello-bar .hello-link:hover {
	background-color: #1676C6;
}

.hello-bar .hello-text {
	margin: 0px 0px 0px 20px;
    color: #fff;
	font-size: 18px;
	font-family: 'muli_regular';
}

.hello-bar .hello-text b {
	font-family: 'muli_extrabold';
}

.hello-bar .hello-tap-clicks {
	height: 90px;
    position: absolute;
    left: 143px;
    z-index: 0;
}

.hello-bar .click-section {
	position: relative;
	height: 90px;
    display: flex;
    flex-direction: column;
	justify-content: center;
	margin-right: 90px;
}

.hello-bar .hello-logo-section{
	display: flex;
    align-items: center;
}

.hello-bar .mobile-image {
	display: none;
}

@media only screen and (max-width: 1250px) {
	.hello-bar {
		flex-direction: column;
		padding: 10px;
	}	

	.hello-bar .hello-link {
		padding: 10px 20px;
		border-radius: 42px;
		margin-left: 0px;
		font-size: 15px;
	}

	.hello-bar .click-section {
		position: static;
		height: 51px;
		margin-right: 0px;
	}

	.hello-bar .desktop-image {
		display: none;
	}

	.hello-bar .mobile-image {
		display: block;
		transform: rotate(47deg);
		right: -90px;
		bottom: -61px;
		left: auto;
	}

	.hello-bar .hello-text {
		margin-left: 10px;
	}
}

@media only screen and (max-width: 840px) {
	.hello-bar .hello-logo {
		display: none;
	}

	.hello-bar .hello-text {
		font-size: 15px;
		text-align: center;
	}
}
/* End: Hello bar */