/* KICKFIRE CSS */

/* resets */
*,
*:before,
*:after { box-sizing: border-box; }

html, body, table, th, tr, td, p, img, hr, ul, li, h1, h2, h3, h4, h5, div, form, fieldset { padding: 0; margin: 0; border: none; }


/* ============ STICKY FOOTER (combined with jQuery) ============ */
html, body { height: 100%; }
#wrapper { min-height: 100%; height: auto !important; height: 100%; }

/* ============ STICKY FOOTER //============ */

.clearfix:after { content: ""; display: table; clear: both; }

body { font-family: Roboto, Helvetica, "Lucida Grande", Verdana, Arial; font-size: 14px; color: #999999; line-height: 1.5; font-weight: 300; }

.clear { clear: both; }
.center { margin: 0 auto; text-align: center; }
.left { text-align: left; }

::-moz-focus-inner { border: 0; } 	/* FireFox */
input:focus, textarea:focus { outline: 0; }				/* Chrome, Safari */

a { outline: 0; text-decoration: none; color: #f89938; cursor: pointer; }
a:hover { color: #666666; }

.title { line-height: 1.4; }

.pad5 { padding-top: 5px; }
.pad10 { padding-top: 10px; }
.pad20 { padding-top: 20px; }
.pad30 { padding-top: 30px; }
.pad40 { padding-top: 40px; }
.pad50 { padding-top: 50px; }
.pad60 { padding-top: 60px; }
.pad70 { padding-top: 70px; }
.pad80 { padding-top: 80px; }
.pad90 { padding-top: 90px; }
.pad100 { padding-top: 100px; }

.pad-short-page { padding-top: 220px; }

.white { background-color: #ffffff; }
.white-opacity1 { background-color: rgba(255,255,255, 0.9); }
.white-opacity2 { background-color: rgba(255,255,255, 0.97); }
.gray-opacity1 { background-color: rgba(252, 252, 252, 0.9); }
.light-gray1 { background-color: #fafafa; }
.light-gray2 { background-color: #fefefe; }
.light-gray3 { background-color: #f1f1f1; }
.light-gray4 { background-color: #f9f9f9; }
.light-gray5 { background-color: #f6f6f6; }
.light-gray6 { background-color: #f4f4f4; }
.section-blue { background-color: #035c88; }
.hide { display: none; }
.title { line-height: 1.4; }
li { line-height: 1.7; }

.sep { border-top: dotted 1px #cccccc; }

.main_endpad { padding-top: 70px; }

/* ======================== COMMON ELEMENTS ======================= */


ul.tick { list-style-type: none; padding: 0; margin: 0; }
ul.tick li { background: url(../img/tick-orange.png) 0 8px no-repeat; padding-left: 20px; }
ul.tick.gray li { background-image: url(../img/tick-gray.png); }

.error-msg { color: #991b1e; font-size: 12px; }

.kf-red { color: #991b13; }
.kf-orange-dark { color: #dc7c27; }
.kf-orange-medium { color: #f89938; }
.kf-orange-light { color: #ffcc67; }
.kf-gray-dark { color: #333333; }
.kf-gray-medium { color: #676766; }

*::-webkit-input-placeholder { font-family: Roboto, Helvetica, Verdana, Arial; opacity: 0.7; font-weight: 100; }
*::-moz-placeholder { font-family: Roboto, Helvetica, Verdana, Arial; opacity: 0.7; font-weight: 100; /* Firefox 19+ */ }
*:-ms-input-placeholder { font-family: Roboto, Helvetica, Verdana, Arial; opacity: 0.7; font-weight: 100; }


/* --------- BUTTONS --------- */
/* .btn-orange2 used in banner. It shows different gradient when hover which doesn't support by transition */
.btn-orange2 { height: 50px; line-height: 48px; display: inline-block; position: relative;
	padding: 0 25px; 
font-family: Roboto, Helvetica, "Lucida Grande", Verdana, Arial; font-size: 18px; font-weight: 400; text-decoration: none; 
	-moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;
	background-color: #e77a06;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #febc42), color-stop(1, #e77a06) );
	background:-moz-linear-gradient( center top, #febc42 5%, #e77a06 90% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#febc42', endColorstr='#e77a06');
	color: #ffffff; text-shadow: 0 1px 2px rgba(0,0,0, 0.6); cursor: pointer; transition: all 0.25s linear 0s; overflow: hidden;
 }
.btn-orange2:hover { 
	background-color: #f28907;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ffcf4a), color-stop(1, #f28907) );
	background:-moz-linear-gradient( center top, #ffcf4a 5%, #f28907 90% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffcf4a', endColorstr='#f28907');
	color: #ffffff;
 }
.btn-orange2:hover.on-darkbg { box-shadow: 0 0 6px rgba(212,107,0, 0.7); }

.btn-orange { position: relative; height: 50px; line-height: 48px; display: inline-block;
	padding: 0 25px; 
font-family: Roboto, Helvetica, "Lucida Grande", Verdana, Arial; font-size: 18px; font-weight: 400; text-decoration: none; 
	-moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;
	background-color: #e77a06;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #febc42), color-stop(1, #e77a06) );
	background:-moz-linear-gradient( center top, #febc42 5%, #e77a06 90% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#febc42', endColorstr='#e77a06');
	color: #ffffff; 
	text-shadow: 1px 1px 0 rgba(212,107,0, 1);
	border: solid 1px rgba(241,152,33,0.9);
	cursor: pointer; transition: all 0.25s linear 0s; overflow: hidden;
 }
.btn-orange:hover { opacity: 0.85; background-position: 10px; text-shadow: 1px 1px 0 rgba(193,91,0, 1); }


.btn-orange-flat { height: 50px; line-height: 48px; position: relative; display: inline-block; padding: 0 25px; border-radius: 3px; background-color: rgba(235,133,16, 1); color: #ffffff;  font-family: Roboto, Helvetica, "Lucida Grande", Verdana, Arial; font-size: 18px; font-weight: 400; text-decoration: none; text-shadow: 1px 1px 0 rgba(178,80,12, 0.5); cursor: pointer; overflow: hidden; transition: all .3s linear 0; }

.btn-orange-flat:hover { background-color: rgba(247,167,47, 1); text-shadow: 1px 1px 0 rgba(193,91,0, 0.8); }

.btn-gray-flat { height: 50px; line-height: 48px; position: relative; display: inline-block; padding: 0 25px; border-radius: 3px; background-color: #e1e1e1; color: #7e7e7e; font-family: Roboto, Helvetica, "Lucida Grande", Verdana, Arial; font-size: 18px; font-weight: 400; text-decoration: none; cursor: pointer; overflow: hidden; transition: all .3s linear 0; }

.btn-gray-flat:hover { background-color: #808080; color: #ffffff; }

.btn-disable, .btn-disable:hover { opacity: 0.5; background-color: #e1e1e1; color: #7e7e7e; cursor: default; }
.btn-medium { height: 30px; line-height: 30px; padding: 0 16px; font-size: 12px; }

.btn-black { position: relative; height: 50px; line-height: 48px; display: inline-block;padding: 0 25px; font-family: Roboto, Helvetica, "Lucida Grande", Verdana, Arial; font-size: 18px; font-weight: 400; text-decoration: none; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;
	background-color: #333333;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #666666), color-stop(1, #333333) );
	background:-moz-linear-gradient( center top, #333333 5%, #999999 90% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#febc42', endColorstr='#e77a06');
	color: #ffffff; 
	text-shadow: 1px 1px 0 rgba(0,0,0, 1);
	cursor: pointer; transition: all 0.25s linear 0s; overflow: hidden;
 }
.btn-black:hover { opacity: 0.85; background-position: 10px; color:#ffffff; text-shadow: 1px 1px 0 rgba(0,0,0, 1); }

.learnmore { width: 115px; height: 30px; line-height: 30px; margin-top: 25px; text-align: center; border-radius: 5px; background: #666666; color: #ffffff; font-size: 14px; cursor: pointer; }
.learnmore:hover { background: #ff9933; color: #ffffff; }

.learnmore-orange { width: 115px; height: 30px; line-height: 30px; margin-top: 25px; text-align: center; border-radius: 5px; background: #ff9933; color: #ffffff; font-size: 14px; cursor: pointer; }
/* --------- BUTTONS //--------- */


/* --------- ARROW UP FOR EXTENSION --------- */
.ext-arrow-up-position { position: relative; /*padding-left: 160px; padding-top: 25px;*/ }
.ext-arrow-up { position: absolute; z-index:100; background:url(../img/ext-arrow-up.png) 0 0 no-repeat; width:17px; height: 9px; }


/* ============== CHECKBOX ============== */
.kf-checkbox input { display: none; }
.kf-checkbox .icon { text-align: center; display: inline-block; }

.kf-checkbox .icon .fa { visibility: hidden; }
.kf-checkbox input:checked + .icon .fa { visibility: visible; }

/* Optional */
.kf-checkbox { 
  /* prevent accidental selection when clicking */
  user-select: none;
  -ms-user-select: none;
  -moz-user-select: none;
  -webkit-user-select: none;
 }

/* Checkbox styling */

.kf-checkbox input { margin: 0 .1em; /* Use something similar to .icon */ }

.kf-checkbox .icon { width: 1.2em; height: 1.2em; line-height: 1; padding: 0; text-align: center; background: #f3f3f3; border: 1px solid; border-color: #c8c8c7 #dfdfdf #dfdfdf #cecece; border-radius: 2px; font-size: 1em; color: #999999;
    /* Values for height, width and line-height may need to be adjusted depending on your font. */ }

/* Inline menu styling */

.kf-checkbox { list-style: none; padding: 8px; display: inline-block; }

/* <label> tab is different than class ".label" */
label { cursor: pointer; }
/* ============== CHECKBOX //============== */


/* ============== ARROW BOX ============== */
.arrow-box { 
	background-color: #f9f9f9; box-shadow: 0 0 3px 0 rgba(216,216,216, 1); box-sizing: border-box; position-absolute; z-index: 99px;
	width: 300px; height: 50px; border-radius: 5px; border: solid 1px rgba(206,206,206, 0.7); padding: 10px; margin-left: 30px; overflow: hidden;
 }

.arrow-box:before { 
	border-bottom-color: none; border-color: transparent transparent #f9f9f9 #f9f9f9; border-image: none; border-style: solid; border-width: 7px;
	box-shadow: -2px 2px 2px 0 rgba(216,216,216, 1); box-sizing: border-box; content:""; width:0; height: 0; 
	-ms-transform-origin: 0 0 0; -moz-transform-origin: 0 0 0; -webkit-transform-origin: 0 0 0; transform-origin: 0 0 0; 
	position: absolute; z-index: 100;
 }

.arrow-box-down:before { 
	-ms-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg);
	
	/* change arrow position here */
	margin-top: 37px; margin-left: 10px;
 }

.arrow-box-up:before { 
	-ms-transform: rotate(135deg); -moz-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg);
	
	/* change arrow position here */
	margin-top: -9px; margin-left: 270px;
 }

.arrow-box-left:before { 
	-ms-transform: rotate(45deg); -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg);
	
	/* change arrow position here */
	margin-top: 4px; margin-left: -10px;
 }

.arrow-box-right:before { 
	-ms-transform: rotate(-135deg); -moz-transform: rotate(-135deg); -webkit-transform: rotate(-135deg); transform: rotate(-135deg);
	
	/* change arrow position here */
	margin-top: 24px; margin-left: 287px;
 }
/* ============== ARROW BOX //============== */


img.gray-logo-fade { border: none; opacity: .4; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; }
img.gray-logo-fade:hover { opacity: 1; }


/* ======================== COMMON ELEMENTS //======================= */



/* ======================== HEADER ======================== */
#header { width: 100%; height: 60px /*120px*/; position: fixed; z-index: 100; top: 0; background-color: #ffffff; font-family: Helvetica, Roboto, "Lucida Grande", Verdana, Arial; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05), 0 0 4px rgba(0,0, 0, 0.15); }

#header.scrolled { background-color: #222222 !important; transition: background-color .2s linear; }

.top-banner { width: 100%; height: 60px; margin: 0 auto; text-align: center; background-color: #000000; font-size: 0; }

.header-padding { width: 100%; height: 60px; } /* Padding to push main content down when have top banner. Having same height as .top-banner. Comment out header-padding tag inside nav.inc.php when not using the top banner and adjust #header height to 60px (regular and mobile) */

#logo { float: left; }
#logo .logo-inner { margin-top: 6px; }
#logo img { width: 127px; height: 46px; background: url(../img/foundry-black.svg) 0 0/127px 46px no-repeat; }

#header.scrolled img { background: url(../img/foundry-white.svg) 0 0/127px 46px no-repeat; }

#nav { overflow: hidden; }
#nav ul.main-menu > li > a, #nav ul.main-menu > li .nav-btn-wrap a { line-height: 58px; padding: 0 12px; margin: 0 auto; text-align: center; color: #888888; font-size: 15px; font-weight: 400; }


/* ==================== MAIN-MENU DROP DOWN ==================== */
ul.main-menu { float: right; list-style: none; padding: 0; margin: 0; }


/* ========== BODY OF DROPDOWN ========== */
ul.main-menu li ul { list-style: none; padding: 0; margin: -7px 0 0 -22px; border: solid 1px #bebebe; background-color: #ffffff; border-radius: 10px; box-shadow: 0 3px 4px 0 rgba(136,136,136, 0.4); display: none; } /* submenu hidden by default */

ul.main-menu li ul.submenu1 { margin-left: -269px; }	/* position of dropdown 1 */
ul.main-menu li ul.submenu2 { margin-left: -76px; }		/* position of dropdown 2 */
ul.main-menu li ul.submenu3 { margin-left: -500px; }	/* position of dropdown 3 */
ul.main-menu li ul.submenu4 { margin-left: -618px; }	/* position of dropdown 4 */
ul.main-menu li ul.submenu5 { margin-left: -62px; }		/* position of dropdown 5 */

ul.main-menu li ul.submenu-login { margin: 0; margin-top: -14px; margin-left: -168px; padding-top: 8px; border: 0; border-radius: 0; box-shadow: none; background-color: transparent; }
/* ========== BODY OF DROPDOWN //========== */


/* ========== ARROW OF DROPDOWN (center the dropdown arrow first relative to the body, then center the dropdown body relative to the top text menu) ========== */
ul.main-menu li ul:after { content: ""; position: absolute; z-index: 101; background: url(../img/ext-arrow-up-white.png) 0 0 no-repeat; width: 17px; height: 8px; left: 67px; top: -8px; }

ul.main-menu li ul.submenu1:after { left: 302px; }	/* arrow of dropdown 1 */
ul.main-menu li ul.submenu2:after { left: 117px; } 	/* arrow of dropdown 2 */
ul.main-menu li ul.submenu3:after { left: 539px; } 	/* arrow of dropdown 3 */
ul.main-menu li ul.submenu4:after { left: 643px; } 	/* arrow of dropdown 4 */
ul.main-menu li ul.submenu5:after { left: 91px; } 	/* arrow of dropdown 5 */
ul.main-menu li ul.submenu-login:after { left: 196px; top: 0; background-image: none; }
/* ========== ARROW OF DROPDOWN //========== */


ul.main-menu li { display: block; position: realtive; float: left; }

ul.main-menu > li { padding: 0 11px; } /* top menu item */

#nav ul.main-menu li a { display: block; text-decoration: none; white-space: no-wrap; color: #848484; }

#header.scrolled #nav ul.main-menu > li > a { color: #ffffff; }

ul.main-menu li:hover > ul { display: block; position: absolute; } /* display dropdown on hover */

ul.main-menu li:hover li { float: none; }

#nav ul.main-menu li:hover > a { color: #f89938; }

#nav ul.main-menu li > a.active { color: #f89938; } /* orange color for KF site */

#nav ul.main-menu li:hover li a { transition: all .2s ease-out; }
#nav ul.main-menu li:hover li a:hover { color: #333333 ; background-color: #fcf4e9; }

#nav ul.main-menu li:hover li:first-child { margin-top: 12px; }
#nav ul.main-menu li:hover li:last-child { margin-bottom: 12px; }
#nav ul.main-menu li:hover ul.submenu-login li:first-child { margin-top: 0; }
#nav ul.main-menu li:hover ul.submenu-login li:last-child { margin-bottom: 0; }

#nav ul.main-menu li ul.submenu5 li a.active { color: #f89938 ; background-color: #f5f5f5; } /* orange color for KF site */

#nav ul.main-menu li ul.submenu5 li a { width: 150px; height: 38px; line-height: 38px; display: block; padding: 0 15px 0 17px; margin-left: 0; margin-right: 0; text-align: left; font-weight: 300; cursor: pointer; } /* width and height of dropdown items */

#nav ul.main-menu li ul.submenu5 li a { width: 198px; padding: 0 7px 0 50px; background: url(../img/nav/icon-nav-flame.png) 16px 7px no-repeat; }  /* width of dropdown 5 */

#nav ul.main-menu li .submenu5 li a.nav-contact-us { background-image: url(../img/nav/icon-nav-contact-us.png); }
#nav ul.main-menu li .submenu5 li a.nav-about-us { background-image: url(../img/nav/icon-nav-flame.png); background-position: 21px 7px; }


#nav ul.main-menu li a.menu-kickfire-new { width: 90px; background: url(../img/new.gif) 70px 13px no-repeat; }


/* ========== SUBMENU ITEM ========== */
.submenu-inner { width: 980px; }
.submenu-inner:after { content: ""; display: table; clear: both; }
.submenu-left, .submenu-right { float: left; }

.submenu-row { margin: 0 10px; padding-top: 10px; padding-bottom: 15px; }

.submenu1 .submenu-row {  width: 724px; }
.submenu3 .submenu-row { width: 968px; }
.submenu4 .submenu-row { width: 724px; }

.submenu-right-inner { height: 243px; border-left: solid 1px #dddddd; }

#nav ul.main-menu .submenu-item { width: 231px; padding: 0 7px 6px 35px; margin: 0 10px 0 0; display: inline-block; background: #ffffff url(../img/nav/icon-nav-whitepaper.png) 7px 8px  no-repeat; border-radius: 10px; cursor: pointer; transition: all .5s ease-out; }

#nav ul.main-menu .submenu-item:last-child { margin-right: 0; }

#nav ul.main-menu .submenu-item.submenu-item-k4g { background-image: url(../img/nav/icon-nav-k4g.png); }
#nav ul.main-menu .submenu-item.submenu-item-ll { background-image: url(../img/nav/icon-nav-ll.png); }
#nav ul.main-menu .submenu-item.submenu-item-api { background-image: url(../img/nav/icon-nav-api.png); }
#nav ul.main-menu .submenu-item.submenu-item-k4a { background-image: url(../img/nav/icon-nav-k4a.png); }
#nav ul.main-menu .submenu-item.submenu-item-spark { background-image: url(../img/nav/icon-nav-spark.png); }
#nav ul.main-menu .submenu-item.submenu-item-twin-iq { background-image: url(../img/nav/icon-nav-twin-iq.png); }

#nav ul.main-menu .submenu-item.submenu-item-integration { background-image: url(../img/nav/icon-nav-integration.png); }
#nav ul.main-menu .submenu-item.submenu-item-twin-caching { background-image: url(../img/nav/icon-nav-flame.png); }
#nav ul.main-menu .submenu-item.submenu-item-intent-data { background-image: url(../img/nav/icon-nav-intent-data.png); }

#nav ul.main-menu .submenu-item.submenu-item-whitepaper { background-image: url(../img/nav/icon-nav-whitepaper.png); }
#nav ul.main-menu .submenu-item.submenu-item-blog { background-image: url(../img/nav/icon-nav-blog.png); }
#nav ul.main-menu .submenu-item.submenu-item-help-center { background-image: url(../img/nav/icon-nav-whitepaper.png); }
#nav ul.main-menu .submenu-item.submenu-item-developer { background-image: url(../img/nav/icon-nav-developer.png); }
#nav ul.main-menu .submenu-item.submenu-item-webinar-video { background-image: url(../img/nav/icon-nav-webinar.png); }
#nav ul.main-menu .submenu-item.submenu-item-case-study { background-image: url(../img/nav/icon-nav-case-study.png); }
#nav ul.main-menu .submenu-item.submenu-item-customer-review { background-image: url(../img/nav/icon-nav-customer-review.png); }
#nav ul.main-menu .submenu-item.submenu-item-company-logo { background-image: url(../img/nav/icon-nav-company-logo.png); }

#nav ul.main-menu .submenu-item:hover, #nav ul.main-menu .submenu-item.active { background-color: #fcf4e9; }

#nav ul.main-menu .submenu-item .item-title { color: #ff9933; font-size: 19px; }
#nav ul.main-menu .submenu-item .item-title sup { font-size: 13px; }

#nav ul.main-menu .submenu-item .item-text { line-height: 19px; color: #666666; font-size: 14px; }
#nav ul.main-menu .submenu-item .item-text sup { font-size: 11px; }


.title-use-case { margin: 10px 0 21px 20px; color: #ff9933; font-size: 19px; }

.nav-btn { height: 35px; line-height: 35px; text-align: center; background-color: #fcf4e9; color: #ff9933; font-size: 19px; border-radius: 10px; cursor: pointer; transition: all .2s ease-out; }
.nav-btn:hover { background-color: #ff9933; color: #ffffff; }

.nav-btn-see-all { width: 710px; margin: 7px 0 9px 17px; }
.nav-btn-learn-more { width: 201px; margin-top: 25px; margin-left: 17px; }

.submenu-right p { line-height: 26px; margin-top: 0; margin-bottom: 0; margin-left: 20px; padding-left: 25px; padding-top: 0; padding-bottom: 0; background: url(../img/nav/kf-flame-bullet.svg) 0 0/22px 22px no-repeat; color: #666666; font-size: 14px; }
/* ========== SUBMENU ITEM //========== */


/* =========== SIGN UP BUTTON (SEE IT LIVE) =========== */
.nav-btn-wrap-signup { margin-top: 15px; }
#nav ul.main-menu li a.nav-btn-signup { display: block; height: 30px; line-height: 30px; min-width: 78px; padding: 0 10px; background-color: rgba(235,133,16, 1); color: #ffffff;  font-size: 13px; text-shadow: 1px 1px 0 rgba(178,80,12, 0.5); border: #dc7c27 solid 1px; text-transform: uppercase; border-radius: 4px; transition: all 300ms linear 0s; }

#nav ul.main-menu li a.nav-btn-signup:hover,
#nav ul.main-menu li a.nav-btn-signup.active { background-color: rgba(247,167,47, 1); color: #ffffff; text-shadow: 1px 1px 0 rgba(193,91,0, 0.8); } 

ul.main-menu > li.li-signup { padding-left: 4px; padding-right: 0; }
/* =========== SIGN UP BUTTON (SEE IT LIVE) //=========== */


/* =========== LOG IN BUTTON =========== */
#nav .nav-btn-wrap { margin-top: 0; }

#nav .nav-btn-wrap a { color: #848484; }
#nav .nav-btn-wrap a:hover { color: #f89938; }

#header.scrolled #nav .nav-btn-wrap a { color: #ffffff; }


#nav ul.main-menu li a.nav-btn { display: block; height: 32px; line-height: 32px; min-width: 70px; padding: 0 10px; background-color: #ffffff; color: #f89938;  font-size: 13px; text-transform: uppercase; border: #dc7c27 solid 1px; border-radius: 4px; transition: all 300ms linear 0s; }

#nav ul.main-menu li a.nav-btn:hover,
#nav ul.main-menu li a.nav-btn.active { background-color: #f89938; color: #ffffff; border: #dc7c27 solid 1px; }
/* =========== LOG IN BUTTON //=========== */


/* =========== LOGIN DROP DOWN =========== */
#nav .login-dropdown { width: 240px; right: 0; top: 45px; border: solid 1px rgba(206,206,206, 1); border-radius: 10px; background-color: #f9f9f9; box-shadow: 0 3px 4px 0 rgba(136,136,136, 0.4); }

#nav .login-dropdown:after { content: ""; position: absolute; z-index: 101; display: block;  width: 17px; height: 9px; right: 28px; top: 0; background: url(../img/ext-arrow-up.png) 0 0 no-repeat; }

#nav .login-dropdown-content { min-height: 370px; margin-left: auto; margin-right: auto; text-align: center; background: url(../img/portal-login-bg-orange.png) center 53px no-repeat; }

#nav .login-dropdown .login-title-wrap { height: 48px; }
#nav .login-dropdown .login-title { padding-top: 15px; padding-bottom: 10px; color: #999999; font-weight: 100; }


#nav .login-circle-wrap { width: 66px; height: 66px; margin-left: auto; margin-right: auto; margin-top: 38px; background-color: #ffffff; border-radius: 33px; cursor: pointer; transition: all 0.25s linear 0s; }
#nav .login-circle-wrap:hover { background-color: rgba(102,102,102, 0.6); }

#nav .login-circle-wrap.login-circle-wrap2 { margin-top: 54px; }
#nav .login-circle-wrap.login-circle-wrap2:hover { background-color: rgba(248, 153, 56, 0.8); }


#nav ul.main-menu li li a.login-circle { display: block; width: 66px; height: 66px; line-height: 66px; margin: 0; padding: 0;  text-align: center; color: #999999; font-weight: 400; text-transform: uppercase; }
#nav ul.main-menu li li .login-circle-wrap:hover a.login-circle { background-color: transparent; color: #ffffff;  }

#nav ul.main-menu li li .login-circle-wrap.login-circle-wrap2 a.login-circle { color: #f89938; }
#nav ul.main-menu li li .login-circle-wrap.login-circle-wrap2:hover a.login-circle { background-color: transparent; color: #ffffff; }

#nav ul.main-menu li li .partner-login { margin-top: 58px; }

#nav ul.main-menu li li .partner-login a { display: block; width: 92px; height: 22px; line-height: 21px; margin: 0 auto; padding: 0; text-align: center; background-color: #dedede; color: #666666; font-size: 11px; font-weight: 300;  border-radius: 20px; transition: all 0.25s linear 0s; }
#nav ul.main-menu li li .partner-login a:hover { background-color: #8e8f91; color: #ffffff; }
/* =========== LOGIN DROP DOWN //=========== */
/* ==================== MAIN-MENU DROP DOWN //==================== */


/* =========== MOBILE MENU =========== */
#nav-m { float: right; margin-right: 10px; display: none; }

.nav-button-m { float: right; margin-right: 35px; display: none; }
.nav-button-m .nav-btn a { margin-top: 5px; margin-left: 0; height: 30px; line-height: 28px; text-align: center; font-size: 14px; }

.btn-main { display: block; height: 18px; width: 25px; margin-top: 21px; border-bottom: 4px solid #989898; border-top: 4px solid #989898; }
.btn-main:before { background: none repeat scroll 0 0 #989898; content: " "; height: 4px; position: absolute; right: 10px; top: 28px; width: 25px; }

.btn-main-dropdown { width: 280px; right: 5px; top: 48px; display: none; position: absolute; z-index: 100;  border: solid 1px rgba(206,206,206, 1); border-radius: 6px; background-color: #f9f9f9; box-shadow: 0 3px 4px 0 rgba(136,136,136, 0.8); }

.btn-main-dropdown:after { content: ""; position: absolute; z-index: 101;  width: 17px; height: 9px; right: 8px; top: -9px; background: url(../img/ext-arrow-up.png) 0 0 no-repeat; }

.btn-main:hover { text-decoration: none; }

.dropdown-content { margin: 14px 0 0; }
.dropdown-item, .dropdown-item-last { height: 44px; line-height: 44px; padding-right: 6px; cursor: pointer; display: block; transition:all 0.4s ease 0s; font-size: 14px; font-weight: 300; }

.dropdown-item { margin-left: 17px; margin-right: 17px; padding-left: 6px; border-bottom: solid 1px #cecece; color: #666666; }
.dropdown-item:hover { color: #f89938; }

.dropdown-item-last { height: 48px; line-height: 48px; border-bottom: 0; }

.dropdown-item .fa-key { font-size: 16px; display: inline-block; padding-right: 7px; }
.dropdown-item-last .fa-edit { font-size: 16px; display: inline-block; padding-right: 7px; }
/* =========== MOBILE MENU //=========== */

/* ======================== HEADER //======================== */



/* Apply .main-grid to any sections you want to be 980px width */
.main-grid { width: 100%; max-width: 980px; margin: 0 auto; position: relative; }


/* =========== SECTION-GEN =========== */
.section-gen { padding-top: 60px; padding-bottom: 70px; }
.section-gen.no-title { padding-top: 100px; }
.section-gen .title, .section-gen .title h1 { color: #949494; font-size: 46px; font-weight: 100; padding-top: 0; padding-bottom: 0; line-height: 1.2; }
.section-gen .title.orange, .section-gen .title.orange h1 { color: #f89938; }
.section-gen .sub-title { font-size: 17.5px; padding-top: 10px; font-weight: 300; }
/* =========== SECTION-GEN //=========== */


/* ============== SLIDER ============== */
.slider { height: 350px; background: url(../img/topbanner-drawing.jpg) 0 0 no-repeat; background-size: cover; color: rgba(255,255,255, 1); font-family: Roboto; font-size: 17px; font-weight: 100; 	text-shadow: 1px 1px 2px rgba(0,0,0, 0.6); line-height: 1.6; }

.slider .flex-wrapper { max-width: 900px; }

.slider .row { margin-bottom: 0; padding-bottom: 20px; }
.slider .col-1-3 { max-width: 386px; width: 42%; }
.slider .col-2-3 { max-width: 514px; width: 58%; font-weight: 100; }

.slider-icon { max-width: 256px; padding-top: 46px; margin-left: auto; margin-right: auto; }
.slider img { position: relative; }
.slider-desc { max-width: 480px; position: relative; }
.slider h2 { position: absolute; top: 40px; padding-top: 0; font-size: 42px; color: #ffffff; font-weight: 100; text-shadow: 0 2px 2px rgba(0,0,0, 0.6); }
.slider p { position: absolute; top: 132px; }
.slider  .btn-position { position: absolute; margin: 0; top: 258px; }
/* ============== SLIDER //============== */


/* ============== SLIDER-M ============== */
.slider-m { display: none; background: url(../img/topbanner-drawing.jpg) center center no-repeat; background-size: cover; overflow: hidden; }

.slider-m .slider-icon img { width: 180px; height: 180px; }
.slider-m .slider-desc { position: relative; width: 100%; max-width: 100%; text-align: center; padding-left: 20px; padding-right: 20px; }
.slider-m h2, .slider-m p, .slider-m .btn-position { position: relative; color: #ffffff; font-weight: 100; }
.slider-m h2 { font-size: 36px; padding-top: 35px; padding-bottom: 10px; }
.slider-m p { font-size: 16px; padding-bottom: 35px; }
.slider-m .btn-position { position: relative; /*padding-bottom: 45px;*/ margin-bottom: 45px; }
/* ============== SLIDER-M //============== */


/* ============== SLIDER-API ============== */
.slider-api { opacity: 0; }
.slider-api .flex-wrapper { max-width: 980px; }

.slider-api .col-1-3 { max-width: 380px; width: 38%; }
.slider-api .col-2-3 { max-width: 600px; width: 62%; }

.slider-api .slider-desc { max-width: 580px; }
.slider-api h2 { top: 34px; font-size: 35px; letter-spacing: -0.7px; }
.slider-api h2 .trademark { position: relative; top: -15px; left: 0; font-family: Roboto, Helvetica, "Lucida Grande", Verdana, Arial; font-size: 16px; opacity: 0.5; }

.slider-api p { font-size: 16px; }
.slider-api p.p1 { top: 132px; }

.slider-api .btn-position { position: relative; top: 250px; }

.slider-api .btn-wrapper { float: left; }
.slider-api .btn-wrapper2 { margin-left: 16px; }

.slider-api .btn-orange-slider { padding-left: 16px; padding-right: 16px; }
.slider-api .btn-orange-slider img { top: 7px; }
.slider-api #btn-more-text1, .slider-api #btn-more-text3 { position: relative; display: inline-block; }
.slider-api #btn-more-text2, .slider-api #btn-more-text4 { position: relative; padding-left: 26px; padding-top: 38px; }
/* ============== SLIDER-API //============== */


/* ============== SLIDER-API-M ============== */
.slider-api-m .slider-icon { padding-top: 20px; }
.slider-api-m img { max-width: 200px; max-height: 200px; }
.slider-api-m p.p1 { padding-top: 25px; }
.slider-api-m .btn-position { position: relative; }
.slider-api-m h2 { font-size: 30px; }
.slider-api-m h2 .trademark { position: relative; top: -10px; left: 0; font-family: Roboto, Helvetica, "Lucida Grande", Verdana, Arial; font-size: 16px; opacity: 0.5; }

.slider-api-m #btn-more1-m { display: inline-block; }
.slider-api-m .btn-orange-slider#btn-more2-m { margin-top: 4px; padding-left: 26px; padding-right: 26px; }
.slider-api-m .btn-wrapper > a { display: inline-block; }
.slider-api-m #btn-more-text1-m, .slider-api-m #btn-more-text3-m { position: relative; display: inline-block; }

/* ============== SLIDER-API-M //============== */


/* ============== SLIDER-GDPR ============== */
.slider-gdpr { height: 350px; background: url(../img/topbanner-drawing.jpg) 0 0 no-repeat; background-size: cover; color: rgba(255,255,255, 1); font-family: Roboto; font-size: 17px; font-weight: 100; 	text-shadow: 1px 1px 2px rgba(0,0,0, 0.6); line-height: 1.3; }

.slider-gdpr .flex-wrapper { max-width: 900px; }

.slider-gdpr .row { margin-bottom: 0; padding-bottom: 20px; }
.slider-gdpr .col-1-3 { max-width: 386px; width: 40%; }
.slider-gdpr .col-2-3 { max-width: 514px; width: 60%; font-weight: 100; }

.slider-gdpr-icon { max-width: 256px; padding-top: 46px; margin-left: auto; margin-right: auto; }
.slider-gdpr img { position: relative; }
.slider-gdpr-desc { max-width: 480px; position: relative; }
.slider-gdpr h1 { position: absolute; top: 40px; padding-top: 0; font-size: 36px; color: #ffffff; font-weight: 100; text-shadow: 0 2px 2px rgba(0,0,0, 0.6); }
.slider-gdpr p { position: absolute; top: 150px; font-size: 18px; }
.slider-gdpr  .btn-position { position: absolute; margin: 0; top: 258px; }
/* ============== SLIDER-GDPR //============== */


/* ============== SLIDER-CUSTOMER ============== */
.slider-customer .btn-orange-slider { display: inline-block; }
.slider-customer .btn-orange-slider.btn-orange-slider-next { margin-left: 10px; }
.slider-customer .btn-orange-slider #btn-more-text3, .slider-customer .btn-orange-slider #btn-more-text4 { position: relative; }
.slider-customer .btn-orange-slider #btn-more-text4 { padding-top: 40px; top: 0; }

.slider-customer-m .btn-orange-slider.btn-orange-slider-next { margin-left: 10px; }
/* ============== SLIDER-CUSTOMER //============== */


/* ============== SLIDER ACE ============== */
.slider-ace { height: 400px; background: url(../img/slider/slider-bg-ace-event1.jpg) 0 0 no-repeat; background-size: cover; color: rgba(255,255,255, 1); font-family: Roboto; font-size: 17px; font-weight: 100; 	text-shadow: 1px 1px 2px rgba(0,0,0, 0.6); line-height: 1.3; }

.slider-ace .flex-wrapper { max-width: 900px; }

.slider-ace .row { margin-bottom: 0; padding-bottom: 20px; }
.slider-ace .col-1-3 { max-width: 275px; width: 70%; }
.slider-ace .col-2-3 { max-width: 300px; width: 30%; font-weight: 100; }

.slider-ace img { position: relative; }
.slider-ace-desc { max-width: 480px; position: relative; }
.slider-ace h2 { position: absolute; top: 40px; padding-top: 40px; font-size: 70px; color: #ffffff; font-weight: 200; text-shadow: 2px 2px 2px rgba(0,0,0, 0.6); }
.slider-ace p { position: absolute; top: 220px; font-size: 24px; }
.slider-ace  .btn-position { position: absolute; margin: 0; top: 258px; }
/* ============== SLIDER ACE//============== */


/* ============== DEMO-CIRCLE ============== */
.demo-circle-wrapper { position: relative; width: 100%; max-width: 950px; margin: 0 auto; top: 30px; }
.demo-circle-wrapper2 { position: relative; float: right; }
.demo-circle { position: relative; width: 134px; height: 134px; cursor: pointer; opacity: 1; }
.demo-circle-inner { position: relative; cursor: pointer; }
/* ============== DEMO-CIRCLE //============== */


/* ============== MISC ============== */
.angleMsg { width:150px; top: 20px; right: -45px; padding: 3px; position: absolute; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); font-size:10pt; font-family:helvetica; font-weight:100; background:#990000; color:#ffffff;  }
/* ============== MISC //============== */


/* ============== WHITEPAPER-LAYER1 ============== */
#whitepaper-layer1 { position: absolute; z-index: 1000; width: 0; height: 0; opacity: 0; }
.whitepaper-container-wrap { position: relative; width:90%; max-width: 980px; max-height: 560px; margin-left: auto; margin-right: auto; text-align: center; background-color: #ffffff; background: #ffffff url(../img/whitepaper-watermark.png) -200px bottom no-repeat; border-radius: 6px; }

.whitepaper { width: 90%; margin-left: auto; margin-right: auto; text-align: center; padding-top: 42px; padding-bottom: 50px; font-size: 15px; }

.whitepaper *::-webkit-input-placeholder { font-family: Roboto, Helvetica, Verdana, Arial; opacity: 0.8; font-weight: 100; }
.whitepaper *:-moz-placeholder { font-family: Roboto, Helvetica, Verdana, Arial; opacity: 0.8;  font-weight: 100; /* Firefox 18- */ }
.whitepaper *::-moz-placeholder { font-family: Roboto, Helvetica, Verdana, Arial; opacity: 0.8; font-weight: 100; /* Firefox 19+ */ }
.whitepaper *:-ms-input-placeholder { font-family: Roboto, Helvetica, Verdana, Arial; opacity: 0.8; font-weight: 100; }


.whitepaper .whitepaper-title, .whitepaper .whitepaper-title-thankyou { padding-bottom: 25px; font-weight: 100; font-size: 42px; line-height: 1.2; }
.whitepaper .whitepaper-title-thankyou { display: none; }
.whitepaper .whitepaper-text { padding-bottom: 10px; font-size: 18px; font-weight: 300; }
.whitepaper .whitepaper-text2 { max-width: 550px; margin-left: auto; margin-right: auto; padding-bottom: 22px; text-align: center; }

.whitepaper .item { margin-top: 10px; }
.whitepaper input { width: 240px; height: 36px; margin-left: auto; margin-right: auto; padding: 6px 8px; border-radius: 4px; border: solid 1px #cccccc; color: #666666; font-family: Roboto, Helvetica, Verdana, Arial; font-weight: 300; font-size: 14px;  }


.whitepaper .item-submit { margin-top: 30px; }
.whitepaper .item-submit .item-submit-inner, .whitepaper input[type="submit"] { width: 240px; height: 40px; line-height: 40px; margin: 19px auto 0; padding: 0; text-align: center; border: 0; border-radius: 5px; cursor: pointer;	background-color: rgba(235,133,16, 0.8); color: #ffffff; font-family: Roboto; font-weight: 300; font-size: 16px; text-shadow: 1px 1px 0 rgba(178,80,12, 0.5); transition: all 250ms linear 0s;  }

.whitepaper .item-submit .item-submit-inner:hover, .whitepaper input[type="submit"]:hover { background-color: rgba(235,133,16, 1); }

.whitepaper .error-msg { display: none; position: relative; left: 10px; width: 240px; margin-left: auto; margin-right: auto; text-align: left; padding-top: 4px; padding-bottom: 8px; color: #dc7c27; font-size: 12px; }

.success-msg { display: none; padding-top: 0; }


.btn-orange5 { width: 120px; height: 40px; line-height: 40px; margin: 19px auto 0; padding: 0; text-align: center; border: 0; border-radius: 5px; cursor: pointer;	background-color: rgba(235,133,16, 0.8); color: #ffffff; font-family: Roboto; font-weight: 300; font-size: 16px; text-shadow: 1px 1px 0 rgba(178,80,12, 0.5); transition: all 250ms linear 0s; }
.btn-orange5:hover { background-color: rgba(235,133,16, 1); }

.whitepaper-done { display: none; padding-top: 10px; }

.whitepaper-close-button { position: absolute; z-index: 1001; width: 100%; max-width: 740px; text-align: right; right: -20px; top: -20px; cursor: pointer; }
.whitepaper-close-button .fa { font-size: 24px;  color: #e7e7e7; }

.whitepaper-download-content { padding-bottom: 100px; }
.whitepaper-icon { position: relative; margin-top: 188px; }
.whitepaper-download-btn { position: relative; margin-top: 17px; font-size: 15px; }
.whitepaper-download-btn .btn-orange5 { width: 350px; }
.whitepaper-download-btn .fa { position: relative; display: inline-block; margin-left: 10px; top: 5px; font-size: 25px; }

/* ============== WHITEPAPER-LAYER1 //============== */


/* ============ SECTION-CUSTOMER ============ */
.section-customer { position: relative; padding-top: 61px; padding-bottom: 75px; font-weight: 300; font-family: Roboto, sans-serif, Arial, Verdana; color: #999999; position: relative; overflow: hidden; }

.section-customer .main-grid { position: relative; }
.section-customer h1, .section-customer h2 { position: relative; font-weight: 300; text-align: center; line-height: 1.3; overflow: hidden; }
.section-customer h1 { padding-bottom: 39px;bottom: 0; font-size: 48px; color: #666666; font-weight: 100; }
.section-customer h2 { max-width: 800px; margin-left: auto; margin-right: auto; line-height: 1.4; font-size: 21px; color: #f89938; }
.section-customer h1 .trademark { position: relative; top: -17px; left: -2px; font-size: 20px; }

.section-customer .customer-quick { margin-top: 55px; }
.section-customer .customer-quick:after { content: ""; display: table; clear: both; }
.section-customer .customer-quote, .section-customer .customer-profile { float: left; position: relative; }
.section-customer .customer-quote { width: 670px; padding-right: 30px; }
.section-customer .customer-profile { width: 294px; }
.section-customer .customer-profile a { color: #f89938; }
.section-customer .customer-profile a:hover { color: #666666; }

.section-customer .quote1, .section-customer .quote2 { color: #444444;  font-size: 17px; font-style: italic; line-height: 1.7; padding-left: 29px; }
.section-customer .quote1 { background: url(../img/quote1.png) 0 0 no-repeat; padding-top: 44px; }
.section-customer .quote2 { padding-left: 29px; padding-top: 16px; }

.section-customer .quote-source { background: url(../img/case-study/Bombora-RobArmstrong.png) right 0 no-repeat; float: right; padding-right: 167px; text-align: right; margin-right: 10px; margin-top: 20px; padding-top: 52px; min-height: 141px; max-width: 430px; color: #999999; font-size: 15px; font-style: normal; line-height: 1.5; position: relative; }

.section-customer.bombora .quote-source { background-image: url(../img/case-study/Bombora-RobArmstrong.png); }
.section-customer.rollworks .quote-source { background-image: url(../img/case-study/RollWorks-KushanPatel.png); }
.section-customer.terminus .quote-source { background-image: url(../img/case-study/Terminus-BryanBrown.png); }
.section-customer.designmind .quote-source { background-image: url(../img/case-study/DesignMind-PattySchinzing.png); }
.section-customer.recoverypoint .quote-source { background-image: url(../img/case-study/RecoveryPoint-DickFordham.png); }
.section-customer.lead411 .quote-source { background-image: url(../img/case-study/Lead411-TomBlue.png); }
.section-customer.avascent .quote-source { background-image: url(../img/case-study/Avascent-ChristineVargas.png); }
.section-customer.designmind .quote-source { background-image: url(../img/case-study/DesignMind-PattySchinzing.png); }
.section-customer.cplanenetworks .quote-source { background-image: url(../img/case-study/CplaneNetworks-RobertKeahey.png); }
.section-customer.datasolutionsinternational .quote-source { background-image: url(../img/case-study/DataSolutionsInternational-AlinaRuggieri.png); }

.section-customer.five9 { position: relative; padding-bottom: 0; }
.section-customer.five9 h1 { position: relative; padding-top: 20px; padding-bottom: 25px; }
.section-customer.five9 h2 { padding-bottom: 40px; }
.section-customer.five9 .section-gen.case-study-video { margin-left: auto; margin-right: auto; text-align: center; padding-top: 50px; padding-bottom: 80px; }
.section-customer.five9 .case-study-video { position: relative; }

.section-customer .quote-source.three-line { padding-top: 31px; }
.section-customer .quote-source-name { font-size: 16px; color: #888888; }
.section-customer .quote-source-title { font-size: 15px; }


.customer-profile-content { padding: 18px 25px 23px 25px; background-color: #eff0f0; border-radius: 20px; }
.customer-profile-content h3 { font-size: 22px; font-weight: 300; color: #444444; padding-bottom: 10px; }
.customer-profile-content p { font-size: 15px; line-height: 1.7; color: #666666; }
.customer-profile-content p.url { padding-top: 20px; }
.customer-profile .customer-logo { margin: 20px auto 0; text-align: center; }
.customer-profile-more { padding-top: 10px; font-size: 14px; color: #666666; }
.customer-profile-more span { color: #999999; display: inline-block; padding-right: 5px; }
.customer-profile-more > .item { padding-top: 5px; }

.customer-detail { position: relative;	 }
.customer-detail h3 { font-size: 25px; color: #666666; font-weight: 300; }
.customer-detail.customer-solution { margin-top: 19px; }
.customer-detail p { font-size: 16px; line-height: 1.6; margin-top: 19px; }

.section-customer .pdf-download { position: relative; margin: 0 auto; text-align: center; padding-top: 38px; }
.pdf-download a img{ opacity: 0.8; transition: all 800ms cubic-bezier(0.175, 0.885, 0.320, 1.275); }
.pdf-download a:hover img{ opacity: 1; }
.pdf-download p { text-align: center; font-size: 15px; margin-top: 6px; }
.pdf-download p a { transition: all 800ms cubic-bezier(0.175, 0.885, 0.320, 1.275); }
/* ============ SECTION-CUSTOMER //============ */


/* =========== BTN-ORANGE-SLIDER =========== */
.btn-orange-slider { position: relative; height: 43px; line-height: 42px; padding: 0 20px; display: inline-block; background-image: linear-gradient(to top,#e77a06,#febc42); color: #ffffff;    border-radius: 3px; font-size: 15px; font-weight: 400;  text-shadow: 0 1px 1px rgba(0,0,0, 0.4); overflow: hidden; }

.btn-orange-slider:hover { color: #ffffff; }

.btn-orange-slider img { position: relative; top: 5px; padding-right: 3px; }
.btn-orange-slider #btn-more-text1, #btn-more-text1a { position: relative; display: inline-block; }
.btn-orange-slider #btn-more-text2, #btn-more-text2a { position: relative; padding-top: 40px; top: 0; }
/* =========== BTN-ORANGE-SLIDER //=========== */


/* =========== BTN-ORANGE-IPD (IP DETECTION) =========== */
.btn-orange-ipd { position: relative; height: 48px; line-height: 47px; padding: 0 20px; display: inline-block; background-image: linear-gradient(to top,#e77a06,#febc42); color: #ffffff; border-radius: 3px; font-size: 15px; font-weight: 400; text-shadow: 0 1px 1px rgba(0,0,0, 0.4); overflow: hidden; }

.btn-orange-ipd:hover { color: #ffffff; }

.btn-orange-ipd img { position: relative; top: 8px; padding-right: 1px; }
.btn-orange-ipd #btn-more-text1 { position: relative; top: 1px; display: inline-block; }
.btn-orange-ipd #btn-more-text2 { position: relative; left: -6px; padding-top: 100px; }
/* =========== BTN-ORANGE-IPD (IP DETECTION) =========== */


/* =========== SCREENSHOT =========== */
.section-gen .screenshot { margin-left: auto; margin-right: auto; text-align: center; padding-top: 60px; padding-bottom: 20px; }

.section-gen .screenshot-flex { width: 100%; max-width: 980px; height: auto; border: solid 1px #dddddd; border-radius: 2px; }
.section-gen .screenshot-flex2 { width: 100%; max-width: 478px; height: auto; }
/* =========== SCREENSHOT //=========== */


/* =========== KF-ANI =========== */
.section-gen.kf-ani-wrap { position: relative; padding: 0; font-weight: 300; -webkit-font-smoothing: antialiased; }
.main-grid.kf-ani { position: relative; max-width: 700px;  height: 380px; }


.kf-ani-icon { position: absolute; opacity: 0; }
.kf-ani-icon img { width: 208px; height: 208px; }
.kf-ani-title { position: absolute; top: 98px; left: 252px; color: #f89938 /*#848484*/; font-size: 44px; opacity: 0; }
.kf-ani-p { position: absolute; left: 252px; color: #888888; font-size: 17px; line-height: 1.7; -webkit-font-smoothing: antialiased; }

#kf-ani-p1 { top: 188px; opacity: 0; }
#kf-ani-p2 { top: 250px; opacity: 0; }
/* =========== KF-ANI //=========== */


/* =========== KF-ANI-M =========== */
.kf-ani-m { display: none; margin: 0 auto; text-align: center; padding-bottom: 70px; }
.kf-ani-m { padding-top: 60px; }
.kf-ani-m-icon img { width: 190px; height: 190px; }

.kf-ani-m-title { color: #f89938; font-size: 36px; padding-top: 10px; }
.kf-ani-m-p1, .kf-ani-m-p2 { padding: 10px 25px 0; font-size: 16px; }
/* =========== KF-ANI-M //=========== */


/* =========== EXTENSION-DOWNLOAD =========== */
.extension-download { position: relative; z-index: 5; margin-top: 10px; cursor: pointer; display: none; }

.extension-download .btn-download { 
	position: relative; background-image: linear-gradient(to top,#e77a06,#febc42); color: #ffffff; display: inline-block; padding: 0 20px; height: 43px;
	-moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;
	font-size: 15px; font-weight: 400; line-height: 42px; text-shadow: 0 1px 1px rgba(0,0,0, 0.4); 
 }

.fa-circle-ani { position: relative; }

/* =========== EXTENSION-DOWNLOAD //=========== */


/* =========== BTN-ORANGE-ANI =========== */
.btn-orange-ani { position: relative; height: 38px; line-height: 37px; background-image: linear-gradient(to top,#e77a06,#febc42); color: #ffffff; display: inline-block; padding: 0 20px; border-radius: 3px; font-size: 15px; font-weight: 400;  text-shadow: 0 1px 1px rgba(0,0,0, 0.4); cursor: pointer; overflow: hidden; }

.btn-orange-ani:hover { color: #ffffff; }
/* =========== BTN-ORANGE-ANI //=========== */


/* ============ BG-VIDEO-WRAPPER ============ */
.layer-wrapper { position: relative; }

.layer1 { position: absolute; z-index: 1; top: 0; width: 100%; opacity: 1; }
.layer2 { position: absolute; z-index: 1; top: 0; width: 100%; background-color: transparent; }

.video-pad { background-image: url(../video/kf-extension-blank.png); background-repeat: no-repeat; background-size: cover; width: 100%; height: auto; }
.video-pad img { width: 100%; height: auto; }
.bg-video-arrow { position: absolute; z-index: 3; top: 30px; width: 35px; margin-left: auto; margin-right: auto; left: 0; right: 0; opacity: 0; cursor: pointer; display: block; }

#bounce-arrow1 { position: relative; }
.layer2 #jump-anchor1 { position: relative; top:-60px; }

.bg-video-wrapper { position: fixed; width: 100%; overflow: hidden; }
.bg-video { position: relative; width: 100%; height: auto; z-index: -10; background: url(../video/kf-extension-480-ss.jpg) no-repeat; opacity: 1; }

.bg-video-msg { position: absolute; z-index: 2; top: 100px; color: #ffffff; margin-left: auto; margin-right: auto; text-align: center; width: 100%; }
.bg-video-msg-inner { width: 980px; left: 50%; margin-left: -490px; position: relative; text-align: left; top: 100px; font-size: 52px; font-weight: 100; line-height: 1.3; text-shadow: 1px 1px 2px rgba(0,0,0, 0.8); }
/* ============ BG-VIDEO-WRAPPER ============ */


/* ============ BG-VIDEO-WRAPPER-M ============ */
.bg-video-wrapper-m { position: fixed; background-image: url(../video/kf-extension-mobile.jpg); background-repeat: no-repeat; background-size: 100% auto; z-index: 1; display: none; overflow: hidden; width: 100%; }
.bg-video-m { min-height: 270px; width: 100%; height: 100%; }
/* ============ BG-VIDEO-WRAPPER-M //============ */


/* ============ OVERLAY-LAYER1 ============ */
#overlay-layer1 { position: absolute; z-index: 999; width: 100%; height: 100%; background-color: rgba(0,0,0, 0.85); display: none; }
/* ============ OVERLAY-LAYER1 //============ */


/* =========== VIDEO-LAYER =========== */
.video-layer { position: absolute; z-index: 1000; width: 1; height: 1; opacity: 0; }

.section-gen.section-gen-video { margin-left: auto; margin-right: auto; text-align: center; padding-top: 44px; padding-bottom: 70px; }

.section-gen.intro-video { margin-left: auto; margin-right: auto; text-align: center; padding-top: 44px; padding-bottom: 95px; }

.main-index .section-gen.intro-video { padding-bottom: 50px; }

.section-gen-video .sub-title, .intro-video .sub-title { margin: 0; padding-bottom: 50px; color: #949494; font-size: 46px; line-height: 1.5; font-weight: 100; }

.video-container-wrap { position: relative; width: 90%; max-width: 980px; max-height: 560px; margin-left: auto; margin-right: auto; text-align: center; background-color: #e7e7e7; border: solid 10px #e7e7e7; border-radius: 6px; }

.video-container { position: relative; 
	padding-bottom: 56.25%;  /* proportion value to aspect ratio 16:9 (9 / 16 = 0.5625 or 56.25%) */
	padding-top: 0; height: 0; overflow: hidden; }

.video-container iframe, .video-container object, .video-container embed { position: absolute; top: 1px; left: 0; width: 100%; height: 100%; background-color: #e7e7e7; }

.video-container iframe { border: 0; }

img.video-thumbnail { border: solid 10px #e7e7e7 ; border-radius: 6px; width: 95%; height: 95%; max-width: 960px; max-height: 540px; opacity: 0.8; transition: all 0.25s linear 0s; cursor: pointer; }
img.video-thumbnail:hover { opacity: 1; }

.video-close-button { position: absolute; z-index: 1001; width: 100%; max-width: 740px; text-align: right; right: -30px; top: -34px; cursor: pointer; }
.video-close-button .fa { font-size: 24px;  color: #e7e7e7; }

.noscroll { position: fixed; width: 100%; overflow-y: auto; }
/* =========== VIDEO-LAYER //=========== */


/* =========== W-VIDEO (WISTIA) =========== */
.section-gen.w-video { padding: 20px 10px 70px; }
.section-gen.w-video.w-video-homepage-top { padding-top: 10px; padding-bottom: 30px; }
.w-video-content { max-width: 960px; margin-left: auto; margin-right: auto; text-align: center;  }
.w-video .sub-title { padding-bottom: 30px; color: #949494; font-size: 46px; line-height: 1.5; font-weight: 100; }

.section-gen.w-video.w-video-kfg-main .btn-position { padding-top: 30px; }

.resource .wistia_embed { display: inline; position: relative; } /* the span class wraps around Wistia video button link */
/* =========== W-VIDEO //=========== */


/* =========== LOGO-SLIDER-WRAPPER =========== */
.logo-slider-header { padding-top: 15px; padding-bottom: 15px; background-color: #ffffff; font-size: 34px; text-align: center; font-weight: 100; }

.logo-slider-wrapper { position: relative; padding-top: 20px; padding-bottom: 40px; background-color: #fff3e7; opacity: 0.9; }
.logo-slider { width: 100%; max-width: 980px; margin: 0 auto; }
.logo-slider-item img { position: relative; margin: 0 auto; text-align: center; opacity: 0.5; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; }
.logo-slider-item img:hover { opacity: 1; }
.logo-slider-wrapper .slick-slider { margin-bottom: 0; }
/* =========== LOGO-SLIDER-WRAPPER //=========== */


/* =========== TECH-LOGO-SLIDER-WRAPPER =========== */
.tech-logo-slider-header { padding-top: 38px; padding-bottom: 25px;  background-color: #ffffff; font-size: 34px; text-align: center; font-weight: 100; }

.tech-logo-slider-wrapper { position: relative; padding-top: 15px; padding-bottom: 45px; background-color: #ffffff; opacity: 0.9; }
.tech-logo-slider { width: 100%; max-width: 980px; margin: 0 auto; }
.tech-logo-slider .logo-slider-item img { position: relative; margin: 0 auto; text-align: center; opacity: 0.5; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; }
.tech-logo-slider .logo-slider-item img:hover { opacity: 1; }
.tech-logo-slider-wrapper .slick-slider { margin-bottom: 0; }
/* =========== LOGO-SLIDER-WRAPPER //=========== */


/* =========== MSG-QUOTE =========== */
.section-gen.msg-quote { padding-top: 62px; padding-bottom: 80px; font-weight: 100; }
.msg-quote .main-grid { max-width: 880px; margin-left: auto; margin-right: auto; text-align: center; }
.msg-quote .msg-icon, .msg-quote .msg-text { float: left; position: relative; }
.msg-quote .msg-icon { padding-top: 24px; text-align: right; overflow: hidden; }
.msg-quote .msg-icon img { width: 146px; }
.msg-quote .msg-text { padding-top: 12px; padding-left: 20px; color: #868686; font-size: 40px; line-height: 1.4; max-width: 730px; }
.msg-quote .msg-source { color: #999999; font-style: italic;  font-size: 25px; }

.msg-quote .msg-icon-m { display: none; }
/* =========== MSG-QUOTE //=========== */


/* =========== all-road =========== */
.all-road { margin: 0 auto; padding-top: 50px; padding-bottom: 47px; text-align: center; }
.all-road-title, .all-road-sub-title { text-align: center; color: #999999; }
.all-road-title { margin-bottom: 5px; font-size: 40px; font-weight: 100; }
.all-road-sub-title { margin-bottom: 40px; font-size: 18px; }
.all-road .all-road-img { width: 96%; max-width: 900px; height: auto; }
/* =========== all-road //=========== */


/* =========== SECTION-TWIN (at 2 locations: api.php and twin-caching.php) =========== */
.section-twin { position: relative; padding-top: 0 ; padding-bottom: 0; padding-left: 10px; padding-right: 10px; font-size: 16px; font-weight: 300; color: #999999; overflow: hidden; }
.flex-wrapper { overflow: hidden; }
.section-gen.section-twin .title { position: relative; padding-top: 80px; padding-bottom: 60px; color: #949494; }
.twin-text { position: relative; margin-top: 12px; overflow: hidden; }
.twin-text:last-child { padding-bottom: 88px; }
.section-twin .twin-logo img { position: relative; margin-top: 18px; margin-left: 7px; margin-bottom: 5px; }

.section-twin .twin-circle { position: relative; margin-left: auto; margin-right: auto; text-align: center; padding-top: 50px; padding-bottom: 90px; }
.section-twin .twin-circle-img { width: 100%; max-width: 600px; height: auto; }
/* =========== SECTION-TWIN //=========== */


/* =========== TWIN-CACHING-WRAPPER (twin-caching.php) =========== */
#main.twin-wrapper .section-gen.section-twin .title { padding-top: 60px; padding-bottom: 50px;}

.section-twin-download { padding-top: 60px; padding-bottom: 90px; /*background-color: #f5f5f5;*/ font-weight: 300; }
.section-twin-download .flex-wrapper { max-width: 890px; }
.section-twin-download .title { padding-bottom: 49px; text-align: center; color: #777777; font-size: 48px; }
.section-twin-download .sub-title { padding-top: 0; padding-bottom: 46px; text-align: center; color: #aaaaaa; font-size: 17px; }
.section-twin-download h2 { padding-bottom: 10px; padding-top: 12px; color: #f89938; font-size: 25px; line-height: 1.4; font-weight: 300; }
.section-twin-download .icon { position: relative; }
.section-twin-download p { margin-bottom: 0; padding-top: 0; font-size: 15px; line-height: 1.6; }

.section-twin-download .twin-download-item { position: relative; min-width: 215px; margin-left: 3px; margin-right: 3px; padding: 30px 20px; background-color: #ffffff; border-radius: 6px; box-shadow: 0 0 6px 1px rgba(0,0,0, 0.18); }

.section-twin-download .btn-orange-flat, .section-twin-download .btn-gray-flat { height: 32px; line-height: 32px; padding: 0 20px; margin-top: 24px; font-size: 15px; font-weight: 400; }
.section-twin-download .btn-orange-flat:hover, .section-twin-download .btn-gray-flat:hover { color: #ffffff; }

.section-twin-download .btn-after { margin-left: 8px; }
.section-twin-download .small-text { font-size: 12px; opacity: 0.5; }
.section-twin-download .em-text { color: #888888; font-weight: 400; }
.section-twin-download .light-gray-text { color: #999999; }
/* =========== TWIN-CACHING-WRAPPER //=========== */


/* =========== VISITOR-DETECTION =========== */
.visitor-detection-wrapper { width: 100%; max-width: 850px; margin-left: auto; margin-right: auto; }
.visitor-detection { position: relative; padding: 0 10px; font-size: 16px; font-weight: 300; color: #999999; overflow: hidden; }
.visitor-detection .title { position: relative; text-align: center; top: 30px; padding-top: 0; padding-bottom: 30px; color: #949494; }
.visitor-detection .title .darkgray { color: #333333; }
.visitor-detection-logo { padding-top: 20px; }
/* =========== VISITOR-DETECTION //=========== */


/* =========== STAT BAR =========== */
.section-gen.stat-bar { overflow: hidden; }
.section-gen.stat-bar .title { position: relative; color: #949494; padding-bottom: 107px; }

.comp-chart { height: 320px; position: relative; }

.comp-chart .chart-x-axis { border: 1px solid #b1b1b1; bottom: -2px; left: 0; position: absolute; right: 0; }
.comp-chart .chart-axis-label { position: absolute; width: 160px; }

.comp-chart .chart-axis-label.y-top, 
.comp-chart .chart-axis-label.y-middle, 
.comp-chart .chart-axis-label.y-bottom { left: -180px; text-align: right; }

.comp-chart .chart-axis-label.y-top { top: 0; }
.comp-chart .chart-axis-label.y-middle { top: 48.5%; }
.comp-chart .chart-axis-label.y-bottom { bottom: 0; }
.comp-chart .chart-axis-label.small { font-size: 12px; }

.comp-chart .chart-bar { background-color: #f5a22b; bottom: 0; height: 50%; position: absolute; width: calc(100%/10); }


.comp-chart .chart-bar .chart-bar-percentage { text-align: center; font-size: 40px; font-weight: 100; margin-top: -57px; color: #949494; }
.comp-chart .chart-bar .chart-bar-percentage sup { font-size: 22px; opacity: 0.8; } 

.bar-label { float: left; width: 104px; margin-left: 42px; text-align: center; padding-top: 11px; color: #949494; font-size: 16px; font-weight: 300; }
.bar-label.first-bar-label { margin-left: 0; }
.comp-chart-note { text-align: center; font-style: italic; padding-top: 20px; font-size: 14px; opacity: 0.7; }
/* =========== STAT BAR //=========== */


/* =========== API-ANI-WRAP =========== */
.api-ani { margin: 0 auto; padding-top: 50px; padding-bottom: 40px; text-align: center; width: 666px; }
.api-ani:after { content: ""; display: table; clear: both; }
.api-item { float:left; }
.api-ani-mobile { width: 134px; padding-top: 23px; padding-right: 5px; }
.api-ani-gear { width: 176px; padding-top: 0; }
.api-ani-server { width: 134px; padding-top: 23px; padding-left: 5px; }

.api-ani-arrow { padding-top: 77px; padding-left: 25px; padding-right: 25px; }

/* =========== API-ANI-WRAP //=========== */


/* =========== API-ANI-WRAP-M =========== */
.api-ani-wrap-m { display: none; margin: 0 auto; text-align: center; }
.api-ani-wrap-m .title { padding-top: 10px; padding-bottom: 40px; font-size: 19px; font-weight: 300; }
.api-ani-wrap-m img { display: block; clear: both; margin: 0 auto; text-align: center; }


.api-ani-wrap-m img:nth-of-type(2) { padding-top: 20px; padding-bottom: 15px; }
.api-ani-wrap-m img:nth-of-type(4) { padding-top: 15px; padding-bottom: 20px; }


/* =========== API-ANI-WRAP-M //=========== */


/* =========== API-BUILDER =========== */
.section-gen.flip-builder { padding-top: 0; }
.builder-wrapper { position: relative; max-width: 656px; height: 360px;  margin: 0 auto; text-align: center; cursor: pointer; }
.builder-face { position: absolute; width: 656px; height: 360px; }

.builder-content { margin: 0 auto; text-align: center; }


.builder-desc h1 { max-width: 810px; margin: 0 auto; text-align:center; padding-top: 30px; font-size: 20px; font-weight: 300; color: #999999; }
/* =========== API-BUILDER //=========== */


/* =========== API-BUILDER-M =========== */
.main-grid-builder-m { display: none; }
.main-grid-builder-m .builder-wrapper { max-width: 320px; }
.main-grid-builder-m .builder-face { width: 320px; }

.main-grid-builder-m .builder-desc { max-width: 320px; font-size: 15px; }
/* =========== API-BUILDER-M //=========== */


/* =========== FLIP-CARD =========== */
.flip-card .title, .flip-card-m .title { padding-bottom: 10px; }
.flip-card .sub-title, .flip-card-m .sub-title { padding-top: 10px; padding-bottom: 50px; }
.flip-card .col-1-3 { padding: 0; }

.card-wrapper { position: relative; -webkit-font-smoothing: antialiased; 
max-width: 310px; height: 180px; margin: 0 auto; text-align: center; overflow-x: hidden; margin-top:33px; margin-bottom: 0; cursor: pointer; }

.card-content { margin: 0 auto; text-align: center; width: 310px; }
.card-img img { width: 90px; height: 90px; margin: 0 auto; text-align: center; }

.card-face { position: absolute; overflow: hidden; background-color: #ffffff /*#fafafa;*/ }
.front { padding-top: 18px; }
.back { padding-top: 28px; }

.card-title { font-size: 16px; color: #f89938; font-weight: 400; }
.front .card-title { padding-top: 8px; color: #666666; }
.card-desc { color: #777777; font-size: 15px; padding-top: 10px; padding-bottom: 10px; line-height: 1.6 }
/* =========== FLIP-CARD //=========== */


/* =========== FLIP CARD-M =========== */
.flip-card-m { display: none; }
.flip-card-m .card-item { padding-bottom: 70px; }
.flip-card-m .card-title { padding-top: 10px; font-size: 19px; font-weight: 300; }
.flip-card-m .card-desc { padding-left: 0; padding-right: 0; overflow-x: hidden; }

/* =========== FLIP CARD-M //=========== */


/* =========== IPC-WRAPPER (IP CIRCLES) =========== */
.ipc-wrapper { width: 900px; height: 610px; margin-left: auto; margin-right: auto; margin-top: 37px; margin-bottom: 90px; position: relative; }
.ipc-content { width: 900px; height: 610px; }

.ipc .iptxt { line-height: 23px; color: #333333; font-family: Helvetica, Verdana, Arial; font-size: 15px; font-weight: 100; }

.ipc .wrapper-a, .ipc .wrapper-b, .ipc .wrapper-c, .ipc .wrapper-d, .ipc .wrapper-e, .ipc .wrapper-f, .ipc .wrapper-g, .ipc .wrapper-h { position: absolute; }

.ipc .wrapper-a { left: 160px; top: 7px; }
.ipc .wrapper-b { left: 5px; top: 217px; }
.ipc .wrapper-c { left: 405px; top: 102px; }
.ipc .wrapper-d { left: 595px; top: 62px; }
.ipc .wrapper-e { left: 720px; top: 292px; }
.ipc .wrapper-f { left: 150px; top: 400px; }
.ipc .wrapper-g { left: 390px; top: 460px; }
.ipc .wrapper-h { left: 590px; top: 422px; }

.ipc div.a, .ipc div.b, .ipc div.c, .ipc div.d, .ipc div.e, .ipc div.f, .ipc div.g, .ipc div.h { position: relative; background-color: #cccccc; border-radius: 100%; }

.ipc div.a { width: 225px; height: 225px; }
.ipc div.b { width: 200px; height: 200px; }
.ipc div.c { width: 150px; height: 150px; }
.ipc div.d { width: 225px; height: 225px; }
.ipc div.e { width: 150px; height: 150px; }
.ipc div.f { width: 185px; height: 185px; } 
.ipc div.g { width: 125px; height: 125px; }
.ipc div.h { width: 150px; height: 150px; }

.ipc .a-img, .ipc .b-img, .ipc .c-img, .ipc .d-img, .ipc .e-img, .ipc .f-img, .ipc .g-img, .ipc .h-img { position: absolute; }

.ipc .a-img { left: 75px; top: 20px; }
.ipc .b-img { left: 65px; top: 20px; }
.ipc .c-img { left: 45px; top: 15px; }
.ipc .d-img { left: 75px; top: 15px; }
.ipc .e-img { left: 20px; top: 35px; }
.ipc .f-img { left: 60px; top: 20px; }
.ipc .g-img { left: 40px; top: 15px; }
.ipc .h-img { left: 45px; top: 15px; }

.ipc .a-img img { width: 75px; }
.ipc .b-img img { width: 75px; }
.ipc .c-img img { width: 65px; }
.ipc .d-img img { width: 100px; }
.ipc .e-img img { width: 110px; }
.ipc .f-img img { width: 75px; }
.ipc .g-img img { width: 60px; }
.ipc .h-img img { width: 60px; }

.ipc #a-data, .ipc #b-data, .ipc #c-data, .ipc #d-data, .ipc #e-data, .ipc #f-data, .ipc #g-data, .ipc #h-data { position: absolute; text-align: center; display: none; }

.ipc #a-data { width: 200px; left: 11px; top: 100px; }
.ipc #b-data { width: 175px; left: 11px; top: 105px; }
.ipc #c-data { width: 130px; left: 11px; top: 90px; }
.ipc #d-data { width: 225px; top: 130px; }
.ipc #e-data { width: 150px; top: 80px; }
.ipc #f-data { width: 185px; top: 110px; }
.ipc #g-data { width: 125px; top: 85px; }
.ipc #h-data { width: 155px; top: 80px; }

.ipc #a-spin, .ipc #b-spin, .ipc #c-spin, .ipc #d-spin, .ipc #e-spin, .ipc #f-spin, .ipc #g-spin, .ipc #h-spin { position: absolute; }

.ipc #a-spin { left: 100px; top: 140px; }
.ipc #b-spin { left: 90px; top: 120px; }
.ipc #c-spin { left: 63px; top: 95px; }
.ipc #d-spin { left: 100px; top: 140px; }
.ipc #e-spin { left: 62px; top: 85px; }
.ipc #f-spin { left: 80px; top: 120px; }
.ipc #g-spin { left: 50px; top: 85px; }
.ipc #h-spin { left: 60px; top: 95px; }

.ipc .ipbtn, .ipc .ipbtnover, .ipc .ipbtnout { width: 96px; height: 42px; line-height: 36px; position: absolute; left: 430px; top: 387px; text-align: center; background-color: #333333; border-radius: 20px; border: 3px solid #dddddd; color: #cccccc; font-family: Helvetica, Verdana, Arial; font-size: 16px; font-weight: 100; transition: all 300ms linear 0s; cursor: pointer; display: none; }

.ipc .ipbtnover { background-color: #d9d9d9; color: #5e5e5e; border-color: #bbbbbb; }


.ipc .odometer-wrapper { position: absolute; left: 240px; top: 252px; width: 500px; height: 255px; background-image: url('../img/ip-circles/ipc-arrows.png'); background-repeat: no-repeat; }
.ipc .odometer { position: relative; top: 75px; left: 90px; color: #ff9933; font-family: Helvetica, Verdana, Arial; font-weight: 100; font-size: 40px; }

#ipcircle-anchor { position: relative; top:-60px; }
.ipc-note { position: relative; top: -50px; margin-left: auto; margin-right: auto; text-align: center; color: #999999; font-size: 13px; font-style: italic; }
/* =========== IPC-WRAPPER //=========== */


/* =========== NOTFOUND =========== */
.notfound { width: 100%; max-width: 850px; margin-left: auto; margin-right: auto; padding-top: 100px; }
#canvas_notfound { width: 100%; max-width: 850px; }
/* =========== NOTFOUND =========== */


/* =========== BANNER-BOMBORA =========== */
.banner-bombora { margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; background-color: #2f2f2f; }
.banner-bombora .banner-wrapper { margin: 0 auto; text-align: center; }
.banner-bombora .banner-wrapper img { width: 100%; max-width: 980px; }
/* =========== BANNER-BOMBORA //=========== */


/* =========== API-QUOTE =========== */
.section-gen.api-quote { padding: 0 0 70px; text-align: center; overflow: hidden; }

/* .quote-slider and .slider-item need to have "width: 100%" so slider can slide the whole screen and not cut off at 950px.
		To control the max-width of 950px for the content, set it on the item inside .slider-item like ".quote-text", ".quote-source"
*/
.quote-slider { width: 100%; margin-left: auto; margin-right: auto; background-color: transparent; }
.quote-slider .slider-item { width: 100%; }

.quote-slider .slider-item .quote-logo { position: relative; padding-top: 45px; padding-bottom: 16px; opacity: 1; cursor: pointer; }
.quote-slider .slider-item-short .quote-logo { padding-top: 100px; }
.quote-slider .slider-item-mrc .quote-logo { padding-top: 60px; }
.quote-slider .slider-item-kwanzoo .quote-logo { padding-top: 70px; }

.quote-slider .slider-item .quote-logo a { display: inline-block; }
.quote-slider .slider-item .quote-logo img { margin-left: auto; margin-right: auto; }

.api-quote .quote-msg { position: relative; margin-left: 10px; margin-right: 10px; padding-left: 40px; padding-right: 40px; font-size: 18px; font-weight: 300; color: #666666; text-align: left; font-style: italic; line-height: 1.7; }

.api-quote .quote-msg .quote-text { position: relative; max-width: 950px; padding-top: 20px; padding-left: 28px; margin-left: auto; margin-right: auto; opacity: 1; }
.api-quote .quote-msg .quote-text:first-child { background: url(../img/quote1.png) 0 0 no-repeat; padding-top: 45px; }

.api-quote .quote-source { position: relative; max-width: 910px; min-height: 141px; margin-left: auto; margin-right: auto; margin-top: 20px; padding-top: 52px; padding-right: 167px; background: url(../img/company/Bombora-RobArmstrong.png) right 0 no-repeat; text-align: right;  color: #999999; font-size: 15px; font-style: normal; line-height: 1.5; opacity: 1; }

.api-quote .quote-source .quote-source-name { color: #888888; position: relative; font-weight: 400; }

.api-quote .quote-source.three-line { padding-top: 38px; }
.quote-slider .slider-item-techtarget .quote-source { background-image: url(../img/case-study/TechTarget-JustinHoskins.png); }
.quote-slider .slider-item-terminus .quote-source { background-image: url(../img/case-study/Terminus-BryanBrown.png); }
.quote-slider .slider-item-five9 .quote-source { background-image: url(../img/case-study/Five9-JasonYang.png); }
.quote-slider .slider-item-idio .quote-source { background-image: url(../img/case-study/Idio-EdwardBarrow.png); }
.quote-slider .slider-item-bombora .quote-source { background-image: url(../img/case-study/Bombora-RobArmstrong.png); }
.quote-slider .slider-item-captora .quote-source { background-image: url(../img/case-study/Captora-JosephRosenfeld.png); }
.quote-slider .slider-item-everstring .quote-source { background-image: url(../img/case-study/EverString-VictorLiu.png); }
.quote-slider .slider-item-engagio .quote-source { background-image: url(../img/case-study/Engagio-BrianBabcock.png); }
.quote-slider .slider-item-triblio .quote-source { background-image: url(../img/case-study/Triblio-AndreYee.png); }
.quote-slider .slider-item-multiview .quote-source { background-image: url(../img/case-study/Multiview-AndrewKretzschmer.png); }
.quote-slider .slider-item-mrc .quote-source { background-image: url(../img/case-study/MRC-ZaneCurtis.png); }
.quote-slider .slider-item-zeniq .quote-source { background-image: url(../img/case-study/ZenIQ-SrihariKumar.png); }
.quote-slider .slider-item-pulse .quote-source { background-image: url(../img/case-study/Pulse-RickyAbbott.png); }
.quote-slider .slider-item-kwanzoo .quote-source { background-image: url(../img/case-study/Kwanzoo-ManiIyer.png); }
.quote-slider .slider-item-bonfire .quote-source { background-image: url(../img/case-study/Bonfire-JamesWilliamson.png); }
.quote-slider .slider-item-rollworks .quote-source { background-image: url(../img/case-study/RollWorks-MikeStocker.png); }
.quote-slider .slider-item-g2 .quote-source { background-image: url(../img/case-study/G2-PatrickBarnes.png); }

.api-quote .view-case-study { text-decoration: none; color: #f89938; font-style: normal; }
.api-quote .view-case-study:hover { color: #666666; }
/* =========== API-QUOTE //=========== */


/* =========== INDEX-SLIDER =========== */
.section-gen.index-slider-wrapper { padding: 0; text-align: center; overflow: hidden; }
.index-slider { width: 100%; margin-left: auto; margin-right: auto; background-color: transparent; }

.index-slider .trademark { position: relative; top: -15px; left: 0; font-family: Roboto, Helvetica, sans-serif; font-size: 20px; font-weight: 100; opacity: 0.5; }

.index-slider .slider-item { position: relative; width: 100%; height: 500px; background: #1d1d1d url(../img/slider/slider-bg1.jpg) center center no-repeat; }

.index-slider .slider-item-content { position: relative; max-width: 950px; margin-left: auto; margin-right: auto; text-align: left; top: 50%; transform: translateY(-50%); color: #ffffff; }

.index-slider .slider-item-icon { display: inline-block; width: 30%; max-width: 285px; }
.index-slider .slider-item-text { display: inline-block; width: 68%; max-width: 646px; }
.index-slider .slider-item-text a, .index-slider .slider-item-text a:hover { color: #ffffff; }

.index-slider .slider-item-icon img { margin-left: auto; margin-right: auto; text-align: center; }

.index-slider h2, .index-slider p, .index-slider .btn-position { width: 100%; max-width: 646px; padding-left: 10px; padding-right: 10px; }


.index-slider .center .slider-item-content { max-width: 760px; }
.index-slider .center .slider-item-icon { display: none; }
.index-slider .center .slider-item-text { width: 100%; max-width: 760px; }
.index-slider .center h2, .index-slider .center p, .index-slider .center .btn-position { width: 100%; max-width: 950px; text-align: center; padding-left: 10px; padding-right: 10px; }
.index-slider .center h2 { margin-bottom: 20px; font-size: 46px; }
.index-slider .center p { margin-bottom: 30px; font-size: 18px; }

.index-slider .text-right-60 .slider-item-icon { width: 40%; max-width: 380px; }
.index-slider .text-right-60 .slider-item-text { width: 58%; max-width: 551px; }

.index-slider h2 { margin-bottom: 40px; line-height: 1.3; font-size: 40px; font-weight: 100; }
.index-slider p { margin-bottom: 20px; line-height: 1.6; margin-top: 10px; font-size: 18px; }
.index-slider .btn-position { text-align: right; margin-top: 40px; }

.index-slider .btn-orange2 { height: 40px; line-height: 39px; padding: 0 18px; font-size: 16px; }


.index-slider-video-wrapper { width: 100%; height: 500px; background-color: #000000; }
.index-slider-video { max-width: 1500px; height: 500px; margin-left: auto; margin-right: auto; text-align: center; }
.index-slider .video-msg { position: absolute; z-index: 2; max-width: 950px; text-align: center; top: 35%; transform: translateY(-50%); left: 50%; transform: translateX(-50%); color: #ffffff; font-size: 40px; font-weight: 100; }
.index-slider .video-msg .btn-position-video { margin-top: 15px; }
.index-slider .video-thumbnail { cursor: pointer; }

.index-slider .video-msg-api { position: absolute; z-index: 2; max-width: 950px; text-align: center; top: 15%; transform: translateY(-50%); left: 50%; transform: translateX(-50%); color: #ffffff; font-size: 40px; font-weight: 100; }
.index-slider .video-msg-api .video-title { max-width: 700px; font-size: 40px; font-weight: 100; }
.index-slider .video-msg-api .video-subtitle { max-width: 700px; margin-top: 105px; font-size: 18px; font-weight: 300; }


.index-slider .video-msg-api .btn-position-video { margin-top: 20px; }

.index-slider .slider-video .video-msg-api a, .index-slider .slider-video .video-msg-api a:hover { color: #ffffff; }

.index-slider .img-play { width: 96%; height: 96%; max-width: 386px; max-height: 216px; margin-left: auto; margin-right: auto; text-align: center; background-color: #000000; } /* need set background color for this so the slider background doesn't show through the video on off state */
.index-slider .img-play img.video-thumbnail { width: 100%; height: 100%; max-width: 386px; max-height: 216px; margin-left: auto; margin-right: auto; text-align: center; border: 0; border-radius: 0; opacity: 1; }
.index-slider .img-play img.video-thumbnail:hover { opacity: 0.9; } 

/* ===== OVERWRITE LIB ===== */
.index-slider.slick-slider { margin-bottom: 0; }

/* Slider Arrow */
.index-slider .slick-prev, .index-slider .slick-next { width: 27px; height: 45px; opacity: 0.3; transition: all 300ms linear 0s; }
.index-slider .slick-prev:hover, .index-slider .slick-next:hover { opacity: 1; }

/* Slider Dots */
.index-slider .slick-dots { bottom: 20px; }
.index-slider .slick-dots li button:before { font-size: 18px; opacity: 0.3; color: #fef1e8; }
.index-slider .slick-dots li.slick-active button:before { opacity: 0.8; color: #e07832; }
/* ===== OVERWRITE LIB //===== */


/* ===== TYPING TEXT ===== */
.typing-text-wrapper { width: 1000px; margin-top: -100px; color: #ffffff; font-size: 55px; }
.typing-text { color: #f4d598; }
/* ===== TYPING TEXT ===== */

/* =========== INDEX-SLIDER //=========== */


/* =========== FAQ =========== */
.faq { position: relative; padding-left: 7px; padding-right: 7px; text-align: left; line-height: 1.7; }
.faq-q { 
	position: relative; display: block; text-decoration: none;
	margin-top: 3px; border-radius: 3px; padding: 9px 0 10px 29px; cursor: pointer; font-size: 14px;
	background-color: #f3f3f3; color: #666666; font-weight: 300;
 }
.faq-q:nth-child(1) { margin-top:40px; }

.faq-a { position: relative; padding: 10px 15px 20px 36px; display: none; }

.faq-a p { padding-top: 8px; }
.faq-a ul { list-style-type: none; padding: 0; margin: 0; }

.faq ul { list-style-type: none; padding: 0; margin: 0; margin-top: 5px; }
.faq li { background: url(../img/tick-gray.png) 0 8px no-repeat; padding-left: 20px; padding-top: 0; padding-bottom: 0; margin-top: 11px; margin-bottom: 11px; }
.faq li li { background: url(../img/li-dot.png) 0 8px no-repeat; padding-left: 20px; }

.faq-icon { position: absolute; left: 11px; top: 11px;  width: 19px; height: 19px; background: url(../img/plus-gray.png) 0 1px no-repeat; }

.faq-text { position: relative; display: inline-block; margin-left: 7px; }

/* =========== FAQ =========== */


/* =========== KF-PRODUCT =========== */
.kfcol { padding: 10px; max-width:500px; margin-left:auto; margin-right: auto; }
.kfcol-inner { background-color: #ffffff; border-radius: 2px; padding: 10% 7%; font-size: 17px; font-weight: 100; }

.kfcol h2 { color: #f89938; font-size: 28px; font-weight: 300; margin-left: auto; margin-right: auto; padding-top: 10px; padding-bottom: 10px; }

.icon-kf { margin: 0 auto; text-align: center; }
.icon-kf img { width:75%; height: 75%; max-width:190px; max-height: 190px; }

.kf-product [class*="col-1-"] { padding-left: 10px; padding-right: 10px; }

.kf-product .product-desc { padding-bottom: 10px; }


/* =========== KF-PRODUCT //=========== */


/* =========== PRODUCT-SINGLE =========== */
.section-gen.top-intro { padding-top: 55px; padding-bottom: 65px; }
.product-single h2 { color: #f89938; font-size: 46px; font-weight: 100; padding-top: 25px; padding-bottom: 10px; line-height: 1.2; }
.product-single p { font-size: 16px; }
.product-single .col-1-3 img { width:75%; height: 75%; max-width:190px; max-height: 190px; }
/* =========== PRODUCT-SINGLE //=========== */


/* =========== PRODUCT-SCREENSHOT =========== */
.product-screenshot .title { color: #f89938; font-size: 42px; font-weight: 300; padding-top: 10px; padding-bottom: 10px; line-height: 1.2; }
.product-screenshot .sub-title { font-size: 18px; }

/* =========== PRODUCT-SCREENSHOT //=========== */

/* =========== VS-FORM =========== */
.vs-form { width: 100%; max-width: 630px; margin: 0 auto; color: #848484; font-size: 14px; font-weight: 300; position: relative; }
.vs-form .title, .vs-form h1 .title { padding-bottom: 3px; text-align: center; color: #949494; font-size: 46px; font-weight: 300; }
.vs-form .sub-title, .vs-form h1 .sub-title { padding-bottom: 20px; text-align: center; color: #aaaaaa; font-size: 16px; font-weight: 300; }

.vs-form .row { margin-bottom: 0; }
.vs-form .item { width: 295px; height: 83px; margin: 0 auto; text-align:center; margin-top: 20px; margin-bottom: 0; border-radius: 8px; background-color: #f3f3f3; color: #888888; position: relative; transition: all 300ms linear 0s; }
.vs-form .item-active { background-color: rgba(241,172,50, 0.15); color: #666666; transition: all 300ms linear 0s; }

.vs-form .item .label { padding: 13px 2px 2px 16px; text-align: left; }
.vs-form .item input, .vs-form .item textarea { margin-top: 2px; width: 263px; height: 28px; border: solid 1px transparent; 
	font-weight: 400; font-size: 14px; color: #666666; background-color: #ffffff; border-radius: 4px;
 }
.vs-form .item input.input-long { width: 584px; }

/* red border around required input box that need correct input */
.vs-form .item input.input-error { border: solid 1px rgba(170,0,0, 0.7); box-shadow: 0 0 5px rgba(157,82,98, 0.6); }

.vs-form .item-long { width: 620px; }

.vs-form .item-textarea { width: 620px; height: 166px; }	/* dimension of an item that contains a textarea */
.vs-form .item-textarea textarea { width: 584px; height: 109px; }	/* dimension of the innner textarea itself */

/* submit button */
.vs-form .item-submit, .vs-form .item-submit-wrapper { margin: 0 auto; text-align: center; }
.vs-form .item-submit input { width: 620px; height: 57px; margin-top: 20px; padding: 0; border: 0; border-radius: 8px; cursor: pointer;	background-color: rgba(235,133,16, 0.8); color: #ffffff; font-family: Roboto; font-weight: 300; font-size: 20px; text-shadow: 1px 1px 0 rgba(178,80,12, 0.5); transition: all 250ms linear 0s; }

.vs-form .item-submit .item-submit-inner, .vs-form input[type="submit"] { width: 620px; height: 57px; margin: 0 auto; text-align: center; margin-top:19px; padding: 0; border: 0; border-radius: 8px; cursor: pointer;	background-color: rgba(235,133,16, 0.8); color: #ffffff; font-family: Roboto; font-weight: 300; font-size: 20px; line-height: 55px; text-shadow: 1px 1px 0 rgba(178,80,12, 0.5); transition: all 250ms linear 0s; }

.vs-form .item-submit input.submit-short, .vs-form .item-submit .item-submit-inner.submit-short, .vs-form input[type="submit"].submit-short  { width: 295px; }
.vs-form .item-submit input:hover, .vs-form .item-submit .item-submit-inner:hover, .vs-form input[type="submit"]:hover { background-color: rgba(247,167,47, 1); text-shadow: 1px 1px 0 rgba(217,140,14, 0.7); }


/* --------- INPUT BOX ERROR MESSAGE --------- */
.vs-form .error-msg:before { position: absolute; width: 161px; height: 29px; padding-top: 5px; top:-5px; left:-8px; color: #ffffff; border-radius: 6px; 
	content:"Please fill out this field"; font-size: 11px; text-align:center; 
	box-shadow: 0 1px 6px rgba(0, 0, 0, 0.4);
	background-color: #333333; 	
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #444444), color-stop(1, #333333) );
	background:-moz-linear-gradient( center top, #444444 5%, #333333 90% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#444444', endColorstr='#333333');	
 }

.vs-form .error-msg:after { position: absolute; content:""; border-color: rgba(255,0,0,0) rgba(255,0,0,0) rgba(68,68,68, 1) rgba(255,0,0,0);
	border-style:solid; border-width:0px 10px 10px 10px; -moz-transformation:scale(.9999); left:9px; top:-12px; 
 }

.vs-form .msg-name:before { content: "Please enter your First and Last Name."; width: 214px; }
.vs-form .msg-first-name:before { content: "Please enter your First Name."; width: 166; }
.vs-form .msg-last-name:before { content: "Please enter your Last Name."; width: 166px; }
.vs-form .msg-email:before { content: "Please enter a valid email address."; width: 190px; }
.vs-form .msg-phone:before { content: "Please enter your Telephone number."; width: 206px; }
.vs-form .msg-website:before { content: "Please enter your Domain name (Web Address)."; width: 258px; }
.vs-form .msg-password:before { content: "Please enter minimum 6 characters."; width: 214px; }

.vs-form .error-msg { display: none; position: absolute; z-index:2; top:56px; }
/* --------- INPUT BOX ERROR MESSAGE //--------- */


/* --------- SIGNUP --------- */

.term-agreement { margin:0 auto; max-width: 620px; text-align:center; margin-top:23px; font-size: 13px; color: #929292; }
.term-agreement a { color: rgba(248,153,56, 0.7); }
.term-agreement a:hover { color: #999999; }
.vs-form.vs-form-signup .item-submit { text-align:center; }

.vs-form.vs-form-signup .item-submit item-submit-inner { margin-top:20px; width:295px; 
	background:rgba(235,133,16, 0.8) url(../img/lock-white.png) 53px 18px no-repeat; }

.vs-form.vs-form-signup .item-submit item-submit-inner:hover { background-color: rgba(247,167,47, 1); }

/* --------- SIGNUP //--------- */


/* --------- LOGIN --------- */
.keep-login-wrap { width: 295px; margin: -4px auto 0; text-align: center; color: #cccccc; }
.keep-login  { text-align: left; margin-left:-8px; }

.login-more-option { width: 295px; margin: 24px auto 70px; text-align:center; }
.login-more-option a { color: #cccccc; }
.login-more-option a:hover { color: #f89938; }
.login-more-option .login-more-option1 { float: left; }
.login-more-option .login-more-option2 { float: right; }

/* --------- LOGIN //--------- */


.stylish { 
    font-family: georgia, FontAwesome;
 }

/* =========== VS-FORM //=========== */


/* =========== CONTACT-US =========== */
.vs-address { text-align: center; padding-top: 25px; padding-bottom: 25px; }
.vs-address p { padding-top: 0; font-size: 16px; line-height: 2; }

.section-contact { padding-top: 60px; padding-bottom: 60px; }
.section-contact .flex-wrapper { max-width: 700px; } /* for 2 columns */
.section-contact h2 { padding-bottom: 0; padding-top: 5px; font-size: 23px; font-weight: 300; }
.section-contact .icon img { width: 125px; height: 125px; }
.section-contact p { text-align: left; font-size: 16px; line-height: 1.4; text-align: center; padding-top: 4px; }


/* hide Google logo and other related info */
a[href^="http://maps.google.com/maps"]{ display: none !important }
.gmnoprint a, .gmnoprint span { display: none; }
.gmnoprint div { background:none !important; }

.now-anchor { position: relative; top: -100px; }
/* =========== CONTACT-US //=========== */


/* =========== SECTION-PRODUCT =========== */
.section-gen.section-product { margin-top: 50px; padding-top: 0; padding-bottom: 70px; color: #999999; }
.section-product .icon { position: relative; top: 50px; margin-left: auto; margin-right: auto; text-align: center; }
.section-product .icon img { width: 125px; height: 125px; }
.section-product h2 { padding-top: 65px; padding-bottom: 15px; text-align: center; font-weight: 100; font-size: 24px; }
.section-product p { font-size: 16px; }
.section-product .vip { color: #ff9933; }
.section-product .col-1-3 { padding-left: 30px; padding-right: 30px; }
.section-product p a { text-decoration: none; color: #ff9933; transition: all 0.25s linear 0s; }
.section-product p a:hover { color: #f58c23; }

.section-product-index .col-1-3 { padding-left: 26px; padding-right: 26px; }

.btn-product-orange, 
.btn-product-gray { position: relative; left: 0; display: inline-block; height: 32px; line-height: 32px; margin-top: 20px; padding: 0 16px; border-radius: 4px; text-decoration: none; font-family: Roboto, Helvetica, sans-serif, Verdana, Arial; font-weight: 400; font-size: 13px; cursor: pointer; transition: all 300ms linear 0s; overflow: hidden; }

.btn-product-orange { margin-left: 7px; background-color: rgba(235,133,16, 1); color: #ffffff; text-shadow: 1px 1px 0 rgba(178,80,12, 0.5); }
.btn-product-orange:hover { background-color: rgba(247,167,47, 1); color: #ffffff; text-shadow: 1px 1px 0 rgba(193,91,0, 0.8); }

.btn-product-gray { background-color: #808080; color: #ffffff; }
.btn-product-gray:hover { background-color: #cccccc; color: #717171; }

#link-api, #link-live-leads, #link-kickfire-for-analytics { cursor: pointer; }
/* =========== SECTION-PRODUCT //=========== */


/* =========== PRICING =========== */
.section-pricing { padding-top: 60px; padding-bottom: 90px; background-color: #f5f5f5; font-weight: 300; }
.section-pricing .flex-wrapper { max-width: 890px; }
.section-pricing .title { padding-bottom: 22px; text-align: center; color: #777777; font-size: 48px; }
.section-pricing .sub-title { padding-top: 0; padding-bottom: 46px; text-align: center; color: #aaaaaa; font-size: 20px; }
.section-pricing h2 { padding-top: 0; padding-bottom: 10px; color: #f89938; font-size: 25px; line-height: 1.4; font-weight: 300; }
.section-pricing h2 .h2-small { color: #f89938; font-size: 20px; }

.section-pricing #pricing-item2 h2, .section-pricing #pricing-item3 h2 { padding-top: 17px; }


.section-pricing .icon { position: relative; }
.section-pricing .icon img { width: 170px; height: 170px; }
.section-pricing p { margin-bottom: 0; padding-top: 5px; padding-bottom: 10px; font-size: 15px; line-height: 1.6; }

.section-pricing .pricing-item { position: relative; min-width: 215px; margin-left: 3px; margin-right: 3px; padding: 17px 12px; background-color: #ffffff; border-radius: 6px; box-shadow: 0 0 6px 1px rgba(0,0,0, 0.18); }

.section-pricing .pricing-item ul { list-style-type: none; padding: 0; margin: 0; margin-top: 5px; }
.section-pricing .pricing-item li { text-align: left; background: url(../img/li-dot.png) 0 8px no-repeat; padding-left: 15px; padding-top: 0; padding-bottom: 0; margin-top: 5px; margin-bottom: 5px; font-size: 15px; line-height: 1.6; }

.section-pricing .tpl-box-item { position: relative; min-width: 215px; margin-left: 3px; margin-right: 3px; padding: 30px 20px; background-color: #ffffff; border-radius: 6px; box-shadow: 0 0 6px 1px rgba(0,0,0, 0.18); }

.section-pricing .btn-orange-flat, .section-pricing .btn-gray-flat { height: 32px; line-height: 32px; margin-top: 12px; margin-bottom: 14px; padding: 0 16px; font-size: 15px; font-weight: 400; }
.section-pricing .btn-orange-flat:hover, .section-pricing .btn-gray-flat:hover { color: #ffffff; }

.section-pricing #pricing-item2 .btn-orange-flat, .section-pricing #pricing-item2 .btn-gray-flat, .section-pricing #pricing-item3 .btn-orange-flat, .section-pricing #pricing-item3 .btn-gray-flat { margin-top: 23px; }

.section-pricing .btn-after { margin-left: 8px; }
.section-pricing .small-text { font-size: 12px; opacity: 0.5; }
.section-pricing .em-text { color: #888888; font-weight: 400; }
.section-pricing .light-gray-text { color: #999999; }

.section-pricing #pricing-item1 .bottom-padding { padding-top: 35px; }
.section-pricing #pricing-item2 .bottom-padding { padding-top: 30px; }

.section-gen.section-pricing-contact { padding-top: 74px; }
.section-pricing-contact .title { padding-top: 0; padding-bottom: 3px; color: #777777; font-size: 46px; }
.section-pricing-contact .sub-title { padding-top: 0; color: #aaaaaa; }

.ribbon-top-left-wrapper { position: relative; }
.ribbon-top-left { position: absolute; top: -32px; left: -24px; }

.anchor-contactform { position: relative; top: -100px; }
/* =========== PRICING //=========== */


/* =========== FREE-ENDPOINT =========== */
.section-gen.free-endpoint { padding-top: 60px; padding-bottom: 60px; }
.free-endpoint .title { margin-bottom: 10px; text-align: center; color: #777777; }
.free-endpoint .main-grid { max-width: 805px; padding: 10px 0 10px 10px; border: solid #cccccc 1px; border-radius: 6px; }
.free-endpoint .e-icon, .free-endpoint .e-name, .free-endpoint .e-desc { float: left; height: 54px; }
.free-endpoint .e-item:after { content: ""; display: table; clear: both; }

.free-endpoint .e-icon { width: 74px; padding: 10px 0; text-align: center; }
.free-endpoint .e-name { min-width: 175px; padding-left: 10px; line-height: 54px; color: #333333; font-weight: 400; }
.free-endpoint .e-desc { min-width: 510px; padding-left: 10px; line-height: 54px; }

.free-endpoint .e-icon img { text-align: center; height: 36px; }
.free-endpoint .e-button { margin: 20px auto 18px; text-align: center; }
.free-endpoint .e-button .btn-orange2 { height: 42px; line-height: 41px; font-size: 17px; }
/* =========== FREE-ENDPOINT //=========== */


/* =========== PREMIUM-ENDPOINT =========== */
.premium-endpoint { padding-top: 45px;  }
.section-pricing.premium-endpoint .title { padding-bottom: 25px; }
/* =========== PREMIUM-ENDPOINT //=========== */


/* --------- SECTION-BANNER --------- */
.section-banner { height: 225px; background:url(../img/drawing-bg.gif) 0 0 no-repeat; background-size: cover; }
.section-banner .desc { text-align: center; width: 100%; }
.section-banner h2 { padding: 52px 0 0 0; color: #ffffff; font-size: 42px; font-weight: 100; line-height: 1; text-shadow: 1px 1px 2px rgba(3, 61, 78, 0.6); }
.section-banner .btn-position { margin: 30px 0 0 0; text-align:center; }
.section-banner .btn-orange2 { font-weight: 400; font-size: 17px; text-shadow:0 1px 2px rgba(0,0,0, 0.4); }

.section-banner .section-banner-icon-key { position: relative; top: 6px; left: -2px; }
/* --------- SECTION-BANNER //--------- */


/* =========== CRM-PARTNER =========== */
.section-gen.crm-partner-title { padding-top: 49px; padding-bottom: 55px; }
.section-gen.crm-partner-title .title { overflow: hidden; width: 98%; }

.section-gen.crm-partner { padding-top: 60px; padding-bottom: 54px; }
.crm-partner table { width: 98%; }

.crm-partner .crm-logo { position: relative; }
.crm-partner .crm-connectwise { top: 4px; }
.crm-partner .crm-hubspot { top: 8px; }
.crm-partner .crm-infusionsoft { top: 12px; }
.crm-partner .crm-netsuite { top: 13px; }
.crm-partner .crm-salesforce { top: 8px; }
.crm-partner .crm-sugar { top: -2px; }

.partner-fade { border: none; opacity: .4; transition: opacity .25s ease-in-out; -moz-transition: opacity .25s ease-in-out; -webkit-transition: opacity .25s ease-in-out; }
.partner-fade:hover { opacity: 1; }
/* =========== CRM-PARTNER //=========== */


/* =========== INFOGRAPHIC =========== */
.section-gen.section-infographic { padding-top: 50px; }
.section-gen.section-infographic .flex-wrapper { margin: 0 auto; max-width: 600px; }
.section-gen.section-infographic .title { padding-bottom: 15px; color: #949494; font-size: 44px; }
.infographic-desc { text-align: left; font-size: 15px; }
.infographic-desc p { margin-top:15px; line-height: 1.7; }
.infographic-wrapper { margin: 0 auto; padding-top: 40px; text-align: center; }
.infographic-wrapper img { width: 100%; height: 100%; max-width: 600px; }

.section-infographic .share-social { margin-top: 10px; }
.section-infographic .share-button { position: relative; float: left; margin-right: 12px; }
.section-infographic .fb-share-button { position: relative !important; top: -2px !important; }
/* =========== INFOGRAPHIC //=========== */


/* =========== KF-TPL2 =========== */
body.kf-tpl2 { background-color: #f8f8f8; }
.kf-tpl2 .kf-logo-med { margin: 55px auto 55px; text-align: center; }
.kf-tpl2 .kf-logo-med img { width: 200px; }
.kf-tpl2 .box { width: 100%; max-width: 890PX; margin-left: auto; margin-right: auto; background-color: #ffffff; border: solid 1px #d8d8d8; border-radius: 5px; padding: 40px 50px 50px; }
.kf-tpl2 .box-email-unsubscribe { padding: 60px 50px 70px; }

.kf-tpl2 .title { margin-bottom: 40px; font-weight: 300; font-size: 34px; color: #666666; text-align: center; }
.kf-tpl2 .box-email-unsubscribe p { margin-left: auto; margin-right: auto; text-align: center; font-size: 16px; color: #999999; }
/* =========== KF-TEMPLATE2 //=========== */


/* =========== COMP-PROFILE =========== */
#wrapper.comp-profile { background: url(../img/kf-watermark-fire.png) center bottom no-repeat; }

.comp-profile #main { max-width: 980px; margin-top: 30px; margin-left: auto; margin-right: auto; background: url(../img/comp-profile-building.png) right 40% no-repeat; }
.comp-profile .kf-logo-med { margin: 12px auto 30px; text-align: center; }
.comp-profile .kf-logo-med img { width: 200px; }

.company-form { max-width: 530px; margin-left: auto; margin-right: auto; }
.company-form .title { line-height: 1.4; padding-bottom: 10px; margin-bottom: 0; text-align: center; color: #888888; font-size: 22px; font-weight: 300; }

.company-form .label { float: left; min-width: 120px; margin-top: 22px; margin-right: 8px; line-height: 29px; text-align: right; }
.company-form input, .company-form select { float: left; margin-top: 22px; width: 370px; height: 32px; padding: 6px 6px 7px 6px; border-radius: 4px; border: solid 1px #cccccc; background-color: #ffffff; font-family: Roboto, Helvetica, sans-serif, Arial; color: #666666; font-size: 14px; font-weight: 400;  }


.company-form input:focus, .company-form select:focus { background-color: #fdf3e0; outline: 0; }

.company-form .item-submit { margin: 40px auto 0; text-align:center; }

.company-form .item-submit .item-submit-inner { width: 466px; height: 44px; line-height: 43px; margin: 0 auto; text-align: center; margin-top:19px; padding: 0; border: 0; border-radius: 8px; cursor: pointer;	background-color: rgba(235,133,16, 0.8); color: #ffffff; font-family: Roboto; font-weight: 300; font-size: 20px; text-shadow: 1px 1px 0 rgba(178,80,12, 0.5); transition: all 250ms linear 0s; }

.company-form .item-submit .item-submit-inner:hover { background-color: rgba(247,167,47, 1); text-shadow: 1px 1px 0 rgba(217,140,14, 0.7); }

.company-form .item-submit img { position: relative; top: 6px; padding-right: 6px; }
/* =========== COMP-PROFILE //=========== */


/* =========== IP-DETECTION =========== */
#particle { position: fixed; z-index: -1; width: 100%; height: 100%; opacity: 0.8; overflow: hidden; }
.ip-detection-wrapper .flex-wrapper { background: transparent; }

.ip-detection { margin-left: auto; margin-right: auto; font-weight: 300; }
.ip-detection .title { color: #949494; }
.ip-detection .intro { max-width: 500px; margin-top: 30px; margin-bottom: 36px; margin-left: auto; margin-right: auto; font-size: 17.5px; }

.code-wrapper { max-width: 570px; margin-top: 40px; margin-left: auto; margin-right: auto; padding: 25px 25px; text-align: left; background-color: #f3f3f3; color: #666666; font-size: 12px; border-radius: 8px; }

.faq .code-wrapper { margin-top: 11px; }

.code-wrapper .code_comment { opacity: 0.5; }
.code-wrapper .green { color: #669966; }
.code-wrapper .orange { color: #f89938; }

.ip-detection .btn-position { margin-left: auto; margin-right: auto; text-align: center; }
.ip-detection .faq { max-width: 800px; margin-top: 50px; margin-left: auto; margin-right: auto; }

.ip-detection .faq .title { margin-top: 80px; margin-bottom: 20px; font-size: 40px; }
/* =========== IP-DETECTION //=========== */


/* =========== GOOGLE-ANALYTIC =========== */
.google-analytic { margin-left: auto; margin-right: auto; padding-bottom: 40px; font-weight: 300; }
.google-analytic .title { color: #949494; }
.google-analytic .google-analytic-desc { font-size: 18px; margin-top: 10px; }
.google-analytic .main-image { width: 100%; max-width: 950px; }

.google-analytic-wrapper .btn-position { margin-left: auto; margin-right: auto; text-align: center; }

.google-analytic .faq { max-width: 800px; margin-top: 50px; margin-left: auto; margin-right: auto; }
.google-analytic .faq .title { margin-top: 80px; margin-bottom: 20px; font-size: 40px; }

.google-analytic-wrapper .btn-orange-ani { height: 46px; line-height: 44px; }
.google-analytic-wrapper .btn-orange-ani img { position: relative; top: 8px; padding-right: 1px; }

.google-analytic #btn-more1b { margin-left: 10px; }

.google-analytic-wrapper .btn-orange-ani .btn-get-started-text1 { position: relative; top: 1px; display: inline-block; }
.google-analytic-wrapper .btn-orange-ani .btn-get-started-text2 { position: relative; left: 11px; padding-top: 100px; }

.google-analytic .btn-orange-ani #btn-more-text1b { position: relative; top: 1px; display: inline-block; }
.google-analytic .btn-orange-ani #btn-more-text2b { position: relative; left: 11px; padding-top: 100px; }

.google-analytic .section-gen.intro-video { padding-top: 70px; padding-bottom: 0; }

/* =========== GOOGLE-ANALYTIC //=========== */


/* =========== GOOGLE-DEPRECATION =========== */
.google-deprecation-wrapper .btn-orange-ani { height: 46px; line-height: 44px; }
.google-deprecation-wrapper .btn-orange-ani img { position: relative; top: 8px; padding-right: 1px; }

.google-deprecation-wrapper .btn-orange-ani .btn-get-started-text1 { position: relative; top: 1px; display: inline-block; }
.google-deprecation-wrapper .btn-orange-ani .btn-get-started-text2 { position: relative; left: 11px; padding-top: 100px; }
/* =========== GOOGLE-DEPRECATION //=========== */


/* =========== DRIFT =========== */
.drift .btn-orange-ani { height: 40px; line-height: 38px; }
.drift .btn-orange-ani img { position: relative; top: 8px; padding-right: 1px; }

.drift #btn-more1b { margin-left: 10px; }

.drift .btn-orange-ani #btn-more-text1 { position: relative; display: inline-block; }
.drift .btn-orange-ani #btn-more-text2 { position: relative; left: 11px; padding-top: 100px; }

.drift .btn-orange-ani #btn-more-text1b { position: relative; top: 1px; display: inline-block; }
.drift .btn-orange-ani #btn-more-text2b { position: relative; left: 11px; padding-top: 100px; }

.kf-drift-logo img { width: 300px; }
.drift-intro { max-width: 710px; margin: 0 auto; text-align: center; font-size: 20px; font-weight: 300; color: #999999; }
.drift-text { padding: 20px 0 30px; }

/* =========== DRIFT =========== */


/* =========== FLOAT-BANNER =========== */
.float-banner { position: fixed; z-index: 1000; width: 328px; height: 106px; right: -900; bottom: 20px; background: #2f2f2f url(../img/floatbanner-watermark.png) 0 0 no-repeat; border-radius: 6px; opacity: 0; }

.float-banner-close { float: right; display: block; width: 30px; height: 30px; text-align: right; padding-top: 0; padding-right: 7px; font-size: 16px; cursor: pointer; opacity: 0.4; }
.float-banner-close:hover { opacity: 1; }

.float-banner .icon  img{ position: relative; top: 19px; left: 10px; width: 68px; height: 68px; }
.float-banner-text { position: relative; top: -56px; left: 84px; color: #ffffff; font-size: 20px; font-weight: 100; }

.float-banner .btn-action { 	position: relative; top: -45px; left: 127px; height: 28px; line-height: 27px; padding: 0 10px; background-image: linear-gradient(to top,#e77a06,#febc42); color: #ffffff; display: inline-block;  border-radius: 3px; font-size: 14px; font-weight: 400;  text-shadow: 0 1px 1px rgba(0,0,0, 0.4); cursor: pointer; }
/* =========== FLOAT-BANNER //=========== */


/* =========== SECTION-TPL =========== */
.section-tpl { padding-top: 60px; padding-bottom: 90px; }
.google-deprecation-wrapper .section-tpl { padding-bottom: 40px; }
.section-tpl.section-tpl-above-form { padding-bottom: 20px; }
.section-tpl .title {  }
.section-tpl .sub-title { max-width: 710px; margin-left: auto; margin-right: auto; text-align: center; padding-top: 20px; font-size: 20px; font-weight: 300; color: #999999; }

.section-tpl .tpl-big-img-wrapper { margin-left: auto; margin-right: auto; text-align: center; padding-top: 50px; }
.section-tpl .tpl-big-img { width: 100%; max-width: 600px; height: auto; }
.section-tpl .medium-text { margin-top: 30px; }
.section-tpl .medium-text p { margin-top: 12px; font-size: 16px; font-weight: 300; color: #999999; }

.section-tpl .medium-text ul { list-style-type: none; padding: 0; margin: 0; margin-top: 15px; }
.section-tpl .medium-text li { background: url(../img/tick-gray.png) 0 8px no-repeat; padding-left: 20px; padding-top: 0; padding-bottom: 0; margin-top: 11px; margin-bottom: 11px; font-size: 16px; line-height: 1.5; }
.section-tpl .medium-text li li { background: url(../img/li-dot.png) 0 8px no-repeat; padding-left: 20px; }

ul.flame { list-style-type: none; padding: 0; margin: 0; }
ul.flame li { background: url(../img/kf-flame-bullet.png) 0 2px no-repeat; padding-left: 25px; padding-top: 0; padding-bottom: 0; margin-top: 11px; margin-bottom: 11px; font-size: 16px; line-height: 1.5; }

.section-tpl .medium-text ul.single { margin-top: 10px; }
.section-tpl .medium-text ul.single li { margin-top: 2px; margin-bottom: 2px; }

.section-tpl-7-3, .section-tpl-3-7 { padding-top: 60px; padding-bottom: 60px; }
.section-tpl-7-3 .col-2-3, .section-tpl-7-3 .col-1-3, .section-tpl-3-7 .col-2-3, .section-tpl-3-7 .col-1-3    { padding-top: 0; padding-bottom: 0; }
.section-tpl-7-3 .col-2-3 .title, .section-tpl-3-7 .col-2-3 .title { font-size: 42px; }
.section-tpl-7-3 .col-2-3 .medium-text, .section-tpl-3-7 .col-2-3 .medium-text { margin-top: 10px; }

.section-tpl-7-3 .col-1-3 img, .section-tpl-3-7 .col-1-3 img { max-width: 94%; }

.section-tpl-2-col { padding-top: 50px; padding-bottom: 70px; font-size: 15px; }
.section-tpl-2-col p { margin-top: 12px; font-size: 15px; }
.section-tpl-2-col .title { font-size: 42px; }
.section-tpl-2-col .col-1-2:first-child { padding-right: 20px; }
.section-tpl-2-col .col-1-2:last-child { padding-left: 20px; }
.section-tpl-2-col ul { list-style-type: none; padding: 0; margin: 0; margin-top: 15px; }
.section-tpl-2-col li { background: url(../img/tick-gray.png) 0 8px no-repeat; padding-left: 20px; padding-top: 0; padding-bottom: 0; margin-top: 11px; margin-bottom: 11px; font-size: 15px; line-height: 1.5; }
.section-tpl-2-col li li { background: url(../img/li-dot.png) 0 8px no-repeat; padding-left: 20px; }
/* =========== SECTION-TPL //=========== */


/* =========== SECTION-TPL-3BOX =========== */
.section-tpl-3box { padding-top: 60px; padding-bottom: 90px; font-weight: 300; }
.section-tpl-3box.section-tpl-3box-kfg-main { padding-top: 40px; padding-bottom:80px; }
.section-tpl-3box .flex-wrapper { max-width: 890px; }
.section-tpl-3box .title { padding-bottom: 22px; text-align: center; color: #949494; font-size: 46px; }
.section-tpl-3box .title.no-sub-title { padding-bottom: 49px; }

.section-tpl-3box .sub-title { max-width: 650px; line-height: 1.6; margin-left: auto; margin-right: auto; padding-top: 0; padding-bottom: 40px; text-align: center; color: #aaaaaa; font-size: 18px; }
.section-tpl-3box.orange-box .sub-title { color: #ffffff; }

.section-tpl-3box h2 { padding-top: 12px; padding-bottom: 10px; color: #f89938; font-size: 25px; line-height: 1.4; font-weight: 300; }
.section-tpl-3box .tpl-3box-item.orange-box h2 { color: #ffffff; }


.section-tpl-3box .icon { position: relative; }
.section-tpl-3box p { margin-bottom: 0; padding-top: 0; font-size: 15px; line-height: 1.6; }
.section-tpl-3box .tpl-3box-item.orange-box p { color: #ffffff; }

.section-tpl-3box .tpl-3box-item { position: relative; min-width: 215px; margin-left: 3px; margin-right: 3px; padding: 30px 20px; background-color: #ffffff; border-radius: 6px; box-shadow: 0 0 6px 1px rgba(0,0,0, 0.18); }

.section-tpl-3box .tpl-3box-item.orange-box { background-color: #f79844; box-shadow: 0 0 6px 1px rgba(253,153,65, 0.4); }


.section-tpl-3box .btn-orange-flat, .section-tpl-3box .btn-gray-flat { height: 32px; line-height: 32px; padding: 0 20px; margin-top: 24px; font-size: 15px; font-weight: 400; }

.section-tpl-3box .tpl-3box-item.orange-box .btn-orange-flat { background-color: #ffffff; color: #fa7705; text-shadow: none; }

.section-tpl-3box .btn-orange-flat:hover, .section-tpl-3box .btn-gray-flat:hover { color: #ffffff; }

.section-tpl-3box .tpl-3box-item.orange-box .btn-orange-flat:hover { background-color: #ffffff; color: #fa7705; }

.section-tpl-3box.integration a { color: #666666; }
.section-tpl-3box.integration a:hover { color: #f89938; }
.section-tpl-3box.integration .btn-orange, .section-tpl-3box.integration .btn-orange:hover { color: #ffffff; }

.section-tpl-3box .btn-after { margin-left: 8px; }
.section-tpl-3box .small-text { font-size: 12px; opacity: 0.5; }

.section-tpl-3box .em-text { color: #888888; font-weight: 400; }
.section-tpl-3box.orange-box .em-text { color: #ffffff; }


.section-tpl-3box .light-gray-text { color: #999999; }
.section-tpl-3box .tpl-3box-item.orange-box .light-gray-text { color: #ffffff; }
/* =========== SECTION-TPL-3BOX //=========== */


/* =========== SECTION-TPL-BOX (1 col box)=========== */
.section-tpl-box { padding-top: 60px; padding-bottom: 90px; font-weight: 300; }
.section-tpl-box .flex-wrapper { max-width: 890px; }
.section-tpl-box .title { padding-bottom: 22px; text-align: center; color: #949494; font-size: 46px; }
.section-tpl-box .title.no-sub-title { padding-bottom: 49px; }
.section-tpl-box .sub-title { max-width: 650px; line-height: 1.6; margin-left: auto; margin-right: auto; padding-top: 0; padding-bottom: 40px; text-align: center; color: #aaaaaa; font-size: 18px; }
.section-tpl-box h2 { padding-bottom: 10px; padding-top: 12px; color: #f89938; font-size: 25px; line-height: 1.4; font-weight: 300; }
.section-tpl-box .icon { position: relative; }
.section-tpl-box p { padding-top: 7px; padding-bottom: 7px; font-size: 15px; line-height: 1.6; }

.section-tpl-box .tpl-box-item { position: relative; min-width: 215px; margin-left: 3px; margin-right: 3px; padding: 30px 20px; background-color: #ffffff; border-radius: 6px; box-shadow: 0 0 6px 1px rgba(0,0,0, 0.18); }

.section-tpl-box .btn-orange-flat, .section-tpl-box .btn-gray-flat { height: 32px; line-height: 32px; padding: 0 20px; margin-top: 24px; font-size: 15px; font-weight: 400; }
.section-tpl-box .btn-orange-flat:hover, .section-tpl-box .btn-gray-flat:hover { color: #ffffff; }

.section-tpl-box.integration a { color: #666666; }
.section-tpl-box.integration a:hover { color: #f89938; }
.section-tpl-box.integration .btn-orange, .section-tpl-box.integration .btn-orange:hover { color: #ffffff; }

.section-tpl-box .btn-after { margin-left: 8px; }
.section-tpl-box .small-text { font-size: 12px; opacity: 0.5; }
.section-tpl-box .em-text { color: #888888; font-weight: 400; }
.section-tpl-box .light-gray-text { color: #999999; }
/* =========== SECTION-TPL-BOX //=========== */


/* =========== SECTION-TPL BUTTONS =========== */
.section-tpl .btn-orange,  .section-tpl .btn-orange-flat, .section-tpl .btn-gray-flat { height: 42px; line-height: 42px; padding-left: 20px; padding-right: 20px; font-size: 15px; }
.section-tpl .btn-orange:hover, .section-tpl .btn-orange-flat:hover { color: #ffffff; }

.section-tpl .multiple-btn .btn-orange, .section-tpl .multiple-btn .btn-orange-flat, .section-tpl .multiple-btn .btn-gray-flat { margin-left: 15px; }
/* =========== SECTION-TPL BUTTONS //=========== */


/* =========== RESOURCES BUTTON NAVIGATION =========== */
#main.resource .section-tpl-3box { padding-top: 40px; }

.resource-button-nav { margin-bottom: 10px; margin-left: auto; margin-right: auto; text-align: center; }

.resource-button-nav a { height: 40px; line-height: 40px; position: relative; display: inline-block; margin-right: 7px; margin-top: 7px; padding: 0 20px; border-radius: 6px; background-color: #e1e1e1; color: #7e7e7e; font-family: Roboto, Helvetica, "Lucida Grande", Verdana, Arial; font-size: 15px; font-weight: 400; text-decoration: none; cursor: pointer; overflow: hidden; transition: all .3s linear 0s; }

.resource-button-nav a:hover { background-color: #808080; color: #ffffff; }

.resource-button-nav a.active { background-color: rgba(235,133,16, 1); color: #ffffff; text-shadow: 1px 1px 0 rgba(178,80,12, 0.5); transition: none; }
.resource-button-nav a.active:hover { background-color: rgba(247,167,47, 1); text-shadow: 1px 1px 0 rgba(193,91,0, 0.8); }
/* =========== RESOURCES BUTTON NAVIGATION //=========== */


/* =========== LIVE LEADS =========== */
.section-gen.live-leads-banner { background: url(../img/topbanner-LL.jpg) center center / cover no-repeat; }
.live-leads-banner .title, .live-leads-banner .sub-title { color: #ffffff; text-shadow: 1px 1px 1px rgba(0,0,0, 0.8); }
/* =========== LIVE LEADS //=========== */


/* =========== CAREER =========== */
.section-gen.career-open .title { text-align: center; }
.section-gen.career-open .title .no-job-open { margin-top: 30px; font-size: 17px; }

.section-gen.career-perk { padding-top: 50px; padding-bottom: 60px; }
.career-perk .title { margin-bottom: 50px;  position: relative; }
.perk-item { position: relative; font-size: 16px; font-weight: 300; min-width: 315px; }
.perk-icon, perk-icon img { position: relative; }
.perk-medical { padding-top: 13px; }
.perk-stock { padding-top: 9px; }
.perk-transit { padding-top: 14px; }
.perk-lunch { padding-top: 29px; }
.perk-smartcar { padding-top: 29px; }
.perk-lifeinsurance { top: -3px; }
.perk-desc { margin-top: 12px;  position: relative; }
.perk-desc-lifeinsurance { margin-top: 9px; }
/* =========== CAREER //=========== */


/* ============ CAREER ============ */
.section-gen.career { padding-top: 0; padding-bottom: 10px; font-weight: 300; }

.main-career .section-tpl { padding-bottom: 60px; }

.main-career p { padding-top: 7px; padding-bottom: 7px; }

.section-gen.career .title { text-align: center;  position: relative; padding-bottom: 0; position: relative; color: #999999; font-weight: 100; font-size: 46px; }
.job-cat { margin-top: 50px; margin-bottom: 70; position: relative; }

.job-cat-title { background: url(../img/career-icon-cog.png) 0 0px no-repeat;); font-size: 26px; color: #999999; padding-bottom: 5px; font-weight: 300; position: relative; }

.job-cat-engineering .job-cat-title, .job-cat-data .job-cat-title{ background-image: url(../img/career-icon-cog.png); }
.job-cat-support .job-cat-title{ background-image: url(../img/career-icon-wrench.png); }
.job-cat-sales .job-cat-title{ background-image: url(../img/career-icon-headphone.png); }
.job-cat-marketing .job-cat-title{ background-image: url(../img/career-icon-chart.png); }
.job-cat-finance .job-cat-title{ background-image: url(../img/career-icon-money.png); }

.job-item-title { font-size: 17px; color: #888888; font-weight: 300; padding-top: 10px; cursor: pointer; position: relative; }
.job-item-title:hover { color: #ff9933; }
.job-item-title .fa { font-size: 17px; margin-right: 7px; }

.job-item-content { line-height: 1.7;  margin-top: 20px; margin-bottom: 20px; margin-left: 0px; padding: 15px 30px 26px 30px; font-weight: 300; font-size: 14px; background-color: #f8f8f8; color: #333333; border-radius: 4px; display: none; }

/* Left align for cat title, item title and item content */
.job-cat-title, .job-item-title { padding-left: 55px; }
.job-item-content { margin-left: 55px; }

.job-item-content p { font-size: 14px; }
.career .job-header { font-weight: 500; color: #666666; padding-top: 15px; padding-bottom: 0; }

.section-gen.career-policy { padding-top: 68px; padding-bottom: 70px; }
.job-policy { margin-top: 0px; margin-bottom: 0; color: #999999; font-size: 14px; opacity: 1; font-weight: 300; }

.career ul.tick li{ margin-top: 5px; }

.job-address { margin-left: auto; margin-right: auto; padding: 30px 0;text-align: center; color: #ff9933; font-family: Roboto, Verdana, Arial; font-size: 16px; font-weight: 300; }

.career ul { text-align: left; font-weight: 300; list-style-position: outside; padding: 10px 0 0 0; margin: 0 0 0 19px; }
.career li { padding-left: 0; margin-top: 0; }
.career ul.tick { margin: 0; }

.career ul ul { padding: 0; }

.career .more-info p { padding-top: 0px; }
.career .apply-button { margin-left: auto; margin-right: auto; text-align: center; margin-top: 20px; }
.no-job-open { padding-top: 30px; font-size: 17px; }

.career .btn-orange { color: #ffffff; display: inline-block; padding: 0 15px; height: 40px; line-height: 40px; font-size: 15px; font-weight: 400;  border-radius: 3px; transition: all .2s ease-out; }
/* ============ CAREER //============ */


/* =========== SLIDER-CAREER =========== */
.slider-career { height: 300px; }
.slider-career .slider-icon { max-width: 220px; padding-top: 22px; }
.slider-career .slider-icon img { width: 240px; }
.slider-career h2 { font-size: 46px; }
.slider-career p.p1 { font-size: 18px; }
.slider-career h2 { top: 45px; }
.slider-career p { top: 134px; }
.slider-career  .btn-position { position: absolute; margin: 0; top: 238px; }
/* =========== SLIDER-CAREER //=========== */


/* =========== SLIDER-CAREER-M =========== */
.slider-career-m h2 { font-size: 42px; padding-bottom: 0; }
.slider-career-m .slider-icon { padding-top: 16px; padding-bottom: 10px; }
/* =========== SLIDER-CAREER-M //=========== */


/* =========== ABOUT-US =========== */
.section-gen.kf-people .title { padding-bottom: 40px; text-align: center; }

.photo-wrapper { max-width: 740px; margin-left: auto; margin-right: auto; text-align: center; }

.photo-item{ position: relative; display: inline-block; margin: auto; margin-left: 28px; width: 214px; height: 214px; background-position: center; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; overflow: hidden; }

.photo-item .photo-overlay{ position: absolute; background: rgba(0,0,0,.5);  margin: auto; opacity: 0;
	width: 0; height: 0; top: 0; right: 0; bottom: 0; left: 0;
	-webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; 
	-webkit-transition: .3s ease; transition: .3s ease;
}
 
.photo-item:hover .photo-overlay{ opacity: 1; width: 100%; height: 100%; }

.photo-overlay .photo-desc{ position: absolute; font-weight: 300; text-align: center; margin: auto; left: 0; top: 70px; right: 0; bottom: 0; opacity: 0; width: 140px; height: 100px; }

.photo-item:hover .photo-overlay .photo-desc{ opacity: 1; -webkit-transition: 1.3s ease; transition: 1.3s ease; }	

.photo-desc .e-name { font-size: 16px; color: #ffffff; }
.photo-desc .e-title { font-size: 11px; padding-top: 4px; color: #ffffff; }

.photo-item1 { background-image: url('../img/photo/Stephen.png'); }
.photo-item2 { background-image: url('../img/photo/Tina.png'); }
.photo-item3 { background-image: url('../img/photo/Michael.png'); }
/* =========== ABOUT-US =========== */


/* =========== SLIDER-ABOUT-US =========== */
.slider-about-us { height: 300px; }
.slider-about-us .slider-icon { max-width: 220px; padding-top: 22px; }
.slider-about-us .slider-icon img { width: 240px; }
.slider-about-us h2 { font-size: 46px; }
.slider-about-us p.p1 { font-size: 18px; }
.slider-about-us h2 { top: 45px; }
.slider-about-us p { top: 134px; }
.slider-about-us  .btn-position { position: absolute; margin: 0; top: 238px; }
/* =========== SLIDER-ABOUT-US //=========== */


/* =========== SLIDER-ABOUT-US-M =========== */
.slider-about-us-m h2 { font-size: 42px; padding-bottom: 0; }
.slider-about-us-m .slider-icon { padding-top: 16px; padding-bottom: 10px; }
/* =========== SLIDER-ABOUT-US-M //=========== */


/* =========== LL TRIAL =========== */
.section-product-LL-trial { padding-top: 50px; padding-bottom: 90px; }
.section-product-LL-trial .title { text-align: center; padding-bottom: 20px; font-weight: 100; font-size: 46px; color: #949494; }

.section-product-LL-trial .llsignup-input { border: 1px solid #cccccc; padding: 5px; width: 350px; font-size: 12pt; height: 35px; border-radius: 5px; } 
.section-product-LL-trial .timezone-select.selectboxit + .selectboxit-options { width: 300px; min-width: 300px; max-height: 200px; }
.section-product-LL-trial .selectboxit-container .selectboxit { overflow-y: auto; }

.section-product-LL-trial .selectboxit-list > .selectboxit-focus > .selectboxit-option-anchor {
	color: #ffffff;
	background-color: #ff9933;
	background-image: -moz-linear-gradient(top, #ff9933, #ff9933);
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ff9933), to(#ff9933));
	background-image: -webkit-linear-gradient(top, #ff9933, #ff9933);
	background-image: -o-linear-gradient(top, #ff9933, #ff9933);
	background-image: linear-gradient(to bottom, #ff9933, #ff9933);
	background-repeat: repeat-x;
}

.section-product-LL-trial .selectboxit-btn.selectboxit-enabled:hover,
.section-product-LL-trial .selectboxit-btn.selectboxit-enabled:focus {
  color: #333333;
  text-decoration: none;
  background-position: 0;
}

.section-product-LL-trial .btn-orange { height: 44px; line-height: 42px; font-size: 17px; }
.section-product-LL-trial .reginput { color: #666666; }
/* =========== LL TRIAL //=========== */


/* ======================== FOOTER ======================== */
#footer, .push { min-height: /*680px*/ 200px; } /* Measure the actual height of the footer then put the dimension here. When change height here, need to change height in ".video-footer". Each additional footer entry is increasing 30px */
#footer { width: 100%; background-color: /*#f0f0f0*/ #000000; color: #ffffff; font-family: Roboto, Helvetica, sans-serif, Verdana, Arial; font-weight: 300; }

.footer-bg-layer { position: absolute; z-index: 1; width: 100%; overflow: hidden; }
.footer-layer { position: absolute; z-index: 2; width: 100%; background: transparent; }

.video-footer-wrapper { width: 100%; margin-left: auto; margin-right: auto; text-align: center; background-color: #000000; }
.video-footer { position: relative; height: /*478px*/ /*650px*/ 680px; left: -100px; filter: grayscale(100%); }


.footer-cat { width: 207px; margin-top: 38px; margin-right: 30px; padding-left: 20px; text-align: left; font-size: 14px; }
.footer-cat-header { margin-bottom: 10px; color: #ffffff; font-size: 22px; font-family: Roboto, Verdana, Arial; font-weight: 300; }

.footer-cat > a { color: #c9c9c9; text-decoration: none; display: block; line-height: 30px; cursor: pointer; }
.footer-cat > a:hover, .footer-cat > a.active { color: #f89938; }


/* =========== SOCIAL ICON =========== */
.social-icon { margin-top: 14px; }
.social-icon * { box-sizing: border-box; }
.social-icon .social-text { font-weight: 100; padding-bottom: 5px; }

.social-icon a { text-decoration: none; }

.social-icon > a > div { 
		display: inline-block; margin: 0 0 0 2px; width: 36px; height: 36px; border-radius: 50%; background-color: #9a9a9a; position: relative;
		
		-webkit-transition: all 600ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
		-moz-transition: all 600ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
		-ms-transition: all 600ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
		-o-transition: all 600ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
		transition: all 600ms cubic-bezier(0.175, 0.885, 0.320, 1.275); 
 }
.social-icon > a > div.first-social-icon { margin-left: 0; }
.social-icon > a > div:hover { background-color: #efefef; }

.social-icon .icon { 
		position: absolute; z-index: 2; top: 0; left: 0; width: 36px; height: 36px;
		background-repeat: no-repeat; background-image: url(../img/social-icon36x36.png);
		
		-webkit-transition: all 600ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
		-moz-transition: all 600ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
		-ms-transition: all 600ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
		-o-transition: all 600ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
		transition: all 600ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
 }

.social-icon .social-facebook .icon { background-position: 0 0; }
.social-icon .social-facebook .icon:hover { background-position: 0 -36px; }
.social-icon .social-twitter .icon { background-position: -36px 0; }
.social-icon .social-twitter .icon:hover { background-position: -36px -36px; }
.social-icon .social-linkedin .icon { background-position: -72px 0; }
.social-icon .social-linkedin .icon:hover { background-position: -72px -36px; }
.social-icon .social-gotomeeting .icon { background-position: -108px 0; }
.social-icon .social-gotomeeting .icon:hover { background-position: -108px -36px; }

.social-icon .round-hover-social-icon { 
		position: absolute; opacity: 0; width: 36px; height: 36px; border-radius: 50%; z-index: 1;
		
		-webkit-transform-origin: center bottom 200px;
		-moz-transform-origin: center bottom 200px;
		-ms-transform-origin: center bottom 200px;
		-o-transform-origin: center bottom 200px;
		transform-origin: center bottom 200px;
		
		-webkit-transform: rotate(-180deg);
		-moz-transform: rotate(-180deg);
		-ms-transform: rotate(-180deg);
		-o-transform: rotate(-180deg);
		transform: rotate(-180deg);
		
		-webkit-transition: all 600ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
		-moz-transition: all 600ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
		-ms-transition: all 600ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
		-o-transition: all 600ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
		transition: all 600ms cubic-bezier(0.175, 0.885, 0.320, 1.275);
 }

.social-icon .social-facebook .round-hover-social-icon { background-color: #5b6aab; }
.social-icon .social-twitter .round-hover-social-icon { background-color: #599dff; }
.social-icon .social-linkedin .round-hover-social-icon { background-color: #268fc1; }
.social-icon .social-gotomeeting .round-hover-social-icon { background-color: #ffbc26; }

.social-icon a:hover .round-hover-social-icon { 
		-webkit-transform: rotate(0deg);
		-moz-transform: rotate(0deg);
		-ms-transform: rotate(0deg);
		-o-transform: rotate(0deg);
		transform: rotate(0deg);
		opacity: 1;
 }
/* =========== SOCIAL ICON //=========== */


/* =========== G2 ICON =========== */
.g2-icon { padding-top: 2px; }
.g2-icon img { width: 65px; }

/* =========== G2 ICON //=========== */


/* =========== LOGO FOOTER =========== */
.logo-footer-wrapper { margin: 30px 0 10px; position: relative; }
.logo-footer { display: block; width: 140px; height: 41px; position: relative; margin-left: auto; margin-right: auto; }
.logo-footer-gray, .logo-footer-color { position: absolute; z-index: 2; top: 0; left: 0; width: 148px; height: 45px; }

.copyright { margin: 65px auto 30px; text-align:center; font-size: 12px; color: #aaaaaa; font-family: "Lucida Grande", Verdana, Arial; }
.copyright a { text-decoration: none; color: #949494; }
.copyright a:hover { color: #f89938; }
/* =========== LOGO FOOTER //=========== */

/* ======================== FOOTER //======================== */


/* ============ COLOR ADJUSTMENT ============ */
.orange { color: #f89938; }
/* ============ COLOR ADJUSTMENT //============ */


/* ============ GRID ============ */
.flex-wrapper { margin: 0 auto; padding: 0; max-width: 980px; overflow-x: hidden; }
.flex-wrapper.flip-card { max-width: 980px; }

.row { margin: 0 -10px 20px -10px; }
.row:after { content: ""; display: table; clear: both; }

.flip-card .row { margin: 0; }

.row:last-child { margin-bottom: 0; }

[class*="col-1-"], [class*="col-2-"] { padding: 10px; }

.flip-card .col-1-2 { padding: 10px 0; }

.vs-form .col-1-2 { padding: 0; }

@media screen and ( min-width: 641px ) { 
  .col-2-3 { float: left; width: 66.66%; }
  .col-1-1 { width: 100%; }
  .col-1-2 { float: left; width: 50%; }
  .col-1-3 { float: left; width: 33.33%; }
  .col-1-4 { float: left; width: 25%; }
  .col-1-5 { float: left; width: 20%; }
  .col-1-8 { float: left; width: 12.5%; }
 }

#main { margin-top:60px; }

/* ============ GRID //============ */


/* ============ MEDIA QUERIES ============ */

/* ------- CONDITION FOR .bg-video ------- */
@media screen and ( max-width: 1400px ){ 
	.bg-video-msg-inner { top: 80px; font-size: 45px; }
 }

@media screen and ( max-width: 1100px ){ 
	.bg-video-msg-inner { top: 30px; font-size: 40px; line-height: 1.3 }
 }

@media screen and ( max-width: 980px ){ 
	.bg-video-msg-inner { width: 80%; margin-left: -40%; top: 20px; font-size: 35px; line-height: 1.3; }
 }
@media screen and ( max-width: 820px ){ 
	.bg-video-wrapper { display: none; }
	.bg-video-msg { display: none; }
	.bg-video-wrapper-m { display: block; }
 }
@media screen and ( max-width: 640px ){ 
	.section-gen.intro-video { padding-top: 0; }
 }
/* ------- CONDITION FOR .bg-video //------- */


@media screen and ( max-width: 980px ){ 
	.section-gen.banner-bombora { display: none; }
	.section-gen.banner-bombora-m { display: block; }
	
	.section-customer .customer-quote { width: 100%; padding-left: 20px; padding-right: 20px; margin-left: auto; margin-right: auto; }
	.section-customer .customer-profile { width: 100%; margin-left: auto; margin-right: auto; margin-top: 30px; margin-bottom: 30px; }
	
	.customer-profile-content { padding: 18px 25px 23px 25px; margin-left: 10px; margin-right: 10px; background: #eff0f0 url(../img/case-study/Bombora-logo-case.png) 97% 90% no-repeat; border-radius: 6px; }
	
	.section-customer.bombora .customer-profile-content { background-image: url(../img/case-study/Bombora-logo-case.png); }
	.section-customer.rollworks .customer-profile-content { background-image: url(../img/case-study/RollWorks-logo-case.png); }
	.section-customer.terminus .customer-profile-content { background-image: url(../img/case-study/Terminus-logo-case.png); }
	.section-customer.designmind .customer-profile-content { background-image: url(../img/case-study/DesignMind-logo-case.png); }
	.section-customer.leibsolutions .customer-profile-content { background-image: url(../img/case-study/LeibSolutions-logo-case.png); }
	
	.customer-profile .customer-logo { display: none; }
	.customer-detail { padding-left: 15px; padding-right: 15px; }
 }

@media screen and ( min-width: 641px ) and ( max-width: 979px ){ 
	.main-grid { width: 98%; }
	#nav { margin-right: 1%; }
	#logo { margin-left: 1%; }
 }

@media screen and ( max-width: 970px ){ 
	.slider { display: none; }
	.slider-m { display: block; }
 }

@media screen and ( max-width: 920px ){ 
	.flip-card { display: none; }
	.flip-card-m { display: block; }
	
  .msg-quote .msg-icon { float: none; text-align: center; }
  .msg-quote .msg-text { float: none; text-align: center; }
  
  .index-slider .slider-item-icon, .index-slider .text-right-60 .slider-item-icon { display: none; }
  .index-slider .slider-item-text, .index-slider .text-right-60 .slider-item-text { width: 100%; max-width: 760px; margin-left: auto; margin-right: auto; }
  .index-slider h2, .index-slider p, .index-slider .btn-position,
  .index-slider .text-right-60 h2, .index-slider .text-right-60 p, .index-slider .text-right-60 .btn-position { width: 90%; left: 0; right: 0; margin-left: auto; margin-right: auto; text-align: center; }
 }

@media screen and ( max-width: 1000px ) { 
	#nav { display: none; }
  #nav-m { display: inline-block; margin-right: 10px; }
  .nav-button-m { display: inline-block; }
  .typing-text-wrapper { font-size: 40px; }
 }

@media screen and ( max-width: 870px ){ 
	.comp-profile #main { background-image: url(../img/clear.gif) !important; }
	
	.index-slider.slider-video .video-msg-api { width: 100%; max-width: 700px; padding-left: 0; padding-right: 0; }
	.index-slider .video-msg-api .video-title { font-size: 35px; }
 }

@media screen and ( max-width: 820px ){ 
	.extension-download { display: none; }
	.msg-quote .msg-icon, .msg-quote .msg-text { float: none; }

	.comp-chart .chart-bar .chart-bar-percentage { font-size: 32px; margin-top: -48px; }
	.comp-chart .chart-bar .chart-bar-percentage sup { font-size: 17px; }
	.bar-label { font-size: 13px; padding-top: 7px; }
	.comp-chart-note { font-size: 14px; padding-top: 15px; }
	
	.customer-logo .col-1-4 { width: 100%; padding-top: 20px; padding-bottom: 20px; }

	.free-endpoint .e-icon { text-align: left; padding-left: 0; }
	.free-endpoint .e-desc { height: 30px; line-height: 30px; padding-left: 0; padding-bottom: 30px; }
	.free-endpoint .e-icon img { text-align: left; }
 }

@media screen and ( max-width: 760px ){ 
	.index-slider h2, .index-slider .center h2 { margin-bottom: 30px; font-size: 33px; }
	.index-slider p, .index-slider .center p { margin-bottom: 10px; font-size: 16px; }
	
	.index-slider .center h2 { margin-bottom: 20px; }
	.index-slider .center p { margin-bottom: 15px; }

	.slider-video .index-slider-video-wrapper { display: none; }
	.index-slider .slider-item.slider-video { background-color: #000000; background-image: url(../img/slider/flame-bg-mobile.jpg); }
	.index-slider .slider-item.slider-video.slider-video-api { background-color: #090504; background-image: url(../img/slider/electricity-bg-mobile.jpg); }
	.slider-item.slider-video .video-msg { top: 25%; font-size: 30px; }
	
	.slider-item.slider-video .video-msg-api { width: 100%; max-width: 650px; left: 0; right: 0; padding-left: 10px; padding-right: 10px; top: 30%; font-size: 30px; transform: none; }
	
	.index-slider .video-msg-api .video-title { font-size: 30px; }
	.index-slider .video-msg-api .video-subtitle { margin-top: 30px; font-size: 16px; }
	
	
	.footer-bg-layer { display: none; }
	.footer-layer { background-color: #000000; }
 }

@media screen and ( max-width: 700px ){ 
	.kf-ani { display: none; }
	.kf-ani-m { display: block; }
 }

@media screen and ( max-width: 670px ){ 
	.api-ani-wrap { display: none; }
	.api-ani-wrap-m { display: block; }
	
	.main-grid-builder { display: none; }
	.main-grid-builder-m { display: block; }
	
 }

@media screen and ( max-width: 640px ){
	.flex-wrapper { width:98%; }
	.flex-wrapper .title { font-size: 37px; }
	#main { margin-top: 40px; }
	#header { height: 60px /*120px*/; }
  .main-grid { width: 100% }
  
  .pad-short-page { display: none; }
  
	#logo { margin-left: 10px; }
  #logo img { height: 46px; margin-top: 2px; }
  .icon-kf img { width: 50%; height: 50%; max-width: 190px; max-height: 190px; }
	.kfcol h2 { font-size: 26px; }
	
	.typing-text-wrapper { font-size: 22px; }
	
	.company-form { margin-left: auto; margin-right: auto; width: 96%; }
	.company-form .title { font-size: 20px; }
	.company-form .label, .company-form input, .company-form select { float: none; display: block; width: 100%; }
	.company-form .label { text-align: left; margin-top: 14px; margin-right: 0; line-height: 1; }
	.company-form input { margin-top: 3px; }
	.company-form .item-submit .item-submit-inner { width: 100%; }
	
	.vs-form .item-textarea { width: 295px; }	/* dimension of an item that contains a textarea */
	.vs-form .item-textarea textarea { width: 263px; }	/* dimension of the innner textarea itself */
	.vs-form .item-submit input, .vs-form .item-submit .item-submit-inner, .vs-form input[type="submit"] { width: 295px; margin-left: auto; margin-right: auto; text-align: center; }	
	
	.vs-form .item-long { width: 295px; }
	.vs-form .item input.input-long { width: 263px; }
	.vs-form .term-agreement { width: 270px; }

	.section-gen .title { width: 98%; font-size: 30px; }
	.section-gen .sub-title { width: 98%; font-size: 16px; }
	.section-gen.intro-video .sub-title { font-size: 18px; }

	.section-gen.crm-partner-title { padding-bottom: 40px; }
	.section-gen.crm-partner .col-1-3 { padding-bottom: 20px; }
	.section-gen.crm-partner .col-1-3:nth-of-type(3) { padding-bottom: 8px; }
	.section-gen.crm-partner .crm-connectwise,
	.section-gen.crm-partner .crm-hubspot,
	.section-gen.crm-partner .crm-infusionsoft,
	.section-gen.crm-partner .crm-netsuite,
	.section-gen.crm-partner .crm-salesforce,
	.section-gen.crm-partner .crm-sugar { top: 0; }
	
	.section-contact .col-1-3 { margin-bottom: 20px; }
	
	.section-banner { height: 160px; }
	.section-banner.section-banner-long-text { height: 218px; }
	.section-banner.section-banner-long-text h2 { line-height: 1.4; font-size: 28px; }
	.section-banner h2 { font-size: 26px; padding-top: 35px; }
	.section-banner .btn-orange2 { height: 40px; padding: 0 15px; line-height: 39px; font-size: 15px; }
	.section-banner .btn-position { margin-top: 26px; }
	
	.product-single { padding-left: 10px; padding-right: 10px; }
	.product-single h2 { font-size: 30px; }
	.product-single p { font-size: 16px; }
	.product-single .col-1-3 img { width: 50%; height: 50%; }
	
	.msg-quote .msg-text { float: none; }
	.msg-quote .msg-icon { display: none; }
	.msg-quote .msg-icon-m { display: block; }
	.msg-quote .msg-text { padding-left: 0; font-size: 20px; }
	.msg-quote .msg-source { font-size: 15px; }
	.msg-quote .msg-icon { padding-bottom: 10px; }

	.api-quote .quote-logo img { max-width: 300px; }
	.api-quote .quote-msg { font-size: 16px; padding-left: 5px; padding-right: 5px; }
	.api-quote .quote-source { font-size: 14px; }	
	.slick-prev, .slick-next { display: none !important; }

	.comp-chart .chart-bar .chart-bar-percentage { font-size: 20px; margin-top: -38px; }
	.comp-chart .chart-bar .chart-bar-percentage sup { font-size: 12px; }
	.bar-label { font-size: 10px; padding-top: 5px; }
	.comp-chart-note { font-size: 12px; padding-top: 10px; }
	
	/* Bambora quote mobile view */
	.quote-bombora-wrapper { background-image: none; }
	#quote-bombora1, #quote-bombora2 { margin-left: auto; margin-right: auto; padding-left: 0; padding-right: 15px; text-align: center; font-size: 16px; font-weight: 300; }
	#quote-bombora2 { background-position: calc(100% - 20px) 0; }
	#quote-source1 { margin-left: auto; margin-right: auto; padding-left: 0; padding-right: 15px; text-align: center; font-size: 14px; }

	.customer-profile-content { background-image: none !important; }
	
	.whitepaper { padding-top: 20px; padding-bottom: 20px; }
	.whitepaper .whitepaper-title, .whitepaper .whitepaper-title-thankyou { padding-bottom: 10px; font-size: 16px; }
	.whitepaper .whitepaper-text2 { font-size: 13px; padding-bottom: 10px; }
	.whitepaper .item-submit { margin-top: 10px; }
	.whitepaper .item-submit .item-submit-inner { margin-top: 5px; }
	.whitepaper input[type="submit"] { margin-top: 15px; }
	
	.index-slider .img-play img.video-thumbnail { transition: none; }
	
	.free-endpoint .main-grid { max-width: 98%; }
	.free-endpoint .e-desc { min-width: 370px; line-height: 1.5; margin-bottom: 20px; padding-right: 7px; font-size: 13px; }
	.free-endpoint .e-button { margin-top: 0; margin-bottom: 18px; }
	.free-endpoint .e-button .btn-orange2 { height: 36px; line-height: 36px; font-size: 15px; }
	
	.drift-intro { font-size: 17px }
	.drift-text { padding: 10px 0 20px; }
	
	.section-tpl-7-3 .col-2-3 .title { text-align: center; }
	.section-tpl-7-3 .col-1-3 { margin-top: 30px; }

	.section-tpl-3-7 .col-1-3 { } 
	.section-tpl-3-7 .col-2-3 .title { text-align: center; margin-top: 20px; }
	
	.section-tpl-2-col .col-1-2 {  }
	.section-tpl-2-col .col-1-2:first-child { padding-right: 10px; }
	.section-tpl-2-col .col-1-2:last-child { padding-top: 30px; padding-left: 10px; }
	.section-tpl-2-col .title { font-size: 40px; }
 }
/* ============ MEDIA QUERIES ============ */
