/* VisiStat CSS */

html, body { height: 100%; margin: 0; padding: 0; }
body { font-family: Roboto, Helvetica, sans-serif, Verdana, Arial; font-size: 12px; color: #666666; line-height: 1.5; font-weight: 300; }
.clear { clear: both; }
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; }
.vs-blue { color: #006699; }
.vs-brown { color: #6699cc; }
.vs-red { color: #990000; }
.vs-green { color: #669966; }
.center { margin: 0 auto; text-align: center; }
.light-gray1 { background-color: #fafafa; }
.light-gray2 { background-color: #f0f0f0; }
.light-gray3 { background-color: #f9f9f9; }
.section-blue { background-color: #035c88; }
.pattern1 { background: url(../img/pattern3.jpg) 0 -10px repeat-x; width: 100%; }
.pattern2 { background: url(../img/pattern3.jpg) 0 -10px repeat; width: 100%; }
.hide { display: none; }
.title { line-height: 1.4; }
li { line-height: 1.7; }
.left { text-align: left; }
.center { text-align: center; }
.pad10 { padding-top: 10px; }
.pad20 { padding-top: 20px; }
.pad30 { padding-top: 30px; }
.pad40 { padding-top: 40px; }
.pad50 { padding-top: 50px; }
.pad70 { padding-top: 70px; }
.pad90 { padding-top: 90px; }

.trade { font-family: Roboto, Helvetica, sans-serif, Verdana, Arial; opacity: 0.8; }
.slider h2 .trade { font-size: 20px; position: relative; top: -18px; }

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

::-moz-focus-inner { border: 0; } 	/* FireFox */
input:focus, textarea:focus { outline: 0; }				/* Chrome, Safari */
a { outline: 0; text-decoration: none; color: #6699cc; }
a:hover { color: #666666; }

a.vs-blue { color: #006699; }
a.vs-blue:hover { color: #666666; }
a.vs-brown { color: #6699cc; }
a.vs-brown:hover { color: #666666; }

ul.tick, ul.tick-blue, ul.tick-gray { text-align: left; font-weight: 300; list-style-type: none; padding: 0; margin: 0; }
ul.tick li { background: url(../img/tick-green.png) 0 8px no-repeat; padding-left: 20px; margin-top: 10px; }

ul.tick-blue li { background: url(../img/tick-blue.png) 0 8px no-repeat; padding-left: 20px; margin-top: 10px; }
ul.tick-gray li { background: url(../img/tick-gray.gif) 0 8px no-repeat; padding-left: 20px; margin-top: 10px; }

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; }

.reginput { font-size: 12px; color: #666666; background-color: #ffffff; font-family: verdana,arial; border: #CCCCCC solid 1px; padding-left: 5px; height: 25px; }


.overlay { display: none; position: fixed; z-index: 1000; top: 0; left: 0; width: 100%; height: 100%; background-color: #000000; 
	-moz-opacity: 0.7; opacity: 0.7; }
	
	
#wrapper { min-height: 100%; height: auto !important; height: 100%; margin: 0 auto -450px; }

/* Apply .main-grid to any sections that need to be 950px width */
.main-grid { width: 950px; margin: 0 auto; position: relative; }
.main-grid:after { content: ""; display: table; clear: both; }


.section-gen.privacy-policy ul { list-style-position: outside; padding: 7px 0 7px 16px; margin: 0; }
.section-gen.privacy-policy li { padding-top: 7px; }


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

#overlay-layer1-light { position: absolute; z-index: 999; width: 100%; height: 100%; background-color: rgba(0,0,0, 0.92); }

.noscroll { position: fixed; overflow-y: auto;  width: 100%; height: 100%; }
/* ============ OVERLAY-LAYER1 //============ */


/* =========== INTRO-VIDEO =========== */
#video-layer1 { position: absolute; z-index: 1000; width: 1; height: 1; opacity:0; }

.section-gen.intro-video { margin-left: auto; margin-right: auto; text-align: center; padding-top: 62px; padding-bottom: 76px; position: relative; overflow: hidden; }

.intro-video .sub-title { margin: 0; padding-bottom: 50px; line-height: 1.5; overflow: hidden; }

.video-container-wrap { position: relative; width: 82%; 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: 0px; 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: #ffffff; background-color: #e7e7e7; }

.video-container iframe { border: 0; }

img#video-thumbnail { border: solid 10px #d5d5d5 ; border-radius: 6px; width: 95%; height: 95%; max-width: 960px; max-height: 540px; opacity: 0.7; transition: all 0.25s linear 0s; position: relative; overflow: hidden; cursor: pointer; }
img#video-thumbnail:hover {opacity: 1; }

#video-thumbnail-wrapper1 { position: relative; opacity: 0; }

.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; }

.intro-video-landing .sub-title {opacity: 0; }

#live-lead-title2-trigger { position: absolute; top: 450px; }
/* =========== INTRO-VIDEO //=========== */


/* =========== MSG-LAYER1 =========== */
#msg-layer1 { position: absolute; z-index: 1000; width: 100%; height: 100%; opacity: 1; }

.msg-container-wrap { position: relative; width: 82%; max-width: 800px; max-height: 600px; margin-left: auto; margin-right: auto; margin-top: 50px; text-align: center; background-color: transparent; border-radius: 6px; }

.msg-container { position: relative;
	padding-bottom: 75%;
	padding-top: 0; height: 0; /*overflow: hidden;*/	
	margin-left: auto; margin-right: auto; text-align: center; color: #bbbbbb; font-weight: 100; font-size: 15px; }

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

.msg-logo { padding-top: 53px; }
.msg-title { padding-top: 12px; padding-bottom: 21px; color: #ffffff; font-size: 32px; font-weight: 300; }
.msg-container p { max-width: 620px; margin-left: auto; margin-right: auto; margin-bottom: 22px; text-align: center; line-height: 1.7; }

.msg-container .btn-blue {
	font-family: Roboto, "Lucida Grande", Verdana, Arial; font-size: 17px; font-weight: 100; text-decoration: none; height: 48px; line-height: 48px; display: inline-block; padding: 0 30px;
	border-radius: 4px;
	background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #6699cc), color-stop(1, #336699) );
	background: -moz-linear-gradient( center top, #6699cc 5%, #336699 90% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#6699cc', endColorstr='#336699');
	background-color: #336699;	
	color: #ffffff; 
	text-shadow: 1px 1px 0 rgba(0, 0, 0, .6);
	box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);
	cursor: pointer;
	position: relative;
	overflow: hidden;
	margin-top: 24px;
}
.msg-container .btn-blue:hover { color: #ffffff;
	background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #6699cc), color-stop(1, #336699) );
	background: -moz-linear-gradient( center top, #6699cc 5%, #336699 90% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#6699cc', endColorstr='#336699');
	background-color: #6699cc;
}

.msg-container .btn-blue-next { margin-left: 42px; }
/* =========== MSG-LAYER1 //=========== */


/* ======================== HEADER======================== */
#header { width: 100%; position: fixed; z-index: 100; top: 0; height: 60px; background-color: #ffffff; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05), 0 0 4px rgba(0,0, 0, 0.15); }
#header * { box-sizing: border-box; }
#logo { float: left; }
#logo img { margin-top: 7px; }

#nav { overflow: hidden; }
#nav a { line-height: 58px; padding: 0 12px; margin: 0 auto; text-align: center; text-decoration: none; color: #888888; font-size: 15px;  font-weight: 400; }


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


/* ===== body of dropdown ===== */
ul.main-menu li ul { list-style: none; padding: 0; margin: -7px 0 0 -22px; border: solid 1px #bebebe; border-radius: 4px; background-color: #ffffff; 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: -39px; }	/* position of dropdown 1 */
ul.main-menu li ul.submenu2 { margin-left: -22px; }	/* position of dropdown 2 */
ul.main-menu li ul.submenu3 { margin-left: -49px; }	/* position of dropdown 3 */
ul.main-menu li ul.submenu5 { margin-left: -29px; }	/* position of dropdown 5 */

ul.main-menu li ul.submenu-login { background-color: transparent; margin: 0; margin-top: -14px; margin-left: -168px; padding-top: 8px; margin-left: -165px; border: 0; border-radius: 0; box-shadow: none; } 
/* ===== 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: 77px; }	/* arrow of dropdown 1 */
ul.main-menu li ul.submenu3:after { left: 91px; } /* arrow of dropdown 3 */
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; }

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: #333333; }

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

#nav ul.main-menu li:hover li a:hover { color: #333333 ; background-color: #eeeeee; }

#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: 0px; }
#nav ul.main-menu li:hover ul.submenu-login li:last-child { margin-bottom: 0px; }

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

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


#nav ul.main-menu li .submenu1 li a { width: 173px; }  /* width of dropdown 1 */
#nav ul.main-menu li .submenu3 li a { width: 198px; }  /* width of dropdown 3 */

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


/* =========== 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(231,122,6, 1); color: #ffffff; font-size: 13px; text-shadow: 1px 1px 0 rgba(248,153,56, 0.5); border: #f89938 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(248,153,56, 1); color: #ffffff; text-shadow: 1px 1px 0px rgba(248,153,56, 0.5); } 

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 ul.main-menu li a.nav-btn { display: block; height: 32px; line-height: 32px; min-width: 70px; padding: 0 10px; background-color: #ffffff; color: #6699cc; font-size: 13px; text-transform: uppercase; border: #6699cc 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: #6699cc; color: #ffffff; border: #5186bb 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: 6px; background-color: #f9f9f9; }

#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-blue.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(100,152,204, 0.9); }

#nav .login-circle-wrap.login-circle-wrap2 { margin-top: 54px; }
#nav .login-circle-wrap.login-circle-wrap2:hover { background-color: rgba(102,102,102, 0.6); }


#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: #6699cc; 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: #999999; }
#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 //--------------- */

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


/* ======================== MAIN ======================== */
#main { padding-top: 60px; }
.item ul { text-align: left; font-weight: 300; list-style-type: none; padding: 0; margin: 0; }
.item ul li { background: url(../img/tick-green.gif) 0 8px no-repeat; padding-left: 20px; }

/* ============== SLIDER ============== */
.slider {height: 370px; background: url(../img/blue-bg.png) 0 0 no-repeat; background-size:cover; color: rgba(255,255,255, 1); font-family: Roboto; font-size: 18px; font-weight:100; 	text-shadow: 1px 1px 2px rgba(0,0,0, 0.6); line-height: 1.6; position: relative; overflow: hidden; }
.slider-icon { float: left; width: 260px; padding-top: 55px; padding-left: 80px; padding-right:54px; }
.slider-img { position: relative; }
.slider-desc { float: left; width: 480px; position: relative; }
.slider-desc h1, .slider-desc h2, .slider-desc h3, .slider-desc h4 { padding-top: 52px; padding-bottom: 10px; color: rgba(255,255,255, 1); font-weight: 300; text-shadow: 0px 2px 2px rgba(0,0,0, 0.3); }
.slider-desc h1, .slider-desc h2 { font-size: 50px; }
.slider-desc h3 { font-size: 48px; }
.slider-desc h4 { font-size: 42px; }


/*-------- slider-gen-ani -------- */
.slider-gen-ani { background: #1d1d1d url(../img/topbanner-drawing.jpg) center center no-repeat; overflow: hidden; }
.slider-gen-ani .slider-icon { padding-top: 56px; padding-left: 88px; }
.slider-gen-ani .slider-icon img { position: relative; opacity: 0; }
.slider-gen-ani .slider-desc { text-shadow: 0px 2px 2px rgba(0,0,0, 0.6); left: 10px; }
.slider-gen-ani h2, .slider-gen-ani p { width: 470px; opacity: 0; }
.slider-gen-ani h2 { position: absolute; top: 44px; padding-top: 0; text-shadow: 1px 2px 2px rgba(0,0,0, 0.6); font-weight: 300; }
.slider-gen-ani p { position: absolute; top: 142px; }
.slider-gen-ani .btn-position { position: absolute; margin: 0; top: 258px; opacity: 0; }


/*-------- slider-ad-landing -------- */
.slider-ad-landing { background: #1763ae url(../img/topbanner-ocean.jpg) center center no-repeat; }
.slider-ad-landing .slider-desc { padding-left: 450px; padding-bottom: 34px; width: 450px; }
.slider-ad-landing h2 { padding-top: 50px; line-height: 1.5; }
.slider-ad-landing img { position: absolute; z-index: 2; top: 115px; left: 35px; }
.slider-ad-landing .btn-position { padding-left: 450px; }

/*-------- slider-conversion-tracking -------- */
.slider-conversion-tracking { position: relative; background: #474747 url(../img/topbanner-conversion-tracking.jpg) center center no-repeat; overflow: hidden; }
.slider-conversion-tracking .topbanner-msg1 { position: absolute; top: 185px; left: 11px; opacity: 0; }
.slider-conversion-tracking .topbanner-msg2 { position: absolute; top: 175px; left: 722px; opacity: 0; }
.slider-partner-program a.email-verify { position: relative; left: -14px; top: 192px; display: block; width: 30px; height: 22px; cursor: default; }

/*-------- slider-partner-program -------- */
.slider-partner-program { background: #3b5e88 url(../img/topbanner-partner-program.jpg) center center no-repeat; }
.slider-partner-program .slider-desc { padding-left: 470px; font-weight: 300; text-shadow: 0px 2px 2px rgba(0,0,0, 0.6); }
.slider-partner-program h2 { position: absolute; top: 15px; left: 26px; padding-top: 0; text-shadow: 1px 2px 2px rgba(0,0,0, 0.6); opacity:0; }
.slider-partner-program p { position: absolute; top: 162px; width: 450px; }

/*-------- slider-news -------- */
.slider-news { background: #a4c3d5 url(../img/topbanner-news.jpg) center center no-repeat; }
.slider-news .slider-desc { padding-left: 0; color: #336699; text-shadow: 1px 1px 0px rgba(255,255,255,0.7); font-weight: 300; }
.slider-news h2 { position: absolute; top: 73px; left: 470px; width: 480px; padding-top: 0;  color: #336699; text-shadow: 1px 1px 0px rgba(255,255,255, 0.9);  opacity:0; }
.slider-news p { position: absolute; top: 162px; width: 450px; left: 470px; opacity:0; }


/*-------- slider-solution -------- */
.slider-solution { background: #323137 url(../img/topbanner-solution.jpg) center center no-repeat; }
.slider-solution .slider-desc { padding-left: 0; }
.slider-solution h2 { position: absolute; padding-top: 0; top: 257px; left: 597px; text-shadow: 3px 3px 1px rgba(0,0,0, 0.85); opacity:0; }


/*-------- slider-web-analytic -------- */
.slider-web-analytic { background: #1d1d1d url(../img/topbanner-drawing.jpg) center center no-repeat; overflow: hidden; }
.slider-web-analytic .slider-icon { padding-top: 56px; padding-left: 88px; }
.slider-web-analytic .slider-icon img { position: relative; }
.slider-web-analytic .slider-desc { text-shadow: 0px 2px 2px rgba(0,0,0, 0.6); left: 10px; }
.slider-web-analytic h2, .slider-web-analytic p { width: 470px; }
.slider-web-analytic h2 { position: absolute; top: 44px; padding-top: 0; text-shadow: 1px 2px 2px rgba(0,0,0, 0.6); font-weight: 100; }
.slider-web-analytic p { position: absolute; top: 142px; }
.slider-web-analytic .btn-position { position: absolute; margin: 0; top: 258px; }


/*-------- slider-live-lead -------- */
.slider-live-lead { background: #3b576f url(../img/topbanner-live-lead.jpg) center center no-repeat; overflow: hidden; }
.slider-live-lead .slider-desc { padding-left: 0; text-shadow: 2px 2px 1px rgba(0,0,0, 0.8); }

.slider-live-lead h2, 
.slider-live-lead p { position: absolute; width: 460px; left: 450px; }

.slider-live-lead h2 { top: 44px; padding-top: 0; text-shadow: 3px 3px 2px rgba(0,0,0, 0.3); }
.slider-live-lead p { top: 142px; }
.slider-live-lead .btn-position { position: absolute; margin: 0; top: 265px; left: 450px; }


/*-------- slider-hosted-form -------- */
.slider-hosted-form { background: #3b576f url(../img/topbanner-hosted-form.jpg) center center no-repeat; overflow: hidden; }
.slider-hosted-form .slider-desc { padding-left: 0; }
.slider-hosted-form h2, .slider-hosted-form p { position: absolute; width: 460px; left: 450px; }
.slider-hosted-form h2 { top: 44px; padding-top: 0; text-shadow: 1px 2px 1px rgba(255,255,255, 0.9); color: #222222; font-weight: 100; }
.slider-hosted-form p { top: 142px; font-weight: 300; color: #222222; text-shadow: 1px 1px 0px rgba(255,255,255, 0.7); }
.slider-hosted-form .btn-position { position: absolute; margin: 0; top: 265px; left: 450px; }


/*-------- slider-customer -------- */
.slider-customer { background: #1d1d1d url(../img/topbanner-drawing.jpg) center center no-repeat; overflow: hidden; }
.slider-customer .slider-icon { padding-top: 56px; padding-left: 88px; }
.slider-customer .slider-icon img { position: relative; }
.slider-customer .slider-desc { text-shadow: 0px 2px 2px rgba(0,0,0, 0.6); left: 10px; }
.slider-customer h2, .slider-customer p { width: 470px; }
.slider-customer h2 { position: absolute; top: 44px; padding-top: 0; text-shadow: 1px 2px 2px rgba(0,0,0, 0.6); font-weight: 300; }
.slider-customer p { position: absolute; top: 142px; }
.slider-customer .btn-position { position: absolute; margin: 0; top: 258px; }


/*-------- slider-webinar -------- */
.slider-webinar { background: #1e1c1d url(../img/topbanner-webinar.jpg) center center no-repeat; }
.slider-webinar .slider-desc { padding-left: 0; text-shadow: 2px 2px 1px rgba(0,0,0, 1); }
.slider-webinar h1, .slider-webinar p { position: absolute; width: 450px; left: 500px; /*opacity:0;*/}
.slider-webinar h1 { top: 64px; padding-top: 0; text-shadow: 3px 3px 2px rgba(0,0,0, 0.6); }
.slider-webinar p { top: 160px; }
/*-------- slider-webinar //-------- */


/*-------- slider-index -------- */
.slider.slider-index { height: 500px; background: #27180b url(../img/topbanner-index.jpg) center center / cover no-repeat; overflow: hidden; }
.slider-index .slider-desc { position: relative; padding-left: 0; text-shadow: 2px 2px 1px rgba(0,0,0, 0.9); }

.slider-index h1, .slider-index h2, .slider-index .p-wrap { position: absolute; width: 521px; left: 426px; opacity:0; }

.slider-index h1, .slider-index h2 { top: 45px; padding-top: 0; line-height: 1.3; text-shadow: 2px 2px 2px rgba(0,0,0, 0.8); font-size: 48px; font-weight: 100; }
.slider-index h1 .trademark, .slider-index h2 .trademark { position: relative; top: -18px; left: -1px; font-family: Roboto, Helvetica, sans-serif; font-size: 17px; font-weight: 100; opacity: 0.8; text-shadow: 0; }
.slider-index .p-wrap { top: 193px; }

.slider-index p { padding-bottom: 12px; font-size: 18px; line-height: 1.4; }

/* must set position as relative instead of position, else the text will be hidden here */
.slider-index .btn-position { position: relative; margin: 0; top: 348px; left: 662px; opacity: 0; }
.slider-index .btn-brown { line-height: 42px; }
.slider-index .fa-user-plus { position: relative; font-size: 18px; }
.slider-index #btn-text-animate2 { padding-left: 24px; padding-top: 38px; }
/*-------- slider-index //-------- */


/*-------- slider-video -------- */
.slider-video { background: #3b576f url(../img/topbanner-video.jpg) center center no-repeat; }
.slider-video .slider-desc { padding-left: 0; text-shadow: 2px 2px 1px rgba(0,0,0, 0.8); }
.slider-video h2, .slider-video p { position: absolute; width: 480px; left: 490px; opacity:0; }
.slider-video h2 { top: 64px; padding-top: 0; text-shadow: 3px 3px 2px rgba(0,0,0, 0.3); }
.slider-video p { top: 160px; }


/*-------- slider-contact-us -------- */
.slider.slider-contact-us { background: #0379a4 url(../img/topbanner-contact-us.jpg) center center no-repeat; }
.slider-contact-us h2 { position: absolute; left: 570px; top: 187px; width: 270px; color: rgba(51,102,153, 1); text-shadow: 3px 3px 3px rgba(51,102,153, 0.5); }

.slider-contact-us p { padding-top: 0px; font-size: 15px; color: rgba(255,255,255, 0.9); }
.slider-contact-us p.em { font-size: 22px; padding-bottom: 10px; }

/*-------- slider-about-us -------- */
.slider-about-us { background: #3b576f url(../img/topbanner-about-us.jpg) center center / cover no-repeat; }
.slider-about-us .slider-desc { padding-left: 0; text-shadow: 2px 2px 1px rgba(0,0,0, 0.8); }
.slider-about-us h1, .slider-about-us h2, .slider-about-us p { position: absolute; width: 480px; left: 490px; }
.slider-about-us h1, .slider-about-us h2 { top: 134px; padding-top: 0; text-shadow: 3px 3px 2px rgba(0,0,0, 0.3); }
.slider-about-us p { top: 240px; }

/*-------- slider-thank-you -------- */
.slider.slider-thank-you {height: 280px; }
.slider-thank-you { background: #b78b35 url(../img/topbanner-thank-you.jpg) center center / cover no-repeat; }

/*-------- slider-career -------- */
.slider-career { background: #3b576f url(../img/topbanner-about-us.jpg) center center / cover no-repeat; }
.slider-career .slider-desc { padding-left: 0; text-shadow: 1px 1px 1px rgba(0,0,0, 0.7); font-size: 17px; }
.slider-career h1, .slider-career h2, .slider-career p { position: absolute; width: 470px; left: 460px; }
.slider-career h1, .slider-career h2 { top: 134px; padding-top: 0; text-shadow: 3px 3px 2px rgba(0,0,0, 0.3); }
.slider-career p { top: 240px; }

/* ============== SLIDER //============== */



/* --------- SECTION-TITLE --------- */
.section-title { padding: 60px 0 0; font-family: Roboto; font-weight: 300;; position: relative; }
.section-title .title { text-align: center; font-size: 40px; position: relative; }

/* --------- SECTION-GEN --------- */
.section-gen { font-family: Roboto, Verdana, Arial; font-weight: 300; color: #999999; }

.section-gen .title1, .section-gen .title2, .section-gen .title3 { line-height: 1.3; color: #666666; padding: 50px 0 0; }
.section-gen .title1 { font-size: 45px; }
.section-gen .title2 { font-size: 32px; }
.section-gen .title3 { font-size: 22px; }

.section-gen .blue { color: rgba(51,102,153, 0.9); }
.section-gen .green { color: rgba(102,153,102,1); }
.section-gen p { font-size: 16px; padding-top: 10px; }
/* --------- SECTION-GEN //--------- */


/* --------- SECTION-GEN2 --------- */
.section-gen2 { font-family: Roboto, Helvetica, Vernada, Arial; font-size: 14px; color: #888888; font-weight: 300; }
.section-gen2 .title1, .section-gen2 .title2, .section-gen2 .title3 { color: #666666; padding: 50px 0 10px; line-height: 1.3; }
.section-gen2 .title1 { font-size: 45px; }
.section-gen2 .title2 { font-size: 32px; }
.section-gen2 .title3 { font-size: 22px; }
.section-gen2 p { padding-top: 12px; }
/* --------- SECTION-GEN2 --------- */


/* --------- SECTION-SNIPPET --------- */
.section-snippet .dark-gray { color: #666666; }
.section-snippet a { color: #006699; }
.section-snippet a:hover { color: #666666; }
/* --------- SECTION-SNIPPET //--------- */


/* --------- TITLE (for multiple titles) --------- */
.section-product .title,
.section-feature .title,
.intro-video .sub-title,
.title-and-sub .title { position: relative; color: #666666; font-size: 48px; font-weight: 100; }
/* --------- TITLE (for multiple titles) //--------- */

/* --------- SECTION-PRODUCT --------- */
.section-product { margin: 0 auto; text-align: center; padding: 55px 0 75px; font-family: Roboto; font-size: 16px; position: relative; overflow: hidden; }
.section-product.section-product-notitle { padding-top: 70px; }
.section-product.section-product-index { padding-top: 80px; padding-bottom: 75px; }
.section-product .title { padding-bottom: 45px; }
.section-product .item { float: left; width: 281px; margin-left: 45px; position: relative; }
.section-product .item-first { margin-left: 0; }
.section-product .icon { margin: 0 auto; text-align: center; padding-bottom: 9px; }
.section-product .icon img { width: 125px; height: 125px; }
.section-product h2 { margin: 0 auto; padding-bottom: 12px; font-family: Roboto; font-weight: 300; color: #f89938; font-size: 23px; }
.section-product.section-product-index h2 { color: #666666; }

.section-product h2.kickfire-h2-new { background: url(../img/new.gif) 180px 2px no-repeat; }

.section-product p { text-align: left; line-height: 26px; font-weight: 300; }
.section-product p a { color: #6699cc; text-decoration: none; }
.section-product p a:hover { color: #000000; }
/* --------- SECTION-PRODUCT //--------- */

.title-and-sub { position: relative; }
.title-and-sub p { margin: 0 auto; text-align: center; position: relative; font-family: Roboto; font-weight: 300; width: 950px; }
.title-and-sub .title { width: 950px; margin: 0 auto; text-align: center; padding-bottom: 20px; line-height: 1.4; }
.title-and-sub p { font-size: 22px; color: #888888; padding-bottom: 60px; line-height: 1.6; }

/* WHEN TITLE AND SUB JUST BY ITSELF */
.title-and-sub.alone .title { padding-top: 44px; }
.title-and-sub.alone p { padding-bottom: 20px; }

/* --------- SECTION-PRODUCT-SMALL --------- */
.section-product-small { margin: 0 auto; text-align: center; padding: 65px 0; color: #999999; font-family: Roboto; font-size: 15px; font-weight: 300; }
.section-product-small .title { padding-bottom: 45px; border: solid 1px red; color: #006699; color: rgba(0, 102, 153, 0.9); font-size: 45px; font-weight: 300; font-family: Roboto; }
.section-product-small .item { float: left; width: 265px; margin-left: 77px; position: relative; }
.section-product-small .item-first { margin-left: 0; position: relative; }
.section-product-small .icon { margin: 0 auto; text-align: center; padding-bottom: 7px; position: relative; }
.section-product-small .icon img { width: 84px; height: 84px; }
.section-product-small h2 { margin: 0 auto; padding-bottom: 10px; font-family: Roboto; font-weight: 300; color: #666666; font-size: 20px; }
.section-product-small p { text-align: left; line-height: 26px; }
.section-product-small p a { color: #6699cc; text-decoration: none; }
.section-product-small p a:hover { color: #000000; }
.section-product-small .pad { height: 50px; }
.section-product-small .item ul li { padding-left: 17px; background-position: 0 8px; }
/* --------- SECTION-PRODUCT-SMALL //--------- */



/* --------- SECTION-FEATURE --------- */
.section-feature { margin: 0 auto; text-align: center; padding: 55px 0 75px; color: #999999; font-family: Roboto; font-size: 16px; font-weight: 300; position: relative; }
.section-feature .title { padding: 0 0 50px; }
.section-feature .item { padding: 70px 0 0; position: relative; }
.section-feature .item-first { padding: 0; }
.section-feature .icon, .section-feature .desc { float: left; width: 50%; position: relative; }
.section-feature .icon { margin: 0 auto; text-align: center; }
.section-feature .desc { text-align: left; }

.section-feature h2 { font-family: Roboto; font-weight: 300; color: #f89938; font-size: 32px; padding-bottom: 18px; line-height: 1.5; }
.section-feature p { margin-bottom:18px; }
.section-feature p a { color: #f89938; text-decoration: none; }
.section-feature p a:hover { color: #666666; }
/* --------- SECTION-FEATURE //--------- */


/*-------- GEN-BANNER BANNER-HIRING-------- */
.gen-banner.banner-hiring {height: 350px; font-family: Roboto, Helvetica, Arial , Verdana; }
.banner-hiring {}

.banner-hiring-inside { position: relative; height: 350px; width: 100%; background: #b78b35 url(../img/topbanner-about-us.jpg) center center / cover no-repeat; }

.banner-hiring .banner-msg { width: 530px; margin-left: auto; margin-right: auto; text-align: center; position: relative; font-weight: 100; color: #ffffff; }
.banner-hiring #banner-msg1 { top: 80px; line-height: 1.3; font-size: 48px; }
.banner-hiring #banner-msg2 { font-size: 17px; top: 110px; }
.banner-hiring #banner-msg2  a { line-height: 37px; padding: 0 0; color: #ffffff; font-weight: 300; border: solid 1px; border-radius: 3px; padding: 7px 16px; }
/*-------- GEN-BANNER BANNER-HIRING//-------- */


/* --------- SECTION-BANNER --------- */
.section-banner {height: 225px; background: url(../img/drawing-bg.gif) 0 0 no-repeat; background-size:cover; font-family: Roboto; }
.section-banner .desc { text-align: center; width: 100%; }
.section-banner .icon { float: left; padding: 25px 0 0; width: 35%; text-align: left; }
.section-banner h2 { padding: 52px 0 0 0px; color: #ffffff; font-size: 50px; font-weight:100; line-height: 25px; text-shadow: 1px 1px 2px rgba(3, 61, 78, 0.6); }

.section-banner .btn-position { margin: 50px 0 0 0px; text-align: center; }

.btn-orange, input.trial-signup-btn[type="submit"] {
	font-family: Roboto, "Lucida Grande", Verdana, Arial; font-size: 18px; font-weight: 400; text-decoration: none; height: 48px; line-height: 46px; display: inline-block;
	padding: 0 18px;
	-moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;
	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');
	background-color: #e77a06;	
	color: #ffffff; 
	text-shadow: 1px 1px 0 rgba(0, 0, 0, .6);
	box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);
	cursor: pointer;
	transition: all 0.3s linear 0s;
	position: relative;
	overflow: hidden;
}
.btn-orange:hover {
	background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #f89938), color-stop(1, #e77a06) );
	background: -moz-linear-gradient( center top, #f89938 5%, #e77a06 60% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f89938', endColorstr='#e77a06');
	color: rgba(255,255,255, 1);
}

.btn-orange.medium { font-size: 12px; height: 30px; line-height: 30px; padding: 0 22px;
	background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #999999), color-stop(1, #606060) );
	background: -moz-linear-gradient( center top, #999999 5%, #606060 90% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#999999', endColorstr='#606060');
	text-shadow: 2px 2px 1px rgba(0,0,0, 0.4);
}

.btn-orange.medium:hover {
	background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #6aa7e3), color-stop(1, #044585) );
	background: -moz-linear-gradient( center top, #6aa7e3 5%, #044585 90% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#6aa7e3', endColorstr='#044585');
	opacity:0.8;
	background-position: -10px;
}

.btn-brown {
	font-family: Roboto, "Lucida Grande", Verdana, Arial; font-size: 16px; font-weight: 400; text-decoration: none; height: 42px; line-height: 40px; display: inline-block; padding: 0 18px;
	-moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;
	background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #6699cc), color-stop(1, #336699) );
	background: -moz-linear-gradient( center top, #6699cc 5%, #336699 90% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#6699cc', endColorstr='#336699');
	background-color: #336699;	
	color: #ffffff; 
	text-shadow: 1px 1px 0 rgba(0, 0, 0, .6);
	box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.2);
	cursor: pointer;
	position: relative;
	overflow: hidden;
}
.btn-brown:hover { color: #ffffff;
	background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #6699cc), color-stop(1, #336699) );
	background: -moz-linear-gradient( center top, #6699cc 5%, #336699 90% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#6699cc', endColorstr='#336699');
	background-color: #6699cc;
}

.slider .btn-brown img { position: relative; top: 6px; }
.btn-brown img { padding-right: 3px; }
#btn-text-animate1 { position: relative; display: inline-block; top: 1px; }
#btn-text-animate2 { position: relative; padding-left: 30px; padding-top: 40px; top: 0}


.btn-gray-small {
	font-family: "Lucida Grande", Verdana, Aria; font-size: 11px; text-decoration: none; height: 23px; display: inline-block; 
	-moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;
	background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf) );
	background: -moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf');
	background-color: #cdcccc;	
	border: 1px solid #c2c0c0;
	color: #4b4b4b; 
	cursor: pointer;
}

.btn-gray-small:hover {
  color: #ffffff; 
	background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #debb83), color-stop(1, #c78b3c) );
	background: -moz-linear-gradient( center top, #c99f60 5%, #bb863b 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#debb83', endColorstr='#c78b3c');
	background-color: #d1a15d;
	border: 1px solid #bc873c;
	text-shadow: 0px 1px 2px rgba(103, 51, 14, 1);
}


/* --------- SECTION-BANNER //--------- */


/* =========== PAGE SCROLL ANIMATE (live-lead.php, web-analytic.php, hosted-form.php =========== */
#section-product2, #section-feature1 {overflow: hidden; }
#section-feature1 .item {overflow: hidden; }
.section-feature .icon, .section-feature .desc { position: relative; }
.section-product .icon, .section-product .desc { position: relative; }

.section-product .item { position: relative; }
#section-feature-crm1 table, #section-feature-crm1 td { position: relative; }
img .crm-item { position: relative; }
.section-title {overflow: hidden; }

#vs-analytics-anchor { position: relative; top: -60px; }
/* =========== PAGE SCROLL ANIMATE //=========== */


/* --------- VIDEOS --------- */
.video-layout { padding: 35px 0 60px 0; font-family: Roboto; font-weight: 300; font-size: 13px; }
.video-left { float: left; width: 220px; margin-right: 30px; margin-top: 30px; }
.video-right { float: left; width: 700px; margin-top: 32px; background-color: #ffffff; }

.video-layout h2 { font-family: Roboto; font-weight: 300; color: #999999; font-size: 40px; padding-bottom: 10px; }
.video-layout h1, .video-layout p { font-family: Roboto; font-weight: 300; font-size: 16px; color: #999999; }
.video-layout p a { color: #6699cc; text-decoration: none; }
.video-layout p a:hover { color: #666666; }

ul#accordion, ul#accordion ul { list-style: none; margin: 0; padding: 0; }

ul#accordion ul li { border-bottom: 1px solid #eeeeee; color: #999999; }
ul#accordion ul li:last-child { border-bottom: none; }

ul#accordion a.heading { color: #999999; display: block; line-height: 27px; text-decoration: none; font-size: 13px; margin-top: 2px; border-radius: 3px; padding: 4px 0 5px 27px; 	background: #f0f0f0 url(../img/plus-gray.png) 6px center no-repeat; transition: all 300ms linear 0s; }


/* extend transition effect here control when the page first load and the first section is highlighted */
ul#accordion li.current a.heading { background-image: url(../img/minus-white.png); background-color: #6699cc; color: #ffffff; text-shadow: 1px 1px 0 rgba(166, 111, 0, 0.6);
	transition: all 800ms linear 0s; }

/* normal transition effect here affects when mouse over */
ul#accordion li ul a { color: #999999; text-decoration: none; display: block; padding: 8px 0 8px 26px; border-radius: 1px; background: #ffffff url(../img/icon-video-sm.png) 6px center no-repeat; transition: all 300ms linear 0s; }

ul#accordion a.heading:hover { background-color: #6699cc; background-image: url(../img/plus-white.png); color: #ffffff; text-shadow: 1px 1px 0 rgba(166, 111, 0, 0.6); }

ul#accordion li ul a:hover { background-color: #e0ebf5; color: #777777; }
ul#accordion li ul a.link-current { background-color: #c2d6eb ; color: #777777; }

ul#accordion li.ui-accordion-selected a.heading { background: #c2d6eb; color: #ffffff; }

ul#accordion li ul { display: none; }

.vbody { display: none; background: url(../img/video-msg.png) 49px 82px no-repeat; border: solid 10px #e7e7e7; border-radius: 6px; width: 670px; height: 440px; }
/* --------- VIDEOS //--------- */


/* =========== WEBINAR =========== */
.section-webinar { padding: 50px 0 20px 0; font-family: Roboto; font-weight: 300; }
.section-webinar .section-webinar-msg { position: relative; }
.section-webinar p.msg1 { padding-bottom: 10px; font-size: 16px; }
.section-webinar p.msg2 { padding-bottom: 45px; font-size: 16px; color: #666666; font-style: italic; }
.webinar-cat { padding-bottom: 55px; position: relative; }
.section-webinar h1, .section-webinar h2 { font-family: Roboto; font-weight: 300; }
.section-webinar h1 { color: #999999; font-size: 35px; line-height: 1.1; }

.section-webinar .item { float: left; width: 415px; position: relative; margin-top: 40px; }
.section-webinar .item-list .item:nth-of-type(even) { margin-left: 120px; }

.section-webinar .item:after, .webinar-cat:after, .webinar-subcat:after { content: ""; display: table; clear: both; }


/* ----------- WEBINAR-BANNER ----------- */
.webinar-banner { padding-top: 16px; padding-bottom: 50px; }
.webinar-banner-image { padding-bottom: 0; background: url(../img/kf-banner-webinar.png) 0 0 no-repeat; display: block; width: 950px; height: 117px; }
.webinar-banner-learn-more { margin-top: 2px; padding-left: 2px; font-size: 12px; }
/* ----------- WEBINAR-BANNER //----------- */


/* ----------- BTN-ANI ----------- */
.btn-ani-wrap { float: right; margin-right: 32px; margin-top: 38px; }
.btn-ani {
	position: relative; 
	background-image: linear-gradient(to top, #e77a06, #feb93b); 
	color: #ffffff; display: inline-block; padding: 0 24px; height: 40px;
	-moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px;
	font-size: 15px; font-weight: 400; line-height: 39px; text-shadow: 0px 1px 1px rgba(0,0,0, 0.4);
}

.fa { position: relative; }
/* ----------- BTN-ANI ----------- */


/* --------- item-date --------- */
.item-date { float: left; width: 70px; height: 95px; color: rgba(255,255,255, 0.5); font-size: 14px; 	text-align: center; line-height: 1; margin-top: 5px; border-radius: 2px; }

.green .item-date { background-color: #85ad85; }
.brown .item-date { background-color: #d7af60; }
.blue .item-date { background-color: rgba(102, 102, 102, 0.9); }
.lightblue .item-date { background-color: #68a0bc; }
.gray .item-date { background-color: #b6b6b6; }

.item-date:before {content:""; position: absolute; z-index: 2; overflow: visible; left: 70px; top: 24px;
	border-style: solid; border-width: 8px 0 8px 12px; -moz-transformation:scale(.9999); }

.green .item-date:before { border-color: rgba(255,0,0,0) rgba(255,0,0,0) rgba(255,0,0,0) rgba(133,173,133, 1); }
.brown .item-date:before { border-color: rgba(255,0,0,0) rgba(255,0,0,0) rgba(255,0,0,0) rgba(215,175,96, 1); }
.blue .item-date:before { border-color: rgba(255,0,0,0) rgba(255,0,0,0) rgba(255,0,0,0) rgba(102, 102, 102, 0.9); }
.lightblue .item-date:before { border-color: rgba(255,0,0,0) rgba(255,0,0,0) rgba(255,0,0,0) rgba(104,160,188, 1); }
.gray .item-date:before { border-color: rgba(255,0,0,0) rgba(255,0,0,0) rgba(255,0,0,0) rgba(182,182,182, 1); }

.item-date .date { color: rgba(255,255,255, 0.9); font-size: 34px; padding: 3px 0 5px 0}
.item-date .month, .item-date .year { text-transform:uppercase; }
.item-date .month { padding-top: 13px; }
/* --------- item-date //--------- */

.item-content { float: left; margin-left: 30px; }
.section-webinar .item-content { width: 315px; }

.section-webinar h2 { color: #999999; line-height: 1.3; }

.section-webinar .time { background: url(../img/icon-clock-gray.png) 0 10px no-repeat; padding-left: 22px; }
.section-webinar .registration { background: url(../img/icon-write-gray.png) 2px 10px no-repeat; padding-left: 24px; }

.green h1,
	.green a { color: rgba(102,153,102, 0.9); }
.brown h1,
	.brown a { color: #6699cc; }
.blue h1, 
	.blue a { color: #6699cc; }
.lightblue h1, 
	.lightblue a, .webinar-subcat-link { color: #528ba6; }

.section-webinar h2 a:hover { color: #666666; }
.section-webinar p { color: #999999; font-size: 14px; padding-top: 7px; }
.section-webinar p.em { color: #666666; font-style:italic; }
.section-webinar p a:hover { color: #666666; }

.previous-webinar { padding-top: 5px; padding-bottom: 65px; }
.previous-webinar p.em { padding-top: 15px; }
.previous-webinar p span { display: inline-block; margin-left: 30px; }
.previous-webinar span.webinar-download { background: url(../img/icon-download-brown.png) 0 0 no-repeat; width: 20px; height: 20px; cursor: pointer; }
.previous-webinar span.webinar-download:hover{ background-image: url(../img/icon-download-brown-ani.gif); }

.previous-webinar .webinar-subcat .item:first-child span.webinar-download { background-image: url(../img/icon-download-brown-ani.gif); }

.previous-webinar span.webinar-download-ani { background: url(../img/icon-download-brown-ani.gif) 0 0 no-repeat; width: 20px; height: 20px; cursor: pointer; }

.webinar-subcat-link {
	color: #999999; display: block; line-height: 27px; text-decoration: none;
	margin-top: 4px; border-radius: 3px; padding: 6px 0 7px 27px; cursor: pointer; font-size: 14px;
	background: #f0f0f0 url(../img/plus-gray.png) 6px center no-repeat; transition: all 300ms linear 0s;
}
.webinar-subcat-link:hover, .webinar-subcat-link.current { background-color: /*#d7af60*/ #d8b672; background-image: url(../img/plus-white.png); color: #ffffff; text-shadow: 1px 1px 0 rgba(166, 111, 0, 0.6); }
.webinar-subcat-link.current { background-image: url(../img/minus-white.png); }

.webinar-subcat-link1{ margin-top: 30px; }
.webinar-subcat { padding-bottom: 30px; }
.section-webinar .webinar-subcat .item { margin-top: 30px; }
.section-webinar .webinar-subcat h2 { padding-top: 22px; }

.webinar-subcat { display: none; }
/* =========== WEBINAR //=========== */


/* =========== VS-FORM =========== */
.vs-form { padding: 100px 165px 0; color: #848484; font-size: 14px; font-family: Roboto; font-weight: 300; position: relative; /*display: none;*/ }
.vs-form .title { font-size: 40px; line-height: 1.4; padding-bottom: 10px; text-align: center; }
.vs-form .sub-title { font-size: 16px; text-align: center; padding-bottom: 20px; }

.vs-form .item { float: left; width: 295px; height: 83px; border-radius: 8px; margin-top: 20px; background-color: #f3f3f3; color: #888888; position: relative; transition: all 300ms linear 0s; }
.vs-form .item-right { margin-left: 30px; }
.vs-form .item-active { background-color: rgba(0, 102, 153, 0.1); color: #666666; transition: all 300ms linear 0s; }

.vs-form .item .label { padding-top: 13px; padding-left: 16px; padding-bottom: 2px; }
.vs-form .item input, .vs-form .item textarea { margin-left: 16px; margin-top: 2px; width: 259px; height: 24px; border: solid 1px transparent; 
	font-family: Roboto; font-weight: 400; font-size: 14px; color: #333333; 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: 584px; height: 109px; }	/* dimension of the innner textarea itself */
.vs-form .item-textarea { width: 620px; height: 166px; }	/* dimension of an item that contains a textarea */

/* submit button */
form.llpartnerform .item-submit-wrapper { margin: 0 auto; text-align: center; }

.vs-form .item-submit input, input.partner-form-btn[type="submit"] { width: 620px; height: 57px; margin: 20px 0 0; padding: 0; border: 0; border-radius: 8px; cursor: pointer; 
	background-color: #f89938; color: #ffffff; font-size: 19px; transition: all 300ms linear 0s;
}
.vs-form .item-submit input:hover, input.partner-form-btn[type="submit"]:hover { background-color: #6699cc; text-shadow: 1px 1px 0 #333333; }


/* --------- INPUT BOX ERROR MESSAGE --------- */
.vs-form .error-msg:before { position: absolute; width: 157px; height: 25px; 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: 0px 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-firstname:before {content:"Please enter your first name."; width: 176px; }
.vs-form .msg-lastname:before {content:"Please enter your last name."; width: 176px; }
.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 .error-msg { display: none; position: absolute; z-index: 2; top: 56px; }
/* --------- INPUT BOX ERROR MESSAGE //--------- */

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


/* =========== VS-FORM: form-partner =========== */
/* styling for reseller form */
.vs-form.form-partner { display: block; padding-top: 50px; }

/* =========== VS-FORM: form-partner //=========== */





/* --------- CONTACT US --------- */
.section-contact { height: 295px; margin: 0 auto; padding-top: 40px; position: relative; font-family: Roboto; font-weight: 300; color: #999999; font-size: 14px; }
.section-contact .contact-col { position: absolute; width: 180px; text-align: center; top: 0; left: 245px; margin: 0; padding: 0; background-color: #fafafa; } 
.section-contact h2 { padding-bottom: 0; padding-top: 5px; font-size: 23px; font-weight: 300; color: #6699cc; }

.vs-address { text-align: center; }
.vs-address h2 { padding-bottom: 0; padding-top: 35px; font-size: 36px; font-weight: 300; color: #336699; }
.vs-address h2 span.brown { color: #6699cc; }
.vs-address p { padding-top: 20px; }

.section-contact .contact-col1 { z-index: 3; }
.section-contact .contact-col2 { z-index: 2; }
.section-contact .contact-col3 { z-index: 1; }
.section-contact .icon img { width: 125px; height: 125px; }
.section-contact p { text-align: left; font-size: 15px; line-height: 1.4; text-align: center; }


/* 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; }

/* offset the Google Maps Embed API 5px because there's a 5px of white space below the map */
.google-map-wrapper { background-color: #fafafa; }
.google-map-wrapper-inner { position: relative; bottom: -5px; }
/* --------- CONTACT US //--------- */


/* =========== SECTION-TWIN =========== */
.section-twin { position: relative; padding-top: 0px ; padding-bottom: 0; padding-left: 10px; padding-right: 10px; font-size: 16px; font-weight: 300; color: #999999; overflow: hidden; }
.flex-wrapper {overflow: hidden; }
.section-product.section-twin .title { position: relative; padding-top: 63px; padding-bottom: 50px; color: #666666; }
.section-product.section-twin .title span.trade { position: relative; top: -20px; left: 2px; font-size: 20px; }

.twin-text { position: relative; margin-top: 12px; overflow: hidden; }
.twin-text:last-child { padding-bottom: 78px; }
.section-twin img { position: relative; margin-top: 18px; margin-left: 7px; margin-bottom: 5px; }
/* =========== SECTION-TWIN //=========== */


/* ============ SECTION-THANK-YOU ============ */
.section-thank-you { padding: 80px 0 100px 0; text-align: center; font-family: Roboto; font-weight: 300; }
.section-thank-you h2 { font-size: 45px; font-weight: 300; }
.section-thank-you p { padding-top: 10px; line-heigh: 1.7; font-size: 18px;   }
/* ============ SECTION-THANK-YOU //============ */


/* ============ SECTION-MAGENTO ============ */
.section-magento { padding: 60px 0 100px 0; font-weight: 300; font-size: 14px; }
.section-magento h2 { text-align: center; color: #666666; font-size: 24px; font-weight: 300; }
.section-magento .title { padding-top: 20px; text-align: center; font-size: 24px; }
.magento-wrapper { width: 764px; margin-top: 40px; margin-left: auto; margin-right: auto; }
.magento-wrapper:after { content:""; display: table; clear: both; }
.magento-box { float: left; width: 322px; height: 117px; padding: 18px 20px 20px; border-radius: 10px; background-color: #efefef; color: #888888; }
.magento-box:nth-child(2) { margin-left: 40px; }
.magento-box-answer { font-weight: 400; text-align: center; font-size: 20px; color: #6699cc; }
.section-magento ol { padding-left: 16px; }
.magento-action { text-align: center; font-weight: 400; }
.section-magento .btn-brown { margin-top: 19px; }
.section-magento .btn-text-animate1 { }

.why-visistat { width: 290px; margin: 20px auto; }
.why-visistat .title { text-align: left; color: #6699cc; font-size: 20px; }
.why-visistat ul { list-style-type: none; padding: 0; margin: 0; margin-top: 10px; }
.why-visistat ul li { padding-left: 20px; background: url(../img/tick-green.png) 0 6px no-repeat; font-weight: 400; color: #999999; }

.logo-magento { position: relative; top: 7px; text-align: right; }
/* ============ SECTION-MAGENTO //============ */


/* ============ ABOUT-US ============ */

/* ---------- .vs-people ---------- */
/* Every time add a new row, add 214px to the current height */
.vs-people { padding: 50px 0; height: /*2564px*/ 2350px /*2136px*/ /*1922px*/ ; overflow-x: hidden; }
.vs-people .title { font-size: 45px; font-weight: 300; color: #666666; padding: 0 0 40px;; text-align: center; position: relative; opacity: 0; }
.photo-row:after {content: ''; display: table; clear: both; }
.photo-row1, .photo-row2 {opacity: 0; }

.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'); }

.vs-people .photo-row { position: relative; }
.row-even .photo-item.item-first { margin-left: 0}
.row-odd .photo-item.item-first { margin-left: 122px; }

/* When even row has two items or odd row has one item, add ".item-first-push-middle" after ".item-first" to center align them */
.row-odd .photo-item.item-first.item-first-center { margin-left: 366px; } 
.row-even .photo-item.item-first.item-first-center { margin-left: 259px; }

/* ---------- .vs-people //---------- */


/* ======== TIMELINE ======== */
/* --------------------------------------------
 *  :before  	: styling for the arrow
 *	:after		: styling for the arrow shadow
 *  .timeline, .vertical-line : increase height 140px for each new timeline-item added
 * -------------------------------------------- */
.timeline { position: relative; height: 2120px; font-family: Roboto, Verdana, Arial; font-weight: 300; overflow-x: hidden; }
.timeline .title { font-size: 45px; font-weight: 300; color: #666666; padding: 50px 0 0px; text-align: center; position: relative; }

.timeline-pin { padding: 0; }
.vertical-line { position: absolute; z-index: 2; width: 4px; height: 1463px; background-color :#eeeeee; top: 182px; left: 473px; }

.timeline-item { position: absolute; z-index: 1; width: 385px; }

.timeline-img img { position: absolute; z-index: 3; width: 100px; height: 100px; top: 24px; left: 12px; }


/* ========== .timeline-p1 ========== */
.timeline-p1, .timeline-p2 { width: 385px; }
.timeline-p1 { height: 65px; border-radius: 2px 2px 1px 1px; box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.35); }
.timeline-p1:before { content:""; position: absolute; z-index: 3; overflow: visible; top: 17px; border-style: solid; -moz-transformation:scale(.9999); }
.timeline-p1:after { content:""; position: absolute; z-index: 2; overflow: visible; top: 19px; border-style: solid; -moz-transformation:scale(.9999); }

.item-left .timeline-p1:before  { border-width: 16px 0 16px 16px; } /* arrow of the right item */
.item-left .timeline-p1:after  { border-width: 15px 0 15px 15px; }  /* arrow shadow of the right item */

.item-right .timeline-p1:before  { border-width: 16px 16px 16px 0; } /* arrow of the right item */
.item-right .timeline-p1:after  { border-width: 15px 15px 15px 0; }  /* arrow shadow of the right item */

/* color for the timeline item */
.timeline-p1 { background-color: #666666; }
.item-left .timeline-p1:before { border-color: rgba(255,0,0,0) rgba(255,0,0,0) rgba(255,0,0,0) rgba(102, 102, 102, 1); }
.item-right .timeline-p1:before { border-color: rgba(255,0,0,0) rgba(102, 102, 102, 1) rgba(255,0,0,0) rgba(255,0,0,0); }

/* DIFFERENT COLOR FOR TIMELINE ITEM: BROWN */
.item-future .timeline-p1 { background-color: #336699; }
.item-left.item-future .timeline-p1:before { border-color: rgba(255,0,0,0) rgba(255,0,0,0) rgba(255,0,0,0) rgba(51,102,153, 1); }
.item-right.item-future .timeline-p1:before { border-color: rgba(255,0,0,0) rgba(51,102,153, 1) rgba(255,0,0,0) rgba(255,0,0,0); }

/* DIFFERENT COLOR FOR TIMELINE ITEM: ORANGE */
.item-orange .timeline-p1 { background-color: #336699; }
.item-left.item-orange .timeline-p1:before { border-color: rgba(255,0,0,0) rgba(255,0,0,0) rgba(255,0,0,0) rgba(220,124,39, 1); }
.item-right.item-orange .timeline-p1:before { border-color: rgba(255,0,0,0) rgba(220,124,39, 1) rgba(255,0,0,0) rgba(255,0,0,0); }


/* color for the arrow shadow */
.item-left .timeline-p1:after { border-color: rgba(255,0,0,0) rgba(255,0,0,0) rgba(255,0,0,0) rgba(191,191,191, 0.3); }
.item-right .timeline-p1:after { border-color: rgba(255,0,0,0) rgba(191,191,191, 0.3) rgba(255,0,0,0) rgba(255,0,0,0); }


/* arrow position */
.item-right .timeline-p1:before { right: 383px; }
.item-right .timeline-p1:after { right: 385px; }

.item-left .timeline-p1:before { left: 383px; }
.item-left .timeline-p1:after { left: 385px; }

.timeline-p1 .year { position: relative; top: 1px; color: #ffffff; font-size: 45px; line-height: 65px; padding-left: 185px; text-shadow: 2px 2px 2px rgba(0,0,0, 0.3); }
.item-future .timeline-p1 .year { text-shadow: 2px 2px 2px rgba(0,0,0, 0.3); }
.item-orange .timeline-p1 .year { text-shadow: 2px 2px 2px rgba(209,112, 25, 0.8); }
/* ========== .timeline-p1 //========== */


/* ========== .timeline-p2 ========== */
.timeline-p2 { width: 383px; height: 88px; color: #666666; margin-left: 1px; background-color: #eeeeee; border-radius: 0 0 4px 4px; box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.2); }
.item-future .timeline-p2 { color: #666666; }
.item-orange .timeline-p2 { color: #dc7c27; }

.timeline-p2-text { padding-left: 82px; padding-top: 17px; }
.timeline-p2 .main-text { font-size: 17px; text-align: center; }
.timeline-p2 .sub-text { font-size: 14px; text-align: center; padding-top: 2px; }


/* ---------- .timeline item ---------- */
.timeline13 img { left: 33px; width: 110px; height: 110px; }
.timeline13 .timeline-p1 .year { padding-left: 204px; }
.timeline13 .timeline-p2-text { padding-left: 129px; padding-top: 29px; }

.timeline12 img { left: 14px; }
.timeline12 .timeline-p1 .year { padding-left: 190px; }
.timeline12 .timeline-p2-text { padding-left: 98px; padding-top: 17px; }

.timeline11 img { left: 24px; width: 81px; height: 102px; }
.timeline11 .timeline-p1 .year { padding-left: 172px; }
.timeline11 .timeline-p2-text { padding-left: 90px; padding-top: 29px; }

.timeline10 img { left: 36px; width: 108px; height: 108px; }
.timeline10 .timeline-p1 .year { padding-left: 208px; }
.timeline10 .timeline-p2-text { padding-left: 130px; }
.timeline10 .main-text { }
.timeline10 .main-text a:hover { color: #666666; }

.timeline9 img { left: 33px; top: 27px; }
.timeline9 .timeline-p1 .year { padding-left: 203px; }
.timeline9 .timeline-p2-text { padding-left: 121px; }

.timeline8 img { left: 25px; }
.timeline8 .timeline-p1 .year { padding-left: 203px; }
.timeline8 .timeline-p2-text { padding-left: 120px; }

.timeline7 img { left: 36px; top: 27px; }
.timeline7 .timeline-p1 .year { padding-left: 206px; }
.timeline7 .timeline-p2-text { padding-left: 120px; }

.timeline6 img { left: 22px; }
.timeline6 .timeline-p1 .year { padding-left: 197px; }
.timeline6 .timeline-p2-text { padding-left: 110px; }

.timeline5 img { left: 34px; }
.timeline5 .timeline-p1 .year { padding-left: 200px; }
.timeline5 .timeline-p2-text { padding-left: 115px; }

.timeline4 img { left: 24px; }
.timeline4 .timeline-p1 .year { padding-left: 200px; }
.timeline4 .timeline-p2-text { padding-left: 115px; }

.timeline3 img { left: 42px; }
.timeline3 .timeline-p1 .year { padding-left: 205px; }
.timeline3 .timeline-p2-text { padding-left: 124px; }

.timeline2 .main-text{ padding-top: 14px; padding-left: 10px; }

.timeline1 img { left: 34px; }
.timeline1 .timeline-p1 .year { padding-left: 194px; }
.timeline1 .timeline-p2-text { padding-left: 105px; }
/* ---------- .timeline item ---------- */

/* ========== .timeline-p2 ========== */



/* ---------- .timeline-circle ---------- */
.timeline-circle { position: absolute; z-index: 6; left: -12px; }

.timeline-circle .outside-circle { border-radius: 50%; width: 28px; height: 28px; background-color: #eeeeee; position: relative; }
.timeline-circle .inside-circle { border-radius: 50%; width: 16px; height: 16px; background-color: #999999; position: absolute; z-index: 7; top: 6px; left: 6px; }

/* FUTURE CIRCLE FOR FUTURE TIMELINE POINT */
.future-circle .outside-circle { background-color: #eeeeee; }
.future-circle .inside-circle { background-color: #999999; }

/* ORANGE CIRCLE FOR ORANGE TIMELINE POINT */
.orange-circle .outside-circle { background-color: #f0d8c1; }
.orange-circle .inside-circle { background-color: #dc7c27; }

/* ---------- .timeline-circle //---------- */

/* ======== TIMELINE ======== */


/* ============ ABOUT-US //============ */


/* ============ CAREER ============ */
.section-gen.career { padding-top: 58px; padding-bottom: 0; font-weight: 300; }
.section-gen.career .title { color: #999999; font-weight: 100; font-size: 52px; text-align: center;  position: relative; padding-bottom: 0px; position: relative; }
.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: 28px; 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-blue.png); }
.job-cat-support .job-cat-title{ background-image: url(../img/career-icon-wrench-blue.png); }
.job-cat-sales .job-cat-title{ background-image: url(../img/career-icon-headphone-blue.png); }
.job-cat-marketing .job-cat-title{ background-image: url(../img/career-icon-chart-blue.png); }
.job-cat-finance .job-cat-title{ background-image: url(../img/career-icon-money-blue.png); }

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

.job-item-content { font-size: 14px; background-color: #f8f8f8; color: #333333; padding: 26px 30px 36px 30px; margin-top: 20px; margin-bottom: 20px; margin-left: 0px; font-weight: 300; line-height: 1.7; 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: 19px; }

.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: #6699cc; 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: 30px; }
.no-job-open { padding-top: 30px; font-size: 17px; }


/* ----------- CAREER-PERK ----------- */
.career-perk .title { margin-bottom: 55px;  position: relative; }
.perk-row { margin-bottom: 56px; }
#perk-row3 { margin-bottom: 0px; }
.career .perk-item { font-size: 16px; font-weight: 300; float: left; 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-PERK //----------- */


/* ----------- BTN-ANI-BROWN ----------- */
.btn-ani-brown {
	position: relative; 
	background-image: linear-gradient(to top, #6699cc, #336699); 
	color: #ffffff; display: inline-block; padding: 0 20px; height: 40px;
	-moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; 
	font-size: 15px; font-weight: 400; line-height: 39px; text-shadow: 0px 1px 1px rgba(0,0,0, 0.35);	
}
/* ----------- BTN-ANI-BROWN //----------- */

/* ============ CAREER //============ */


/* --------- NEWS --------- */
.section-news { padding: 35px 0 60px 0; font-family: Roboto; font-weight: 300; }
.section-news h1 { font-family: Roboto; font-weight: 300; color: #666666; font-size: 40px; padding-bottom: 27px; }
.section-news .news-item { margin: 0 auto; padding-bottom: 50px; position: relative; }
.section-news .item-date { margin-top: 8px; }
.news-item .news-content { float: left; width: 850px; margin-left: 30px; }

.section-news h2, .section-news h2 a { color: rgba(51,102,153, 1); font-weight: 300; font-size: 22px; text-decoration: none; line-height: 1.5; margin-top: 4px; }
.section-news h2 a:hover { color: #666666; }
.section-news .subsection-event h2 a { background: url(../img/icon-calendar-tick-gray.png) 0 2px no-repeat; padding-left: 26px; }
.section-news .subsection-news h2 a { background: url(../img/icon-newspaper-gray.png) 0 2px no-repeat; padding-left: 24px; }

.section-news p { color: #999999; font-size: 14px; padding-top: 7px; }
.section-news p a { color: #336699; text-decoration: none; }
.section-news p a:hover { color: #666666; }
/* --------- NEWS //--------- */


/* --------- TEMPLATE-LAYOUT1 --------- */
.template-layout1 { padding: 35px 0 60px 0; }
.template-layout1 h2 { font-family: Roboto; font-weight: 300; color: #999999; font-size: 40px; padding-bottom: 10px; }
.template-layout1 p { font-family: Roboto; font-weight: 300; font-size: 16px; color: #999999; }
.template-layout1 p a { color: #6699cc; text-decoration: none; }
.template-layout1 p a:hover { color: #666666; }
/* --------- TEMPLATE1 LAYOUT //--------- */


/* ============ SECTION-PRICE ============ */
.section-price { font-family: Roboto, Helvetica, Verdana, Arial; font-weight: 300; margin-bottom: 0; }
.section-price .main-grid { width: 980px; }
.section-price .title{ color: #666666; padding-top: 48px; font-size: 50px; line-height: 1.4; }
.section-price .sub-title { padding-bottom: 20px; color: rgba(102,102,102,0.7); font-size: 18px; }
.section-price .trade { position: relative; top: -4px; font-family: inherit; font-size: 12px; }
.section-price .price-table-col .trade { opacity: 0.8; }


.section-price .label-tab-wrapper:after { content: ""; display: table; clear: both; }
.section-price .label-tab { float: left; border-top-left-radius: 6px; border-top-right-radius: 6px; width: 486px; 
	text-align: center; padding: 6px 0 2px; margin-top: 30px; font-size: 22px; color: #666666; }

.section-price .label-tab2 { float: right; margin-left: 5px; }

.section-price .label-tab-on { background-color: #e4e4e4; color: #666666; }
.section-price .label-tab-off { background-color: #c2c0c0; color: #ffffff; cursor: pointer; 
	text-shadow: 1px 1px 0 rgba(118,118,118, 0.2); 
	box-shadow:0 -3px 5px -2px #aaaaaa inset; 
	transition: all 300ms linear 0s; }
.section-price .label-tab-off:hover { background-color: #b2b1b1; color: #f7f5f5; box-shadow: 0 -3px 5px -2px #8b8b8b inset; }

.section-price .label-tab a { display: inline-block; text-decoration: none; }

.section-price .body-tab { width: 964px; background: #e4e4e4 url(../img/bg-pricing-rocket.png) center center no-repeat; padding: 8px 8px 8px; border-radius: 6px; display: none; }
.section-price .body-tab-on { display: block; }


.toggle-container { display: inline-block; }

/* Change the height of the background here */
.price-table { margin-top: 0px; position: relative; height: 906px; }

.price-table a { text-decoration: none; color: #6699cc; }
.price-table a:hover { color: #666666; }
.price-table-col { position: absolute; border-top-left-radius: 4px; border-top-right-radius: 4px; }

.body-tab1 .col1 { z-index: 4; }
.body-tab1 .col2 { z-index: 3; }
.body-tab1 .col3 { z-index: 2; }
.body-tab1 .col4 { z-index: 1; }

.body-tab2 .col1 { z-index: 1; }
.body-tab2 .col2 { z-index: 2; }
.body-tab2 .col3 { z-index: 3; }
.body-tab2 .col4 { z-index: 4; }

.col1, .col2, .col3, .col4 { width: 235px; box-shadow: 1px 1px 3px rgba(0,0,0, 0.2); }
.col2 { margin: 0 8px; }
.ribbon-top-right-wrap { position: relative; }
.ribbon-top-right { position: absolute; z-index: 2; top: 0px; right:0px; }

.price-box1 { height: 51px; line-height: 50px; margin: 0 auto; text-align: center; border-top-left-radius: 4px; border-top-right-radius: 4px; color: #ffffff; background-color: #e0b96c; font-size: 19px; }
.col2 .price-box1 { background-color: #6d94bb; }
.col4 .price-box1{ background-color: #669966; }


.price-box2 { margin: 0 auto; text-align: center; background-color: #f9f4da; color: #d8ad59; }
.col2 .price-box2 { background-color: #92afcc; color: #ffffff; }
.col4 .price-box2 { background-color: #abc5ab; color: #ffffff; }

/* ------ price ------ */
.price-box2 .price { width: 235px; padding: 22px 0 12px 0; font-size: 60px; font-weight: 400; border-bottom: solid 1px #d3d1c8; }

.price-box2 .price .currency-wrap { width: 235px; margin: 0 auto; text-align: center; }
.price-box2 .price .currency:before { content: '$'; font-size: 25px; vertical-align: top; margin-top: -9px; display: inline-block; }
.price-box2 .price .currency { font-size: 55px; letter-spacing: -1px; line-height: 50px; }

.price-box2 .price .period { padding-top: 20px; }

.toggle-business-wrap { margin-top: 9px; margin-bottom: 32px; }
.toggle-light { margin: 0 auto; text-align: center; }

.save-msg { font-size: 13px; font-weight: 300; color: rgba(216,173,89, 0.7); padding-top: 10px; height: 16px; }
.col2 .save-msg, .col4 .save-msg { color: rgba(255,255,255, 0.5); }
/* ------ price //------ */


/* ------ price (no term slider)------ */
.col4 .price-box2 .price { height: 117px; }
.col4 .price-box2 .price .currency-msg { font-size: 14px; font-weight: 300; opacity: 1; margin-top: -5px; letter-spacing:0px; }

.col4 .price-box2 .price .currency-msg-contact { font-size: 24px; font-weight: 300; margin-top: 12px; position: relative; }
.col4 .price-box2 .price .currency-msg-contact a { color: #ffffff; position: relative; display: block; }
/* ------ price (no term slider)------ */


/* ------ abstract ------ */
.price-box2 .abstract { color: #888888; border-bottom: solid 1px #d3d1c8; font-size: 16px; font-weight: 300; padding: 16px 15px 21px 15px; height: 44px; }
.col2 .price-box2 .abstract { color: #3b6592 ; }
.col4 .price-box2 .abstract { color: #ffffff; }

.col2 .price-box2 .price, .col2 .price-box2 .abstract { border-bottom: solid 1px #7ea0c3; }
.col4 .price-box2 .price, .col4 .price-box2 .abstract { border-bottom: solid 1px #aaaaaa; }
/* ------ abstract //------ */


/* ------ price-action ------ */
.price-box2 .price-action { position: relative; padding: 25px 0; }
a.price-btn { position: relative; width: 40px; height: 27px; font-size: 15px; padding: 0 20px; line-height: 28px; display: inline-block; color: #ffffff; border-radius: 15px; font-weight: 400; margin-left: 10px; overflow: hidden; }

a.price-btn:hover { color: #ffffff; }

.price-btn-text { position: relative; display: inline-block; }
.price-btn-text2 { padding-left: 0px; padding-top: 40px; }

a.price-btn:first-child { margin-left: 0; }

a.price-btn.gray { background-color: #eeeeee; color: #666666; }
a.price-btn.gray:hover { background-color: #ffffff; color: #3c3c3c; text-shadow: 1px 1px 2px rgba(0,0,0, 0.1); }

a.price-btn.gray2 { background-color: #999898; color: #ffffff; }
a.price-btn.gray2:hover { background-color: #797878; }

a.price-btn.gray3 { background-color: #658c65; color: #ffffff; }
a.price-btn.gray3:hover { background-color: #5c925c; }

a.price-btn.blue { background-color: rgba(51,102,153, 0.7); color: #ffffff; }
a.price-btn.blue:hover { background-color: rgba(51,102,153, 1); text-shadow: 1px 1px 1px #235a91; }

a.price-btn.brown { background-color: #e2bb65; color: #ffffff; text-shadow: 1px 1px 1px rgba(192,142,32, 0.7); }
a.price-btn.brown:hover { background-color: #d7a22e; }
/* ------ price-action //------ */


.price-box3 { background-color: #ffffff; color: #848484; }
.price-box3 ul { list-style-type: none; padding: 0; margin: 0; }
.price-box3 li { height: 48px; line-height: 46px; text-align: center; font-size: 14px; font-weight: 300; border-bottom: solid 1px rgba(0,0,0,0.04); }

.price-box3 li:first-child { background: url(../img/price-arrow-yellow.png) center top no-repeat; height: 48px; line-height: 50px; }
.col2 .price-box3 li:first-child { background-image: url(../img/price-arrow-blue.png); }
.col4 .price-box3 li:first-child { background-image: url(../img/price-arrow-green.png); }

.price-box3 li.one-entry { height: 424px; line-height: 2; padding-top: 114px; padding-left: 20px; padding-right: 20px; font-size: 16px; font-weight: 300; color: #9a9a9a; }
.body-tab2 .price-box3 li.one-entry { height: 476px; padding-top: 61px; }

.person-support { padding-top: 17px; position: relative; }
.person-support img { width: 86px; opacity: 0.8; position: relative; }
.person-support a { display: block; position: relative; }

.col4 .partner-item-wrapper { position: relative; left: 0px; margin: 10px 0 0 12px; text-align: left; font-size: 16px; }
.col4 .partner-item { background: url(../img/tick-green.png) 0 8px no-repeat; padding-left: 20px; }

.body-tab sup { opacity: 0.5; }

.price-note { padding-top: 5px; padding-left: 10px; color: #cccccc; font-style: italic; }
.price-note.first-note { padding-top: 12px; }

/* ============ SECTION-PRICE //============ */


/* --------- VISISTAT-COMPARISON --------- */
.visistat-comparison { text-align: center; padding-top: 55px; padding-bottom: 67px; font-family: Roboto, Arial, Verdana; }

table.t-comparison { margin: 0 auto; text-align: center; cellpadding: 0; cellspacing: 0; border: 0; }

table.t-comparison tr {height: 42px; }
table.t-comparison tr:nth-child(2n+1) { background-color: #f1f1f1; }
table.t-comparison tr:nth-child(2n+0) { background-color: #ffffff; }
table.t-comparison tr:first-child {height: 50px; background-color: #ffffff; }

table.t-comparison th { width: 217px; text-align: center; font-weight: 400; font-size: 20px; color: #444444; }
table.t-comparison th:nth-of-type(1) { width: 316px; }

table.t-comparison td { color: #666666; font-size: 15px; font-weight: 400; }
table.t-comparison td:first-child { text-align: right; }

.compare-yes { background: url(../img/tag-yes.png) center center no-repeat; width: 49px; height: 28px; margin: 0 auto; }
.compare-no { background: url(../img/tag-no.png) center center no-repeat; width: 49px; height: 28px; margin: 0 auto; }

.comparison-note { width: 750px; margin: 0 auto; padding-top: 15px; text-align: left; color: #aaaaaa; font-weight: 100; font-size: 11px; }
/* --------- VISISTAT-COMPARISON --------- */


/* ============ SECTION-CUSTOMER ============ */
.section-customer { padding-top: 61px; padding-bottom: 75px; font-weight: 300; font-family: Roboto, sans-serif, Arial, Verdana; color: #999999; position: relative; overflow: hidden; }
.section-customer h1, .section-customer h2 { font-weight: 300; text-align: center; line-height: 1.3; position: relative; overflow: hidden; }
.section-customer h1 { font-size: 44px; color: #666666; padding-bottom: 39px; }
.section-customer h2 { font-size: 21px; color: #6699cc; }        

.customer-quick { margin-top: 55px; }
.customer-quote, .customer-profile { float: left; position: relative; }
.customer-quote { width: 626px; padding-right: 30px; }
.customer-profile { width: 294px; }

.quote-author { position: absolute; top: 152px; left: 485px; }
.quote-author.quote-author-avascent { top: 280px; }
.quote1, .quote2 { color: #444444;  font-size: 17px; font-style: italic; line-height: 1.8; padding-left: 29px; }
.quote1 { background: url(../img/quote1.png) 0 0 no-repeat; padding-top: 44px; }
.quote2 { padding-left: 29px; padding-top: 20px; padding-right: 171px; }
#customer3 .quote2 { padding-right: 0; }


.quote-source { padding-top: 22px; padding-right: 171px; font-size: 14px; font-style: normal; text-align: right; }
.quote-source.lead411, .quote-source.cplanenetworks { padding-top: 65px; }
.quote-source.designmind { padding-top: 67px; }
.quote-source.avascent { padding-top: 18px; }


.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; }
.quote-source.datasolutionsinternational { padding-top: 36px; }

.section-customer .pdf-download { 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 //============ */


/* --------- BUZZ BANNER --------- */
.buzz-banner-container { position: relative; text-align: left; height: 400px; }
.buzz-banner { position: absolute; margin-left: 7px; margin-top: 50px; }
.buzz-banner img { width: 184px; }
.buzz-banner.first { margin-left: 0; }

/* --------- BUZZ BANNER //--------- */


/* --------- PRIVACY POLICY --------- */
.privacy-policy { font-size: 14px; }
.privacy-policy p { font-size: 14px; }
.privacy-policy h1 .title { font-size: 45px; font-weight: 300; color: rgba(0, 102, 153, 0.9); text-align: center; padding-top: 50px; padding-bottom: 30px; }
.privacy-policy .sub-title { font-size: 26px; font-weight: 300; color: rgba(0, 102, 153, 0.9); padding-top: 29px; padding-bottom: 23px; }
/* --------- PRIVACY POLICY //--------- */

/* invisible link for notfound.php page */
a.notfound-link { opacity: 0; cursor: default; }


/* --------- DEMO-CIRCLE --------- */
.demo-circle { position: absolute; z-index: 2; top: 80px; left: 50%; margin-left: 337px; cursor: pointer; opacity: 1; }
.demo-circle-inner { position: relative; cursor: pointer; }
/* --------- DEMO-CIRCLE //--------- */


/* ============ blue-login ============ */
.blue-login { margin-top: 200px; margin-bottom: 100px; text-align: center; color: #999999; font-family: Roboto, Helvetica, Verdana, Arial; }
.blue-login * { margin: 0; padding: 0; border: 0; box-sizing: border-box; }

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


.blue-login .login-title { padding-bottom: 25px; line-height: 1.2; font-family: Roboto, Helvetica, Arial; font-weight: 100; font-size: 42px;  }

.blue-login .item { margin-top: 10px; }
.blue-login input { height: 40px; 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;  }


.blue-login .item-submit { margin-top: 30px; }
.blue-login .item-submit .item-submit-inner { height: 42px; line-height: 42px; margin: 19px auto 0; padding: 0; text-align: center; border: 0; border-radius: 5px; cursor: pointer;	background-color: rgba(248,153,56, 1); color: #ffffff; font-family: Roboto; font-weight: 300; font-size: 16px; text-shadow: 1px 1px 0 rgba(248,153,56, 1); transition: all 250ms linear 0s;  }

.blue-login .item-submit .item-submit-inner:hover { background-color: rgba(248,153,56, .8); }

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

.blue-login .fail { width: 400px; margin-left: auto; margin-right: auto; padding-bottom: 15px; color: rgba(248,153,56, 0.9); font-size: 13px; }

.blue-login .quick-link { margin-top: 50px; font-size: 13px; font-weight: 300; }

.blue-login a { text-decoration: none; color: #999999; opacity: 0.9; }
.blue-login a:hover { color: #f89938; opacity: 1; }

.blue-login .msg-hint { margin-left: auto; margin-right: auto; margin-top: 3px; text-align: left; font-weight: 300; }


.blue-login input,
.blue-login .error-msg,
.blue-login .msg-hint,
.blue-login .item-submit .item-submit-inner { width: 300px; }
/* ============ blue-login //============ */

/* ============ msg-vstokf ============ */
.msg-vstokf { padding-bottom: 50px; text-align: center; color: #999999; font-size: 18px; }
.msg-vstokf p { font-size: 18px; margin-bottom: 3px; }

/* ============ msg-vstokf ============ */


/* =========== 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: 0px 1px 1px rgba(0,0,0, 0.4); cursor: pointer; }
/* =========== FLOAT-BANNER //=========== */


/* =========== TERMOFUSE =========== */
.termofuse ul { list-style-position: outside; padding-left: 0px; }
.termofuse ul li:first-child { padding-top: 20px; }
.termofuse ul li { margin-left: 15px; }
/* =========== TERMOFUSE =========== */


/* ======================== MAIN //======================== */



/* ======================== FOOTER ======================== */
#footer, .push { height: 580px; } /* mesure the actual height of the footer then put the dimension here */

.push { margin-top: /*-30px;*/ /*130px*/ 0; } /* measure the white space gap between the banner and the footer and put the minus dimension here */
#footer { width: 100% ; background-color: /*#f0f0f0*/ #000000; color: #808080; font-family: Roboto, Helvetica, sans-serif; Verdana, Arial; font-weight: 300; }

.footer-bg-layer { position: absolute; z-index: 1; width: 100%; }
.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: /*450px*/ /*480px*/ 580px; left: -100px; filter: grayscale(100%); }


#footer-content { width: 950px; margin: 0 auto; text-align: left; padding-top: 50px; }
.footer-cat { float: left; width: 207px; margin-right: 30px; font-size: 14px; }
.footer-cat-header { margin-bottom: 17px; color: #ffffff; font-size: 22px; }

.footer-cat > a { color: #929292; text-decoration: none; display: block; line-height: 30px; cursor: pointer; }
.footer-cat > a.kickfire-new { background: url(../img/new.gif) 50px 2px no-repeat; }
.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 /* gray */; 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 //--------- */


/* --------- 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: 140px; height: 41px; }

.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: #888888; }
.copyright a:hover { color: #6699cc; }
/* --------- LOGO FOOTER //--------- */


/* --------- CHAT --------- */
.icon-chat-style { position: fixed; z-index: 5; width: 32px; height: 85px; right: 0; bottom: 30px; 
	border-top-left-radius: 5px; border-bottom-left-radius: 5px; 
	font-family: Roboto; font-size: 15px; font-weight: 400; overflow: hidden; }
.icon-chat-bg {z-index: 4; background-color: #fff; }
.icon-chat {z-index: 5; box-shadow:0px 0px 4px rgba(0,0,0, 0.5); cursor: pointer; }

.icon-chat-img { position: relative; margin-top: 7px; margin-left: 6px; }
.icon-chat-text { margin-top: 13px;
	-moz-transform: rotate(-90deg);
	-webkit-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	color: #666666;
}
.icon-chat-expand { display: none; font-weight: 300; margin-top: -61px; text-align: left; margin-left: 14px; }
.icon-chat-expand p { font-size: 14px; line-height: 1.5; margin-left: 22px; }
.icon-chat-expand p.p1 { color: rgba(102, 102, 102, 1); }
.icon-chat-expand p.p2 { color: rgba(102, 153, 102, 1); }
/* --------- CHAT //--------- */

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