/* ==========================================================================
   #General Layout
   ========================================================================== */

/* Branding Colors */

:root {
    --primaryColor: #555;
    --primaryNav: #f1f1f1;
    --primaryText: #555555;
    --primaryTextfade: #777777;
    --primaryHover: #FFF8BC;
    --borderColor: #C6C6C6;
    --borderColor1: #d7d7d7;
    --borderColor2: #e8e8e8;
    --borderColor3: #efefef;
    --borderColor4: #f5f5f5;
    --borderColor5: #666666;
    --focusOrange: #f68a33;
    --tabNav: #fcfcfc;
    --brandColorGreen: #228e1c;
    --brandColorLtGreen: #54B948;
    --brandColorBlue: #009DDC;
    --brandColorGrey: #6c6c6c;
    --brandColorBlack: #333333;
    --brandColorSolidBlack: #000000;
    --brandColorWhite: #ffffff;
    --colorWhiteRGB: 255,255,255;
    --colorBlackRGB:0,0,0;
    --brandColorRed: #E31B23;
}

   #preload { display: none !important; }

   .mobile-show {
     display: none;
	}
	.mobile-hide {
	     display: inline-block;
	}

   a.btn font{
   	vertical-align: top !important;
   	line-height: 1 !important;
   }

   *{
      transition: width 1s, height 1s;
    }

	#wrap {
		position: relative;
		background-color:transparent;
	}
	.fullwidthbanner {xvisibility: hidden}

	/* anchors */

	.anchors{
	    display: block;
	    position: relative;
	    z-index: 5000;
	    visibility: visible;
	}
	.anchor-printing{
		top: 0px;
	}
	.anchor-tools{
	    top: -110px;
	}
	.anchor-about{
		top: -160px;
	}


	@media screen and (max-width:1200px){
		.anchors{
	    	xvisibility: visible !important;
	    	xborder:1px solid blue;
		}
		.anchor-printing{
			top: 0px;
		}
		.anchor-tools{
		    top: -110px;
		}
		.anchor-about{
			top: -160px;
		}
	}

