@charset "UTF-8";

/* NORMALISE */

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

*, *:after, *:before { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; outline:none; }
*:focus {
	outline:none;
}
/*hide the default highlighting/blink when pressing links on mobile*/
* {
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	-webkit-tap-highlight-color: transparent;
}
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,input,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,textarea,caption,tbody,tfoot,thead,tr,th,td{
	margin:0;
	padding:0;
	border:0;
	outline:none;
	font-weight:inherit;
	font-style:inherit;
	font-family:inherit;
	vertical-align:baseline;
}

ol,ul{list-style:none}
table{border-collapse:separate;border-spacing:0;vertical-align:middle}
caption,th,td{text-align:left;font-weight:normal;vertical-align:middle}
a img{border:none}


/* THEME */

body {
	font-family: 		"Muli", Helvetica, Arial, sans-serif;
	font-size:			16px;
    letter-spacing:		0.02em;
	line-height:		1.5em;
	color:				#636363; /*black 70%*/
	overflow-x:			hidden;
}
a,
a:visited {
	color:				#7bb4cc; /*sky*/
	text-decoration:	none;
	cursor:				pointer;
}
.desktop a:hover {
	color:				#2c4a5b !important; /*gunmetal*/
	text-decoration:	underline;
	cursor:				pointer;
}
a:active {
	color:				#2c4a5b !important; /* gunmetal */
}
a.active,
.selected {
	text-transform:		uppercase;
	font-weight:		600;
	color:				#2c4a5b !important;
}
.selected a {
	color:				#2c4a5b; /* gunmetal */
}


h1,
h2,
h3,
h4,
h5,
h6 {
	font-family:		"UI Light", Calibri Light, Helvetica Neue, Helvetica, Arial, sans-serif;
    letter-spacing:		0.02em;
	line-height: 		1.3;
    margin:				0 0 30px;
	color:				#64a79d; /*teal*/
}
p {
    margin:				auto;
	max-width:			840px;
}
sup { 
	letter-spacing:		0;
	position:			relative;
	top:				-0.4em;
}
strong, b {
	font-weight:		800;
}
em, i {
	font-style:			italic;
}
/*-- FONT SIZES --*/
h1, .h1 {
  font-size: 2.375rem; /*38px login title */
  letter-spacing: -0.02em;
}
h2, .h2 {
  font-size: 1.75rem /*28px process types */
}
h3, .h3 {
  font-size: 1.5rem /*24px section or instance title */
}
h4, .h4 {
  font-size: 1.31rem /*21px modules, grid */
}
h5, .h5 {
  font-size: 1.125rem /*18px form inputs, form sections, tabs, actionbar labels */
}
h6, .h6 {
  font-size: 0.94rem /*15px field labels, filters */
}
.small_13 {
	font-size:			0.81rem; /*13px date & name meta, comments, dashboard date and IDs, stacked action labels, superscript, tooltips */
	font-family:		"UI Normal", Calibri, Helvetica, Arial, sans-serif;
}
.small_11 {
	font-size:			0.69rem; /*11px module date stamp, tags */
	font-family:		"UI Normal", Calibri, Helvetica, Arial, sans-serif;
}
.mega {
	font-size:			3.6rem !important;
	font-weight:		200;
	letter-spacing:		0em !important;
	line-height:		1.1 !important;
}


/*-- LINE HEIGHTS --*/

.line_16 {
	line-height:		1em; /*16px tooltips*/
}
.line_19 {
	line-height:		1.19em; /*19px pairs with font 15 and 13*/
}
.line_21 {
	line-height:		1.31em; /*21px modules, grid*/
}
.line_24 {
	line-height:		1.5em; /*24px feature titles (tours, guides)*/
}
.line_28 {
	line-height:		1.75em; /*28px modules, grid*/
}
.line_30 {
	line-height:		1.875em; /*30px avenir paragraph copy*/
}
.line_32 {
	line-height:		2em; /*32px process types*/
}


/*-- COLORS --*/

