/*
	-------------------------------------------
		TYPOGRAPHY
	-------------------------------------------
*/

.admin-bar .fixed-top{
  top: 32px;
}

body,
html {
    font-family: 'Lato', sans-serif;
    /*color: #4c4c4c;*/
	color: #75818c;
}

.section-content {
    position: relative;
    z-index: 3
}

h1, h2, h3, h4, h5, h6 {
	color: #4c4c4c;
}

h2 {
    font-weight: 600;
	margin-top: 40px;
	margin-bottom: 20px;
}

h6 {
	font-size: 1.2rem;
}

.blue {
    color: #2da6ff
}

a, a:visited {
    color: #2da6ff;
    transition: all 0.3s
}

a:hover, a:focus {
    text-decoration: none;
    color: #0251dd;
    -webkit-transition:all .7s ease-in-out;
	-moz-transition:all .7s ease-in-out;
	-o-transition:all .7s ease-in-out;
	transition:all .7s ease-in-out
}

h2.section-titles, h1.section-titles {
    text-align: center;
    font-weight: 900;
    font-size: 2.5rem;
    position: relative;
    padding-bottom: 50px
}

h2.section-titles:after, h1.section-titles:after {
    width: 100px;
    height: 7px;
    position: absolute;
    left: 50%;
    margin-left: -50px;
    background: #2196ff;
    /*background: -moz-linear-gradient(left, #2196ff 0%, #0251dd 100%);
    background: -webkit-linear-gradient(left, #2196ff 0%, #0251dd 100%);
    background: linear-gradient(to right, #2196ff 0%, #0251dd 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#2196ff', endColorstr='#0251dd', GradientType=1);*/
	background: linear-gradient(-45deg, #2295ff, #0259f5, #002b91, #00206a);
	background-size: 400% 400%;
	-webkit-animation: Gradient 2s ease infinite;
	-moz-animation: Gradient 2s ease infinite;
	animation: Gradient 2s ease infinite;
    display: block;
    content: '';
    bottom: 35px;
	border-radius: 50px;
}

.page-wrapper  h1.section-titles {
	text-align: left;
}

h1.section-titles:after {
	margin-left: 0;
    left: 0;
    bottom: 25px;
}

dl, ol, ul {
	padding-left: 1.5em;	
}

p, li {
	font-weight: 100;
	font-size: 1.2rem;
}

.lead p {
	text-align: center;
	font-weight: 100;
    font-size: 1.8rem;
}

textarea,
select,
input,
button {
    outline: none;
}

:focus {
    outline-color: transparent;
    outline-style: none;
}

button:focus {
    outline: none!important
}

.max-width {
    max-width: 2500px!important;
}

.wrapper .fas {
	color: #2da6ff;
}

.wrapper {
	padding: 0;
}

.center {
	text-align: center;
}

/** HIGHLIGHT *******************************/
::-moz-selection { color: #fff;  background: #2da6ff; }
::selection {color: #fff; background: #2da6ff;}


/**********************************************************************************************************************************************************************************************/








/*
	-------------------------------------------
		HEADER
	-------------------------------------------
*/
.navbar {
	padding: 1.2rem .5rem .5rem;
}

.navbar.faded {
    background-color: rgba(255, 255, 255, 0)!important;
    transition: all 0.3s
}

.navbar.full {
    background-color: rgba(255, 255, 255, 0.95)!important;
    transition: all 0.3s;
    border-bottom: 1px solid #ced4da;
}

.navbar .navbar-nav > li {
	border: 3px solid transparent;
	position: relative;
	border-radius: 45px;
	margin: 0 5px;
	-webkit-transition:all .7s ease-in-out;
	-moz-transition:all .7s ease-in-out;
	-o-transition:all .7s ease-in-out;
	transition:all .7s ease-in-out
}

.navbar.faded .navbar-nav a,
.navbar.faded #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link,
.navbar.full .navbar-nav > li >.dropdown-menu a {
    color: #fff!important;
    transition: all 0.3s;
	border-radius: 45px;
}

.navbar.faded .navbar-nav > li:hover {
	border: 3px solid rgba(255,255,255,0.2);
}

.navbar.faded .navbar-nav > li:focus {
	border: 3px solid rgba(255,255,255,0.4);
}

.navbar.full .navbar-nav > .dropdown-menu a:hover {
    background-color: #fff!important;
    transition: all 0.3s;
    color: #2da6ff!important;
}

.navbar.full .navbar-nav a,
.navbar.full #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link {
    color: #2da6ff!important;
    transition: all 0.3s
}

#wrapper-navbar .navbar.full .current-menu-item, .navbar.full #main-menu > .current-menu-ancestor {
	border-color: #2da6ff;
}

#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-megamenu > ul.mega-sub-menu > li.mega-menu-item > a.mega-menu-link,
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-column > ul.mega-sub-menu > li.mega-menu-item > a.mega-menu-link {
    line-height: 1.2
}

.navbar-expand-lg .navbar-nav .nav-link {
    padding-right: 1.3rem;
    padding-left: 1.3rem;
}

.nav-link {
	padding: .3rem 1rem;
}

#main-menu {
	margin-top :20px;
}

#main-menu > .current-menu-item, #main-menu > .current_page_ancestor, #main-menu > .current-menu-item, #main-menu > .current_page_parent, #main-menu > .current-menu-ancestor {
	border: 3px solid #fff;
}

#main-menu .dropdown-menu .current-menu-item a {
	color: #2da6ff !important;
}
 



.navbar-brand {
    background-size: contain;
    background-repeat: no-repeat !important;
    width: 290px;
    height: 70px;
    display: block;
    margin-top: 10px;
    padding: 0;
    margin-bottom: 2px;
}

.navbar-brand.color {
    background: url(../img/processflow_logo.svg) no-repeat;
}

.navbar-brand.white {
    background: url(../img/processflow_logo_white.svg) no-repeat;
}

.navbar-toggle {
    border: none;
    background: transparent !important;
}

.navbar-toggle:hover {
    background: transparent !important;
}

.navbar-toggler .icon-bar {
    width: 22px;
    transition: all 0.2s;
    height: 2px;
    background-color: #fff;
    margin-top: 4px;
    display: block;
    transition: all 0.3s;
}

.navbar-toggler .top-bar {
    transform: rotate(45deg);
    transform-origin: 10% 10%;
}

.navbar-toggler .middle-bar {
    opacity: 0;
}

.navbar-toggler .bottom-bar {
    transform: rotate(-45deg);
    transform-origin: 10% 90%;
}

.navbar-toggler.collapsed .top-bar {
    transform: rotate(0);
}

.navbar-toggler.collapsed .middle-bar {
    opacity: 1;
}

.navbar-toggler.collapsed .bottom-bar {
    transform: rotate(0);
}

.navbar .navbar-nav .dropdown-menu a {
    font-size: 14px;
    transition: all 0.6s;
	color: #75818c !important;
}

.navbar.full .navbar-nav .dropdown-menu {
	background: rgba(255, 255, 255, 1);
	box-shadow: none;
}

.navbar.full .navbar-nav > li > .dropdown-menu a {
	color: #75818c !important;
}

.navbar.faded .navbar-nav .dropdown-menu a:hover {
    transition: all 0.6s;
    color: rgba(55, 89, 168, 1)!important;
    background: rgba(255, 255, 255, 0.8)
}

.navbar .navbar-nav > li > .dropdown-menu {
    background: #fff;
	box-shadow: 0 0 2px rgba(0,0,0,.10), 0 3px 8px rgba(0,0,0,.10);
	color: #fff;
	padding: 0;
	margin-left: 20px;
    margin-top: 10px;
}

.arrow {
    width: 0;
    height: 0;
    margin-left: 15px;
    border-right: 9px solid transparent;
    border-left: 9px solid transparent;
    border-bottom: 9px solid #FEFEFE;
    position: absolute;
    top: -9px;
}

.navbar .navbar-nav > li > .dropdown-menu {
	width: 250%;
	overflow: hidden;
	animation-name: fadeIn;
	animation-duration: 0.4s;
	animation-timing-function: ease-in-out;
}

.dropdown-toggle::after {
	display: none;
}



.navbar .navbar-nav > li > ul.dropdown-menu li {
	border-bottom: 1px solid #ced4da;
}

.navbar .navbar-nav > li > ul.dropdown-menu li a {
	padding-top: 15px;
	padding-bottom: 15px;
}

.navbar .navbar-nav > ul.dropdown-menu > li:hover {
	background: #f9f9f9;
}

.navbar .navbar-nav ul.dropdown-menu li:hover a {
	color: #2da6ff !important;
	margin-left: 10px;
}

.navbar .navbar-nav ul.dropdown-menu li:hover a:hover {
	background: transparent !important;
	color: #2da6ff !important;
}

.navbar .navbar-nav ul.dropdown-menu li:last-child {
	border-bottom: none;
}

.navbar .navbar-nav ul.dropdown-menu li { 
	animation-name: fadeInLeft;
	animation-duration: 0.3s;
	animation-play-state: paused;
	animation-timing-function: ease-in-out;
	animation-fill-mode: backwards;
}

.navbar .navbar-nav ul.dropdown-menu.show, .navbar .navbar-nav ul.dropdown-menu.show li { 
	animation-play-state: running;	
}

.navbar .navbar-nav > li.product-menu > ul.dropdown-menu > li.col-product { 
	float: left;
	padding: 0 !important;
	border-bottom: none;
}

.navbar .navbar-nav > li.product-menu > ul.dropdown-menu > li:first-child.col-product {
	border-bottom: 1px solid #ced4da !important;
}

.navbar .navbar-nav > li.product-menu > .dropdown-menu {
	width: 350%;
	margin-left: -150px;
}

.navbar .navbar-nav > li.col-product > ul.dropdown-menu li:first-child a {
	padding-bottom: 0;
}

.product-menu > ul.dropdown-menu > li.col-product > a { 
	padding-bottom: 10px;
	font-weight: bold;
    font-size: 1rem;
}

.product-menu > ul.dropdown-menu > li.col-product:hover > a:hover {
	color: #75818c !important;
	cursor: default;
}

.product-menu > ul.dropdown-menu > li.col-product > ul.dropdown-menu {
	display: block;
	position: relative;
	border: none;
	padding: 0;
}

.product-menu > ul.dropdown-menu > li.col-product > ul.dropdown-menu > li {
	border-top: none;
	border-bottom: none;
}

.product-menu > ul.dropdown-menu > li.col-product:hover a {
	color: #75818c !important;
	margin-left: 0 !important;
}

.product-menu > ul.dropdown-menu > li.col-product > ul > li:hover > a {
	margin-left: 10px !important;
}


@-webkit-keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}
	

.social-media {
	width: auto;
	position: absolute;
	display: inherit;
	top: 0;
	right: 1%;
	animation-delay: 3s;
}

.social-media:before {
	background-image: url('../img/social-curve-left.svg');
	transition: all 0.6s;
}

.social-media:after {
	background-image: url('../img/social-curve-right.svg');
	transition: all 0.6s;
}

.social-media:before, .social-media:after  {
	width: 48px;
	height: 35px;
	content: '';
	opacity: 0.4;
	background-repeat: no-repeat;
	background-size: contain;
}

.social-media a {
	padding: 5px 15px;
	background-color: rgba(255,255,255,0.4);
	transition: all 0.6s;
}

.social-media a i {
	color: #fff;
}

.navbar.full .social-media:before, .navbar.full .social-media:after {
	opacity: 1;
}

.navbar.full .social-media:before {
	background-image: url('../img/social-curve-left-navfull.svg');
	transition: all 0.6s;
}

.navbar.full .social-media:after {
	background-image: url('../img/social-curve-right-navfull.svg');
	transition: all 0.6s;
}

.navbar.full .social-media a {
	background-color: #2da6ff;
	transition: all 0.6s;
}

.navbar.full  #main-menu > .current-menu-item, .navbar.full #main-menu > .current_page_ancestor, .navbar.full  #main-menu > .current-menu-item, .navbar.full #main-menu > .current_page_parent {
	border: 3px solid #2da6ff;
}

/**********************************************************************************************************************************************************************************************/








