/* HP_custom.css */

/* navbar styles */

.wrapper-frame {
  padding: 0;
  position: relative;
}

.tab-content> active {
 display: block; 
}

.navbar-inverse .navbar-nav>li>a, .navbar-nav>li>a {
	padding: 2px;
	line-height: 30px;
	letter-spacing: -1px;
	cursor: pointer;
}
/*
.navbar-inverse .navbar-nav>li>a:hover,
.navbar-inverse .navbar-nav>li>a.active,
.navbar-inverse .navbar-nav>li>a:focus {
	color: #009fda;
	border-bottom: 4px solid #399c33;
}
*/
header .drop {
	position: relative;
	overflow: visible;
	z-index: 100;
}
header .menu_1, header .menu_2, header .menu_3, header .menu_4 {
	position: relative;
	padding: 0;
	background-color: #fff;
	overflow: hidden;
}
.solutions-frame .solutions-holder {
	display: inline-block;
	vertical-align: top;
	letter-spacing: 0;
	width: 20%;
	margin: 0 5px 10px;
}
.solutions-frame .solutions-holder a.open {
	display: block;
	text-decoration: none;
	color: #4d4f53;
	text-align: center;
	position: relative;
	min-height: 120px;
	z-index: 17;
}

.solutions-frame .solutions-holder .caratMarker {
	display: block;
	width: 100%;
	height: 20px;
	text-align: center;
	margin-bottom: -30px;
	margin-top: 20px;
	background: transparent url('/na/~/media/site/sagena/responsive/images/caratMarker.png') no-repeat 50% -32px;
	transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-webkit-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
}
.solutions-frame .solutions-holder:hover .caratMarker {
	background: url('/na/~/media/site/sagena/responsive/images/caratMarker.png') no-repeat 50%  0px;
}

.solutions-frame a.open .icon {
	display: block;
	width: 60px;
	height: 60px;
	text-indent: -9999px;
	overflow: hidden;
	margin: 0 auto 11px;
	background-size: 40px 40px;
}
.solutions-frame a.open .icon1 {
	background: url("/na/~/media/shared/responsive/icons/sage_icon_green_calcualtoralt.png") no-repeat 0 0;
	background-size: 100%;
}
.solutions-frame a.open .icon2 {
	background: url("/na/~/media/shared/responsive/icons/sage_icon_green_globalcrm.png") no-repeat 0 0; 
	background-size: 100%;
}
.solutions-frame a.open .icon3 {
	background: url("/na/~/media/shared/responsive/icons/sage_icon_green_globalerp.png") no-repeat 0 0;
	background-size: 100%;
}
.solutions-frame a.open .icon4 {
	background: url("/na/~/media/shared/responsive/icons/sage_icon_green_globalpayroll.png") no-repeat 0 0;
	background-size: 100%;
}
.solutions-frame a.open .icon5 {
	background: url("/na/~/media/shared/responsive/icons/sage_icon_green_globalpayments.png") no-repeat 0 0;
	background-size: 100%;
}
.solutions-frame a.open strong {
	display: inline-block;
	color: #009fda;
	letter-spacing: -1px;
}

.columns-row {padding: 10px 0;}
.columns-row .col {
	padding: 0 0 10px 3.14%;
	float: left;
	width: 25%;
}
.columns-row h2 {
	font: 20px/22px Arial, Helvetica, sans-serif;
	color: #168164;
	margin: 5px 0 15px;
	letter-spacing: -1px;
}
.columns-row h2 em {
	color: #46ad49;
	font-style: normal;
}
.drop-frame {
	margin: 0 auto;
	max-width: 940px;
	padding: 22px 0 20px 20px;
	overflow: visible;
	font-size: 12px;
	line-height: 14px;
	color: #000;
}
.drop-frame .box-shadow {display: none;}
.drop-frame .content-box {
	float: left;
	width: 100%;
}
.drop-frame .solutions-frame {
	float: left;
	width: 50%;
}
.drop-frame .business-frame,
.drop-frame .quickaccess-frame {
	float: left;
	width: 28%;
	padding: 0 15px;
	border-left: 1px solid #ccc;
}
.drop-frame .quickaccess-frame {width: 20%;}
.drop-frame .business-frame ul,
.drop-frame .quickaccess-frame ul {
	list-style: none;
	padding-left: 0;
}
.drop-frame .business-frame li,
.drop-frame .quickaccess-frame li {
	margin-bottom: 0.5em;
}
.drop-frame .content-box h2 {
	font: 17px/21px Arial, Helvetica, sans-serif;
	color: #41a940;
	margin: 0 0 14px;
	letter-spacing: -1px;
}
.drop-frame .columns-row {
	overflow: hidden;
	width: 100%;
}
.drop-frame .columns-row .col {
	padding: 0 0 10px 3.14%;
	float: left;
	width: 25%;
}
.subMenus {
	clear: both;
	display: block !important;
	position: relative;
}
.barrier {
	display: block;
	position: relative;
	height:40px;
	/* margin-top:-40px; */
	background: transparent;
}
#header .menu_1 .box-shadow,
#header .menu_2 .box-shadow,
#header .menu_3 .box-shadow,
#header .menu_4 .box-shadow {
	top: -10px;
}
.navbar-inverse .navbar-toggle, .navbar-inverse .navbar-toggle {
	outline: none;
}