.sky {					color:#7bb4cc !important;} 
.teal {					color:#64a79d !important;}
.apple {				color:#99c942 !important;}
.gunmetal {				color:#2c4a5b !important;}
.salmon {				color:#ee6c3d !important;}
.apricot {				color:#f89e33 !important;}
.frost {				color:#a5c6bb !important;}
.charcoal {				color:#636363 !important;} /* black 70% */
.grey {					color:#acacac !important;}
.silver {				color:#d7d7d7 !important;}
.smoke {				color:#eee    !important;}
.mist {					color:#f5f5f5 !important;}
.white {				color:#fff    !important;}

.bg-sky {				background-color:#7bb4cc !important;}
.bg-apple {				background-color:#99c942 !important;}
.bg-salmon {			background-color:#ee6c3d !important;}
.bg-apricot {			background-color:#f89e33 !important;}
.bg-smoke {				background-color:#eee    !important;}
.bg-mist {				background-color:#f5f5f5 !important;}
.bg-white {				background-color:#fff    !important;}

.completed {			background-color:#99c942 !important;} /* apple */
.inprogress {			background-color:#f89e33 !important;} /* apricot */
.required {				background-color:#2c4a5b !important;} /* gunmetal */
.notrequired {			background-color:#a5a5a5 !important;} /* grey */

.draft {				background-color:#7bb4cc !important;} /* sky */
.nudge {				background-color:#f89e33 !important;} /* apricot */
.urgent {				background-color:#ee6c3d !important;} /* salmo n*/
.expired {				background-color:#a5a5a5 !important;} /* grey */


/*-- GENERAL OBJECTS --*/

.nowrap {
	white-space:		nowrap;
}
.hr {
	display:			block;
	width:				100%;
	height:				1px;
	padding:			0;
	margin:				0 auto;
	background:			#bbb
}
.border-top {
	border:				0;
	border-top:			1px solid #bbb;
}
.pad-topbtm {
    padding:			100px 0;
}
.pad-top {
    padding-top:		100px;
}
.pad-btm {
    padding-bottom:		100px;
}
.container {
	display:			block;
	width:				100%;
	padding-right:		15px;
	padding-left:		15px;
	margin-right:		auto;
	margin-left:		auto;
}
.edgeless .container {
	width:				100% !important;
	padding-right:		auto;
	padding-left:		auto;
}
.edgeless .lft,
.edgeless .rgt {
	display:			table-cell;
	width:				50%;
	margin:				0 auto;
	padding:			0;
	padding-left:		13%;
	vertical-align:		top;
	text-align:			left;
	white-space:		normal;
}
.edgeless {
	white-space:		nowrap;
}
@media (min-width: 768px) {
  .container {
    width:				750px;
  }
}
@media (min-width: 992px) {
  .container {
    width:				970px;
  }
}
@media (min-width: 1200px) {
  .container {
    width:				1100px;
  }
}
.row {
	display:			table;
	width:				100%;
	padding:			auto;
}
.section-header {
    margin-bottom:		50px;
}
.section-header h4 {
	font-family: 		"Avenir Next LT Pro", "Muli", Helvetica, Arial, sans-serif;
	font-weight:		600;
	text-transform:		uppercase;
	text-rendering:		optimizeLegibility;
    margin:				0 0 30px;
	color:				#7bb4cc; /*2c4a5b gunmetal*/
}
.img-responsive {
    display: 			block;
    max-width:			100%;
    height:				auto;
}
.img-center {
    margin:				0 auto;
}
.img-wrapper {
    position:			relative;
    width:				100%;
    height:				auto;
    margin:				0 auto;
    overflow:			hidden;
}
.img-wrapper .on-hover {
    opacity:			1;
    opacity:			0;
    position:			absolute;
    top:				50%;
    margin-top:			-30px;
    width:				100%;
    -webkit-transform:	translateX(-50px);
    transform:			translateX(-50px);
    -webkit-transition:	all .3s ease-out;
    transition:			all .3s ease-out;
}
.img-wrapper:hover .on-hover {
    -webkit-transform:	translateX(0);
    transform:			translateX(0);
    opacity:			1;
}
.img-wrapper .on-hover .btn {
    opacity:			1;
}
.text-center {
	text-align:			center;
}
.lead {
	font-size:			1.2em; /*h5*/
	font-weight:		400;
	color:				#636363; /*black 70%*/
	line-height:		1.5em;
}
.col1 .item {
	width:				100%;
}
.col2 .item {
	width:				50%;
}
.col3 .item {
	width:				33.3%;
}
.col3 .item:nth-child(3n) {
	clear:				right;
}
.col3 .item:nth-child(3n+1) {
	clear:				both;
}
.col3 .item ul {
	padding:			0 0.8em;
}
.col4 .item {
	width:				25%;
}
.col4 .item:nth-child(4n) {
	clear:				right;
}
.col4 .item:nth-child(5n) {
	clear:				both;
}
.item {
	display:			inline-block;
	min-height: 		1px;
	padding-right: 		15px;
	padding-left: 		15px;
	padding-bottom:		50px;
	vertical-align:		top;
    text-align:			center;
	float:				left;
}
.item.widow {
	display:			block;
	width:				100%;
}
.item p {
	text-align:			center;
}
.item h4,
.item h6 {
	font-family: 		"Avenir Next LT Pro", "Muli", Helvetica, Arial, sans-serif;
	font-weight:		800;
	text-align:			center;
	text-transform:		uppercase;
	text-rendering:		optimizeLegibility;
    margin:				0 0 30px;
	color:				#7bb4cc; /*sky*/
}
.item h4,
.item h6 {
    -webkit-transition:	all .3s ease-out;
    transition:			all .3s ease-out;
}
.item:hover h4,
.item:hover h6 {
    color:				#2c4a5b; /*gunmetal*/
}
.item .glyph {
    margin:				0 auto 20px;
    -webkit-transition:	all .3s ease-out;
    transition:			all .3s ease-out;
}
.item:hover .glyph {
    -webkit-transform:	translateY(-10px);
    transform:			translateY(-10px);
    -webkit-transition:-webkit-transform .4s ease-out;
    transition:			transform .4s ease-out;
}

.lft .item {
	display:			block;
	position:			relative;
	width:				100%;
	text-align:			left;
	padding-bottom:		0;
}
.lft .item .glyph {
	float:				left;
	margin-right:		2em;
	max-width:			120px;
}
.lft .item h4,
.lft .item p {
	display:			block;
	text-align:			left;
	margin-top:			1em;
}
.lft .item h4 {
	margin-bottom:		0;
}

ul.feature-list {
	padding-top:		1em;
	padding-bottom:		1em;
	text-align:			left;
}
ul.feature-list li {
	display:			block;
	position:			relative;
	clear:				both;
	padding-bottom:		1em;
	padding-left:		50px;
}
ul.feature-list li .icon {
	display:			block;
	position:			absolute;
	left:				0px;
	color:				#99c942;
}

.break-btn,
.break-simple,
.break-running,
.break-colocate2,
.break-ESS {
	display:			none;
}


/*-- HEADER --*/

#USP .ap-icon, 
#Contact .ap-icon {
	height:				60px;
}
.ap-icon > img {
	height:				100%;
	width:				auto;
	border:				0;
}

#Logo-blu,
#Logo-wht {
	display:			inline-block;
	position:			relative;
	padding:			0;
	border:				0;
	text-indent:		-9999em;
	overflow:			hidden;
}
#Logo-blu {
	background:			url(../assets/logos/logo-v2_blu.png) no-repeat;
}
#Logo-wht {
	background:			url(../assets/logos/logo-v2_wht.png) no-repeat;
}

h1.mega [id^='Logo-'] {	top:13px;  width:291px;  height:62px;  background-size:291px 62px !important; }
h1 [id^='Logo-'] {		top:10px;  width:223px;  height:48px;  background-size:223px 48px !important; }
h2 [id^='Logo-'] {		top:8px;   width:181px;  height:39px;  background-size:181px 39px !important; }
h3 [id^='Logo-'] {		top:6px;   width:140px;  height:30px;  background-size:140px 30px !important; }
h4 [id^='Logo-'] {		top:6px;   width:140px;  height:30px;  background-size:140px 30px !important; }
p  [id^='Logo-'] {		top:5px;   width:100px;  height:22px;  background-size:100px 22px !important; }

#Copilot .logo {
	display:			inline-block;
	margin:				10px;
	width:				80%;
	max-width:			441px;
	background-color:	transparent;
}
#Header {
	background-color:	#7bb4cc;
	padding-top:		70px /*min start value before inline calc*/;
}
#Header h1, #Contact h3, #Contact h4, #Contact h6 {
	color:				#fff;
}
#Header h2 {
/*	font-family:		"UI Normal", Calibri, Helvetica, Arial;*/
	margin-bottom:		60px;
}
#Header h4 {
	font-family: 		"Avenir Next LT Pro", "Muli", Helvetica, Arial, sans-serif;
	text-transform:		uppercase;
	text-rendering:		optimizeLegibility;
    margin:				0 0 30px;
	font-weight:		300 !important;
}

.hero {
	position:			relative;
	background-color:	#7bb4cc;
	padding-top:		64px;
}
.hero .container {
	display:			block;
	position:			relative;
	z-index:			2;
}
.hero .bg-white {
	display:			block;
	position:			absolute;
	bottom:				0;
	left:				0;
	width:				100%;
	height:				80px;
	z-index:			1;
}
.hero h1, .hero h2, .hero h3, .hero h4, .hero h5, .hero h6 {
	color:				white;
}
.hero p {
	color:				#2c4a5b;
}
.hero .carousel-tabs a {
	color:				white;
}
.hero .carousel-tabs {
	border-bottom:		none;
}
.hero .logo {
	margin-bottom:		0.2em;
	margin-left:		0.4em;
}
.fan {
	display:block;
	position:relative;
	width:100%;
	max-width:1000px;
	height:420px;
	padding:0;
	margin:2em auto 0;
	text-align:center;
	overflow:hidden;
}
.fan > div {
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
			box-sizing: border-box;
	display:block; position:absolute; border:0;
}
.fan img {
	width:auto;
	border:0;
}
.fan #pic-mid img {
	 border:1px solid #ccc;
}
.fan #pic-mid {
	top:15px; z-index:3;
	width:100%; margin:0 auto; text-align:center;
}
.fan #pic-rgt {
	/*top:60px; right:50px; z-index:2;*/
	top:-15px; right:0; z-index:2;
	-webkit-transform: rotate(5deg) scale(0.75); /* Safari */
		-ms-transform: rotate(5deg) scale(0.75); /* IE 9 */
			transform: rotate(5deg) scale(0.75);
}
.fan #pic-lft {
	top:-15px; left:0; z-index:2;
	-webkit-transform: rotate(-5deg) scale(0.75); /* Safari */
		-ms-transform: rotate(-5deg) scale(0.75); /* IE 9 */
			transform: rotate(-5deg) scale(0.75);
}
.fan #pic-lft, .fan #pic-rgt, .fan #pic-mid img {
	-webkit-box-shadow: 0 0 16px 0 rgba(0,0,0,0.3); 
			box-shadow: 0 0 16px 0 rgba(0,0,0,0.3);
}
@media (max-width:400px){
.fan {
	height:280px;
}
.fan #pic-mid {
	padding:0 1em;
	bottom:0;
}
}

.video-container {
	position: relative;
	height: 0;
	padding-bottom: 56.25%; /*16:9*/
	overflow: hidden;
	margin: 0 auto;
	background-color:#2c4a5b;
	border:1px solid #2c4a5b;
}
.video-container iframe,
.video-container object,
.video-container embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#Testimonials .quote {
	font-style:			italic;
	text-align:			center;
	line-height:		1.31em;
	color:				#7BB4CC;
	padding:			0 3em 1.31em;
	margin: 			auto;
}
.quoter .name {
	margin: 			1em 1em 0.2em;
}

/*-- NAVBAR --*/

#Navbar {
	display:			block;
	position:			fixed;
	top:				0;
	height:				auto;
	width:				100%;
	color:				#fff;
	text-align:			center;
	margin:				0;
	padding:			0;
	transition:			top 0.4s ease-in-out;
	z-index:			999;
}
#Navbar [id^='Logo-'] {
	margin-top:			-1em;
	top:				0.6em;
	background-size:	181px 39px;
	width:				181px;
	height:				39px;
}
#Navbar #Menu {
	display:			block;
	position:			relative;
	margin:				auto;
	width:				100%;
	height:				100%;
	vertical-align:		middle;
	text-align:			center;
	opacity:			0.7;
}
#Navbar:hover #Menu {
	opacity:			1;
}
#Menu-wrapper {
	display:			block;
	position:			relative;
	width:				100%;
	height: 			auto;
	margin:				0;
	padding:			1.1em 0 1.3em;
	text-align:			center;
	background-color: 	rgba(123,180,204,0.9);
}
@media (max-width:640px){
#Menu-wrapper {
	padding:			0.6em 0;
}
}
#Menu .lft {
	display:			inline-block;
	position:			absolute;
	top:				0;
	left:				0;
	width:				auto;

	vertical-align:		middle;
	text-align:			left;
	padding-left:		2%;
	white-space:		nowrap;
}
#Menu .rgt {
	display:			inline-block;
	position:			absolute;
	top:				0;
	right:				0;
	width:				auto;

	vertical-align:		middle;
	text-align:			right;
	padding-right:		2%;
	white-space:		nowrap;
}
#Menu .lft .icon {
	margin-right:		-4px;
}
#Menu .rgt .icon {
	margin-left:		-4px;
}
#Menu #Links .icon {
	display:			none;
	margin:				auto;
}
#Menu #Links {
	display:			table;
	height:				100%;
	width:				auto;
	margin:				auto;
	text-align:			center;
	vertical-align:		middle;

	-o-transition:		all .2s;
	-moz-transition:	all .2s ease-out;
	-webkit-transition:	all .2s ease-out;
	transition:			all .2s ease-out;
}
#Menu #Links ul {
	display:			table-row;
}
#Menu #Links li {
	display:			table-cell;
	vertical-align:		middle;
	padding:			0 10px;
}
#Menu .lft a,
#Menu .rgt a {
	padding: 0 !important;
}
#Menu a p {
	display:inline-block;
	padding:10px;
	margin:0;
	color:transparent;
}