/*
	-------------------------------------------
		HOMEPAGE
	-------------------------------------------
*/

.notifcation {
	width: 100%;
	padding: 0 0 350px 0;
    background: #fff;
    position: relative;
}

.notifcation:before {
    position: absolute;
    width: 100%;
    height: 360px;
    background: #fff;
    top: -185px;
    content: '';
    -ms-transform: skewY(-7deg);
    -webkit-transform: skewY(-7deg);
    transform: skewY(-7deg);
}

.notifcation h2.section-titles {
	margin-top: 0;
}

.notifcation p {
	margin-bottom: 50px;
}

.notifcation .gform_wrapper label {
	display: none !important;
}

body.home.page-template section.header, body.home.page-template section.header:before {
	background: transparent;
	height: 0;
}

/** TOP ***************************************/
.top-section {
    height: 110vh;
    background: linear-gradient(-45deg, #2196ff, #0259f5, #4C4C4B, #202020 );
	background-size: 400% 400%;
	-webkit-animation: GradientSingle 8s ease;
	-moz-animation: GradientSingle 8s ease;
	animation: GradientSingle 8s ease;
	animation-fill-mode: forwards;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center
}

section.top-section:before {
	width: 100%;
	height: 110vh;
    background: url(../img/home_flash.svg);
	background-size: cover;
    background-position: top center;
	display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
	content: '';
	position: absolute;
}

@-webkit-keyframes Gradient {
	0% {
		background-position: 0% 50%
	}
	50% {
		background-position: 100% 50%
	}
	100% {
		background-position: 0% 50%
	}
}

@-moz-keyframes Gradient {
	0% {
		background-position: 0% 50%
	}
	50% {
		background-position: 100% 50%
	}
	100% {
		background-position: 0% 50%
	}
}

@keyframes Gradient {
	0% {
		background-position: 0% 50%
	}
	50% {
		background-position: 100% 50%
	}
	100% {
		background-position: 0% 50%
	}
}


@-webkit-keyframes GradientSingle {
	0% {
		background-position: 0% 50%
	}
	100% {
		background-position: 100% 50%
	}
}

@-moz-keyframes GradientSingle {
	0% {
		background-position: 0% 50%
	}
	100% {
		background-position: 100% 50%
	}
}

@keyframes GradientSingle {
	0% {
		background-position: 0% 50%
	}
	100% {
		background-position: 100% 50%
	}
}

.top-section h2,
.top-section p {
    color: #fff
}

.top-section h2 {
    font-size: 3.7rem;
    font-weight: 800;
    margin-bottom: 40px;
    margin-top: -50px;
}

.top-section h2 span {
	display: block;
}


.top-section p {
    font-size: 2.5rem;
    margin: 0;
    padding: 0;
    font-weight: 100
}

.top-section span {
	display: block;
}

.top-section p strong {
    font-weight: 700
}

.top-section a {
    border-radius: 55px;
    background: #fff;
    font-weight: 600;
    padding: 25px 50px;
    display: inline-block;
    margin-top: 50px;
    font-size: 2rem;
    text-transform: uppercase;
    transition: all 0.3s;
	animation-delay: 0.3s;
}

.top-section a span {
	font-weight: 200;
    background: linear-gradient(-45deg, #2295ff, #0259f5, #002b91, #00206a);
	background-size: 400% 400%;
	-webkit-animation: Gradient 2s ease infinite;
	-moz-animation: Gradient 2s ease infinite;
	animation: Gradient 2s ease infinite;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 2rem;
}

.top-section a:hover {
    text-decoration: none;
	background: #ececec;
}
/**********************************************/




/** WHO WE ARE ********************************/
.who-we-are {
    position: relative;
    padding: 70px 0 350px 0
}

.who-we-are:before {
    position: absolute;
    width: 100%;
    height: 360px;
    background: #fff;
    top: -185px;
    content: '';
    -ms-transform: skewY(-7deg);
    -webkit-transform: skewY(-7deg);
    transform: skewY(-7deg);
}

.who-we-are p {
    font-weight: 100;
    font-size: 2.5rem;
    text-align: center
}
/**********************************************/




/** SERVICES **********************************/
.services {
    position: relative;
    padding: 70px 0 400px 0
}

.services .service-box:nth-child(2) {
	animation-delay: 0.3s;
}

.services .service-box:nth-child(3) {
	animation-delay: 0.6s;
}

.services .service-box:nth-child(4) {
	animation-delay: 0.9s;
}

.services .service-box:nth-child(5) {
	animation-delay: 1.2s;
}

.services .service-box:nth-child(6) {
	animation-delay: 1.5s;
}

.services:before {
    position: absolute;
    width: 100%;
    height: 100%;
    background: #d0ebff;
    top: -185px;
    content: '';
    -ms-transform: skewY(-7deg);
    -webkit-transform: skewY(-7deg);
    transform: skewY(-7deg);
    opacity: .5;
    z-index: 2;
	right:0; 
}

.services:after {
    position: absolute;
    width: 100%;
    height: 100%;
    background: #d0ebff;
    top: -185px;
    content: '';
    -ms-transform: skewY(7deg);
    -webkit-transform: skewY(7deg);
    transform: skewY(7deg);
    opacity: .2;
    z-index: 1;
}

.service-box {
    padding: 0 30px 50px 30px
}

.service-box .icon {
    width: 75px;
    height: 75px;
    border-radius: 50%;
    display: block;
    background: -moz-linear-gradient(left, #2196ff 0%, #0251dd 100%);
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#1e5799+0,7db9e8+100 */
    text-align: center;
    line-height: 114px;
    background: #2196ff;
    /* Old browsers */
    background: -moz-linear-gradient(-45deg, #2196ff 0%, #0251dd 100%);
    /* FF3.6-15 */
    background: -webkit-linear-gradient(-45deg, #2196ff 0%, #0251dd 100%);
    /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(135deg, #2196ff 0%, #0251dd 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#2196ff', endColorstr='#0251dd', GradientType=1);
    /* IE6-9 fallback on horizontal gradient */
}

.service-box .btn-primary {
	padding: 15px 30px;
}

.service-box .icon span {
    width: 50px;
    height: 50px;
    background-size: contain;
    display: inline-block;
    background-repeat: no-repeat
}

.service-box h2 {
    font-weight: 200;
    background: -webkit-linear-gradient(#2196ff, #0251dd);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-top: 20px
}

.service-box a {
    margin-top: 15px
}

.service-box a i {
    margin-left: 5px
}
/**********************************************/




/** PLUGINS ***********************************/
.plugins {
    position: relative;
    padding: 70px 0 420px 0
}

section.plugins:before {
    position: absolute;
    width: 100%;
    height: 110%;
    background: rgba(45, 166, 255, 0.75);
    top: -185px;
    content: '';
    -ms-transform: skewY(-7deg);
    -webkit-transform: skewY(-7deg);
    transform: skewY(-7deg);
    opacity: .9;
    z-index: 2
}

section.plugins:after {
    position: absolute;
    width: 100%;
    height: 135%;
    background: #2da6ff;
    top: -185px;
    content: '';
    -ms-transform: skewY(7deg);
    -webkit-transform: skewY(7deg);
    transform: skewY(7deg);
    opacity: .5;
    z-index: 1
}

.plugins h2 {
    color: #fff
}

.plugins h2:after {
    width: 100px;
    height: 7px;
    position: absolute;
    left: 50%;
    margin-left: -50px;
    background: #fff!important;
    bottom: 35px
}

.plugin-carousel .item {
    border: solid 2px #fff;
    text-align: center;
    box-shadow: 5px 5px rgba(45, 166, 255, 0.4);
    background: #fff;
    overflow: auto;
    padding-bottom: 20px
}

.plugin-carousel .item ul {
    margin: 0;
    padding: 0;
    list-style: none
}

.plugin-carousel .item ul li {
    width: 50%;
    float: left
}

.plugin-carousel .item ul li a {
    padding: 15px 20px;
	margin-top: 10px;
    float: right;
}

.plugin-carousel .item ul li.price p {
    color: #2da6ff;
    font-size: 3rem;
    text-align: left
}

.plugin-carousel .item ul li.price p sub {
    font-size: 1.75rem;
    bottom: 0
}

.plugin-carousel .item ul li.price p sub.dollar {
    bottom: auto;
    top: -13px
}

.plugin-carousel .top-plugin {
    padding: 30px 20px 50px 20px;
    background-color: #2295ff;
    background-image: url(../img/products_flash.svg);
    background-repeat: no-repeat;
    background-size: cover;
	background-position: bottom;
}

.plugin-carousel .top-plugin p {
    color: #fff;
    font-size: 1.3rem
}

.plugin-carousel .icon {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    background: #fff;
    border: solid 2px #2da6ff;
    box-shadow: 5px 5px rgba(45, 166, 255, 0.2);
    margin: -60px auto 0 auto;
    line-height: 178px;
}

.plugin-carousel .icon span {
    width: 75px;
    height: 75px;
    background-size: contain;
    background-repeat: no-repeat;
    margin: 0 auto;
    display: inline-block
}

.plugin-carousel .plugin-content {
    padding: 20px 30px
}

.plugin-carousel.owl-theme .owl-dots {
    margin-top: 40px
}

.plugin-carousel.owl-theme .owl-dots .owl-dot span {
    width: 25px;
    height: 25px;
    border: solid 3px #fff;
    background: transparent;
    transition: all 0.3s
}

.plugin-carousel.owl-theme .owl-dots .owl-dot.active span,
.plugin-carousel.owl-theme .owl-dots .owl-dot:hover span {
    background: #fff;
    transition: all 0.3s
}

.plugin-carousel .owl-nav button.owl-prev,
.plugin-carousel .owl-nav button.owl-next {
    color: #fff!important;
    font-size: 3.5rem!important;
    transition: all 0.3s
}

.plugin-carousel .owl-nav button.owl-prev:hover,
.plugin-carousel .owl-nav button.owl-next:hover {
    transition: all 0.3s;
    background: transparent;
    opacity: 0.5
}

.plugin-carousel .owl-nav button.owl-prev {
    position: absolute;
    left: -80px;
    top: 40%
}

.plugin-carousel .owl-nav button.owl-next {
    position: absolute;
    right: -80px;
    top: 40%
}
/**********************************************/




/** WHY SUITE CRM *****************************/
.why-row {
    padding: 60px 0;
    z-index: 4;
}

.why-crm {
    position: relative;
    padding: 0 0 400px 0;
    z-index: 5;
}

.why-crm:before {
    position: absolute;
    width: 100%;
    height: 130%;
    background: #fff;
    top: -175px;
    content: '';
    -ms-transform: skewY(-10deg);
    -webkit-transform: skewY(-10deg);
    transform: skewY(-10deg);
    opacity: 1;
    z-index: 2
}

.why-row:nth-of-type(even) [class*=col]:nth-of-type(even) {
    order: -1;
}

.why-row img {
    margin: 0 auto;
    display: block
}

.why-row h2 {
    font-weight: 200;
    background: -webkit-linear-gradient(#2196ff, #0251dd);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-top: 20px
}
/**********************************************/




/** WHY SUITE CRM COMPARISON ******************/
.crm-comparison {
    position: relative;
    z-index: 6;
    padding-bottom: 310px
}

.crm-comparison:before {
    position: absolute;
    width: 100%;
    height: 100%;
    background: #d0ebff;
    top: -185px;
    content: '';
    -ms-transform: skewY(-7deg);
    -webkit-transform: skewY(-7deg);
    transform: skewY(-7deg);
    opacity: .5;
    z-index: 2;
	animation: showHideBefore 2s ease-in;
	animation-delay: 0.2s;
	right:0; 
}

.crm-comparison:after {
    position: absolute;
    width: 100%;
    height: 100%;
    background: #d0ebff;
    top: -185px;
    content: '';
    -ms-transform: skewY(7deg);
    -webkit-transform: skewY(7deg);
    transform: skewY(7deg);
    opacity: .2;
    z-index: 1;
	animation: showHideAfter 2s ease-in;
	
}

.comparison {
    max-width: 100%;
    margin: 0 auto;
    text-align: center;
    padding: 10px;
}

.comparison table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    table-layout: fixed;
    border-bottom: none;
}

.comparison td,
.comparison th {
    border-left: 1px solid #2da6ff;
    empty-cells: show;
    padding: 10px;
}

.comparison td i {
    font-size: 21px;
    color: #2da6ff
}

.comparison table tr {
    border-right: solid 1px #2da6ff;
    background: rgba(255, 255, 255, 0.95)
}

.comparison table thead tr {
    background: transparent
}

.comparison table thead th.compare-heading {
    background: rgba(255, 255, 255, 0.95)
}

.comparison th.tl {
    border: none;
    border-bottom: solid 1px #2da6ff
}

.comparison th {
    border: 1px solid #2da6ff;
}

.comparison th span.price {
    clear: both;
    font-size: 2.2rem;
    display: inline-block;
    width: 100%;
    color: #2da6ff;
    line-height: 1
}

.comparison th span.price sub {
    bottom: auto;
    top: -0.4rem;
    font-size: 65%
}

.compare-heading {
    font-size: 18px;
    font-weight: bold !important;
    padding-top: 10px !important;
}

.comparison tbody tr:nth-child(odd) {
    display: none;
}

.comparison .compare-row {
    background: rgba(233, 246, 255, 0.9);
}

.comparison .tickblue {
    color: #0078C1;
}

.comparison .tickgreen {
    color: #009E2C;
}

.comparison th {
    padding: 0;
    border-bottom: 1px solid #2da6ff;
    position: relative
}

.comparison th.suitecrm {
    padding-top: 30px;
    color: #fff
}

.comparison th.suitecrm span.price {
    color: #fff
}

.comparison th.suitecrm span.box {
    background: #2da6ff;
    position: absolute;
    top: -35px;
    left: -2px;
    right: -2px;
    bottom: 0;
    padding-top: 15px
}

.comparison a.get-demo {
    background: #fff;
    border-radius: 45px;
    color: #2da6ff;
    padding: 10px 20px;
    display: inline-block;
    margin: 10px 0;
    transition: all 0.3s;
    font-size: 16px;
    font-weight: bold;
    text-transform: uppercase
}

.comparison a.get-demo:hover {
    transition: all 0.3s;
    background-color: #0251dd;
    color: #fff
}

.comparison th.suitecrm span.box:after {
    content: '';
    position: absolute;
    top: 0;
    right: -20px;
    height: 35px;
    width: 20px;
    background: url(../img/comparison_angle.svg);
    background-size: contain;
    background-repeat: no-repeat
}

.comparison td:nth-of-type(4) {
    border-left-width: 3px;
    border-right: solid 3px #2da6ff
}

.comparison tr.bottom-row {
    border: none;
    background: transparent
}

.comparison tr.bottom-row td {
    border-left-color: transparent;
    border-top: solid 1px #2da6ff
}

.comparison tr.bottom-row td:nth-of-type(4) {
    border-right: 3px #2da6ff solid;
    border-left: 3px #2da6ff solid;
    background-color: #2da6ff;
    margin-left: -2px;
    margin-right: -2px;
    position: relative
}

.comparison tr.bottom-row td:nth-of-type(4):after {
    content: '';
    position: absolute;
    top: -1px;
    right: -36px;
    height: 100%;
    width: 33px;
    background: url(../img/comparison_angle_btm.svg);
    background-size: contain;
    background-repeat: no-repeat;
}

.comparison tr td:first-child {
    text-align: center;
}

.comparison .qbse,
.comparison .qbo,
.comparison .tl {
    color: #FFF;
    padding: 10px;
    border-right: 1px solid #CCC;
    border-bottom: 0;
}

.comparison .tl2 {
    border-right: 0;
}

.comparison .qbse {
    background: #0078C1;
    border-top-left-radius: 3px;
    border-left: 0px;
}

.comparison .qbo {
    background: #009E2C;
    border-top-right-radius: 3px;
    border-right: 0px;
}

.comparison .price-info {
    padding: 5px 15px 15px 15px;
}

.comparison .price-now,
.comparison .price-now span {
    color: #ff5406;
}

.comparison .price-buy {
    background: #ff5406;
    padding: 10px 20px;
    font-size: 12px;
    display: inline-block;
    color: #FFF;
    text-decoration: none;
    border-radius: 3px;
    text-transform: uppercase;
    margin: 5px 0 10px 0;
}

.comparison .price-try {
    font-size: 12px;
}

.comparison .price-try a {
    color: #202020;
}
/**********************************************/




/** PROOF OF CONCEPT **************************/
.poc {
    position: relative;
    padding: 70px 0 400px 0;
    z-index: 6;
}

.poc:before {
    position: absolute;
    width: 100%;
    height: 100%;
    background: #4c4c4c;
    top: -185px;
    content: '';
    -ms-transform: skewY(-10deg);
    -webkit-transform: skewY(-10deg);
    transform: skewY(-10deg);
    opacity: 1;
    z-index: 2
}

.poc:after {
    position: absolute;
    width: 100%;
    height: 100%;
    top: -185px;
    content: '';
    -ms-transform: skewY(10deg);
    -webkit-transform: skewY(10deg);
    transform: skewY(10deg);
    opacity: .8;
    z-index: 1;
	background: linear-gradient(-45deg, #3c3c3c, #212529);
	background-size: 400% 400%;
	-webkit-animation: Gradient 4s ease infinite;
	-moz-animation: Gradient 4s ease infinite;
	animation: Gradient 4s ease infinite;
}

.poc h2 {
    color: #2da6ff;
    text-align: center;
    font-size: 3.2rem;
}

.poc p {
    color: #fff;
    text-align: center;
}

.poc .gform_confirmation_message {
	color: #fff;
	font-size: 1.2rem;
	font-weight: 100;
}

.top_poc_section p {
    font-size: 2rem
}

.poc a.get-demo {
    background: #fff;
    border-radius: 75px;
    color: #2da6ff;
    padding: 20px 40px;
    display: inline-block;
    margin: 20px 0 40px 0;
    transition: all 0.3s;
    font-size: 21px;
    font-weight: bold;
    text-transform: uppercase;
    text-align: center
}

.poc a.get-demo:hover {
    transition: all 0.3s;
    background-color: #0251dd;
    color: #fff
}

.poc .section-content {
    text-align: center
}


.poc .gform_wrapper input,
.poc .gform_wrapper textarea {
    background: #2c2c2c;
    border: solid 1px #4c4c4c;
    border-radius: 5px;
    height: 65px;
    padding-left: 20px!important;
    font-size: 20px!important;
    color: #fff
}

.poc .gform_wrapper textarea {
    padding-top: 20px
}

.poc .gform_wrapper input[type=submit] {
    padding: 15px 40px!important;
    text-align: center;
    color: #fff;
    height: auto;
    float: left;
    background-color: #2da6ff;
    transition: all 0.3s;
    border-radius: 75px
}

.poc .gform_wrapper input[type=submit]:hover {
    text-decoration: none;
    background-color: #0251dd;
    transition: all 0.3s
}

body.home img.gform_ajax_spinner {
	margin-top: 0;
	width: 75px !important;
}

.poc .gform_wrapper .gform_footer {
    margin-top: 10px;
    padding-top: 0
}
/**********************************************************************************************************************************************************************************************/








/*
	-------------------------------------------
		TESTIMONIALS
	-------------------------------------------
*/
.testimonials {
    position: relative;
    padding: 0 0 300px 0;
    z-index: 7;
    background: #fff
}

.testimonials:before {
    position: absolute;
    width: 100%;
    height: 100%;
    background: #fff;
    top: -215px;
    content: '';
    -ms-transform: skewY(-10deg);
    -webkit-transform: skewY(-10deg);
    transform: skewY(-10deg);
    opacity: 1;
    z-index: 2
}

.testimonials h2 {
    text-align: center;
    color: #2da6ff;
    margin-bottom: 60px
}

.testimonials-carousel .owl-item {
    border: solid 1px #2da6ff;
    box-shadow: 5px 5px rgba(45, 166, 255, 0.2);
    display: flex;
    flex-direction: column;
    padding: 40px;
    text-align: center;
    margin-left: 5px!important
}

.testimonials-carousel .owl-item p {
    font-weight: 100;
    font-style: italic;
    font-size: 1.3rem
}

.testimonials-carousel .owl-stage-outer {
    width: calc(100% + 5px);
    padding: 2px!important
}

.testimonials-carousel .owl-stage {
    display: flex;
    padding-bottom: 5px;
    padding-right: 5px
}

.testimonials-carousel .owl-item .item {
    position: relative;
    padding-top: 80px
}

.testimonials-carousel .owl-item .item:before {
    content: '';
    color: #2da6ff;
    position: absolute;
    top: 0;
    left: 0;
    background: url(../img/quote.svg);
    width: 55px;
    height: 55px;
    background-size: contain;
    background-repeat: no-repeat;
    display: block
}

.testimonials-carousel .owl-item .item .testimonial_author {
    position: relative
}

.testimonials-carousel .owl-item .item .testimonial_author:after {
    content: '';
    color: #2da6ff;
    position: absolute;
    bottom: 0;
    right: 0;
    background: url(../img/quote.svg);
    width: 35px;
    height: 35px;
    background-size: contain;
    background-repeat: no-repeat;
    display: block;
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

.testimonials-carousel .owl-item .item .testimonial_author p {
    font-style: normal;
    font-size: 1rem
}

.testimonials-carousel .owl-item .item .testimonial_author p.author {
    font-weight: 600;
    color: #2da6ff;
    margin: 0;
    padding: 0;
    font-size: 1.3rem
}

.testimonials-carousel .owl-nav {
	display: none;
}

.testimonials-carousel .owl-dots {
	margin-top: 40px;
}

.testimonials-carousel.owl-theme .owl-dots .owl-dot span {
	width: 20px;
	height: 20px;
}

.testimonials-carousel.owl-theme .owl-dots .owl-dot.active span {
	background: #2da6ff;
}

.testimonials-carousel.owl-theme .owl-dots .owl-dot span {
	background: rgba(45, 166, 255, 0.2)
}

/**********************************************/




/** DEFAULT PAGES *****************************/
body.page-template section.header, body.single section.header, body.blog section.header, body.search section.header, body.archive section.header, body.page-template-default section.header {
    width: 100%;
    height: 20vh;
	background: linear-gradient(-45deg, #2295ff, #0259f5, #002b91 );
    background-size: 400% 400%;
    -webkit-animation: Gradient 8s ease infinite;
    -moz-animation: Gradient 8s ease infinite;
    animation: Gradient 8s ease infinite;
	position: relative;
	overflow: hidden;
}

.page-wrapper > .container-fluid {
	padding: 70px 15px 420px;
}

body.page-template section.header:before, body.single section.header:before, body.blog section.header:before, body.search section.header:before, body.archive section.header:before, body.page-template-default section.header:before {
    width: 101%;
	height: 100%;
	margin-left: -3px;
    background: url(../img/interior_bg.svg);
	background-repeat: no-repeat;
    background-size: cover;
    background-position: top center;
    content: '';
    position: absolute;
}
/**********************************************************************************************************************************************************************************************/








/*
	-------------------------------------------
		BLOG PAGE
	-------------------------------------------
*/
.blog article:first-child, .archive article:first-child, .category article:first-child, .search article:first-child {
	margin: 10px 0 60px 0;
}

.blog article, .archive article, .category article, .search article {
	margin: 60px 0;
}

.page-item.active .page-link {
	background: #2a9aec;
	border-color: #2a9aec;
}

.page-link {
	padding: .5rem 1rem;
	border: 1px solid #ced4da;
	color: #75818c;
}

.comments-title {
	margin-bottom: 20px;
}

.comments-area {
	margin-top: 50px;
}

ol.comment-list {
	padding: 0;
    list-style-type: none;
}

ol.children {
    list-style-type: none;
}

.comment-list article {
	margin-bottom: 30px;
	padding: 15px 20px;
    border: 1px solid #ced4da;
    border-radius: 5px;
	box-shadow: 0 0 2px rgba(0,0,0,.10), 0 3px 8px rgba(0,0,0,.10);
}

.post-navigation {
	margin-top: 15px;
	padding: 10px 15px;
    border-top: 1px solid #ced4da;
    border-bottom: 1px solid #ced4da;
}

.single .entry-meta {
	padding-bottom: 30px;
}

.archive .entry-meta, .blog .entry-meta {
	padding-bottom: 15px;
}

.cat-links {
	width: 100%;
    float: left;
	margin: 40px 0 20px;
}

.tags-links a {
	border: 1px solid;
    padding: 5px 15px;
    margin: 0 5px;
}

.share {
	max-height: 70px;
	margin-top: 30px;
	padding-top: 20px;
	border-top: 1px solid #ced4da;
	border-bottom: 1px solid #ced4da;
    display: flex;
}

.sfsi_wDiv {
	margin-top: -10px;
	margin-left: 15px;
	position: relative;
}

/* #secondary img, article img, figure, img, img.wp-post-imag {
	width: 100%;
	margin-bottom: 30px;
} */

/**********************************************************************************************************************************************************************************************/








/*
	-------------------------------------------
		BUTTONS
	-------------------------------------------
*/
.btn {
	padding: .75rem 1rem;
}

.btn-primary, .btn-secondary, .gform_wrapper .gform_footer input.button, .gform_wrapper .gform_footer input[type=submit], .gform_wrapper .gform_page_footer input.button, .gform_wrapper .gform_page_footer input[type=submit] {	
	color: #fff !important;
	background: #2a9aec;
	border-color: #2a9aec;
	border-radius: 50px;
	cursor: pointer;
	position: relative;
  	overflow: hidden;
}

.btn-primary, .btn-secondary {
	padding: 1.2rem 4rem;
    font-size: 1.5rem;
}

.gform_wrapper .gform_footer input.button, .gform_wrapper .gform_footer input[type=submit], .gform_wrapper .gform_page_footer input.button, .gform_wrapper .gform_page_footer input[type=submit] {
	min-width: 150px;
}

.btn-primary:hover, .btn-primary:visited .btn-secondary:hover, .btn-secondary:visited, .gform_wrapper .gform_footer input.button:hover, .gform_wrapper .gform_footer input[type=submit]:hover, .gform_wrapper .gform_page_footer input.button:hover, .gform_wrapper .gform_page_footer input[type=submit]:hover {
    color: #fff !important;
	z-index: 2;
	background-color: transparent;
	border-color: transparent;
	-webkit-transition:all .5s ease-in-out;
	-moz-transition:all .5s ease-in-out;
	-o-transition:all .5s ease-in-out;
	transition:all .5s ease-in-out
}

.btn-primary:focus, .btn-secondary:focus {
	border-color: none;
	box-shadow: none;
	outline: 0 none;
}

.btn-primary:before, .btn-secondary:before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 0%;
	height: 100%;
	z-index: 1;
	opacity: 0;
	border-radius: 50px;
	background-color: rgba(39, 141, 215, .9);
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}

.btn-primary span, .btn-secondary span {
	z-index: 2;	
	display: block;
	position: relative;
	width: 100%;
	height: 100%;	
}

.btn-primary:hover:before, .btn-secondary:hover:before {
	opacity: 1;
	width: 100%;
}


.btn-primary:after, .btn-secondary:after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 5px;
  height: 5px;
  background: rgba(42, 154, 236, .7);
  opacity: 0;
  border-radius: 50%;
  transform: scale(1, 1) translate(-50%);
  transform-origin: 50% 50%;
}

.btn-primary:focus:not(:active)::after , .btn-secondary:focus:not(:active)::after {
  animation: ripple 1s ease-out;
}

@keyframes ripple {
  0% {
    transform: scale(0, 0);
    opacity: 1;
  }
  20% {
    transform: scale(25, 25);
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: scale(50, 50);
  }
}

.gform_wrapper .gform_footer input.button:hover, .gform_wrapper .gform_footer input.button:focus, .gform_wrapper .gform_footer input[type=submit]:hover, gform_wrapper .gform_footer input[type=submit]:focus, .gform_wrapper .gform_page_footer input.button:hover, .gform_wrapper .gform_page_footer input.button:focus, .gform_wrapper .gform_page_footer input[type=submit]:hover, .gform_wrapper .gform_page_footer input[type=submit]:focus, .input-group-btn .btn-primary:hover, .input-group-btn .btn-primary:focus {
	background-color: rgba(39, 141, 215, .9);
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
} 

/**********************************************************************************************************************************************************************************************/








/*
	-------------------------------------------
		SIDEBAR
	-------------------------------------------
*/
#right-sidebar {
    height: fit-content;
}

.sidebar-wrapper {
	padding: 5px 25px;
	border-left: 1px solid #ced4da;
}

.sidebar-wrapper li {
	transition: all 0.6s;
}

.sidebar-wrapper li:hover {
	margin-left: 10px;
	transition: all 0.6s;
}

#search-2 .btn-primary {
	margin-left: 10px;
}

#search-2 #searchform .input-group input {
	padding: 10px 15px;
    margin-right: 0;
    margin-top: 0;
}

#searchform .input-group input:focus {
	box-shadow: 0 0 5px rgba(45, 166, 255, 1);
	border: 1px solid #2da6ff;
}

.assistive-text {
	display: none;
}

.widget {
	margin: 30px 0;
}

.widget-title {
	font-size: 1.2em;
	font-weight: 200;
}

.input-group input {
	border-radius: 50px !important;
}

.social-media-sidebar.widget {
	margin-bottom: 70px;
}

.social-media-sidebar a {
	float: left;
	padding: 8px 16px;
	margin-right: 5px;
	border-radius: 50px;
	background-color: #2da6ff;
}

.social-media-sidebar a:hover {
	background-color: rgba(39, 141, 215, .9);
    -webkit-transition:all .7s ease-in-out;
	-moz-transition:all .7s ease-in-out;
	-o-transition:all .7s ease-in-out;
	transition:all .7s ease-in-out
}

.social-media-sidebar a i {
	color: #fff;	
}

.social-media-sidebar a:nth-child(3) {
	padding: 8px 13px;
}

.social-media-sidebar a:last-of-type {
	padding: 8px 10px;
}

.sidebar-wrapper ul {
	list-style-type: none;
}

.sidebar-wrapper li:before {
	content: "\f105";
	font-family: Font Awesome\ 5 Pro;
	font-weight: 900;
	display: inline-block;
	margin-left: -0.6em;
    width: 0.8em;
	color: #2da6ff;
}

/**********************************************************************************************************************************************************************************************/








/*
	-------------------------------------------
		SEARCH
	-------------------------------------------
*/
#searchform .input-group input {
	margin-top: 15px;
	margin-right: 90px;
    padding: 15px;
}

body.search #searchform .input-group-btn input {
	width: 100%;
}
/**********************************************************************************************************************************************************************************************/








/*
	-------------------------------------------
		CONTACT
	-------------------------------------------
*/

#contact-form {
	margin-top: 45px;
}

#above-form-information {
	padding-right: 15px;
}