/* #Header
   ========================================================================== */

	#header {
		position: fixed !important;
		top:-1;
		z-index: 1010;
		width:100%;
		background:rgba(0,0,0,.6);
	}
	#bottom_nav{
		background:black;
		padding:8px 0px 6px 0;
		color:#fff;
		font-size: 14px;
		font-weight: bold;
	}

	#top_contact{
		position:relative;
		top:0;
		right:5px;
		font-size: 16px;
		line-height: 30px;
		float:right;
		padding:10px 0;
		box-sizing: border-box;
		color:#37b34a;
		margin-bottom: 50px;
	}
	#top_contact a{
		xcolor:#228e1c;
		color:#fff;
		font-weight:400;
	}
	#bottom_nav a{
		color:#fff;
	}
	#bottom_nav{text-align: center}
	#bottom_nav a span{
		color:#2192FF;
	}

	#header h1, #header h2 {
		 font-size: 1px;
	    height: 1px;
	    margin: 0;
	    padding: 0;
	    text-indent: -9999px;
	}

	/* Logo */

	#logo {
		display: block;
		margin-top: 18px;
		margin-bottom: 15px;
		margin-left: 6px;
		float: left !important;
	}

	#logo img { display: block;xwidth: 100px;height:42px;}

	#tagline{
        height:42px;
        display: block;
        float:left;
        font-size: 14px;
        margin-top:20px;
        margin-left:15px;
        color:#fff;
        line-height:1.4;
        border-left:1px solid #787371;
    }

    #tagline div{
    	position: relative;
        padding-top:3px;
        padding-left:15px;
        letter-spacing: .045em;
        box-sizing: border-box;
        color:#ccc;
    }
    #tagline span{font-size: 14px;display: block;}

    #tagline sup{
		position: absolute;
		top:10px;
		font-size: 30%;    	
    	margin-left:0px;
    	font-family: Verdana;
    }

	/* Menu basics */

	.sf-menu,
	.sf-menu ul {
		padding: 0;
		margin: 0;
		list-style: none;
		position: relative;
		z-index: 100;
	}

	.sf-menu > li {
		float: left;
		margin-right: 0;
	}

	.sf-menu > li > a {
		position: relative;
		display: block;
	}
	x.sf-menu > li:nth-child(2) > a:before,
	x.sf-menu > li:nth-child(3) > a:before{
		position:absolute;
		top:11px;
		left:-7px;
		content:'\f111';
		font-size:6px;
		font-family:'fontawesome';
		color:silver;
	}

	/* Menu Skin */

	.sf-menu {
		float: right;
		margin-top: 30px;
		margin-bottom: 20px;
		box-sizing: border-box;
		/*width: 100%;*/
	}

	.sf-menu a {
		display: block;
		font: 14px 'open_sansregular', Arial, sans-serif;
		color: #ccc !important;
		text-decoration: none;
		margin-left:10px;
	}

	.sf-menu > li > a {
		font-size: 14px;
		text-align: center;
		text-transform: uppercase;
	}

	.sf-menu > li > a span{
		display: inline-block;
		padding: 5px 8px;
		border: 1px solid transparent;
		border-radius: 5px;
	}
	.sf-menu > li#login-btn a span{
		color:orange !important;
		padding-top:4px;
		border:1px solid orange !important;
		margin-left:10px;
	}

	.sf-menu > li > a span span{padding: 0px !important;border: 1px solid transparent !important;border-radius: 5px;}

	.sf-menu > li a i { margin-right: 3px; }

	.sf-menu > li.current > a span {
		border-color: var(--brandColorGreen);
		color: #fff;
	}
	.sf-menu > li.focus > a small,
	.sf-menu > li.focus > a span {color:#fff;}

	.sf-menu li.focus > a span {
		background-color:#2192FF;
	}

	.sf-menu > li.current > a small { color: #fff; }

	.sf-menu > li > a:hover span,
	.sf-menu > li > a:hover small { color: #fff; }



	/* arrows */

	/* styling for both css and generated arrows */

	.sf-arrows .sf-with-ul:after {
		position: absolute;
		top: 50%;
		right: 0;
		height: 0;
		width: 0;
		/* order of following 3 rules important for fallbacks to work */
		border: 5px solid transparent;
		border-top-color: rgba(0, 0, 0, 0.5);
		margin-top: -3px;
		content: "";
	}

	.sf-arrows > li > .sf-with-ul:focus:after,
	.sf-arrows > li:hover > .sf-with-ul:after,
	.sf-arrows > .sfHover > .sf-with-ul:after {
		border-top-color: rgba(0, 0, 0, 0.7);
	}

	/* styling for right-facing arrows */

	.sf-arrows ul .sf-with-ul:after {
		border-color: transparent;
		border-left-color: rgba(0 ,0, 0, 0.5);
		margin-top: -5px;
		margin-right: -3px;
	}

	.sf-arrows ul li > .sf-with-ul:focus:after,
	.sf-arrows ul li:hover > .sf-with-ul:after,
	.sf-arrows ul .sfHover > .sf-with-ul:after {
		border-left-color: rgba(0, 0, 0, 0.7);
	}

	/* Mobile Menu  */

	#mobile-menu {
		padding-top: 76px;
		z-index: 20;
		margin-bottom: 0;
	}

	#mobile-menu li {
		display: block;
		margin: 0;
		background-color: #000;
	}
	#mobile-menu li,
	#mobile-menu li.focus > a span {color:#fff;}
	#mobile-menu li.focus{
		background-color:#2192FF !important;
	}
	#mobile-menu li a small { display: none; }

	#mobile-menu > li > ul{
		display: none;
		margin-left: 0;
	}

	#mobile-menu li a {
		position: relative;
		display: block;
		padding: 15px 25px;
		border-top: 1px solid #999;
		color: #fff;
		font-weight:normal;
		font-size: 14px;
		text-align: left;
		text-decoration: none;
	}

	#mobile-menu ul a { padding-left: 45px; }

	#mobile-menu ul li ul a  { padding-left: 65px; }

	#mobile-menu .mobile-menu-submenu-arrow {
		position: absolute;
		top: 0;
		right: 0;
		height: 100%;
		width: 70px;
		border-left: 1px solid #ff9600;
		color: #fff;
		font-size: 20px;
		line-height: 50px;
		text-align: center;
		cursor: pointer;
	}
	#mobile-menu .mobile-menu-submenu-arrow:before{
		position:relative;
		top: 20%;
		transform: translateY(-20%);
	}
	#mobile-menu .mobile-menu-submenu-arrow:hover {
		background-color: #cc0000;
		color: #fff;
	}

	#mobile-menu li a:hover {background-color: #000;color:#fff;}

	#mobile-menu { display: none; }

	/* Mobile menu trigger  */

	#mobile-menu-trigger {
		position: absolute;
		top: 50px;
		right: 40px;
		display: none;
		font-size: 32px;
		color: #ccc;
	}

	#topmenu{
	    display: -ms-flexbox;
	    display: -webkit-flex;
	    display: flex;
	    -webkit-flex-direction: row;
	    -ms-flex-direction: row;
	    flex-direction: row;
	    -webkit-flex-wrap: nowrap;
	    -ms-flex-wrap: nowrap;
	    flex-wrap: nowrap;
	    -webkit-justify-content: space-between;
	    -ms-flex-pack: justify;
	    justify-content: space-between;
	    -webkit-align-content: center;
	    -ms-flex-line-pack: center;
	    align-content: center;
	    -webkit-align-items: center;
	    -ms-flex-align: center;
	    white-space: nowrap;
	}
	.menu-item:nth-child(1) {
	    -webkit-order: 1;
	    -ms-flex-order: 1;
	    order: 1;
	    -webkit-flex: 0 0 auto;
	    -ms-flex: 0 0 auto;
	    flex: 0 0 auto;
	    -webkit-align-self: auto;
	    -ms-flex-item-align: auto;
	    align-self: auto;
	    white-space: nowrap;
    }
	.menu-item:nth-child(2) {
	    -webkit-order: 2;
	    -ms-flex-order: 2;
	    order: 2;
	    -webkit-flex: 0 0 auto;
	    -ms-flex: 0 0 auto;
	    flex: 0 0 auto;
	    -webkit-align-self: auto;
	    -ms-flex-item-align: auto;
	    align-self: auto;
    }
    #divider-line{
		position: absolute;
		top:84px;
		width:100%;
		color:white;
		border-top:1px solid #444;
	}