.menu {
	display:block;
	width:100%;
	margin:auto;
}
#Menu a, 
.menu a {
	display:inline-block;
	padding:10px;
	margin:0 auto;
	color:#fff;
}
.menu a p {
	display:inline-block;
	padding:0;
	margin:0;
	color:transparent;
}
#Menu a p.show, 
.menu a p.show {
	display:inline-block !important;
	color:#fff;
}
.desktop #Menu a:hover p, 
.desktop .menu a:hover p {
	color:#2c4a5b;
}
@media (max-width: 640px){
	#Menu .lft .h5,
	#Menu .rgt .h5 {
		font-size:13px !important;
	}
}
@media (min-width: 641px){
#Menu .rgt #Login {
	padding: 6px 0 !important;
}
}
#Menu #Login span:not(.icon) {
	padding: 0 10px;
}
#Menu .hr {
	display: none;
	width:90%;
	background:#fff !important;
}

/* -- hamburger icon --*/
#Menu #Links #Menu-icon {
	display:none;
	text-align:center;
	padding:0 !important;
}
#Menu #Links #Menu-icon .icon {
	display:inline-block;
	top:3px;
}
#Menu-icon span {
	display: block;
	position: absolute;
	height: 4px;
	width: 22px;
	background: #fff;

	opacity: 1;
	left: 7px;
	
	-webkit-transform: rotate(0deg);
	-moz-transform: rotate(0deg);
	-o-transform: rotate(0deg);
	transform: rotate(0deg);
}
#Menu-icon:hover span {
	background:#2c4a5b;
}
#Menu-icon span:nth-child(1) {
	top: 5px;
}
#Menu-icon span:nth-child(2) {
	top: 13px;
}
#Menu-icon span:nth-child(3) {
	top: 21px;
}
#Menu-icon.open span:nth-child(1) {
	top: 13px;
	-webkit-transform: rotate(135deg);
	-moz-transform: rotate(135deg);
	-o-transform: rotate(135deg);
	transform: rotate(135deg);
}
#Menu-icon.open span:nth-child(2) {
	opacity: 0;
	left: 150px;
}
#Menu-icon.open span:nth-child(3) {
	top: 13px;
	-webkit-transform: rotate(-135deg);
	-moz-transform: rotate(-135deg);
	-o-transform: rotate(-135deg);
	transform: rotate(-135deg);
}
#Menu-icon span,
#Navbar .icon,
#Navbar a p {
	-webkit-transition: .25s ease-in-out;
	-moz-transition: .25s ease-in-out;
	-o-transition: .25s ease-in-out;
	transition: .25s ease-in-out;
}

/*-- Menu Collapsed --*/

#Menu.collapse {
	margin:				0 auto;
	position:			relative;
	clear:				both;
	height:				auto !important;
}
#Menu.collapse .lft {
	display:			inline-block;
	width:				auto;
	position:			absolute;
	top:				0;
	left:				0;
}
#Menu.collapse .rgt {
	display:			inline-block;
	width:				auto;
	position:			absolute;
	top:				0;
	right:				0;
}
#Menu.collapse .rgt #Login {
	padding: 0 !important;
}
#Menu.collapse a p {
	padding:			0 10px;
}
#Menu.collapse #Links {
	display:			inline-block;
	width:				100%;
	vertical-align:		middle;
	text-align:			center;
}
#Menu.collapse #Links ul {
	display:			none;
}
#Menu.collapse #Links li {
	display:			block;
	width:				100%;
	padding:			5px 10px;
}
#Menu.collapse #Links #Menu-icon {
	display:			block;
	width:				100%;
	margin:				auto;
}
#Menu.collapse #Links #Menu-icon .icon {
	display:			inline-block;
	top:				2px;
}
#Menu.collapse #Links.open ul {
	display:			block;
	height:				auto;
	max-height:			80%;
	margin: 			1.2em 0;
	overflow-y:			auto;
	-webkit-overflow-scrolling: touch;
}
#Menu.collapse #Links.open .hr {
	display:			block;
}

/*-- ACTIONBAR --*/

#Actionbar,
.offset-for-actionbar {
	height:66px;
}
#Actionbar {
	z-index:999;
	display:table;
	position:fixed;
	bottom:0;
	width:100%;
	color:#fff;
	background-color:#7bb4cc;
	border-top: 1px solid #fff;
	text-align:center;
}
#Actionbar div {
	display:table-cell;
	vertical-align:middle;
	text-align:center;
	width:50%;
}
#Actionbar a,
#Actionbar a:visited {
	color: #fff;
	text-decoration:none;
}
#Actionbar a:hover {
	color: #2c4a5b; /*gunmetal*/
	text-decoration:underline;
}

/*-- FOOTER --*/

#Footer {
}
.disclaimer {
	font-size:			90%;
	display:			block;
	margin-top:			2em;
}

/*-- CTA --*/

#CTA {
	background-color:	#7bb4cc;
}
#CTA h1,
#CTA p {
	color:				#fff !important;
}
#CTA .lead {
	color:				#2c4a5b !important;
}

/*-- USP --*/

#USP {
	background-color:	#7bb4cc;
}
#USP h1, #USP h3, #USP h4, #USP p {
	color:				#fff !important;
}
#USP h4 {
	font-weight:		300 !important;
}
#USP .section-header {
}

/*-- SYSTEM --*/