.gform_wrapper input, .gform_wrapper textarea {
	padding: 15px 20px !important;
    border: 1px solid #ced4da;
	margin-bottom: 5px;
	color: #75818c;
}

.gform_wrapper input[type=text]:focus, .gform_wrapper textarea:focus  {
	box-shadow: 0 0 5px rgba(45, 166, 255, 1);
	border: 1px solid #2da6ff;
}

.gform_wrapper input {
    border-radius: 50px;
}

.gform_wrapper textarea {
	border-radius: 20px;
	height: 250px !important;
}

.contact-box {
	padding: 35px 15px;
    border: 1px solid blue;
    background: rgba(45, 166, 255, 0.85);
    border-radius: 11px;
    margin: 25px 0;	
}

body.page-template-contact-page section.header {
	height: 0;
}

body.page-template-contact-page .top-section {
	height: 55vh;
}

#contact-page-wrapper .col-lg-10 {
	margin-top: -350px;
    background: #fff;
    border-radius: 25px;
	padding: 0;
	overflow: hidden;
	margin-bottom: 450px;
    box-shadow: 0 0 2px rgba(0,0,0,.10), 0 3px 8px rgba(0,0,0,.10);
}

.contact-block {
	padding: 45px 15px 30px 30px;
	height: 100%;
	border-right: 1px solid #ced4da;
}