/* #Content
   ========================================================================== */

	#content {
		min-height: 600px;
		padding-bottom: 50px;
	}
	/* Page Header */

	#page-header {
		position: relative;
		padding: 20px 0;
		border-top: 1px solid #d7d7d7;
		border-bottom: 1px solid #d7d7d7;
		margin-bottom: 20px;
		height:300px;
	}

	#page-header h3, #page-header h1, #page-header h2 {
		margin-bottom: 0px !important;
		line-height: 24px !important;
		font-size: 22px !important;
	}

	/* LOGIN */
	#login,
	#login-reject{
		position: fixed;
		/* Stay in place */
	    z-index: 500000 !important;
	    /* Sit on top */
	    left: 0;
	    top: 0;
	    width: 100%;
	    /* Full width */
	    height: 100%;
	    /* Full height */
	    overflow:hidden;
	    /* Enable scroll if needed */
	    background-color: rgb(0, 0, 0);
	    /* Fallback color */
	    background-color: rgba(0, 0, 0, 0.5);
	    /* Black w/ opacity */	
		 display: flex;
	    justify-content: center;
	    align-content: center;
	    align-items: center;
	}
	#outter-form{
		display:flex;
		justify-content:center;
		align-content: center;		
		margin:auto auto;
	    height: auto !important;
	    width:100%;
	    opacity: 1;

	}
	#inner-content{
		display:flex;
		flex-direction: row;
		flex-wrap: nowrap;
		justify-content:center;
		align-content: center;
		box-sizing: border-box;
		background-color: #fff;
		border:1px solid #555;
	   box-shadow: 0 5px 12px rgba(0, 0, 0, 0.8);
	   box-sizing: border-box;
	   width:100%;
	    border-width:5px;
	    border-color: grey;
	    border-style: solid;	
	    border-radius: 16px	
	}
	.login-item{
		flex:1 1 50%;
	}	
	.inner-content-img{
		flex: 0 0 514px;
		box-sizing: border-box;
		height:542px;
		background-repeat:no-repeat;
		background-position: center center;
		width:100%;
		background-size: 544px 542px;
		border-bottom-left-radius: 8px;
		border-top-left-radius: 8px;
		background-color:#474540;
	}