#System .glyph {
	width:				140px;
	height:				140px;
}

/*-- FEATURES --*/

#Features .glyph {
	width:				120px;
}
#Features .item {
}

/*-- CONNECTED --*/

#Connected .item {
}

/*-- CHAOS --*/

#Chaos .lft {
	width:				70%;
	padding-top:		3em;
}
#Chaos .rgt {
	width:				30%;
}
#Chaos ul li {
	padding-bottom:		1em;
}

/*-- BUILD --*/

#Build {
	display:			none;
}

/*-- BENEFITS --*/

#Benefits .glyph {
	font-size:			72px;
	color:				#99c942;
}

/*-- FOR --*/

#For .glyph {
	display:			block;
	font-size:			72px;
	color:				#99c942;
	padding-top:		20px;
}
#For .glyph img {
	height:				140px;
}

/*-- IMPROVE --*/

#Improve .glyph {
	font-size:			72px;
	color:				#99c942;
	padding-top:		20px;
}
#Improve .glyph img {
	height:				100px;
}
#Improve .item {
}

/*-- TEMPLATES --*/

#Templates {
}
#Templates .process:hover {
    z-index:            101;
    color:				#2c4a5b !important;

    -o-transform:		scale(1.1);
    -moz-transform:		scale(1.1);
    -webkit-transform:	scale(1.1);
    transform:			scale(1.1);

    -moz-box-shadow:	0 6px 12px rgba(0,0,0,0.2);
    -webkit-box-shadow:	0 6px 12px rgba(0,0,0,0.2);
    box-shadow:			0 6px 12px rgba(0,0,0,0.2);
}
#Templates .process:hover * {
	text-decoration:	none !important;
}
#Templates .process {
    z-index:            100;
    color:              #64a79d; /*teal*/
    display:            inline-block;
        
    -o-transform:       scale(1);
    -moz-transform:     scale(1);
    -webkit-transform:  scale(1);
    transform:          scale(1);

    -moz-box-shadow:    0;
    -webkit-box-shadow: 0;
    box-shadow:         0;

    -o-transition:      all .60s;
    -moz-transition:    all .60s ease-out;
    -webkit-transition: all .60s ease-out;
    transition:         all .60s ease-out;

    cursor:             pointer;
}
.process .style {
    background-color:   #f5f5f5;
}
.bg-mist .process .style {
    background-color:   white;
}

/*-- TEMPLATES .block-style --*/

.block-style .process .triangle-fold, 
.block-style .process .triangle-cut,
.block-style .process .cat {
    display:            none;
}
.block-style .process .style {
    text-align:			center;
    padding:            10px 10px 5px;
    border-radius:      4px;
    border:             1px solid #ddd;
}
.block-style .process .title {
    display:            table;
    height:             50px;
    margin:             0 auto;
}
.block-style .process .title br {
    display:            none;
}
.block-style .process .title h4 br {
    display:            block;
}
.block-style .process h4 {
    display:            table-cell;
    vertical-align:     middle;
    line-height:        21px;
    /*.item h4*/
    font-family:        "Avenir Next LT Pro","Muli",Helvetica,Arial,sans-serif;
    font-weight:        800;
    font-size:          95%;
    text-transform:     uppercase;
    text-rendering:     optimizelegibility;
    color:              #7bb4cc;
}
.block-style .process .style:hover h4 {
    color:              #2c4a5b;
}
.block-style .process .glyph {
    width:				100%;
    height:             100px;
    margin:             auto;
}
.block-style .process .glyph img {
    width:              auto;
    height:             100%;
}

/*-- TEMPLATES .page-style --*/

.page-style .process .style {
    text-align:         left;
    padding:            10px 10px 5px;
    border:             1px solid #ddd;
}
.page-style .process .cat {
    display:            table;
    font-size:          0.8em;
    font-weight:        bold;
    text-transform:     uppercase;
    margin-bottom:      10px;
    color:              #2c4a5b; /*gunmetal*/
}
.page-style .process .title {
    font-size:          1.5em;
    font-weight:        300;
    line-height:        1.2;
    margin-bottom:      20px;
    /*display:          table;*/
    display:            block;
    overflow-y:         hidden;
    word-break:         normal;
}
.page-style .process .glyph {
    display:            block;
    width:              100%;
    height:             100px;
    margin:             0;
    padding:            0;
    text-align:         right;
}
.page-style .process .glyph img {
    width:              auto;
    height:             100%;
}
.process .triangle-fold {
    display:            block;
    position:           absolute;
    top:                0;
    right:              0;
    width:              0;
    height:             0;
    border:             0;
    border-bottom:      30px solid #ddd;
    border-right:       30px solid transparent;
    -moz-transform:     scale(1.05);
}
.process .triangle-cut {
    display:            block;
    position:           absolute;
    top:                -4px;
    right:              -10px;
    width:              0;
    height:             0;
    border:             0;
    border-top:			44px solid #fff;
    border-left:        44px solid transparent;
    -moz-transform:		scale(1.1);
}
    .bg-mist .process .triangle-cut {
    border-top:			44px solid #f5f5f5;
    }
.dashed {
    border:				2px dashed #ddd !important;
    background-color:	transparent !important;
    color:				#7bb4cc;
}
.finance {}
.hrc {}
.marketing {}
.operations {}
.sales {}

.carousel .glyph {
	width:120px;
}
@media (min-width: 1024px) {
.carousel-tabs br {
	display:			none;
}
.carousel-inner .row {
	 padding:			0px 1.5em;
}
#Templates .process {
	width:				17.5%;
	margin:				1%;
}
}
@media (max-width: 1023px) {
.carousel-tabs br {
	display:			block;
}
.carousel-inner .row {
    padding: 			0px 0.5em;
}
#Templates .process {
	width:				22%;
	margin:				1.2%;
}
}
@media (max-width: 799px) {
#Templates .process {
	width:				29.5%;
	margin:				1.5%;
}
}
@media (min-width: 641px) {
.carousel-inner .section-head {
	display:			none;
}
.section-content {
	display:			block !important;
}
.page-style .process .title {
	min-height:			4.8em;
	max-height:			4.8em;
}
}
@media (max-width: 640px) {
.section-head {
	display:			block;
	padding:			1em 0;
	margin:				0 1em;
	font-size:			1.125em;
	cursor:				pointer;
	border-bottom:		1px solid #ccc;
}
.section-head.open {
	border-bottom-color: transparent;
}
.section-content {
	display:			none;
}
.carousel-tabs {
	display:			none;
}
#Templates .gowide .process {
	display:			block;
	width:				auto;
	text-align:			left;
	margin:				10px 15px;
}
.page-style .process .style {
	padding:			10px 10px 5px;
}
.page-style .process .cat {
	display:			table;
	font-size:			0.8em;
	margin-bottom:		5px;
}
.page-style .process .title {
	display:			table;
	font-size:			1.2em;
	font-weight:		300;
	line-height:		1.2;
	margin-bottom:		10px;
	margin-right:		3.3em;
}
.page-style .process .title br {
	display:			none;
}
.page-style .process .glyph {
	display:			block;
	position:			absolute;
	right:				6px;
	bottom:				0;
	width:				auto;
	height:				80px;
	margin:				0;
	padding:			0;
	text-align:			right;
}
.page-style .process .glyph img {
	width:				auto;
	height:				100%;
}
.process .triangle-fold,
.process .triangle-cut {
	display:			none;
}
}
@media (max-width: 520px){
#Templates .process {
	width:				46%;
	margin:				2.2% 1.5%;
}
.block-style .process h4 {
	font-size:			0.9em !important;
	line-height:		1.2;
	padding-bottom:		4px;
}
.process .tag {
	font-size:			10px;
	padding: 			0.4em 1em 0.8em;
	min-width: 			80px;
}
}

/*-- PRINCIPLES --*/

#Principles .glyph {
	width:				140px;
	height:				140px;
}
#Principles .item {
}