.contact-block:before {
	content: '';
	top: 0;
	left: 0;
	position: absolute;
	width: 100%;
	height: 100%;
	background: #f6f7f9;
	z-index: 1;
}

.contact-block:after {
	content: '';
	top: 0;
	left: 0;
	position: absolute;
	width: 100%;
	height: 100%;
	background-image: url('../img/contact-bg.svg');
	background-repeat: no-repeat;
	background-size: cover;
	z-index: 2;
	opacity: 0.5;
}

.address {
	position: relative;
	z-index: 3;
}

.address .fas {
	float: left;
}

.address p {
	margin-left: 35px;
}

.contact-info {
	margin-top: 30px;
	position: relative;
	z-index: 3;
}

.contact-info a:first-child {
	border-top: 1px solid #ced4da;
}

.contact-info a {
	padding: 20px 0;
    display: block;
    border-bottom: 1px solid #ced4da;
}

.contact-form-container {
	padding: 30px 45px;
}

body img.gform_ajax_spinner {
	margin-top: 25px;
	width: 75px !important;
}

/**********************************************************************************************************************************************************************************************/








/*
	-------------------------------------------
		ABOUT
	-------------------------------------------
*/
.about-image-crm {
	background-image: url(../img/crm.svg);
}

body.page-template-about-page > .wrapper {
    padding: 70px 0 420px 0;
}

.about-intro {
    padding: 90px 0 350px 0;
}

.page-template-about-page section.intro:before {
    position: absolute;
    width: 100%;
    height: 110%;
    background-image: url('../img/business.svg');
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
    top: 0;
    content: '';
    opacity: .2;
    z-index: 2;
}

.about-intro, .keys, .mission-statement {
	position: relative;
    z-index: 7;
    background: #fff;
}

.mission-statement {
	padding: 0 0 250px 0;
}

.mission-statement:before {
    position: absolute;
    width: 100%;
    height: 110%;
    background: rgba(45, 166, 255, 0.75);
    top: -185px;
    content: '';
    -ms-transform: skewY(-7deg);
    -webkit-transform: skewY(-7deg);
    transform: skewY(-7deg);
    opacity: .9;
    z-index: 2;
}

.mission-statement:after {
    position: absolute;
    width: 100%;
    height: 135%;
    background: #2da6ff;
    top: -185px;
    content: '';
    -ms-transform: skewY(7deg);
    -webkit-transform: skewY(7deg);
    transform: skewY(7deg);
    opacity: .5;
    z-index: 1;
}

.keys h2, .mission-statement h2, .core-values h2, .awards h2 {
	text-align: center;
	font-weight: 900;
    font-size: 2.5rem;
    position: relative;
	padding-bottom: 60px;
	margin-bottom: 0;
}

.mission-statement h2, .mission-statement p {
	text-align: center;
	color: #fff;
}

.mission-statement h2:after {
	width: 100px;
    height: 7px;
    position: absolute;
    left: 50%;
    margin-left: -50px;
    background: #ffffff;
    display: block;
    content: '';
    bottom: 35px;
    border-radius: 50px;
}

.awards h2 {
	margin-top: 0;
	padding-bottom: 30px;
}

.awards h6 {
	text-align: center;
}

.core-values {
	position: relative;
    padding: 200px 0 420px 0;
}

.keys {
    padding: 0 0 420px 0;
}

section.keys:before {
    position: absolute;
    width: 100%;
    height: 110%;
    background: rgba(245, 250, 254, 0.8);
    top: -185px;
    content: '';
    -ms-transform: skewY(-7deg);
    -webkit-transform: skewY(-7deg);
    transform: skewY(-7deg);
    opacity: .9;
    z-index: 2;
}

section.keys:after {
    position: absolute;
    width: 100%;
    height: 110%;
    background: #d0ebff;
    top: -185px;
    content: '';
    -ms-transform: skewY(7deg);
    -webkit-transform: skewY(7deg);
    transform: skewY(7deg);
    opacity: .5;
    z-index: 1;
}