@media screen and (max-width:1440px){
	#inner-content{
		width:85vw;
	}
	.inner-content-img{
		flex: 1 1 60%;
		background-size: cover;
	}
}
	#inner-content h3{
		margin-bottom:15px;
	}

	.card{
		flex:0 0 300px;
		position: relative;
		display: flex;
		flex-direction: column;
		background-color: #fff;
		background-clip: border-box;
		padding:50px 50px 30px;
		border-bottom-right-radius: 8px;
		border-top-right-radius: 8px;		
	}
	.card h3{
	    margin-right:30px;
	    margin-bottom: 0px;
	    font-size: 24px;
	    line-height: 1.2;
	    box-sizing: border-box;	    
	}
	.card .copy{
	    color:#555;
	    background:#fff;
	    font: 14px Arial, Verdana, sans-serif !important;
	}
	.card .card-footer {
	    width: 100%;
	    box-sizing: border-box;
	    border: none;
	    color: #555;
	    margin-top: 30px;
	    text-align: center;
	}
	.card-footer input{
		margin-bottom: 0px;
	}
	.card .btn_close{
		position: absolute;
		top:10px;
		right:15px;
		font-size:20px;
		color:#000 !important;
		text-decoration: none !important;
	}
	/* Section colors */

	.green-half-r:before,
	.new-half-r:before,
	.blur-half-r:before {
	    width: 48%;
	}
    .new-half-r:before{
         background-size: cover;
         bottom: 0;
         content: "";
         opacity: 1;
         position: absolute;
         left: 0;
         top: 0;
     }
   .new-half-r{
   	margin: 80px 0px 40px;
		padding:80px 0px 50px 0px;
		background-color:#e6e6e6;
		color: #333;
   }
   .blur-half-r:before {
	    xbackground: url(/images/bg-3-blured.jpg) no-repeat center right;
	    xbackground: url(/images/tools-team-interface-2023.png) no-repeat center top;
	    background:url(/images/milestone-screenshot-edited.png) no-repeat center top;
	    background-size: cover;
	    bottom: 0;
	    content: "";
	    opacity: 1;
	    position: absolute;
	    left: 0;
	    top: 0;
	}
	#vid-screenshot{
		display:none;
	}
	.green-half-r:before {
	    background: #f2f2f2 url(/images/bg-3-image.jpg) no-repeat center right;
	    background-size: cover;
	    bottom: 0;
	    content: "";
	    opacity: 1;
	    position: absolute;
	    left: 0;
	    top: 0;
	}
	.grey-half-r:before {
	    width: 50%;
	}
	.grey-half-r:before{
	    background-color: #f6f6f7;
	    bottom: 0;
	    content: "";
	    opacity: 1;
	    position: absolute;
	    right: 0;
	    top: 0;
	}
	.green-half-l:before {
	    width: 50%;
	}
	.green-half-l:before{
	   background-color: #28a745;
	    bottom: 0;
	    content: "";
	    opacity: 1;
	    position: absolute;
	    right: 0;
	    top: -10px;
	}

	.two-flex {
	    display: flex;
	    flex-direction: row;
	    flex-wrap: nowrap;
	    justify-content: space-between;
	    align-content: center;
	    align-items: center;
	    margin: 0px auto;
	    position: relative;
	}
	.two-flex .two-flex-mod{
		-webkit-flex: 0 0 50%;
		-ms-flex: 0 0 50%;
		flex: 0 0 50%;
		position: relative;
	}
	.two-flex .two-flex-mod:nth-child(1){
		text-align: center;
	}
	.two-flex-mod-text{
		padding-left:20px;
		padding-right:11vw;
		box-sizing: border-box;

	}
	#vid-mod{
		margin-top:60px;
		padding:80px 0 50px;
		background-color: #f2f2f2;
	}
	.two-flex .two-flex-mod img{
		margin:-25px auto 0px;
	}
	@media screen and (max-width: 1800px){

		#vid-mod{
			margin-top:60px;
			padding:60px 0 40px;
		}
	}
	@media screen and (max-width: 1700px){
		.two-flex-mod-text{
			padding-left: 20px;
			padding-right:8vw;
		}

	}
	@media screen and (max-width: 1500px){
	   .blur-half-r:before {
		    xxxbackground: url(/images/bg-3-blured.jpg) no-repeat center top;
		    background: url(/images/milestone-screenshot-edited.png) no-repeat right top;
		 }
	}
	@media screen and (max-width: 1080px){
		.green-half-r:before,
		.blur-half-r:before {
	    	background: none;
		}
		#vid-mod .two-flex-mod:first-child{
			position:relative;
			margin-bottom: 20px;
		}
		#vid-screenshot{
			display:block;
		}		
		#youtube-icon{
			position:absolute;
			top:50%;
			left:50%;
			transform: translate(-50%, -50%);
		}
		.two-flex .two-flex-mod img{
			margin:0px auto 20px;
		}
		.two-flex {
	    display: flex;
	    flex-direction:column;
	 	}
		.two-flex-mod-text{
			padding-left:10vw;
			padding-right:10vw;
			box-sizing: border-box;
		}
	}


	/* #Mods
   ========================================================================== */

	.flex {
	    display: -ms-flexbox;
	    display: -webkit-flex;
	    display: flex;
	    -webkit-flex-direction: row;
	    -ms-flex-direction: row;
	    flex-direction: row;
	    -webkit-flex-wrap: wrap;
	    -ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	    -webkit-justify-content: center;
	    -ms-flex-pack: center;
	    justify-content: center;
	    -webkit-align-content: center;
	    -ms-flex-line-pack: center;
	    align-content: center;
	    -webkit-align-items: center;
	    -ms-flex-align: center;
	    align-items: center;
	    width: 90vw;
	    margin: 0px auto;
	}

	.flex .flex-box{
		-webkit-flex: 0 0 50%;
		-ms-flex: 0 0 50%;
		flex: 0 0 50%;
		-webkit-align-self: auto;
		-ms-flex-item-align: auto;
		align-self: auto;
		max-width: 600px;
		height: 400px;
		border:1px solid red;
	}

	.flex .flex-box .box-content h4,
	.fullwidth-section-content  .box-content h4{
		font-size: 1.6em;
		line-height: 1.2;
		margin-bottom: 15px;
		color: #333 !important;
	}

	.flex .flex-box .box-content,
	.fullwidth-section-content .box-content{
		color: #555;
		box-sizing: border-box;
		padding: 50px 30px 20px 60px;
	}


	.flex .greybg .box-content,
	.flex .greybg .box-content h4{
		color: #000 !important;
	}
	.flex .flex-box ul.bullet-arrow,
	.fullwidth-section-content ul.bullet-arrow{
		font-size: 1.1em;
		margin: 20px 20px 25px 40px;
	}
	#bg-6 .flex .flex-box ul.bullet-arrow{
		font-size: 1.1em !important;
	}
	.flex .flex-box .btn,
	.fullwidth-section-content .btn{
		margin-left: 20px;
	}

	#callus-callout{
		margin:30px auto 0;
		width:50%;
		font-size:18px;
		line-height:24px;
	}
	@media screen and (max-width:768px){
		#callus-callout{
			width:80%;
		}
	}

/* Login Options Page */

.flex-login {
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    width: 60vw;
    margin: 0px auto 30px;
}
.flex-login .flex-box{
	-webkit-flex: 0 0 50%;
	-ms-flex: 0 0 50%;
	flex: 0 0 50%;
	-webkit-align-self: auto;
	-ms-flex-item-align: auto;
	align-self: auto;

	}