/* Full hero and parralax styles */
body, html {
  height: 100%;
}
body {
	color: #333;
	background: #fff;
	font-family: Arial;
	font-size: 13px;
	line-height: 18px;
	margin: 0;
	padding: 0;
	overflow-x: hidden !important;
}
/* h3, h4, h5 {color:#fff;} */
.clear {
	clear: both;
	height: 0;
	font-size: 0;
}
.color {color: #41a940;}
.container {
	max-width: 960px;
	margin: 0 auto;
	padding: 10px 0;
	color: #333;
	font-family: Arial, sans-serif;
	font-size: 14px;
	line-height: 18px;
	font-weight: 300;
	text-align: left;
}
.navbar .container {
	margin-top: 0;
	margin-bottom: 0;
	padding: 0;
}

.content_section {
	padding-top: 85px;
	padding-bottom: 110px;
}
p {
	padding: 0;
	margin: 0 0 8px 0;
}
.fullpage_section header { }
.fullpage_section header div.container {
	z-index: 900;
	position: relative;
}
.fullpage_section header div.container h1 {
	font-size: 43px;
	padding: 0 0 10px 0;
	margin: 0;
	text-align: center;
	color: #000000;
	font-weight: 300;
	font-family:  Arial, Helvetica, sans-serif;
	line-height: 41px;
	opacity: 0.7;
	filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70);
	text-transform: uppercase;
}
.fullpage_section header div.container h1 b {font-weight: 800;}
.fullpage_section header div.container p {
	font-weight: 300;
	text-align: center;
	font-size: 1.25em;
	font-family:  Arial, Helvetica, sans-serif;
	line-height: 24px;
	padding: 0 20px 10px 20px;
	margin-bottom: 0;
}

/* NEW */
#fullhero {
	position: relative;
	display:block;
	overflow: hidden;
	min-height: 545px;
	z-index: 5;
}
#fullhero_sm{display:none;}
#fullhero header {
	position: absolute;
	left: 0;
	top: 0;
	background-position: center center;
	background-attachment: fixed;
	background-size: cover;
	background-repeat: no-repeat;
	width: 100%;
	height: 100%;
	color: #fff;
	padding-top: 120px;
	padding-bottom: 120px;
}
.intro-block {
	float: left;
	color: #fff;
	font-size: 14px;
	line-height: 16px;
	width: 374px;
	padding: 14px 24px;
	margin: 6px 0 0;
	position: relative;
	z-index: 10;
}
#headerBase,
#headerBase-block {
	position:absolute;
	left:0;
	bottom:0px;
	display:block;
	width: 100%;
	min-height: 140px;
	text-align: center;
	background:rgba(0, 0, 0, 0.7);
	z-index: 50;
}
#headerBase-block {
	position: relative;
	background:rgba(0, 0, 0, 0.8);
}
#headerBase .container,
#headerBase-block .container {
	color: #fff;
	text-align: center;
	margin-top: 0;
	margin-bottom: 0;
}
#headerBase .iconList div,
#headerBase-block .iconList div,  .iconList div {
	display: table;
	vertical-align: middle;
	text-align: left;
	padding-right:20px;
}
#headerBase .iconList a,
#headerBase-block .iconList a,  .iconList a {
	display: table-cell;
	vertical-align: middle;
	padding-left: 70px;
	height: 50px;
	text-align: left;
	color: #3cf;
}
#headerBase .iconList .finance,
#headerBase-block .iconList .finance, .iconList .finance  {
	/* padding: 0 15px 0 0; */
	background: url('/na/~/media/shared/responsive/icons/sage_icon_white_globalaccounting.png') no-repeat 15px 0;
	background-size: 60px 60px;
}
#headerBase .iconList .business,
#headerBase-block .iconList .business,  .iconList .business {
	background: url('/na/~/media/shared/responsive/icons/sage_icon_white_globalerp.png') no-repeat 15px 0;
	background-size: 60px 60px;
}
#headerBase .iconList .payroll,
#headerBase-block .iconList .payroll,  .iconList .payroll {
	background: url('/na/~/media/shared/responsive/icons/sage_icon_white_globalpayroll.png') no-repeat 15px 0;
	background-size: 60px 60px;
}
#headerBase .iconList .accounting-desk,
#headerBase-block .iconList .accounting-desk,  .iconList .accounting-desk  {
	background: url('/na/~/media/shared/responsive/icons/sage_icon_white_accountingDesktop') no-repeat 15px 0;
	background-size: 60px 60px;
}