.values-row {
	margin-top: 120px;
}

.key-box, .values-box {
	background-color: #fff;
	border: solid 1px #2da6ff;
    box-shadow: 5px 5px rgba(45, 166, 255, 0.2);
    display: flex;
    flex-direction: column;
    padding: 100px 40px 20px;
    text-align: center;
}

.key-box {
	padding: 40px 50px 20px 250px;
	margin-bottom: 50px;
	text-align: left;
	position: relative;
	z-index: 2;
	border-top-left-radius: 25px;
    border-bottom-left-radius: 25px;
}

.key-box:before {
    width: 100%;
    height: 250px;
	position: absolute;
    content: '';
    z-index: 0;
	top: -15px;
	left: -42px;
	background-image: url('../img/back-arrow.svg');
	background-repeat: no-repeat;
	background-position: left;
	background-size: contain;
}

.key-box:after {
    width: 100%;
    height: 250px;
	position: absolute;
    content: '';
    z-index: 3;
	top: -15px;
	left: -15px;
	background-image: url('../img/front-arrow.svg');
	background-repeat: no-repeat;
	background-position: left;
	background-size: contain;
}

.success-icon, .values-icon {
	width: 150px;
    height: 150px;
    position: absolute;
    left: 0;
    right: 0;
    top: -75px;
    margin: auto;
	text-align: center;
	border: solid 1px #2da6ff;
	background-color: #fff;
	border-radius: 50%;
}

.values-icon {
	background-repeat: no-repeat;
	background-position: center;
	background-size: 65%;
	animation-play-state: paused;
	animation-iteration-count: infinite;
	animation-timing-function:  ease-in;
	-webkit-animation-duration: 0.75s;
	animation-duration: 0.75s;
	-webkit-animation-name: bounceInFull;
	animation-name: bounceInFull;
}

.success-icon {
	font-size: 4rem;
    font-weight: 100;
    color: #2da6ff;
	top: 35px;
	left: -75px;
	right: auto;
	display: flex;
    justify-content: center;
    flex-direction: column;
}

@-webkit-keyframes bounceInFull {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes bounceInFull {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.success-icon:hover {
	animation-play-state: running;
	cursor: pointer;
}


/**********************************************************************************************************************************************************************************************/









/*
	-------------------------------------------
		FOOTER
	-------------------------------------------
*/
.hidden-visible > a {
	visibility: hidden;
}

.footer {
    position: relative;
    padding: 440px 0 0 0;
    z-index: 7;
    overflow: hidden;
    margin-top: -340px
}

.footer:before {
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(45, 166, 255, 0.85);
    top: 240px;
    content: '';
    -ms-transform: skewY(-10deg);
    -webkit-transform: skewY(-10deg);
    transform: skewY(-10deg);
    opacity: 1;
    z-index: 2
}

.footer:after {
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(45, 166, 255, 1);
    top: 240px;
    content: '';
    -ms-transform: skewY(10deg);
    -webkit-transform: skewY(10deg);
    transform: skewY(10deg);
    opacity: 1;
    z-index: 1
}

.footer-bg {
    background: rgba(45, 166, 255, 0);
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0
}

.footer .footer-logo {
    background-image: url(../img/processflow_logo_white.svg);
    background-size: contain;
    background-repeat: no-repeat;
	width: 200px;
    height: 100px;
    display: block
}

.footer .crm {
	width: 250px;
    height: 50px;
	margin-bottom: 20px;
	background-image: url('../img/suitecrm-partner.png');
	background-repeat: no-repeat;
    background-size: contain;
	display: block
}

.footer .section-content {
    margin-top: -115px
}

.footer .menu {
    padding: 0;
    margin: 0
}

.footer .menu li {
    list-style: none;
    padding-bottom: 10px
}

.footer .menu li a {
    color: #a7daff;
    font-weight: 600;
    font-size: 21px
}

.footer .menu .sub-menu {
    margin: 20px 0 0 0;
    padding: 0
}

.footer .menu .sub-menu li a {
    color: #fff;
    font-weight: 200;
    font-size: 16px;
}

.footer .menu .sub-menu li a:hover {
	text-decoration: underline;
	-webkit-transition:all .7s ease-in-out;
	-moz-transition:all .7s ease-in-out;
	-o-transition:all .7s ease-in-out;
	transition:all .7s ease-in-out
}

.footer #menu-terms-footer.menu {
    float: right
}

.footer #menu-terms-footer.menu li {
    list-style: none;
    padding-bottom: 10px;
    float: left;
    margin-left: 20px
}

.footer #menu-terms-footer.menu li a,
.footer p {
    color: #fff;
    font-weight: 200;
    font-size: 16px
}

.bottom-footer {
    margin-top: 40px
}

#tawkchat-minified-container.theme-background-color {
	background-color: rgba(45, 166, 255, 0.75) !important;
}
/**********************************************************************************************************************************************************************************************/







/*
	-------------------------------------------
		FORMS
	-------------------------------------------
*/

.gform_wrapper li.gfield.gfield_error, .gform_wrapper li.gfield.gfield_error.gfield_contains_required.gfield_creditcard_warning {
	background-color: transparent !important;
	margin-bottom: 0 !important;
	border: none !important;
	padding-bottom: 0 !important;
    padding-top: 0 !important;
    box-sizing: border-box;
}

.gform_wrapper li.gfield_error input:not([type=radio]):not([type=checkbox]):not([type=submit]):not([type=button]):not([type=image]):not([type=file]), 
.gform_wrapper li.gfield_error textarea {
    border: 1px solid #e74c3c !important;
}

.gform_wrapper .gfield_error .gfield_label, .gform_wrapper .validation_message {
	color: #c0392b !important;
}

.gform_wrapper div.validation_error {
	border: none !important;
	margin: 30px 0 !important;
    padding: 25px 0 !important;
	border-radius: 15px;
    background: #e74c3c;
	color: #fff !important;
}

.gform_wrapper .gfield select {
	height: calc(3rem + 4px);
    background: transparent;
    border: 1px solid #ced4da;
}

.gform_wrapper .gform_footer input[type=submit] {

}

.gform_wrapper .gform_footer input[type=submit]:hover {
	
}


/**********************************************************************************************************************************************************************************************/








/*
	-------------------------------------------
		IMAGES
	-------------------------------------------
*/
.image-block {
	width: 100%;
	height: 100%;
	border: solid 1px #2da6ff;
    box-shadow: 5px 5px rgba(45, 166, 255, 0.2);
	background-image: url('http://via.placeholder.com/550x550');
	background-color: #fafafa;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}


.image-block-none {
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}





/*
	-------------------------------------------
		SUITE-CRM
	-------------------------------------------
*/

.intro {
	position: relative;
    z-index: 7;
    background: #fff;
    padding: 130px 0 400px 0;
}

section.intro:before {
    position: absolute;
    width: 100%;
    height: 110%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
    top: 0;
    content: '';
    opacity: .1;
    z-index: 2;
}

.padd-block {
	padding: 150px 100px;
}

.intro h3 {
	margin-bottom: 30px;
}

.awards {
	position: relative;
    z-index: 7;
    background: #fff;
    padding: 0 0 250px 0;
}

section.awards:before {
    position: absolute;
    width: 100%;
    height: 110%;
    background-color: #d0ebff;
	background-image: url('../img/awards-suitecrm.png');
	background-size: cover;
	background-position: top;
    top: -185px;
    content: '';
    -ms-transform: skewY(-7deg);
    -webkit-transform: skewY(-7deg);
    transform: skewY(-7deg);
    opacity: .9;
    z-index: 2;
}

section.awards:after {
    position: absolute;
    width: 100%;
    height: 135%;
    background: rgba(245, 250, 254, 0.8);
    top: -185px;
    content: '';
    -ms-transform: skewY(7deg);
    -webkit-transform: skewY(7deg);
    transform: skewY(7deg);
    opacity: 1;
    z-index: 1;
}

.awards h2 {
	text-align: center;
}

.awards h2 span {
	display: block;
}

.what-who-why {
	position: relative;
	padding: 100px 0 300px;
} 

.what-who-why .col-lg-10 .row {
	margin: 50px -15px;
}

/**********************************************************************************************************************************************************************************************/


	
	
	

/*
	-------------------------------------------
		ERROR 404
	-------------------------------------------
*/

body.error404 .page-wrapper {
	width: 100%;
	height: 100vh;
	background-image: url('https://media.giphy.com/media/5YgoFLQ4cfiqAJLauQ/giphy.gif');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

body.error404:before {
	content: '';
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 2;
	background: rgba(50,50,50,0.4);
}

body.error404 #primary {
	position: relative;
	z-index: 3;
}

.error-404 {
	height: 40vh;
	margin-top: 20%;
}

.error-404 #searchsubmit {
	margin-right: 15px !important;
	padding: 15px 75px !important;
}

#error-404-wrapper h1, #error-404-wrapper p {
	color: #fff;
}
	
/**********************************************************************************************************************************************************************************************/





/*
	-------------------------------------------
		SERVICES PAGE
	-------------------------------------------
*/
.services-wrapper > .container-fluid {
	padding: 90px 15px 175px;
}

.services-wrapper h1.section-titles:after {
	margin-left: -50px;
	left: 50%;
	bottom: 35px;
}

.service-details {
	position: relative;
    z-index: 7;
    background: #fff;
    padding: 0 0 200px 0;
}

section.service-details:before {
    position: absolute;
    width: 100%;
    height: 110%;
    background-color: rgba(245, 250, 254, 0.8);
	background-image: url(../img/flash-right.svg);
	background-repeat: no-repeat;
    background-size: cover;
    top: -50px;
    content: '';
    -ms-transform: skewY(-7deg);
    -webkit-transform: skewY(-7deg);
    transform: skewY(-7deg);
    opacity: .9;
    z-index: 2;
}

section.service-details:after {
    position: absolute;
    width: 100%;
    height: 120%;
    background: #d0ebff;
    top: -50px;
    content: '';
    -ms-transform: skewY(7deg);
    -webkit-transform: skewY(7deg);
    transform: skewY(7deg);
    opacity: 1;
    z-index: 1;
}

.aditional-block {
    position: relative;
    z-index: 7;
    background: #fff;
    padding: 0 0 300px 0;
}

section.aditional-block:after {
    position: absolute;
    width: 100%;
    height: 120%;
    background-color: #d0ebff;
	background-image: url(../img/home_flash.svg);
	background-repeat: no-repeat;
    background-size: cover;
    top: -90px;
    content: '';
    -ms-transform: skewY(-7deg);
    -webkit-transform: skewY(-7deg);
    transform: skewY(-7deg);
    opacity: 1;
    z-index: 1;
}

.case-studies-carousel .owl-item {
    display: flex;
    flex-direction: column;
    padding: 40px;
}


.case-studies-carousel .owl-stage-outer {
    width: calc(100% + 5px);
    padding: 2px!important
}

.case-studies-carousel .owl-stage {
    display: flex;
    padding-bottom: 5px;
    padding-right: 5px
}

.case-studies-carousel .owl-item .item {
    position: relative;
}

.case-studies-carousel .owl-nav {
	display: none;
}

.case-studies-carousel .owl-dots {
	margin-top: 40px;
}

.case-studies-carousel.owl-theme .owl-dots .owl-dot span {
	width: 20px;
	height: 20px;
}

.case-studies-carousel.owl-theme .owl-dots .owl-dot.active span {
	background: #2da6ff;
}

.case-studies-carousel.owl-theme .owl-dots .owl-dot span {
	background: rgba(45, 166, 255, 0.2)
}

.case-box {
	padding: 0 20px;
	margin-bottom: 20px;
}