/*-- JOURNEY --*/
#Journey .row {
	max-width:			800px;
	margin:				auto;
}
#Journey .item {
	display:			inline-block;
	width:				40%;
	padding:			0em 2.5em 2em;
}
#Journey .item .glyph {
	width:				140px;
	height:				140px;
}
#Journey .item p {
	font-size:			80%;
}
#Journey .para {
	display:			inline-block;
	width:				60%;
	padding:			2em 1.5em 0;
}
#Jrny-Start {}
#Jrny-Analyse .item {
	float:				right;
}
#Jrny-Improve {}
#Jrny-Path {}


/*-- STREAMLINE --*/
#Streamline .row {
	max-width:			980px;
	margin:				auto;
}
#Streamline .item {
	display:			inline-block;
	width:				50%;
	padding:			0em 2.5em 2em;
}
#Streamline .item img {
	max-width:			100%;
}
#Streamline .item .glyph {
	width:				140px;
	height:				140px;
}
#Streamline .item p {
	font-size:			80%;
	padding-right:		2em;
}
#Streamline .para {
	display:			inline-block;
	width:				50%;
	padding:			0em 1.5em;
}
#Streamline .para ul {
	font-size:			81%;
}
#Streamline-Form {}
#Streamline-Dashboard {}

#Streamline-Flow .item,
#Streamline-Console .item {
	float:				right;
}
#Streamline-Path img {}


/*-- PRICING --*/

.col2.pricing-table {
	max-width:			800px;
	margin:				auto;
}
.pricing-table .plan:hover {
		z-index:			101;

		-o-transform:		scale(1.05);
		-moz-transform:		scale(1.05);
		-webkit-transform:	scale(1.05);
		transform:			scale(1.05);

		-moz-box-shadow:	0 6px 12px rgba(0,0,0,0.2);
		-webkit-box-shadow: 0 6px 12px rgba(0,0,0,0.2);
		box-shadow:			0 6px 12px rgba(0,0,0,0.2);
}
.pricing-table .plan {
	position:			relative;
    margin:				0;
	padding:			2em 1em !important;
    border:				1px solid #ccc;
    border-radius:		0; 
    text-align:			center; 
    list-style:			none; 

		z-index:			100;
			
		-o-transform:		scale(1);
		-moz-transform:		scale(1);
		-webkit-transform:	scale(1);
		transform:			scale(1);

		-moz-box-shadow:	0;
		-webkit-box-shadow:	0;
		box-shadow:			0;

		-o-transition:		all .10s;
		-moz-transition:	all .10s ease-out;
		-webkit-transition:	all .10s ease-out;
		transition:			all .10s ease-out;
}
.pricing-table .plan p {
	padding-left:		0;
	padding-right:		0;
}
.pricing-table .heading {
	font-family: 		"Avenir Next LT Pro", "Muli", Helvetica, Arial, sans-serif;
	font-weight:		800;
	text-align:			center;
	text-transform:		uppercase;
	letter-spacing:		0em;
	font-size:			2em; /*32px*/
    color:				#7bb4cc; /*sky*/
	padding:			0;
	margin-bottom:		0.5em;
}
.pricing-table .subhead {
	margin-bottom:		0.5em;
}
.pricing-table .price { 
	font-family: 		"Avenir Next LT Pro", "Muli", Helvetica, Arial, sans-serif;
	font-weight:		600;
	text-align:			center;
	text-transform:		uppercase;
	letter-spacing:		-0.05em;
	font-size:			3.625em; /*58px*/
    color:				#99c942; /*apple*/
	line-height:		1em;
	margin-top:			20px;
	margin-right:		0.1em;
}
.pricing-table .price sup { 
	font-size:			0.3em; /*18px*/
	letter-spacing:		0;
	position:			relative;
	top:				-1.6em;
}
.pricing-table .per {
	font-size: 			1.125em; /*h5*/
    color:				#99c942; /*apple*/
	padding-bottom:		1.1em;
}
.pricing-table .features {
	margin:				24px auto 18px;
}
.pricing-table .features .icon {
	width:				24px;
	height:				24px;
	font-size:			24px;	
}
.pricing-table .btn {
	margin-top:			0.8em;
}

/*-- HELP --*/

#Help {
}
#Help h3 {
	color:				#2c4a5b; /*gunmetal*/
}
#Help .item {
	padding:			3em !important;
}
#Help .glyph {
	background-size:	140px;
	width:				140px;
	height:				140px;
	text-indent:		-9999em;
	overflow:			hidden;
}
.support .glyph {
	background:			url(../assets/support_Flight-Technician.png) no-repeat no-repeat;
}
.copilot .glyph {
	background:			url(../assets/support_Co-pilot.png) no-repeat no-repeat;
}
.copilot {
	background-color:	#7bb4cc; /*sky*/
	color:				#fff;
}


/*-- SHARE TO EXTEND TRIAL --*/

#Share-App .item {
	padding-bottom:		20px;
}
#Share-App .item .glyph {
	font-size:			72px;
	color:				#99c942;
	padding-top:		20px;
}
#Share-App .icon-linkedin {
		padding-left:		10% !important;
	}
#Share-App a:hover {
		z-index:			101;

		-o-transform:		scale(1.05);
		-moz-transform:		scale(1.05);
		-webkit-transform:	scale(1.05);
		transform:			scale(1.05);

		-moz-box-shadow:	0 6px 12px rgba(0,0,0,0.2);
		-webkit-box-shadow: 0 6px 12px rgba(0,0,0,0.2);
		box-shadow:			0 6px 12px rgba(0,0,0,0.2);
}
#Share-App a {
	display:			block;
	color:				inherit !important;
	text-decoration:	none !important;
    margin:				0;
	padding-top:		20px;
    border:				1px solid #ccc;
    border-radius:		0; 
    text-align:			center; 

		z-index:			100;
			
		-o-transform:		scale(1);
		-moz-transform:		scale(1);
		-webkit-transform:	scale(1);
		transform:			scale(1);

		-moz-box-shadow:	0;
		-webkit-box-shadow:	0;
		box-shadow:			0;

		-o-transition:		all .10s;
		-moz-transition:	all .10s ease-out;
		-webkit-transition:	all .10s ease-out;
		transition:			all .10s ease-out;
}

/*-- SIGNUP --*/

#Signup {
	background-color:	#7bb4cc;
	position:			relative;
}
#Signup h1, #Signup h3, #Signup h4, #Signup h6 {
	color:				#fff;
}
#Signup h4 {
	font-family: 		"Avenir Next LT Pro", "Muli", Helvetica, Arial, sans-serif;
	text-transform:		uppercase;
	text-rendering:		optimizeLegibility;
    margin:				0 0 30px;
	font-weight:		400 !important;
}
#Signup p {
	max-width:			1000px !important;
	margin:				auto;
}
#Signup a {
	color:				#2c4a5b; /*gunmetal*/
}
#Signup .section-header {
    margin-bottom:		25px;
}
#Signup .persuaders span {
	display:			inline-block;
	margin:				0 0.5em;
}
#Signup .hr {
	width:				96%;
	margin:				3.6em auto 3em;
	background:			#2c4a5b;
	opacity:			0.5;
}
#Signup .btn {
	/*min-height:		60px;*/
	font-family:		inherit;
}
#Signup .apps, 
#Signup .social {
	display:			inline-block;
	margin:				0 1em 1em;
}
#Signup-form input {
	float:				none !important;
	min-width:			340px;
}


/*-- BUTTONS --*/

.btn {
	display:			inline-block;
	width:				auto;
	margin:				0;
	padding:			0.54em 2em 0.7em;
	border:				1px solid #7bb4cc; /*sky*/;
	border-radius:		0;
	background-color:	transparent;
	color:				#7bb4cc; /*sky*/
	text-align:			center;

	-o-transform:		scale(1);
	-moz-transform:		scale(1);
	-webkit-transform:	scale(1);
	transform: 			scale(1);

	-moz-box-shadow: 	0;
	-webkit-box-shadow: 0;
	box-shadow: 		0;

	-o-transition: 		all .10s;
	-moz-transition: 	all .10s ease-out;
	-webkit-transition: all .10s ease-out;
	transition: 		all .10s ease-out;
}