.flex-login .flex-box .box-content{
	border:1px solid #d7d7d7;
	border-radius: 30px;
	box-sizing: border-box;
	margin:0px 20px;
	min-height: 320px;
	background-color:rgba(255, 255, 255, 0.4);
}
.flex-login .flex-box .box-content h4{
	font-size: 1.6em;
	line-height: 1.2;
	margin-bottom:20px;
}
.flex-login .flex-box .box-content p{
	line-height: 1.8;
	margin-bottom: 20px;
	min-height:150px;
}
.flex-login .flex-box .box-content{
	padding:2em 2.5em 1.5em;
	box-sizing: border-box;
}
.flex-login .flex-box .box-content .btn{
	display: block;
	width:80%;
	margin:0px auto;
	text-align: center;
}

	@media screen and (max-width: 1440px) {
		.flex-login {
		    width: 95vw;
		}
		.flex-login .flex-box .box-content{
			padding: 1.5em 1.85em 1.5em;
			min-height: 340px;
		}
	}
	@media screen and (max-width: 980px) {
		.flex {
		    display: -ms-flexbox;
		    display: -webkit-flex;
		    display: flex;
			-webkit-flex-wrap: wrap;
			-ms-flex-wrap: wrap;
			flex-wrap: wrap;
	    }
	    .flex .flex-box{
			-webkit-flex: 0 0 100%;
			-ms-flex: 0 0 100%;
			flex: 0 0 100%;
			-webkit-align-self: auto;
			-ms-flex-item-align: auto;
			align-self: auto;
			max-width: 600;
			height: auto;
		}

		.flex .flex-box:first-child,
		.flex .flex-box:last-child{
			height: auto;
			min-height: 200px;
		}
		.flex .flex-box:nth-child(2),
		.flex .flex-box:nth-child(3){
			height: auto;
		}

		.flex .flex-box .box-content,
		.fullwidth-section-content .box-content{
			color: #555;
			box-sizing: border-box;
			padding: 30px 30px 20px 10px !important;
		}

		.flex .flex-box .btn{
			margin: 5px 5px 0px 20px !important;
		}
	}
	@media screen and (max-width: 768px) {
		.flex-login {
		    display: -ms-flexbox;
		    display: -webkit-flex;
		    display: flex;
			-webkit-flex-wrap: wrap;
			-ms-flex-wrap: wrap;
			flex-wrap: wrap;
		    width: 95vw;
		}
		.flex-login .flex-box{
			flex: 0 0 100%;
			margin-bottom: 30px;

		}
	  .flex-login .flex-box .box-content{
	  		padding: 2em 1.5em 2em;
	  		min-height: auto;
	  }
		.flex-login .flex-box .box-content p{
			min-height:auto;
		}
	}
	@media screen and (max-width: 600px) {
	    .flex .flex-box{
			-webkit-flex: 0 0 100%;
			-ms-flex: 0 0 100%;
			flex: 0 0 100%;
			-webkit-align-self: auto;
			-ms-flex-item-align: auto;
			align-self: auto;
			max-width: 100%;
			height: auto;
		}

	}

	.post_img_article h4{
		margin:0px;
		text-align: center;
		font-size: 18px;
		box-sizing: border-box;
		padding: 10px 0px;
		font-weight: 400;
		color:#fff !important;
	}
	.post_title_article h5{
		margin: 10px 0px;
		font-size: 18px;
		color:#3d6771 !important;
	}
	.post_img_article{
		margin-bottom: 0px;
		overflow: hidden;
		max-height: 500px;
		border-radius: 5px 5px 0 0;
	}
	.post_img_article img{
		width:100%;
	}
	.post_date{
		color:#999;
		font-size: 12px;
		text-transform: uppercase;
	}
	.post_text_article{
		padding:10px 20px 15px;
		font-size:16px;
		line-height: 22px;
	}
	.post_text_article strong, .post_text_article b{
		color:black;
	}
	.post_title_article{
		margin: 10px 0px;
		font-size: 22px;
	}
	.portfolio-item-preview {
		position: relative;
	}

	.portfolio-item-preview img {
		display: block;
		width: 100%;
	}

	.portfolio-item-overlay {
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background-color: rgba(0,0,0,0.5);
		opacity: 0;
		-webkit-transition: all 0.5s;
				transition: all 0.5s;
		z-index: 500;
	}

	.portfolio-item-overlay-actions {
		position: absolute;
		bottom: 0;
		width: 100%;
		margin-bottom: -50px;
		text-align: center;
		-webkit-transition: bottom 0.5s;
				transition: bottom 0.5s;
		z-index: 500;
	}

	.portfolio-item-overlay-actions .zoom {
		display: inline-block;
		width: 48px;
		height: 48px;
		border: 1px solid  #80a852;
		border-radius: 50%;
		margin-bottom: 25px;
		background-color: #80a852;
		color: #fff;
		text-align: center;
		text-decoration: none;
	}

	.portfolio-item-overlay-actions .zoom i {
		font-size: 32px;
		line-height: 48px;
	}

	.portfolio-item-overlay-actions .zoom:hover { background-color: transparent; }

	.portfolio-item-overlay-actions .btn {
		padding: 5px 15px;
		border-color: #fff;
		margin: 0;
		background-color: #fff;
		color: #69675b;
	}

	.portfolio-item-overlay-actions .btn:hover {
		background-color:#9db052;
		color: #fff;
	}