.case-box:after {
    width: 100%;
    height: 4px;
	margin-top: 35px;
    background: #2196ff;
    background: linear-gradient(-45deg, #2295ff, #0259f5);
    background-size: 400% 400%;
    -webkit-animation: Gradient 2s ease infinite;
    -moz-animation: Gradient 2s ease infinite;
    animation: Gradient 2s ease infinite;
    display: block;
    content: '';
    border-radius: 50px;
}

.case-studies-carousel .col-lg-4:nth-child(1) {
	animation-delay: 0.2s;
}

.case-studies-carousel .col-lg-4:nth-child(2) {
	animation-delay: 0.4s;
}

.case-studies-carousel .col-lg-4:nth-child(3) {
	animation-delay: 0.6s;
}

.case-studies-carousel .col-lg-4:nth-child(4) {
	animation-delay: 0.8s;
}

.case-studies-carousel .col-lg-4:nth-child(5) {
	animation-delay: 1s;
}

.case-studies-carousel .col-lg-4:nth-child(6) {
	animation-delay: 1.2s;
}

/**********************************************************************************************************************************************************************************************/








/*
	-------------------------------------------
		ALL PRODUCTS
	-------------------------------------------
*/

.post-type-archive-plugins .page-wrapper h1.section-titles {
    text-align: center;
}

.post-type-archive-plugins h1.section-titles:after {
	margin-left: -50px;
    left: 50%;
}

.products-box {
	margin: 20px 0;
}

.products-box h5 {
	margin-bottom: 20px;
}

.products-box p {
	margin-bottom: 40px;
}

.all-products .col-lg-4:nth-child(1) {
	animation-delay: 0.2s;
}

.all-products .col-lg-4:nth-child(2) {
	animation-delay: 0.4s;
}

.all-products .col-lg-4:nth-child(3) {
	animation-delay: 0.6s;
}

.all-products .col-lg-4:nth-child(4) {
	animation-delay: 0.8s;
}

.all-products .col-lg-4:nth-child(5) {
	animation-delay: 1s;
}

.all-products .col-lg-4:nth-child(6) {
	animation-delay: 1.8s;
}

.image-products {
	height: 250px;
    margin-bottom: 30px;
}

/**********************************************************************************************************************************************************************************************/










/*
	-------------------------------------------
		PRODUCTS PAGE
	-------------------------------------------
*/
.products-wrapper > .container-fluid {
	padding: 90px 15px 320px;
}

.products-wrapper h1.section-titles:after {
	margin-left: -50px;
	left: 50%;
}

.product-details {
	position: relative;
    z-index: 7;
    background: #fff;
    padding: 0 0 350px 0;
}

section.product-details:before {
    position: absolute;
    width: 100%;
    height: 110%;
	background-image: url(../img/home_flash.svg);
	background-repeat: no-repeat;
    background-size: cover;
    background-color: rgba(45, 166, 255, 0.3);
    top: -185px;
    content: '';
    -ms-transform: skewY(-7deg);
    -webkit-transform: skewY(-7deg);
    transform: skewY(-7deg);
    opacity: .9;
    z-index: 2;
}

section.product-details:after {
    position: absolute;
    width: 100%;
    height: 135%;
    background: #d0ebff;
    top: -185px;
    content: '';
    -ms-transform: skewY(7deg);
    -webkit-transform: skewY(7deg);
    transform: skewY(7deg);
    opacity: 1;
    z-index: 1;
}

.features-block {
	position: relative;
    z-index: 7;
    background: #fff;
    padding: 0 0 450px 0;
}

section.features-block:after {
    position: absolute;
    width: 100%;
    height: 135%;
    background: #fff;
    top: -185px;
    content: '';
    -ms-transform: skewY(-7deg);
    -webkit-transform: skewY(-7deg);
    transform: skewY(-7deg);
    opacity: 1;
    z-index: 1;
}

.features-block .col-lg-4:nth-child(0){
	animation-delay: 0.2s
}

.features-block .col-lg-4:nth-child(1){
	animation-delay: 0.4s
}

.features-block .col-lg-4:nth-child(2){
	animation-delay: 0.6s
}

.features-block .col-lg-4:nth-child(3){
	animation-delay: 0.8s
}

.features-block .col-lg-4:nth-child(4){
	animation-delay: 1s
}

.features-block .col-lg-4:nth-child(5){
	animation-delay: 1.2s
}

.cta-two-block {
	position: relative;
    z-index: 7;
    background: #fff;
    padding: 0 0 400px 0;
}

section.cta-two-block:before {
    position: absolute;
    width: 100%;
    height: 135%;
	background: rgba(245, 250, 254, 0.8);
    top: -185px;
    content: '';
    -ms-transform: skewY(-7deg);
    -webkit-transform: skewY(-7deg);
    transform: skewY(-7deg);
    opacity: 1;
    z-index: 1;
}

section.cta-two-block:after {
    position: absolute;
    width: 100%;
    height: 110%;
    background-color: #d0ebff;
	background-image: url('../img/cta-two.png');
	background-position: center;
    background-size: cover;
    top: -185px;
    content: '';
    -ms-transform: skewY(7deg);
    -webkit-transform: skewY(7deg);
    transform: skewY(7deg);
    opacity: .9;
    z-index: 2;
}

@keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(0.6, 0.6, 0.6);
    transform: scale3d(0.6, 0.6, 0.6);
  }

  50% {
    opacity: 1;
  }
}

.zoomIn {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}

.addons-products-block {
	position: relative;
    z-index: 7;
    background: #fff;
    padding: 0 0 0 0;
}

section.addons-products-block:after {
    position: absolute;
    width: 100%;
    height: 135%;
    background: #fff;
    top: -185px;
    content: '';
    -ms-transform: skewY(-7deg);
    -webkit-transform: skewY(-7deg);
    transform: skewY(-7deg);
    opacity: 1;
    z-index: 1;
}

.cta-three-block {
	position: relative;
    z-index: 7;
    background: #fff;
    padding: 0 0 300px 0;
}

.feature-box {
	text-align: center;
	margin: 20px 0;
	padding: 40px 30px;
}

.feature-box:after {
    width: 100%;
    height: 4px;
    background: #2196ff;
    background: linear-gradient(-45deg, #2295ff, #0259f5);
    background-size: 400% 400%;
    -webkit-animation: Gradient 2s ease infinite;
    -moz-animation: Gradient 2s ease infinite;
    animation: Gradient 2s ease infinite;
    display: block;
    content: '';
    border-radius: 50px;
}

.products-carousel .owl-item {
    border: solid 1px #2da6ff;
    box-shadow: 5px 5px rgba(45, 166, 255, 0.2);
    display: flex;
    flex-direction: column;
    padding: 40px;
    text-align: center;
    margin-left: 5px!important
}

.products-carousel .owl-item p {
    font-size: 1.3rem
}

.products-carousel .owl-stage-outer {
    width: calc(100% + 5px);
    padding: 2px!important
}

.products-carousel .owl-stage {
    display: flex;
    padding-bottom: 5px;
    padding-right: 5px
}


.diamond {
	height: 500px;
	display: flex;
    align-items: center;
    justify-content: center;
}

.diamond h2 {
	margin-bottom :40px;
}

section.cta-three-block:before {
    position: absolute;
    width: 100%;
    height: 100%;
    content: '';
    opacity: 1;
    z-index: 1;
	background: url(../img/products-cta.svg);
    background-size: auto;
    background-repeat: no-repeat;
}

.products-carousel .owl-nav {
	display: none;
}

.products-carousel .owl-dots {
	margin-top: 40px;
}

.products-carousel.owl-theme .owl-dots .owl-dot span {
	width: 20px;
	height: 20px;
}

.products-carousel.owl-theme .owl-dots .owl-dot.active span {
	background: #2da6ff;
}

.products-carousel.owl-theme .owl-dots .owl-dot span {
	background: rgba(45, 166, 255, 0.2)
}

.featured {
	position: relative;
	z-index: 7;
	padding: 0 0 250px 0;
}

.featured:before {
    position: absolute;
    width: 100%;
    height: 110%;
    background-color: #c1dff6;
	background-image: url(../img/home_flash.svg);
    background-size: cover;
    background-position: top;
    top: -185px;
    content: '';
    -ms-transform: skewY(-7deg);
    -webkit-transform: skewY(-7deg);
    transform: skewY(-7deg);
    opacity: .9;
    z-index: 2;
}

.featured:after {
    position: absolute;
    width: 100%;
    height: 135%;
    background: rgba(245, 250, 254, 0.8);
    top: -185px;
    content: '';
    -ms-transform: skewY(7deg);
    -webkit-transform: skewY(7deg);
    transform: skewY(7deg);
    opacity: 1;
    z-index: 1;
}

.featured-product h2 {
	text-align: left;
	margin-bottom: 0;
}

.featured-product h2.section-titles:after {
	left: 0;
	margin-left: 0;
}

.featured-product p {
	font-size: 1.5rem;
	margin-bottom: 40px;
}

.all-products {
	position: relative;
    padding: 200px 0 500px;
}


/**********************************************************************************************************************************************************************************************/









/*
	-------------------------------------------
		RESPONSIVE
	-------------------------------------------
*/


@media (max-width: 2200px) {
	.values-box h3 span {
		display: block;
	}
}

@media (max-width: 2000px) {

	.plugin-carousel .item ul li.price p sub {
		font-size: 1.25rem
	}

	.plugin-carousel .item ul li.price p sub.dollar {
		top: -8px;
	}

	.plugin-carousel .item ul li a {
		margin-top: 5px;
		padding: 10px 35px;
	}

}

@media (max-width: 1720px) {

	.plugin-carousel .item ul li {
    width: 100%
	}

	.plugin-carousel .item ul li a {
		width: 100%
	}
	
	.cta-three-block {
		padding: 0 0 150px 0;
	}

}

@media (max-width: 1500px) {
	
	.top-section h2 {
		font-size: 3rem;
		margin-bottom: 25px;
	}

	.poc h2 {
		font-size: 2.5rem;
	}

	.top-section p {
		font-size: 1.5rem;
	}

	.top-section a {
		font-size: 1.5rem;
		padding: 16px 35px;
	}

	.who-we-are:before {
		top: -95px;
	}

	.who-we-are p,
	h2.section-titles {
		font-size: 2rem;
	}

	h2.section-titles:after {
		height: 5px;
		bottom: 40px;
	}

	.top_poc_section p {
		font-size: 1.5rem;
	}

	.poc:before {
		top: -45px;
	}

	.poc:after {
		top: -25px;
	}
	
	.notifcation { 
		padding: 90px 0 200px 0
	}

	.services:before {
		top: -35px;
	}

	.services:after {
		top: -25px;
	}

	.crm-comparison {
		padding-bottom: 120px;
	}

	.crm-comparison:before {
		height: 110%;
	}

	.who-we-are {
		padding-bottom: 140px
	}

	.services {
		padding-bottom: 200px
	}

	.plugins:before {
		top: -35px;
	}

	.plugins:after {
		top: -45px;
	}

	.why-crm:before {
		top: -65px;
	}

	.plugins {
		padding-bottom: 300px
	}

	.crm-comparison:after {
		top: -65px;
	}

	.crm-comparison:before {
		top: -75px;
	}

	.why-crm {
		padding-bottom: 200px
	}

	.testimonials:before {
		top: -126px;
	}

	.poc {
		padding-bottom: 300px
	}

	.why-row {
		padding: 30px 0;
	}
	
	.padd-block {
		padding: 0 30px;
	}
	
	.cta-three-block {
		padding: 0 0 150px 0;
	}
	
	.lead p {
		font-size: 1.6rem;
	}

}


@media (max-height: 850px) {
	#contact-page-wrapper .col-lg-10 {
		margin-top: -150px;
	}
}


@media (max-width: 1360px) {

	.h1,
	.h2,
	.h3,
	.h4,
	.h5,
	.h6,
	h1,
	h2,
	h3,
	h4,
	h5,
	h6 {
		margin-bottom: .25rem
	}

	.h2,
	h2 {
		font-size: 1.5rem;
	}
	
	p {
		font-size: 1.1rem;
	}

	.service-box a {
		margin-top: 10px
	}

	.service-box .icon {
		width: 65px;
		height: 65px;
		line-height: 90px
	}

	.service-box .icon span {
		width: 35px;
		height: 35px;
	}
	
	.plugin-carousel .icon {
		width: 100px;
		height: 100px;
		line-height: 145px;
	}

	.plugin-carousel .icon span {
		width: 60px;
		height: 60px;
	}

	.compare-heading {
		font-size: 15px;
	}
	
	.btn-primary, .btn-secondary {
		padding: 1rem 2rem;
		font-size: 1.2rem;
	}
	
}