.btn:hover {
	z-index:			101;
	border:				1px solid transparent;
	color:				#2c4a5b; /*gunmetal*/
	text-decoration:	underline;
	cursor:				pointer;

	-o-transform: 		scale(1);
	-moz-transform: 	scale(1);
	-webkit-transform: 	scale(1);
	transform: 			scale(1);

	-moz-box-shadow: 	0px rgba(0,0,0,0.3);
	-webkit-box-shadow: 0px rgba(0,0,0,0.3);
	box-shadow: 		0px rgba(0,0,0,0.3);
}

.btn-inverse {
	border-color:		#fff;
	color:				#fff !important;
}
.btn-inverse:hover {
	border-color:		#2c4a5b;
	color:				#2c4a5b !important;
}

.icon {
	display:			inline-block;
	position:			relative;
	vertical-align:		middle;
	font-size:			36px;
	width:				36px;
	height:				36px;
	padding:			0;
	border:				0;
	color:				inherit;
	overflow:			hidden;
}
.btn .icon {
}
/*FIREFOX*/
@media screen and (min--moz-device-pixel-ratio:0) {
  .icon {
	top:				-4px;
  }
  .glyph[class*='icon-'] {
  }
  ul.feature-list li .icon {
	margin-top:			-4px;
  }
}
/*CHROME*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
  .icon {
	top:				1px;
  }
  .glyph[class*='icon-'] {
	top:				6px;
	position:			relative;
  }
  ul.feature-list li .icon {
	margin-top:			-5px;
  }
}
/*IE*/
@media screen\0 {
  .icon {
	top:				1px;
  }
  .glyph[class*='icon-'] {
	top:				6px;
	position:			relative;
  }
  ul.feature-list li .icon {
	margin-top:			-5px;
  }
}
.big {
	font-weight:		300;
	font-size:			120px;
	width:				120px;
	height:				90px;
	margin-right:		0px;
	color:				white;
}

.icon-left [class*=fa]{
    margin-right:		10px;
}
.icon-right [class*=fa]{
    margin-left:		10px;
}
.temp-signin {
	display:			block;
	position:			absolute;
	top:				1.5em;
	right:				2em;
	text-align:			center;
}
.temp-signin .icon {
	display:			block;
	margin:				auto;
	padding-left:		2px;
	text-align:			center;
}
.temp-signin a:hover {
	text-decoration:	none !important;
}


/*-- FORM COMPONENTS --*/

input {
    width:				100%;
    height:				48px;
    padding-top:		15px;
    padding:			10px 15px;
	background-color:	#f7f7f7;
    border:				none;
	border-bottom:		1px solid #7bb4cc;
    border-radius:		0px;
    outline:			none;
    color:				#2c4a5b;
    font-size:			1em;
    vertical-align:		middle;
}
input:focus {
	border-bottom:		1px solid #2c4a5b;
}
.error input {
	border-bottom:		1px solid #ee6c3d;
}
.error .icon {
	color:				#ee6c3d;
}
.lb_wrap .lb_label.top, .lb_wrap .lb_label.bottom {
	left:				15px !important;
	top:				-10px !important;
	z-index:			1;
}
.lb_wrap .lb_label.left {
	left:				0;
	z-index:			1;
}
.lb_label {
	color:				#fff;
	opacity:			0.6;
	z-index:			1;
}
.lb_label.active {
	color:				#FFF;
	z-index:			1;
}
.no-placeholder .lb_label,
#Signup-form .lb_label {
	display:			none;
}
.field-wrap {
    display:			inline-block;
    position:			relative;
    vertical-align:		middle;
    margin:				5px;
	width:				auto;
	/*max-width:		320px;*/
}
.error-message {
    display:			block;
    position:			relative;
    top:				10px;
    left:				0;
    width:				100%;
	font-weight:		bold;
    font-size:			16px;
    text-align:			center;
	color:				#fff;
}
.field-wrap .error-message {
    display:			block;
    position:			absolute;
    top:				60px;
    left:				10px;
    width:				100%;
    font-size:			16px;
    text-align:			left;
}
.field-wrap .control-label {
    display:			none;
    position:			absolute;
    top:				-30px;
    left:				15px;
}
.no-placeholder .field-wrap .control-label {
    display:			inline-block;
}
.field-wrap:focus .icon,
.field-wrap:hover .icon {
	color:				#2c4a5b;
}
.field-wrap .icon {
	display:			block;
	position:			absolute;
	left:				8px;
}
	/*FIREFOX*/
	@media screen and (min--moz-device-pixel-ratio:0) {
	  .field-wrap .icon {
		top:			3px;
	  }
	}
	/*CHROME*/
	@media screen and (-webkit-min-device-pixel-ratio:0) {
	  .field-wrap .icon {
		top:			8px;
	  }
	}
	/*IE*/
	@media screen\0 {
	  .field-wrap .icon {
		top:			8px;
	  }
	}
@media (min-width:581px){
input.has-icon {
	padding-left:		50px;
}
}
@media (max-width:480px){
	.field-wrap {
		width:			90%;
		max-width:		420px;
	}
}


/*----------------------
	Media Queries
------------------------*/

@media (max-width: 1200px) {
	.break-headline {
		display:			none;
	}
	.break-service {
		display:			block;
	}
	.pricing-table .plan .icon-plus {
		display:		block;
		margin:			auto;
	}
}
@media (max-width: 1024px) {
	.img-wrapper {
		width:				90%;
	}
	#Testimonials .quote {
		padding: 			0 0.4em 1.31em;
	}
}
@media (max-width: 992px) {
	.break-setup,
	.break-reliably,
	.break-happening,
	.break-anywhere,
	.break-yourbiz,
	.break-control,
	.break-service,
	.break-ESS-leave {
		display:			none;
	}
	#Carousel1 .carousel-inner :nth-child(2n+1).item {
    	clear: 				both;
	}
	.contacts {
		display:			block;
	}
}
@media (max-width: 900px) {
	.temp-signin {
		display:			block;
		position:			absolute;
		top:				0.5em;
		right:				0.5em;
		text-align:			center;
	}
	.temp-signin .icon {
		display:			inline-block;
		margin:				auto;
		padding-left:		2px;
		text-align:			center;
		float:				right;
	}
	.temp-signin p {
		display:			inline-block;
		padding-top:		6px;
		float:				left;
	}
}
@media (min-width: 821px) {
	.break-start {
		display:			block;
	}
}
@media (max-width: 820px) {
	.break-big,
	.break-start,
	.break-mailbox,
	.break-paper, 
	.break-soon {
		display:			none;
	}
	.section-header {
    	padding-left:		1.5em;
		padding-right:		1.5em;
	}
	.section-header p {
    	padding-left:		1em;
		padding-right:		1em;
	}
    .section-header h1 {
        /*font-size:32px;*/
    }
	.glyph[class*='icon-'] {
		margin:				0px auto 10px;
		padding-top:		5px !important;
	}
	.col3 .item {
		width:				100%;
		display:			block;
	}
	#Plans .col3 .item {
		width:				33% !important;
	}
		.pricing-table .plan {
			padding:		1em 0;
		}

		.pricing-table .btn {
			width:			90%;
			padding-left:	10px;
			padding-right:	10px;
		}

	.col4 .item,
	#FAQ-plans .item:not(.widow),
	#Improve .item {
		width:				50% !important;
	}
	.col4 .item:nth-child(odd),
	#FAQ-plans .item:nth-child(odd),
	#Improve .item:nth-child(odd) {
		clear:				both !important;
	}
	.col4 .item:nth-child(even),
	#FAQ-plans .item:nth-child(even),
	#Improve .item:nth-child(even) {
		clear:				right !important;
	}

	#Subscribe br {
		display:			none;
	}
}
@media (max-width: 768px) {
	.break-colocate1,
	.break-mailbox,
	.break-paper,
	.break-soon {
		display:			none;
	}
	.break-btn {
		display:			inline-block;
	}
	.mega {
		font-size: 			3em !important;
		letter-spacing:		-0.02em;
	}
	.item p {
/*		padding-left:		1.5em;
		padding-right:		1.5em;*/
	}
	#Connected .item p {
		padding-left:		0.5em;
		padding-right:		0.5em;
	}
}
@media (max-width: 700px) {
	.break-running {
		display:			block;
	}
}
@media (max-width: 680px) {
	.break-colocate1,
	.break-setup,
	.break-reliably,
	.break-anywhere {
		display:			block;
	}
	.quoter .name,
	.quoter .role {
		display:			block;
	}
	.quoter .n-dash {
		display:			none;
	}
	#Testimonials .avatar {
		display:		block;
		width: 			60px;
		height:			60px;
		margin: 		0 auto;
	}
	h1 {
		font-size: 			1.8em !important;
	}
	.mega {
		font-size: 			2.8em !important;
		letter-spacing:		-0.02em;
	}
	#Header .container {
		padding-top:		0px;
	}
	.hero {
		padding-top:		2em;
	}
	.pricing-table .h2 {
		font-size: 			1.4em !important;
	}
	#Plans .col3 .item {
		width:				100% !important;
	}
	#Plans .plan img {
		display: 			none;
	}
	#Plans .plan .subhead.h6,
	#Plans .plan .features {
		font-size:			14px;}
	#Plans .plan .icon-plus {
		display:			inline-block;
	}
	#Plans .plan .price,
	#Plans .plan .per {
		display:			inline-block;
		padding:			0 !important;
	}
	#Plans .plan .price {
		margin-left:		0.2em;
		margin-right:		0.2em;
	}