/* ========================================================================== */

	.three-choices{
		 display: -ms-flexbox;
	    display: -webkit-flex;
	    display: flex;
	    -webkit-flex-direction: row;
	    -ms-flex-direction: row;
	    flex-direction: row;
	    -webkit-flex-wrap: nowrap;
	    -ms-flex-wrap: nowrap;
	    flex-wrap: nowrap;
	    -webkit-justify-content: space-between;
	    -ms-flex-pack: justify;
	    justify-content: space-between;
	    -webkit-align-content: center;
	    -ms-flex-line-pack: center;
	    align-content: center;
	    -webkit-align-items: center;
	    -ms-flex-align: center;
	    align-items: center;
	}
	.three-choices div{
	    -webkit-flex: 0 0 auto;
	    -ms-flex: 0 0 auto;
	    flex: 0 0 auto;
	    height: 60px;
	}
	.three-choices div:nth-child(2){
		border-left: 1px solid #999;
		border-right: 1px solid #999;
	}
	div.center{margin:0 auto;width:100%;}

	ul.bullet-arrow li{
		list-style: url(/images/check.svg) outside no-repeat;
		margin-bottom: 10px;
		text-align: left;
	}
	ul.bullet-arrow li li{
		list-style-type: disc !important;
		list-style-image: none;
		margin-bottom: 5px;
	}
	div ul.bullet-arrow, div ol {
		margin:35px 20px 25px 40px;
	}
	.accordion-item-content ul.bullet-arrow, .accordion-item-content ol {
		margin:10px 5px 25px 40px;
	}
	.accordion-item-content ul li, .accordion-item-content ol li{
		margin-bottom: 15px;
	}

	div ol li{
		margin-bottom: 10px;
	}

	ul.bullet-arrow li ul,
	ul.bullet-arrow li ol{
		margin:5px 0px 5px 20px;
	}
	#content div #awards-list ul li{
		margin-bottom: 8px;
	}
	#awards-list img{
		margin: 0px 50px 50px;
	}
	.box-element{
		text-align: left;
		padding:0px 10px 0px 40px;
		box-sizing: border-box;
	}
	.price-option .icon-box-content ul, .icon-box-content p{
		height:300px;
	}
	.column{
		width:50%;
		margin-bottom: 10px;
		float:left;
	}

	.column p{
		padding-right:20px;
	}

	.column-title{
	    display: -ms-flexbox;
	    display: -webkit-flex;
	    display: flex;
	    -webkit-flex-direction: row;
	    -ms-flex-direction: row;
	    flex-direction: row;
	    -webkit-flex-wrap: nowrap;
	    -ms-flex-wrap: nowrap;
	    flex-wrap: nowrap;
	    -webkit-justify-content: center;
	    -ms-flex-pack: center;
	    justify-content: center;
	    -webkit-align-content: center;
	    -ms-flex-line-pack: center;
	    align-content: center;
	    -webkit-align-items: center;
	    -ms-flex-align: center;
	    align-items: center;

	}
	.column-title ul{
		list-style-position: inside;
		margin: 0px 50px;
	}
	.column li{
		text-align: center;
		max-width:310px;
	}
	@media screen and (max-width: 768px){
		.column-title{
			-webkit-flex-direction: column;
			-ms-flex-direction: column;
			flex-direction: column;			 
			-webkit-flex-wrap: wrap;
			-ms-flex-wrap: wrap;
			flex-wrap: wrap;
			-webkit-justify-content: flex-start;
			-ms-flex-pack: start;
			justify-content: flex-start;
			-webkit-align-content: flex-start;
			-ms-flex-line-pack: start;
			align-content: flex-start;
			-webkit-align-items: flex-start;
			-ms-flex-align: start;
			align-items: flex-start;
		}
		.column-title ul{
			margin: 0px 50px 0px 0px;
		}
			.column li{
				text-align: left;
			max-width:100%;
		}
	}

/* BRANDING COLORS 
	========================================================================= */

	.bluebg{
		background-color: #0E5594 !important;
	}
	.orange, td.orange a{
		color:#FF6700 !important;
	}
	.white{
		color: #EBEBEB;
	}
	.teal{
		color:#18899b !important;
	}
	.green{
		color:#43be61 !important;
	}
	.gold{
		color:#f2bf05 !important;
	}
	.red{
		color:#ff0000 !important;
	}
	.grey-text{
		color: #515151 !important;
	}	
	.black-text{
		color: #000 !important;
	}
	.greybg{
		background-color:#f2f2f2 !important;
	}
	.dkgreybg{
		background-color:#555 !important;
	}	
	.orangebg{
		background-color:#FF6700 !important;
	}
	.tealbg{
		background-color:#18899b !important;
	}
	.greenbg{
		background-color:#43be61 !important;
	}
	.limebg{
		background-color: #9BD806 !important;
	}
	.goldbg{
		background-color:#f2bf05 !important;
	}
	.purplebg{
		background-color: #9C23A4 !important;
	}

	/* Callouts **/

	#callout_examprep{
		background-image: url(/images/callout_bg_womantyping.jpg);
		background-position: bottom center;
		background-color: #222;
		background-repeat: no-repeat;
		background-size: cover;
		
	}
	.callout-content{
		margin-bottom:5px;
		padding:10px 10px 5px;
	}
	.callout-content p{
		color:#fff;
		text-align:left;
	}
	.textshadow{
		text-shadow: 1px 1px 2px rgba(0,0,0,.8);
	}

/* REVIEWS 
	========================================================================== */

 .four-flex {
     display: -ms-flexbox;
     display: -webkit-flex;
     display: flex;
     -webkit-flex-direction: row;
     -ms-flex-direction: row;
     flex-direction: row;
     -webkit-flex-wrap: nowrap;
     -ms-flex-wrap: nowrap;
     flex-wrap: nowrap;
     -webkit-justify-content: space-between;
     -ms-flex-pack: justify;
     justify-content: space-between;
     -webkit-align-content: center;
     -ms-flex-line-pack: center;
     align-content: center;
     -webkit-align-items: center;
     -ms-flex-align: center;
 }

 .customers{
 	padding: 15px 10px 10px 20px;
 	border: 2px solid #e7e7e7;
 	box-sizing: border-box;
 	width: 32%;
 	border-radius: 3px;
 	height: 200px;
 	background-color: #fff;
 }
 @media screen and (max-width: 968px){
 	.customers{
 		padding: 15px 10px 10px 20px;
 		box-sizing: border-box;
 		width: 50%;
 	}	
 }