@media (min-width: 991px) {
	#contact-page-wrapper .col-md-4, #contact-page-wrapper .col-md-8 {
		min-height: 600px;
	}
}


@media (max-width: 1200px) {
	p, li, .btn-primary, .btn-secondary, .testimonials-carousel .owl-item p {
		font-size: 1rem;
	}

	.top-section h2 {
		font-size: 2.5rem;
	}

	.top-section p {
		font-size: 1.5rem;
	}

	.top-section a {
		font-size: 1rem;
		padding: 12px 25px;
	}

	.who-we-are p,
	h2.section-titles {
		font-size: 1.75rem
	}
	
	#main-menu {
		margin-top: 30px;
	}
	
	.navbar-brand {
		width: 230px;
		height: 50px;
		margin-top: 15px;
		margin-bottom: 15px;
	}
	
	.top-section a span {
		font-size: 1.5rem;
	}
	
	.navbar .navbar-nav > li {
		font-size: 1rem;
	}
	
	.navbar-expand-lg .navbar-nav .nav-link {
		padding-right: 1rem;
		padding-left: 1rem;
	}
	
	.who-we-are {
		padding-top: 0;
	}
	
	.services {
		padding-bottom: 300px;
	}
	
	.why-crm {
		padding-bottom: 200px;
	}
	
	.plugins {
		padding-top: 0;
	}
	
	.plugin-carousel-container {
		margin-top: 50px;
		overflow: hidden;
	}
	
	.plugin-carousel .icon {
		margin: -75px auto 0;
	}
	
	.plugin-carousel .top-plugin {
		padding-bottom: 100px;
	}
	
	.plugin-carousel .icon {
    	width: 150px;
    	height: 150px;
	}
	
	.plugin-carousel .item ul li.price p {
		text-align: center;
	}
	
	.poc h2 {
		margin-top: 0;
    	font-size: 2rem;
	}
	
	.poc {
		padding-bottom: 400px;
	}
	
	section.cta-three-block:before {
		top: 33%;
	}
	
	.plugin-carousel .icon span {
		margin-top: 40px;
	}
}


@media (max-width: 1100px) { 
	
	.service-box h2 { 
		font-size: 1.25rem;
	}
	
}

@media (max-width: 992px) {
	
	h1 {
		font-size: 2rem;
	}
	
	h2 {
		margin-top: 30px;
	}
	
	h4 {
		font-size: 1.2rem;
	}
	
	.container-fluid {
		padding-left: 40px;
		padding-right: 40px;
	}
	
	.footer .container-fluid {
		padding-left: 15px;
		padding-right: 15px;
	}
	
	.navbar-toggler {
		margin-top: 25px;
	}
	
	#navbarNavDropdown {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 1;
		height: 100%;
		background: rgba(45, 166, 255, 0.95);
		padding: 20px;
		width: 50%;
		padding-top: 50px
	}

	#navbarNavDropdown #main-menu:before {
		background-image: url(../img/processflow_logo_white.svg);
		background-size: contain;
		background-repeat: no-repeat;
		width: 200px;
    	height: 45px;
		content: '';
		display: block;
		margin-bottom: 20px;
	}

	#navbarNavDropdown .dropdown-menu {
		width: 100%;
		margin-left: 20px;
		background: transparent;
		box-shadow: none;
		border: 0;
	}
	
	.navbar .navbar-nav .dropdown-menu a, .navbar.full .navbar-nav .dropdown-menu a, .navbar .navbar-nav ul.dropdown-menu li:hover a:hover, #main-menu .dropdown-menu .current-menu-item a {
		color: #fff !important;
	}
	
	#main-menu .dropdown-menu .current-menu-item a {
		font-weight: bold;
	}
	
	.navbar .navbar-nav ul.dropdown-menu.show li {
		border: 0;
		padding: 3px 0;
	}
	
	.navbar .navbar-nav ul.dropdown-menu.show li:hover {
		border: 3px transparent;
	}
	
	.navbar .navbar-nav ul.dropdown-menu li:hover {
		background: transparent;
	}
	
	.arrow {
		display: none;
	}
	
	.navbar.faded .navbar-nav > li:hover, .navbar.faded .navbar-nav > li:focus {
		border: 3px solid transparent;
	}
	
	.navbar .navbar-nav .dropdown-menu a:hover { 
		color: #fff !important;	
	}
	
	.navbar.full #main-menu > .current-menu-item, .navbar.full #main-menu > .current_page_ancestor, .navbar.full #main-menu > .current-menu-item, .navbar.full #main-menu > .current_page_parent {
		border: 3px solid #fff;
	}

	#main-menu > .current-menu-item, #main-menu > .current_page_ancestor {
		width: fit-content;
    	padding: 0 15px;
	}

	.navbar-expand-lg .navbar-nav .nav-link {
		padding-left: 0
	}

	.full .navbar-toggler .icon-bar {
		background-color: #2da6ff;
		transition: all 0.3s;
	}

	.navbar.full .navbar-nav a, .navbar.full .navbar-nav li:hover > a, .navbar.full .navbar-nav > li > .dropdown-menu a, .product-menu > ul.dropdown-menu > li.col-product:hover a  {
		color: #fff!important
	}
	
	.navbar .navbar-nav > li > ul.dropdown-menu li a {
		padding: 0;
	}
	
	.navbar .navbar-nav > li.product-menu > ul.dropdown-menu > li.col-product {
		float: none;
	}
	
	.product-menu > ul.dropdown-menu > li.col-product > ul.dropdown-menu > li {
		border-top: none;
	}

	h2.section-titles {
		padding-bottom: 30px;
	}
	
	h2.section-titles:after {
		height: 7px;
		bottom: 5px;
	}
	
	.why-row h2 {
		font-size: 1.5rem
	}
	
	.products-carousel-container {
		margin-top: 50px;
	}

	.why-row p,
	.testimonials-carousel .owl-item p, .products-carousel .owl-item p {
		font-size: 1rem
	}

	.testimonials-carousel .owl-item .item:before {
		width: 40px;
		height: 40px
	}

	.testimonials-carousel .owl-item .item {
		padding-top: 50px;
	}

	.testimonials-carousel .owl-item {
		padding: 20px
	}

	.testimonials-carousel .owl-item .item .testimonial_author p.author {
		font-size: 1rem
	}

	.poc h2 {
		font-size: 1.75rem;
	}

	.poc p {
		font-size: 1rem
	}

	.top_poc_section p {
		font-size: 1rem;
	}

	.poc a.get-demo {
		padding: 15px 30px;
		font-size: 17px;
	}

	.poc .gform_wrapper input,
	.poc .gform_wrapper textarea {
		height: 45px;
		font-size: 16px!important;
		padding-left: 10px!important;
	}

	.testimonials h2 {
		margin-bottom: 50px
	}
	
	.top-section h2 {
		font-size: 2rem;
		margin-bottom: 10px;
	}

	.top-section p {
		font-size: 1.25rem;
	}

	.who-we-are p {
		font-size: 1.25rem
	}

	.poc .gform_wrapper input[type=submit] {
		padding: 10px 20px!important;
	}
	
	
	
	.about-intro {
		padding: 50px 0 350px 0;
	}
	
	.image-about-crm {
		height: 500px;
	}
	
	section.about-intro:before {
		display: none;
	}
	
	.core-values {
		padding: 100px 0 300px 0;
	}
	
	.values-row {
		margin-top: 0;
	}
	
	.values-row .col-lg-4:nth-child(1) {
		animation-delay: 0.2s;
	}
	
	.values-row .col-lg-4:nth-child(2) {
		animation-delay: 0.4s;
	}
	
	.values-row .col-lg-4:nth-child(3) {
		animation-delay: 0.6s;
	}
	
	.values-row .col-lg-3:nth-child(1) {
		animation-delay: 0.8s;
	}
	
	.values-row .col-lg-3:nth-child(2) {
		animation-delay: 1s;
	}
	
	.values-row .col-lg-3:nth-child(3) {
		animation-delay: 1.2s;
	}
	
	.values-row .col-lg-3:nth-child(4) {
		animation-delay: 1.4s;
	}
	
	.values-row .col-lg-3:nth-child(5) {
		animation-delay: 1.6s;
	}
	
	.values-row .col-lg-3:nth-child(6) {
		animation-delay: 1.8s;
	}
	
	.values-row .col-lg-3:nth-child(7) {
		animation-delay: 2s;
	}
	
	.values-row .col-lg-3:nth-child(8) {
		animation-delay: 2.2s;
	}
	
	.container-fluid > .row:nth-child(2) {
		margin-top: 60px;
	}
	
	.values-box {
		margin: 65px 0;
	}
	
	.values-icon {
		top: -10px;
	}
	
	.keys {
    	padding: 0 0 150px 0;
	}
	
	.key-row {
		margin-top: 75px;
	}
	
	.key-row .col-md-12:nth-child(1) {
		animation-delay: 0.2s;
	}
	
	.key-row .col-md-12:nth-child(2) {
		animation-delay: 0.4s;
	}
	
	.key-row .col-md-12:nth-child(3) {
		animation-delay: 0.6s;
	}
	
	.key-row .col-md-12:nth-child(4) {
		animation-delay: 0.8s;
	}
	
	.key-row .col-md-12:nth-child(5) {
		animation-delay: 1s;
	}
	
	.key-row .col-md-12:nth-child(6) {
		animation-delay: 1.2s;
	}
	
	.key-box {
		text-align: center;
		padding: 200px 40px 20px;
		border-top-left-radius: 0;
    	border-bottom-left-radius: 0;
		margin-bottom: 130px;
	}
	
	.key-box:before, .key-box:after {
		left: 0;
		background-position: center;
	}
	
	.key-box:before {
		background-image: url(../img/back-top-arrow.svg);
		height: 131.5px;
		top: -40px;
	}

	.key-box:after {
		background-image: url(../img/front-top-arrow.svg);
		height: 190px;
	}
	
	.success-icon {
   	 	top: -75px;
    	left: 0;
    	right: 0;
	}
	
	.image-block {
		margin-top: 50px;
	}
	
	
	

	
	.page-template-suite-crm-page .image-block {
		height: 350px;
	}
	
	section.intro:before {
		display: none;
	}
	
	.awards h2 span {
		display: inline-block;
	}
	
	.padd-block {
		padding: 25px 15px;
	}
	
	.intro {
		text-align: center;
		padding: 90px 0 300px 0;
	}
	
	.page-wrapper h1.section-titles {
		text-align: center;
	}
	
	h1.section-titles:after {
		left: 50%;
 		margin-left: -50px;
	}
	
	.what-who-why {
		padding: 50px 0 400px;
		text-align: center;
	}
	
	.image-block-none {
		height: 400px
	}
	
	.page-wrapper > .container-fluid {
		padding: 70px 40px 500px;
	}
	
	.plugin-carousel .item ul li.price p {
		text-align: center
	}
	
	.plugin-carousel .item ul li.price p sub.dollar {
		top: -20px;
	}
	
	.plugin-carousel .item ul li.price p sub {
		font-size: 2rem;
	}
	
	.plugin-carousel .item ul li.price p {
		font-size: 3rem;
	}
	
	.testimonials {
		padding-bottom: 450px;
	}
	
	.btn-primary, .btn-secondary {
		padding: 1rem 2rem;
	}
	
	#contact-page-wrapper .col-lg-10 {
		margin-bottom: 550px;
	}
	
	.keys h2, .mission-statement h2, .core-values h2, .awards h2 {
		font-size: 2rem;
	}
	
	.lead p {
		font-size: 1.5rem
	}
	
	.services-wrapper > .container-fluid, .products-wrapper > .container-fluid {
		padding: 90px 40px 175px;
	}
	
	.service-details .section-content, .aditional-block .section-content, .cta-two-block .section-content, .product-details .section-content {
		text-align: center;
	}
	
	.service-details li, .aditional-block li {
		list-style-type: none;
		line-height: 2rem;
	}
	
	.services-wrapper .lead .btn-primary, .products-wrapper .lead .btn-primary {
		padding: 1.2rem 4rem;
    	font-size: 1.5rem;
	}
	
	.aditional-block, .service-details {
		padding: 0 0 200px 0;
	}
	
	.cta-two-block h3 {
		margin-bottom: 40px;
	}
	
	.cta-two-block {
		padding: 0 0 300px 0;
	}
	
	.cta-three-block {
    	padding: 0 0 320px 0;
	}
	
	section.cta-three-block:before {
		top: 20%;
	}
	
	.product-details .btn {
		display: none;
	}
	
	#main-menu > .current-menu-item, #main-menu > .current_page_ancestor, #main-menu > .current-menu-item, #main-menu > .current_page_parent, .navbar.full #main-menu > .current-menu-item, .navbar.full #main-menu > .current_page_ancestor, .navbar.full #main-menu > .current-menu-item, .navbar.full #main-menu > .current_page_parent, #main-menu > .current-menu-ancestor, .navbar.full #main-menu > .current-menu-ancestor {
		border: 3px solid transparent;
		font-weight: bold;
		padding: 0;
	}
	
	#contact-page-wrapper .col-lg-10 {
    	margin-top: -250px;
	}
	
	.featured-product {
		text-align: center;
	}
	
	.featured-product h2 {
		text-align: center;
	}

	.featured-product h2.section-titles:after {
		left: 50%;
		margin-left: -50px;
	}
	
	.featured-product h3 {
		margin-top: 30px;
	}

	.featured-product p {
		font-size: inherit;
		margin-bottom: 40px;
	}
	
	.products-box .image-block-none, .featured .image-block-none {
		height: 300px;
	}
	
	.aditional-block ul, .service-details ul {
		padding-left: 0;
	}

}