/*-- JOURNEY --*/
	#Journey .item,
	#Streamline .item {
		display:			block;
		width:				100%;
		padding:			0em 2.5em 2em;
	}
	#Journey .item .glyph {
		width:				140px;
		height:				140px;
	}
	#Journey .item p,
	#Streamline .item p {
		font-size:			80%;
	}
	#Journey .para, 
	#Streamline .para {
		display:			block;
		width:				100%;
		padding:			2em 1.5em 0;
		text-align:			center;
	}
	#Jrny-Start {}
	#Jrny-Analyse .item, 
	#Streamline-Approved .item {
		float:				none;
	}
	#Jrny-Improve,
	#Streamline-Processed {
	}
	#Jrny-Path {			
		display:			none;
	}
}
@media (max-width: 580px) {
	.break-btn, 
	.break-pricing {
		display:			none;
	}
	#Signup-form input {
		text-align:			center;
		padding-left:		0px !important;
	}
	.field-wrap .icon {
		display:			none;
	}
	#CTA-Templates {
		max-width:			85% !important;
	}
}
@media (min-width: 511px) {
	.disclaimer br,
	.disc br {
		display:			none;
	}
}
@media (max-width: 510px) {
	#Plans .col2 .item {
		width:				100% !important;
	}
	.copilot {
		margin:				10px;
		width:				441px;
		height:				98px;
	}
}
@media (max-width: 480px) {
	.break-colocate1,
	.break-setup,
	.break-reliably,
	.break-anywhere,
	.break-simple {
		display:			none;
	}
	.mega {
		 font-size: 		2.375em !important; /*h1*/
		 letter-spacing:	-0.02em;
	}
	.hero .bg-white {
		height:				40px;
	}
	.price {
		display:			block;
		padding-top:		0 !important;
	}
	.item {
		padding-bottom:		40px;
	}
	.item .glyph {
    	margin: 			0px auto 15px;
	}
	.accordion .item .glyph {
		display:			none;
	}
	.accordion .item {
		padding-bottom:		0;
	}
	.col2 .item,
	.col3 .item,
	.col4 .item {
		width:				100% !important;
		display:			block;
	}
	.col3 .item ul {
    	padding:			0;
	}

	#Plans .plan .price {
		margin-left:0;
		font-size:1.6em;
	}
	#Plans .plan .price sup {
		font-size: 0.5em;
		top: -0.8em;
	}
	#Plans .plan .features {
		margin-top:0.2em;
	}
	#Plans .plan .per {
		position:relative;
		width:40%;
		top:-4px;
		text-align:left;
	}
	/* --- optional styling --- */
	#Plans .plan .per {
		width:auto;
		font-size:13px;
	}
	/* --- end optional --- */

	#FAQ-plans .item,
	#Improve .item { /* seperate override */
		width:				100% !important;
	}
	#Signup .links a {
		display:			block;
		width:				100%;
		padding:			10px;
	}
	#Signup-form input {
		min-width:			100%;
	}
	#Share-App .item a {
		padding: 			10px 20px;
	}
	#Share-App .item p {
		padding:			1px 0 5px;
		text-align:			left;
	}
	#Share-App .item h4 {
		margin-bottom:		5px;
		margin-right: 		3em;
		text-align:			left;
	}
	#Share-App .item h4 br {
		display:			none;
	}
	#Share-App .item .glyph {
		position:			absolute;
		right:				10px;
		bottom:				0;
		width:				54px;
		padding:			0;
		padding-top:		2px !important;
		font-size:			48px;
	}
	#Share-App .icon-linkedin {
		padding-left:		1.5% !important;
	}
}
@media (min-width: 401px) {
	.tel br {
		display:			none;
	}
}
@media (max-width: 400px) {
	.break-start {
		display:		block;
	}
	.mega {
		font-size: 		2.1em !important;
		letter-spacing:	-0.02em;
	}
	h1 {
		font-size: 		1.5em !important;
	}
	h2 {
		font-size: 		1.5em !important;
	}
	h3 {
		font-size: 		1.3em !important;
	}
	h4 {
		font-size: 		1.1em !important;
		line-height:	1.3;
	}
	.btn {
		min-width: 		55%;
		max-width: 		90%;
		padding: 		0.54em 0.7em 0.7em;
	}
	#Templates .pad-topbtm { /* necessary hack */
		padding:		60px 0 !important;
	}
	.pad-topbtm {
		padding:		60px 0;
	}
	.pad-top {
		padding-top:	60px;
	}
	.pad-btm {
		padding-bottom:	60px;
	}
	.section-header {
		margin-bottom:	40px;
	}
	.section-header p, 
	.item p {
		padding: 		0;
	}
	.carousel .glyph {
    	font-size: 		72px;
    	padding-top: 	0;
    	margin: 		0;
	}
	.carousel .item h4 {
    	margin: 		0px auto 10px;
	}
	.section-head.open span {
		display:none;
	}
	#Logo-wht, #Logo-blu {
		top:			8px;
		background-size:181px 39px !important;
		width:			181px;
		height:			39px;
	}
}

/* FROM THE APP */

.tag {
	display:			inline-block;
	border-radius:		4px;
	height:				auto;
	width:				auto;
	min-width:			100px;
	margin:				0;
	margin-bottom:		1px;
	padding:			0.4em 1em 0.6em;
	font-size:			0.81rem; /*13*/
	font-weight:		bold;
	text-transform:		uppercase;
	color:				#fff;
	background-color:	#d7d7d6;
	white-space:		nowrap;
	text-align:			center;
}
.desktop .tag:hover {
	color:				#fff !important;
}
.tagcell {
	font-family:		"UI Normal", Calibri, Helvetica, Arial, sans-serif;
	font-size:			1rem; /*16*/
	line-height:		1;
}