.customer-id img{
	float: right;
	width: 30px;
}
.customer-id .icon{
	float: left;
	width: 40px;
	height: 40px;
	color: #fff;
	border-radius: 80px;
	margin-right: 8px;
	position: relative;
	background-color: transparent;
}
.customer-id .icon span{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
.customer-id .date{
	font-size: 70%;
	color: #aaa;
	margin-bottom: 6px;
}
.customers p{
	margin-top: 10px;
	max-height: 100px;
	overflow-y: auto;
}
.customers .rating{
	margin-left: -2px;
}

/* #Footer
   ========================================================================== */		
		
	#footer {
		font-size:12px;
		line-height: 1.9;
	}
	#footer-middle a, #footer-bottom a{
		text-align: left !important;
		font-weight: 400;
		color:#999;
	}
	#footer ul {
   		 list-style-type: none;
	}
	
	#footer-middle {
		padding: 30px 0 20px 0;
		background-color: #333; 
		color:#ccc;
	}
	#footer h4, #footer h6{
		font-weight: 400;
	}
	
	#footer-bottom {
		padding: 10px 0;
		background-color: #222; 
		color: #e4e4e4;
	}
	#footer-bottom a{
		color:#999;
		text-align: left;
	}
	#security_logos{
		margin-top: 20px;
	}
	#security_logos img{
		margin-right:5px;
	}
			
/* ==========================================================================
   #Page Styles
   ========================================================================== */
   
/* #Index
   ========================================================================== */
   
/* #FORMS
   ========================================================================== */
   
	/* Contact Form */
  
	#contact-form { 
		overflow: hidden;  
		margin-bottom: 40px; 
	}
	
	label.validation-error { color: #b55454; }
	
	input.validation-error,
	textarea.validation-error,
	select.validation-error { border :1px solid #e1a1a1; }


	/* New Partner Form */

	#newpartner{
		margin-top:40px;
		width:980px;
		border:1px solid #d7d7d7;
		border-radius:10px;
		padding:40px 60px;
		margin-bottom: 50px;
		box-sizing: border-box;
	}
		#newpartner h3 {
			margin: 0px 0px 5px;
			font-size: 18px;
			color: #009DDC;
			line-height: 32px;
		}
		#newpartner label{
			font-weight: bold;
    		margin-bottom: 5px;
    		font-size: 14px;
		}
		#newpartner input,
		#newpartner select{
			background-color: #fff;
			height:auto !important;
			margin-bottom: 10px !important;
		}	
		#newpartner input[disabled] {
		  background-color: #eee;
		  color: #999;
		}
		#newpartner .btn{
			max-width: 120px;
			text-align: center;
			border:none !important;
		}
		#newpartner .accent-color-1{
			color:#555 !important;
			background-color: #d7d7d7 !important;
		}
		#newpartner .btn.accent-color-2 {
		    background-color: #999;
		    border: 0px !important;
		    color: #fff !important;
		}

		#newpartner .btn.accent-color-2:hover {
		    background-color: #999 !important;
		    box-shadow: none !important;
		    border: 0px !important;
		    color: #fff !important;
		}		
		#newpartner .accent-color-5,
		#newpartner input[type="submit"]{
			color:#fff !important;
			background-color: #44bc63 !important;
		}
		#newpartner .btn:hover,
		#newpartner .accent-color-5:hover,
		#newpartner input[type="submit"]:hover{
			color:#fff !important;
			background-color: #44bc63 !important;
		}
		#newpartner .g-recaptcha{margin:10px 0px 20px !important;width: 300px !important;display:block;text-align: left;}
		#newpartner .g-recaptcha div{width:auto !important}

		#newpartner fieldset{
			padding:10px 20px 10px;
		}
		#newpartner .file-upload {
		    display: flex;
		    justify-content: space-between;
		    border: 2px dashed #d7d7d7;
		    box-sizing: border-box;
		    width: 100%;
		    min-width: 210px;
		    padding: 7px 5px 6px 10px;
		}
@media screen and (max-width:1127px){
	#newpartner{
		margin-top:40px;
		width:100%;
		max-width:980px;
		border:1px solid #d7d7d7;
		border-radius:10px;
		padding:40px 20px;
		margin-bottom: 50px;
		box-sizing: border-box;
	}
}
@media screen and (max-width:800px){
	#newpartner{
		margin-top:20px;
		margin-bottom: 30px;
		padding:20px 20px;
	}
	#newpartner fieldset {
	  padding: 15px 5px 15px;
	}
	#newpartner hr{
		display:none;
	}
	#newpartner fieldset .hidden{
		display:none;
	}
}
#newpartner .input-group {
    position: relative;
    display: flex;
    border-collapse: separate;
    margin-bottom: 5px;
    padding: 2px 3px;
    height: 40px;
    background: #fff;
    border: 1px solid #d7d7d7;
    font: 14px Arial, Verdana, sans-serif !important;
    border-radius: 3px;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
}

#newpartner .form-control {
    display: inline-flex;
    width: 100%;
    background-image: none;
}

#newpartner .input-group input {
    border: none !important;
    height: 100%;
    box-sizing: border-box;
}

#newpartner .input-group .form-control {
    position: relative;
    z-index: 2;
    float: left;
    width: 100%;
    margin-bottom: 0;
    padding-left: 5px !important;
}

#newpartner .input-group-addon,
#newpartner .input-group-btn,
#newpartner .input-group .form-control {
    display: table-cell;
}

#newpartner .input-group-addon {
    margin-right: 5px;
    line-height: 2;
    text-align: center;
    white-space: nowrap;
    color: var(--brandColorBlue);
}

#newpartner .input-group-pwd {
    position: relative;
    display: flex;
    border-collapse: separate;
    margin-bottom: 5px;
    padding: 2px 3px;
    height: 35px;
    background: #fff;
    border: 1px solid #d7d7d7;
    font: 14px Arial, Verdana, sans-serif !important;
    border-radius: 3px;
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
}

	.input100 {
    	width: 100% !important;
	}

	.input75 {
	    width: 75% !important;
	}

	.input50 {
	    width: 50% !important;
	}

	.input25 {
	    width: 25% !important;
	}


	