#headerBase .iconList .enterprise-desk,
#headerBase-block .iconList .enterprise-desk,  .iconList .enterprise-desk  {
	background: url('/na/~/media/shared/responsive/icons/sage_icon_white_enterpriseDesktop') no-repeat 15px 0;
	background-size: 60px 60px;
}


#headerBase .iconList .payments,
#headerBase-block .iconList .payments,  .iconList .payments  {
	background: url('/na/~/media/shared/responsive/icons/sage_icon_white_globalpayments.png') no-repeat 15px 0;
	background-size: 60px 60px;
}


.drk-gray {
  background-color: #333;
}
.blue { background-color:#009fda; }

.drk-gray .container, .blue .container {
  text-align: center;
}

.scrollMore {
	clear:both;
	display: inline-block;
	text-align: center;
	margin-bottom: 0.25em;
	text-transform:uppercase;
	cursor: pointer;
}
.scrollMore a {
	color: rgba(255,255,255,1);
	font-size: 0.75em;
	text-decoration: none;
}
.scrollMore:hover a {
	color: rgba(255,255,255,0.5);
}
.scrollMore .arrow  {
	position: relative;
	display: inline-block;
	width: 20px;
	height: 20px;
	background: url('/na/~/media/site/sagena/responsive/images/button_down_arrow.png') no-repeat 0 -59px;
	z-index: 10;
	transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-webkit-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
}
.scrollMore:hover .arrow  {
	background-position: 0 0;
}




.content-section .article-box h2 {margin: 5px 0 5px;}
.top-row {
	margin-top: 2em;
	padding: 0 10px;
}
.top-row .description-col .title h3 {
	color: #666;
	font: 48px/46px Arial, Helvetica, sans-serif;
	margin: 0 0 0.5em;
	letter-spacing: -2px;
}

/*.drop-frame, .subMenus, .barrier, .menu_1, .menu_2, .menu_3, .menu_4 {
	display: none;
}*/

#bg-image-2 img {

  max-width: 1990px;
  max-height: 350px;
  left:0 !important;}

#headerBase .container {
  padding: 0;
}


@media only screen and (max-width: 990px){
	.wrapper-frame {
		padding: 115px 0 0;
	}
	.navbar-inverse .navbar-nav>li>a:hover, 
	.navbar-inverse .navbar-nav>li>a.active, 
	.navbar-inverse .navbar-nav>li>a:focus {
		color: #399c33;
		border-bottom: 0;
	}
	.top-row .description-col {width: 100%;}
	.top-row .description-col .title {width: 100%;}	
}

@media only screen and (max-width: 900px){
	.solutions-frame .solutions-holder a.open {
		min-height: 150px;
	}

	#customers {
		margin-top: -180px;
	}
}