@media (min-width: 992px) {
	.who-we-are p {
		margin-bottom: 25px;
	}
}


@media (max-width: 860px) {
	
	.plugin-carousel .owl-nav button.owl-prev,
	.plugin-carousel .owl-nav button.owl-next {
		font-size: 2.5rem!important
	}

	.plugin-carousel .owl-nav button.owl-prev {
		left: -60px
	}

	.plugin-carousel .owl-nav button.owl-next {
		right: -60px
	}

}


@media (max-width: 768px) { 
	
	.who-we-are {
    	padding: 0 0 150px 0;
	}
	
	.navbar-toggler {
		margin-top: -5px;
	}

	.service-box {
		text-align: center;
		padding: 0 20px;
		margin-bottom: 40px;
	}

	.service-box .icon {
		width: 120px;
 		height: 120px;
		line-height: 170px;
		margin: 20px auto 0 auto
	}
	
	.service-box .icon span {
		width: 65px;
		height: 65px;
	}

	.why-row:nth-of-type(even) [class*=col]:nth-of-type(even) {
		order: 1;
	}

	.why-row {
		text-align: center
	}

	.why-row img {
		width: 60%;
		height: auto;
		margin: 0 auto
	}

	.plugin-carousel .owl-nav button.owl-prev,
	.plugin-carousel .owl-nav button.owl-next {
		display: none
	}

	.navbar-brand {
		width: 200px;
		height: 44px;
	}
	
	.poc h2 {
		font-size: 1.3rem;
	}
	
	.sidebar-wrapper {
		padding: 15px 0;
		border-top: 1px solid #ced4da;
		border-left: none;
	}
	
	section.cta-three-block:before {
		top: 30%;
	}
	
	.case-studies-carousel .owl-item {
		padding: 0;
	}
	
	.intro {
		padding-top: 50px;
	}
	
	.feature-box {
		padding: 40px 15px;
	}

}


@media (max-width: 767px) {

	.comparison td:first-child,
	.comparison th:first-child {
		display: none;
	}

	.comparison tbody tr:nth-child(odd) {
		display: table-row;
		background: #2da6ff;
	}

	.comparison tbody tr:nth-child(odd) td {
		font-weight: bold;
		text-transform: uppercase;
		color: #fff;
		font-size: 12px
	}

	.comparison .row {
		background: #FFF;
	}

	.comparison td,
	.comparison th {
		border: 1px solid #2da6ff;
	}

	.comparison tr.bottom-row td {
		border-color: transparent
	}

	.comparison tbody tr:nth-last-of-type(2) {
		display: none
	}

	.price-info {
		border-top: 0 !important;
	}

	#navbarNavDropdown {
		width: 75%
	}
	
	.social-media {
		right: 10%;
	}
	
	.products-box .image-block-none, .featured .image-block-none {
		height: 250px;
	}
	
}
	
	
@media (max-width: 700px) {
	.comparison a.get-demo {
    	font-size: 12px;
    	padding: 6px 12px
	}

	.compare-heading {
		font-size: 11px;
	}

	.comparison th span.price {
		font-size: 1.4rem;
	}
	
	.what-who-why {
		padding: 50px 15px 400px;
	}
	
}
	

@media (max-width: 639px) {

	.comparison .price-buy {
    	padding: 5px 10px;
	}

	.comparison td,
	.comparison th {
		padding: 10px 5px;
	}

	.comparison .hide-mobile {
		display: none;
	}

	.comparison .price-now span {
		font-size: 16px;
	}

	.comparison .price-small {
		font-size: 16px !important;
		top: 0;
		left: 0;
	}

	.comparison .qbse,
	.comparison .qbo {
		font-size: 12px;
		padding: 10px 5px;
	}

	.comparison .price-buy {
		margin-top: 10px;
	}

	.compare-heading {
		font-size: 13px;
	}
	
	.top-section h2 {
		font-size: 1.5rem;
	}
	
	.top-section p {
		font-size: 1rem;
	}
	
	.top-section span {
		display: inline-block;
	}
	
	.top-section a span {
		font-size: 1.5rem;
	}
	
	.why-row img {
    	width: 90%;
	}
	
	.services-wrapper > .container-fluid, .products-wrapper > .container-fluid {
		padding: 50px 40px 175px;
	}
	
	.lead p {
		font-size: 1.2rem;
	}
	
	h2.section-titles, h1.section-titles {
		font-size: 2rem;
	}
	
	.services-wrapper .lead .btn-primary, .products-wrapper .lead .btn-primary {
		padding: 1rem 2rem;
		font-size: 1rem;
	}
	
	.image-block-none {
		height: 200px;
	}
	
	.sfsi_wDiv {
    	margin-top: -5px;
	}
	
	.post-navigation {
	    display: grid;
		margin-top: 30px;
		border-bottom: 0;
	}
	
	section.cta-three-block:before {
		top: 40%;
	}
	
}

@media (max-width: 540px) {
	
	#navbarNavDropdown { 
		width:80%
	}
	
	.image-about-crm {
		height: 300px;
	}
	
	.top-section h2 {
		font-size: 1.1rem;
	}
	
	.footer .last {
		margin-top: -55px;
		flex-basis: auto !important;
	}
	
}
	
	
@media (max-width: 450px) {	
	
	.comparison a.get-demo {
    	font-size: 10px;
    	padding: 4px 7px
	}

	.compare-heading {
		font-size: 11px;
	}

	.comparison th span.price {
		font-size: 1.2rem;
	}

	.top-section h2 {
		font-size: 1.5rem;
	}
	
	.top-section a span {
		font-size: 1rem;
	}
	
	.top-section a {
		margin-top: 20px;
	}

	.top-section p {
		font-size: 1rem;
	}
	
	.navbar .social-media {
		display: none;
	}
	
}




/*
	-------------------------------------------
		ANIMATION
	-------------------------------------------
*/
.animated {
  -webkit-animation-duration: 0.7s;
  animation-duration: 0.7s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}


@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDownBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -2000px, 0);
    transform: translate3d(0, -2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes fadeInUpBig {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 2000px, 0);
    transform: translate3d(0, 2000px, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@-webkit-keyframes showHideBefore { /* Chrome, Safari */
    0% {height:0%; width:0%; opacity: 0;}
    40% {height:0%; width:0%; opacity: 0;}
    60% {height:0%; width:75%; opacity: 0;}
    100% {height:100%; width:100%; opacity: 0.5;}
}
@-moz-keyframes showHideBefore { /* FF */
   0% {height:0%; width:0%; opacity: 0;}
    40% {height:0%; width:0%; opacity: 0;}
    60% {height:0%; width:75%; opacity: 0;}
    100% {height:100%; width:100%; opacity: 0.5;}
}
@-ms-keyframes showHideBefore { /* IE10 */
    0% {height:0%; width:0%; opacity: 0;}
    40% {height:0%; width:0%; opacity: 0;}
    60% {height:0%; width:75%; opacity: 0;}
    100% {height:100%; width:100%; opacity: 0.5;}
}
@-o-keyframes showHideBefore { /* Opera */
    0% {height:0%; width:0%; opacity: 0;}
    40% {height:0%; width:0%; opacity: 0;}
    60% {height:0%; width:75%; opacity: 0;}
    100% {height:100%; width:100%; opacity: 0.5;}
}
@keyframes showHideBefore {
    0% {height:0%; width:0%; opacity: 0;}
    40% {height:0%; width:0%; opacity: 0;}
    60% {height:0%; width:75%; opacity: 0;}
    100% {height:100%; width:100%; opacity: 0.5;}
}

@-webkit-keyframes showHideAfter { /* Chrome, Safari */
    0% {height:0%; width:0%; opacity: 0;}
    40% {height:0%; width:0%; opacity: 0;}
    60% {height:0%; width:75%; opacity: 0;}
    100% {height:100%; width:100%; opacity: 0.2;}
}
@-moz-keyframes showHideAfter { /* FF */
   0% {height:0%; width:0%; opacity: 0;}
    40% {height:0%; width:0%; opacity: 0;}
    60% {height:0%; width:75%; opacity: 0;}
    100% {height:100%; width:100%; opacity: 0.2;}
}
@-ms-keyframes showHideAfter { /* IE10 */
    0% {height:0%; width:0%; opacity: 0;}
    40% {height:0%; width:0%; opacity: 0;}
    60% {height:0%; width:75%; opacity: 0;}
    100% {height:100%; width:100%; opacity: 0.2;}
}
@-o-keyframes showHideAfter { /* Opera */
    0% {height:0%; width:0%; opacity: 0;}
    40% {height:0%; width:0%; opacity: 0;}
    60% {height:0%; width:75%; opacity: 0;}
    100% {height:100%; width:100%; opacity: 0.2;}
}
@keyframes showHideAfter {
    0% {height:0%; width:0%; opacity: 0;}
    40% {height:0%; width:0%; opacity: 0;}
    60% {height:75%; width:75%; opacity: 0;}
    100% {height:100%; width:100%; opacity: 0.2;}
}




@-webkit-keyframes bounceIn {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes bounceIn {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(0.3, 0.3, 0.3);
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(0.9, 0.9, 0.9);
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(0.97, 0.97, 0.97);
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.bounceIn {
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}


@-webkit-keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
}







@-webkit-keyframes flash { /* Chrome, Safari */
    0% { opacity: 0;}
    40% { opacity: 0;}
    60% { opacity: 0.5;}
    100% {opacity: 1;}
}
@-moz-keyframes flash { /* FF */
   	0% { opacity: 0;}
    40% { opacity: 0;}
    60% { opacity: 0.5;}
    100% {opacity: 1;}
}
@-ms-keyframes flash { /* IE10 */
    0% { opacity: 0;}
    40% { opacity: 0;}
    60% { opacity: 0.5;}
    100% {opacity: 1;}
}
@-o-keyframes flash { /* Opera */
    0% { opacity: 0;}
    40% { opacity: 0;}
    60% { opacity: 0.5;}
    100% {{opacity: 1;}
}
@keyframes flash {
    0% { opacity: 0;}
    40% { opacity: 0;}
    60% { opacity: 0.5;}
    100% {opacity: 1;}
}
	
	
	
@keyframes ripple {
  0% {
    transform: scale(0, 0);
    opacity: 1;
  }
  20% {
    transform: scale(25, 25);
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: scale(40, 40);
  }
}
	
/**********************************************************************************************************************************************************************************************/