/* ==========================================================================
   #Responsive
   ========================================================================== */
   
/* #Large Display
   ========================================================================== */

	@media screen and (min-width: 1366px) {
		
		.sf-menu > li { margin-right:0px; }
		.sf-menu > li:last-child { margin-right: 0; }
	}

	@media screen and  (max-width: 1365px) {
		.sf-menu > li > a {
			font-size: 13px;
		}	
		.sf-menu > li > a span{
			display: inline-block;
			padding: 5px 4px;
			border: 1px solid transparent;
		}
		.icon-box-content p{
			height:350px;
		}
		.icon-box-content ul, .icon-box-content p{
			height: auto;
		}
		.icon-box-4 h4{
			font-size: 1em;
			line-height: 1.2;
		}
	
		.flex .flex-box .box-content{
			padding: 40px 20px 60px 40px;
		}
		.flex .flex-box .box-content h4{
			font-size: 1.3em;
			line-height: 1.2;
			margin-bottom: 15px;
		}
		.flex .flex-box ul.bullet-arrow{
			font-size: 1em;
			margin: 20px 10px 25px 20px;
		}
		#bg-slide .row [class*="span"]{
			width:100%;
			margin-left:0px;
		}
		
	}
	@media screen and  (max-width: 1280px) {
		#awards-list .span7{
			width: 70%;
			margin: 0px auto 0px 20%;
		}
		#awards-list img{
			margin: 0px 50px 50px 0px;
		}

	}

@media screen and (max-width: 1180px){
		.menu-item.hidden-phone,
		#menu { display: none; }

		#mobile-menu-trigger { 
			position: absolute;
			display: block;
			top:10px;
			right: 75px;
			margin-right: 10px;
			margin: 10px 0 0px 0;
		}
}
/* #Smaller then 1080px width
   ========================================================================== */
	
	@media screen and (max-width: 1080px) {

		#tagline{
			height: 50px;
		}
		#bg-slide .span10{
			margin-left: 0px;
		}
		#content div #awards-list{
			width: 70%;
			margin-left: 5%;
		}	
	}

/* #Tablet (Portrait)
   ========================================================================== */
	@media screen and (max-width: 979px) {


		#top_contact{
			font-size: 14px;
		}	
		#tagline{
			height: 56px;
			margin-left: 20px;
		}		
		.icon-box-content p{
			height:auto;
			margin-bottom: 30px;
		}
		.icon-box-content ul{
			height: auto;
		}
		h1 {
		  margin-bottom: 10px;
		  font-size: 2em;
		  line-height: 1.2;
		}	
		#awards-list .span7{
			width: 100%;
			padding: 0px 0px 0px 10%;
			margin: 0px auto 0px auto;
			box-sizing: border-box;
		}	
		#awards-list img {
			  margin: 0px 50px 20px 0px;
			}

		#mobile-menu-trigger { 
			position: absolute;
			display: block;
			right: 45px;
		}	
	}

	
/* #Mobile (Portrait and Landscape )
   ========================================================================== */
	@media (max-width: 867px) {

		.row .row,
		.row-fluid .row{ 
			width: auto; 
			padding: 0; 
			margin: 0; 
		}
	}

	@media screen and (max-width: 767px) {
	     #menu,
	     .mobile-hide,
	     #google_translate_element,
	     .mobile-small-hide {
	          display: none !important;
	     }	

		body { 
			background: none; 
			background-color: #fff; 
		}
		.accordion-item-toggle h3, .toggle-item-toggle strong, h2{
			font-size: 1.3em;
		}
		.icon-box-content ul, .icon-box-content p{
			height: auto;
		}
		.column{
			float: none;
			margin-left: 0px;
			margin-bottom: 20px;
		}

		#awards-list .span7{
			width: 100%;
			padding: 0px;
			margin: 0px auto;
			box-sizing: border-box;
			text-align: center;
		}	
		#awards-list img {
			float: none;
			width: 30%;
		  	margin: 0px auto;
		}	
		#awards-list ul{
			margin: 0px 10% 0px 12%;
		}
		#top_contact{
			text-align: center;
			float: none;
		}
		p.last, 
		h1.last, 
		h2.last, 
		h3.last, 
		h4.last, 
		h5.last, 
		address.last, 
		ul.last, 
		ol.last { margin-bottom: 20px; }
		
		.text-right { text-align: left;}
		
		.column{float:none;width:100%;}
		.icon-box-content ul, .icon-box-content p{
			height:auto !important;
		}

		.anchor-get-started{
    		top: -170px;

		}
		.anchor-services {
		    top: -130px;
		}
		.anchor-tools{
		    top: -140px;
		}
		.anchor-achievements{
			top: -160px;
		}

	}
	
/* #Mobile ( Landscape )
  ========================================================================== */

	@media screen and (max-width: 480px){
		#tagline{
			display: none;
		}
		table td{text-align: left;}
	}	

	@media screen and (max-width: 320px) {
	    #top_contact{
	        line-height: 1.2;
	    }
	    #intro-text{
	    	margin-top:0px;
	    }
	    h3{
	    	font-size: 1.2em;
	    }
	    .flex .flex-box .box-content h4{
			font-size:1.2em;
		}
	}