@media only screen and (max-width: 767px){
	#fullhero {
		height: initial !important;
		background-color:#fff;
	}
	#fullhero_sm{
		display:inline;
		width:100%;
	}
	#fullhero header {
		background-image: none;
		background-position: 0 0;
		background-attachment: fixed;
		padding-top: 40px;
		padding-bottom: 40px;
	}
	.home .wrapper-frame, .wrapper-frame {
		padding: 61px 0 0;
	}

	#customers {
		margin-top: -90px;
	}
	#fullhero header {
		padding-top: 40px;
		padding-bottom: 40px;
	}
	.footer-content {
		padding: 24px 10px 56px;
	}
	
	#headerBase, #headerBase-block {
		position: relative;
		padding: 0 10px 10px;
		background-color: #fff;
		/* border-top: 1px solid #ccc; */
		border-bottom: 1px solid #ccc;
	}
	#headerBase .container, #headerBase-block .container {
		color: #333;
		text-align: left;
		margin-top: 0;
		margin-bottom: 0;
		padding: 0 !important;
	}
	#headerBase>.container>h6, #headerBase-block>.container>h6 {
		display: none;
	}
	#headerBase .iconList div, #headerBase-block .iconList div, .iconList div {
		display: block;
		padding: 0;
		border-top: 1px solid #ccc;
	}
	#headerBase .iconList .finance, #headerBase-block .iconList .finance, .iconList .finance,
	#headerBase .iconList .business, #headerBase-block .iconList .business, .iconList .business,
	#headerBase .iconList .payroll, #headerBase-block .iconList .payroll, .iconList .payroll,
	#headerBase .iconList .payments, #headerBase-block .iconList .payments, .iconList .payments {
		background: none;
	}
	#headerBase .iconList a, #headerBase-block .iconList a, .iconList a {
		height: auto;
		padding: 10px;
		color: #009EDB !important;
	}
	
	.image-description.img-stay {
  position: absolute;
}

.img-stay h4 {
  font-size: 1.2em;
  line-height:1.3em;
}
}

@media only screen and (max-width: 420px){

	#customers {margin-top: -75px;} /*-370 */
	#scalability .container .title {padding: 5px 10px 14px;}
	#customers .content-section .title {padding: 25px 10px 0;}	
	

}

@media only screen and (max-width: 325px){

		.img-stay h4 {
  font-size: 1.0em;
  line-height: 1.2em;
}
}

#fullhero .image-description-holder h1{margin:0;font:2.25em/1.125em Arial,Helvetica,sans-serif;}
.intro-block{width:420px; margin: 72px 0 0 !important;}
.feature-area .image-description{padding:21px 0;}

@media only screen and (max-width: 767px) {
	#fullhero .image-description-holder h1,
	#fullhero .image-description-holder h6{color:#333;}
	.intro-block{width:100%; }
	.containet-info-holder{padding:0 1em 32px;}	
	.container .field-pic h2 {
		padding: 0 10px;
	}
	
	.container.sa_headline1, .container {
  padding: 0 10px!important;
}
}

@media only screen and (max-height: 885px){
	.intro-block {
	position:relative;
	width: 60%;
	margin: 72px 0 0 !important;
	}
	.image-description-holder .title, .image-description-holder .title-right {

	background: rgba(65, 158, 65, 0.9);
	width: 60%;
	padding: 19px 22px;
	}
	h2.whtTxt{margin-top: 0px;}
}

@media only screen and (max-height: 760px){
	.intro-block {
		position:relative;
		width: 60%;
		margin: 72px 0 0 !important;
	}
	.image-description-holder .title, .image-description-holder .title-right {
		background: rgba(65, 158, 65, 0.9);
		padding: 19px 22px;
	}
	h2.whtTxt{margin-top: 0px;}
}


@media (min-width: 767px){
	.col-md-offset-1 {
	  margin-left: 8.333333333333332%;
	}

	.col-md-offset-2 {
	  margin-left: 16.666666666666664%;
	}

	.col-md-offset-3 {
	  margin-left: 25%;
	}

	.col-md-offset-4 {
	  margin-left: 33.33333333333333%;
	}

	.col-md-offset-5 {
	  margin-left: 41.66666666666667%;
	}

	.col-md-offset-6 {
	  margin-left: 50%;
	}

	.col-md-offset-7 {
	  margin-left: 58.333333333333336%;
	}
}