/* -----------------------------------------
	POPOVER
----------------------------------------- */
.popover {
	position: 			fixed;
	left: 				50%;
	top:				40%;
	-webkit-transform:	translate(-50%, -50%);
	-moz-transform:		translate(-50%, -50%);
	-ms-transform:		translate(-50%, -50%);
	-o-transform:		translate(-50%, -50%);
	transform: 			translate(-50%, -50%);
	width: 				80%;
	min-width:			320px;
	max-width:			620px;
	height:				60%;
	background-color:	#fff;
	box-shadow: 		0 0 30px rgba(0, 0, 0, 0.2);

	overflow:			hidden;
	z-index: 			102;

	visibility: 		hidden;
	backface-visibility:hidden;
	-webkit-backface-visibility:hidden;
	-moz-backface-visibility:hidden;

    transition:			all 0.6s ease;
	-webkit-transition:	all 0.6s ease;
    -moz-transition:	all 0.6s ease;
    -ms-transition:		all 0.6s ease;
    -o-transition:		all 0.6s ease;
}
.pop-open {
	visibility:			visible;
	top: 				50%;
}

/* appearance up to 640 */
@media (max-width: 640px) {
.popover {
	top:				-100%;
	width:				100% !important;
	height:				100% !important;
	-webkit-transform:	translate(-50%, 0);
	-moz-transform:		translate(-50%, 0);
	-ms-transform:		translate(-50%, 0);
	-o-transform:		translate(-50%, 0);
	transform: 			translate(-50%, 0);
}
.pop-open {
	visibility:			visible;
	top:				0;
}
}
#PopShortcut.popover {
	min-width:			320px;
	max-width:			600px;
	height:				50%;
}
#PopShortcut .content {
	padding:			2em 1.4em 1.2em;
}
#PopShortcut .glyph {
    font-size:			72px;
    color:				#99c942;
    padding-top:		20px;
}
#PopShortcut .close {
	display:			block;
	position:			fixed;
	top:				20px;
	right:				20px;
	z-index: 			89;
}

.jump-top {
	display:			block;
	position:			absolute;
	width:				auto;
	height:				auto;
	bottom:				20px;
	right:				20px;
	font-size:			13px;
	z-index:			190;
}

/*-- CHAT support --*/
#Chat {
	display:			block;
	position:			fixed;
	width:				auto;
	height:				auto;
	bottom:				10px;
	left:				10px;
	z-index:			200;
}
#Chat .close {
	display:			block;
	position:			absolute;
	top:				0;
	right:				0;
	padding:			5px 10px;
	z-index:			199;
	color:				#ccc;
	cursor:				pointer;
}
#Chat .close:hover {
	color:				#2c4a5b;
}
#Chat .note {
	display:			block;
	position:			relative;
	margin-left:		35px;
	padding:			16px 20px 16px 12px;
	width:				205px;
	height:				auto;
	background-color:	white;
	color:				#2c4a5b;
	border:				1px solid #f5f5f5;
	-webkit-box-shadow: 0 12px 16px 0 rgba(0,0,0,0.2);
			box-shadow: 0 12px 16px 0 rgba(0,0,0,0.2);
			
	font-size:			13px !important;
	line-height:		1.4;
}
#Chat:hover * {
	text-decoration: none !important;
}

#Chat .avatar {
	-webkit-box-shadow: 0 8px 16px 0 rgba(0,0,0,0.3);
			box-shadow: 0 8px 16px 0 rgba(0,0,0,0.3);
}

@media (max-width: 640px){
#Chat {
	width:				60%;
	bottom:				0;
	left:				0;
	padding:			15px;
}
#Chat .close {
	padding:			10px;
	z-index:			199;
	margin:				10px 15px;
}
#Chat .note {
	margin-left:		0;
	padding:			10px 30px 12px 45px;
	width:				100%;
	z-index:			197;
}
#Chat .avatar {
	z-index:			198;
	position:			absolute;
	bottom:				5px;
	left:				5px;
}
}
@media (max-width: 480px){
#Chat {
	width:				100%;
}
#Chat .note br {
	display:			none;
}
}



/*------------------------
	Scrolling animations
-------------------------*/

.scrollimation.fade-in{
	opacity:0;
	-webkit-transition:opacity 0.6s ease-out;
	transition:opacity 0.6s ease-out;
}
.scrollimation.fade-in.in{
	opacity:1;
}
.scrollimation.scale-in{
	opacity:0;
	-webkit-transform: scale(0.5);
	-moz-transform: scale(0.5);
	-ms-transform: scale(0.5);
	transform:scale(0.5);
	-webkit-transition: -webkit-transform .6s cubic-bezier(.17,.89,.67,1.57), opacity .6s ease-out;
	transition: transform .6s cubic-bezier(.17,.89,.67,1.57), opacity .6s ease-out;
}
.scrollimation.scale-in.in{
	opacity:1;
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	transform:scale(1);
}
.scrollimation.fade-right{
	opacity:0;
	-webkit-transform: translateX(-100px);
	-moz-transform: translateX(-100px);
	-ms-transform: translateX(-100px);
	transform:translateX(-100px);
	-webkit-transition: -webkit-transform .4s ease-out,opacity .4s ease-out;
	transition: transform .4s ease-out,opacity .4s ease-out;
}
.scrollimation.fade-right.in{
	opacity:1;
	-webkit-transform: translateX(0px);
	-moz-transform: translateX(0px);
	-ms-transform: translateX(0px);
	transform:translateX(0px);
}
.scrollimation.fade-left{
	opacity:0;
	-webkit-transform: translateX(100px);
	-moz-transform: translateX(100px);
	-ms-transform: translateX(100px);
	transform:translateX(100px);
	-webkit-transition: -webkit-transform .4s ease-out,opacity .4s ease-out;
	transition: transform .4s ease-out,opacity .4s ease-out;
}
.scrollimation.fade-left.in{
	opacity:1;
	-webkit-transform: translateX(0px);
	-moz-transform: translateX(0px);
	-ms-transform: translateX(0px);
	transform:translateX(0px);
}
.scrollimation.fade-up{
	opacity:0;
	-webkit-transform: translateY(100px);
	-moz-transform: translateY(100px);
	-ms-transform: translateY(100px);
	transform:translateY(100px);
	-webkit-transition: -webkit-transform .4s ease-out,opacity .4s ease-in;
	transition: transform .4s ease-out,opacity .4s ease-in-out;
}
.scrollimation.fade-up.in{
	opacity:1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-ms-transform: translateY(0px);
	transform:translateY(0px);
}
.scrollimation.d1{
	transition-delay:.2s;
}
.scrollimation.d2{
	transition-delay:.4s;
}
.scrollimation.d3{
	transition-delay:.6s;
}
.scrollimation.d4{
	transition-delay:.8s;
}
.touch .scrollimation.fade-in{
	opacity:1;
}
.touch .scrollimation.scale-in{
	opacity:1;
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	transform:scale(1);
}
.touch .scrollimation.fade-right{
	opacity:1;
	-webkit-transform: translateX(0px);
	-moz-transform: translateX(0px);
	-ms-transform: translateX(0px);
	transform:translateX(0px);
}
.touch .scrollimation.fade-left{
	opacity:1;
	-webkit-transform: translateX(0px);
	-moz-transform: translateX(0px);
	-ms-transform: translateX(0px);
	transform:translateX(0px);
}
.touch .scrollimation.fade-up{
	opacity:1;
	-webkit-transform: translateY(0px);
	-moz-transform: translateY(0px);
	-ms-transform: translateY(0px);
	transform:translateY(0px);
}

/* -- spin --*/
.spin {
  -webkit-animation: spin 1s infinite linear;
  -moz-animation: spin 1s infinite linear;
  -o-animation: spin 15s infinite linear;
  animation: spin 1s infinite linear;
}
@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg);
  }
}
@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
  }
}
@-moz-keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
  }
  100% {
    -moz-transform: rotate(359deg);
  }
}
@-o-keyframes spin {
  0% {
    -o-transform: rotate(0deg);
  }
  100% {
    -o-transform: rotate(359deg);
  }
}