@media only screen and (min-width : 0px) and (max-width : 800px) { 
	
}



/* *************************** */
/* Eric Meyer’s Reset CSS 2.0  */
/* *************************** */

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, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1.4;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}



/* =========== 
	CSS Begin
   =========== */
* {
	box-sizing: border-box;
}

body {
	background-image: url( '/images/site/blue-corner.png' );
	background-repeat: no-repeat;
	background-position: center top;
	font-family: 'Roboto', sans-serif;
	color: #222222;
}

h1, .showcase-title {
	font-size: 2.5em;
	margin-bottom: 20px;
	font-weight: 900;
}

h2 {
	line-height: 2em;
}

p {
	line-height: 2em;
	margin-bottom: 10px;
}

p:last-of-type {
	margin-bottom: 0px;
}

a {
	color: #11b1ff;
}

strong {
	font-weight: bold;
}

img {
	max-width: 100%;
}

.page {
	max-width: 1200px;
	margin: 0px auto;
	min-height: 1000px;
	position: relative;
	padding: 20px;
}

.whitepage {
	background: rgba( 255, 255, 255, .9 );
	color: #222222;
	padding: 50px;
	border: 1px solid #dddddd;
	border-radius: 20px;
	margin-top: 0px !important;
}

.big-title {
	font-size: 2.5em;
	margin: 20px 0px;
	font-weight: 900;
}



@media only screen and (min-width : 0px) and (max-width : 800px) { 
	
	body {
		background-position: 0px 0px;
	}
	
	h1 {
		font-size: 2em;
		line-height: 1.2em;
	}
	
	.whitepage {
		padding: 20px;
		border-radius: 10px;
		border: 0px solid white;
	}
	
	.hide-on-mobile {
		display: none;
	}
}



/* ================
	widgets and ui
   ================ */
.textfield, input[type=text], input[type=password] {
	border: 1px solid #aaaaaa;
	padding: 5px 10px;
	color: #333333;
	border-radius: 2px;
	box-sizing: border-box;
	line-height: 20px;
	margin: 2px;
}

.textfield:focus, input[type=text]:focus {
	border-color: #1e96ff;
}

.feedbackPanelERROR {
	color: red;
}

.pk-link {
	text-decoration: underline;
	cursor: pointer;
}

input[type="submit"] {
	cursor: pointer;
}


/* =================
    Popup overlay
   ================= */
.newoverlaywrapper {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100vh;
	background-color: rgba(0,0,0,.8);
	z-index: 3;
	display: grid;
	align-items: center;
	justify-items: center;
	color: #333333;
}

.newoverlay {
	background-color: white;
	padding: 50px;
	box-sizing: border-box;
	min-width: 50%;
	max-width: 70%;
	max-height: 90vh;
	border-radius: 5px;
	box-shadow: 2px 2px 5px black;
	overflow-y: auto;
	box-sizing: border-box;
}





/* ===========
    Buttons
   =========== */
.button {
	border: 1px solid #dddddd;
	padding: 8px 15px;
	border-radius: 4px;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	text-align: center;
	justify-content: center;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.login-button {
	background-color: white;
	border-color: white;
	color: #222222;
	padding: 4px 15px;
}

.button img {
	height: 15px;
	margin-right: 10px;
}

@media only screen and (min-width : 0px) and (max-width : 800px) { 
	.login-button {
		background-color: #1a237e !important;
		border-color: #1a237e !important;
		color: white !important;
	}	
}

.white-button {
	background-color: white;
	border-color: white;
	color: #222222;
}

.dark-button {
	background-color: #1a237e;
	border-color: #1a237e;
	color: white;
}

.pink-button {
	background-color: #ee1d4d;
	border-color: #ee1d4d;
	color: white;
}

.yellow-button {
	background-color: #ffbd45;
	border-color: #ffbd45;
	color: #222222;
}

.block-link {
	display: inline-block;
	margin: 5px 20px;
}










/* ============
	Navigation
   ============ */
header {
	
	width: 100%;
	position: relative;
	z-index: 10;
}

header .logo img {
	height: 40px;
}

header .logo a {
	display: block;
}

nav {
	position: absolute;
	text-align: left;
	top: 100%;
	left: 0;
	transform: scale(1,0);
	transform-origin: top;
	transition: transform 400ms ease-in-out;
	background-color: white;
	width: 100%;
}

nav ul {
	
}

nav li {
	padding-top: .5em;
	padding-bottom: .5em;
	padding-left: 1em;
	border-bottom: 1px solid #dddddd;
}

nav a {
	color: #222222;
	text-decoration: none;
	font-size: 1rem;
	opacity: 0;
	transition: opacity 150ms ease-in-out;
}

nav a:hover {
	
}

.nav-toggle:checked ~ nav {
	transform: scale(1,1);
}

.nav-toggle:checked ~ nav a {
	opacity: 1;
	transition: opacity 250ms ease-in-out 250ms;
}

.nav-toggle {
	display: none;
}

.nav-toggle-label {
	position: absolute;
	top: 0;
	right: 0;
	margin-left: 1em;
	height: 100%;
	display: flex;
	align-items: center;
}

.nav-toggle-label span,
.nav-toggle-label span::before,
.nav-toggle-label span::after {
	display: block;
	background: white;
	height: 4px;
	width: 2em;
	border-radius: 2px;
	position: relative;
}

.nav-toggle-label span::before,
.nav-toggle-label span::after {
	content: '';
	position: absolute;
}

.nav-toggle-label span::before {
	bottom: 10px;
}

.nav-toggle-label span::after {
	top: 10px;
}

.buy-tickets-icon {
	height: 15px;
}


@media screen and (min-width: 990px) {

	.nav-toggle-label {
		display: none;
	}
	
	header {
		display: grid;
		grid-template-columns: 1fr 0fr 4fr 0fr;
	}
	
	.logo {
		grid-column: 1 / 2;
		justify-content: left;
	}
	
	nav {
		position: static;
		grid-column: 3 / 4;
		display: flex;
		justify-content: flex-end;
		align-items: center;
		transform: scale(1,1);
		background-color: transparent;
	}
	
	nav a {
		color: white;
		opacity: 1;
		position: relative;
	}
	
	nav ul {
		display: flex;
		justify-conten: flex-end;
		align-items: center;
	}
	
	nav li {
		margin-left: 2em;
		margin-bottom: 0;
		padding: 0;
		border: 0px solid white;
	}
	
	header .logo img {
		height: 50px;
	}
}



.callout {
	background-color: #1a237e;
	color: white;
	text-align: center;
	padding: 5px;
	position: sticky;
	top: 0;
	z-index: 100;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0px 0px 5px rgba(26, 35, 126, .5);
}

.callout a {
	color: white;
}

.callout img {
	height: 40px;
	margin-right: 10px;
}

@media only screen and (min-width : 0px) and (max-width : 800px) {
.callout {
	font-size: .8em;
}	
}


/* =================
	Common Elements 
   ================= */
.pk-title {
	font-size: 1.5em;
}

.pk-subtitle {
	margin-bottom: 20px;
}




/* ==========
    Showcase 
   ========== */  
 .showcase {
 	display: grid;
 	grid-template-columns: 1fr 1fr;
 	gap: 20px;
 	margin-top: 100px;
 	color: white;
 }
   
.showcase > * {
	background: auto;
}
   
.default-showcase {
	margin-bottom: 50px;
}
   
.headline {

}

.main-image {
	
}

.main-image img {
	width: 100%;
}

.main-image-default {
	text-align: right;
}

.main-image-default img {
	width: 400px;
	max-width: 100%;
}

.special-image {
	text-align: right;
}

.special-image img {
	border-radius: 250px;
	box-shadow: 0px 0px 5px black;
	border: 5px solid white;
	width: 500px;
	height: 500px;
	object-fit: cover;
}

.buttons {
	margin-top: 20px;
}

.buttons > * {
	margin: 0px 10px 10px 0px;
}

.extra-links {
	margin-top: 20px;
	display: flex;
	align-items: center;
}

.extra-link-current {
	
}

.extra-links a {
	color: white;
}

.extra-link-icon {
	height: 20px;
	margin-right: 10px;
}

.embedded-highlight-link {
	margin: 20px 0px;
}

.question-link-icon {
	height: 20px;
	margin-left: 10px;
	cursor: pointer;
}

.mobile-buy-link {
	display: none;
}


@media only screen and (min-width : 0px) and (max-width : 800px) { 
	.showcase {
		grid-template-columns: 1fr;
		margin-top: 50px;
		gap: 50px 0px;
	}
	
	.homepage-showcase {
		margin-top: 20px !important;
	}
	
	.mobile-buy-link {
		display: block;
	}
	
	.mobile-buy-link img {
		height: 15px;
		margin-right: 10px;
	}
	
	.mobile-buy-link a {
		width: 100%;
		background-color: rgba( 255, 255, 255, .3 );
		color: white;
		text-decoration: none;
		padding: 5px;
		text-align: center;
		margin-top: 20px;
		border-radius: 5px;
		display: flex;
		align-items: center;
		justify-content: center;
	}
}







/* ==========
    Sections
   ========== */  
.section {
	margin: 100px 0px;
}

.wide-section {
	padding: 20px;
	width: 100vw;
	position: relative;
	margin-left: calc(-50vw + 50% - 8px);
	text-align: center;
}

.center-section {
	text-align: center;
}

.center-section img {
	max-width: 100%;
}

.note-section {
	display: grid;
	grid-template-columns: 1fr 2fr;
}

.divider { 
	height: 1px;
	background: #dddddd;
	padding: 0px;
	margin-top: 150px;
	margin-bottom: 150px;
}

.tight-divider {
	margin-top: 50px;
	margin-bottom: 50px;
}

@media only screen and (min-width : 0px) and (max-width : 800px) { 
	.wide-section {
		margin-left: calc(-50vw + 50%);
	}
	
	.note-section {
		grid-template-columns: 1fr;
	}
	
	.divider {
		margin-top: 50px;
		margin-bottom: 50px;
	}
}







/* ==============
   Employee Notes
   ============== */

.employee-note {
	background-color: #dddddd;
	background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(221,221,221,1) 100%);
	text-align: right;
	padding: 20px;
	border-radius: 10px;
	display: grid;
	grid-template-colums: 4fr 1fr;
	gap: 5px 20px;
	align-content: start;
	grid-template-areas:
		"title ---"
		"quote photo"
		"name  photo";
	
}

.employee-note-right {
	
}

.note-title {
	grid-area: title;
	display: flex;
	align-items: center;
	justify-content: end;
	font-size: 1.5em;
	color: #2d69ad;
}

.note-quote {
	grid-area: quote;
	font-style: italic;
}

.note-name {
	grid-area: name;
	font-weight: bold;
}

.note-photo {
	grid-area: photo;
	width: 100px;
	border-radius: 50px;
	border: 2px solid white;
}

.note-icon {
	width: 30px;
	margin-right: 10px;
}


@media screen and (min-width: 1400px) {
	.employee-note {
		margin-right: -100px;
	}	
}

@media only screen and (min-width : 0px) and (max-width : 800px) { 
	.employee-note {
		margin-right: 0px;
	}
}







footer {
	background-image: url( '/images/site/blue-corner-footer.png' );
	background-repeat: no-repeat;
	background-position: 0px 10px;
	font-family: 'Roboto', sans-serif;
	color: #222222;
	height: 550px;
	width: 100vw;
	position: relative;
	margin-left: calc(-50vw + 50% - 8px);
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
}

.footer-buttons {
	padding-top: 100px;
}

.footer-buttons a {
	margin: 10px;
}

.footer-bottom {
	position: absolute;
	bottom: 0;
	left: 0;
	background-color: #0361b2;
	color: white;
	width: 100%;
	height: 100px;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
}

.footer-bottom a {
	margin: 0px 10px;
	color: white;
}


@media only screen and (min-width : 0px) and (max-width : 800px) {
	footer {
		background-position: 0px -150px;
		height: 300px;
		margin-left: calc(-50vw + 50%);
	}
	
	.footer-buttons {
		padding-top: 0px;
	}
	
	.footer-bottom {
		font-size: .8em;
		height: 80px;
		padding: 10px;
	}
	
	.copyright {
		flex-basis: 100%;
	}
}














/* =============
    Top Section 
   ============= */
.top-section {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 50px;
}

.top-section > * {
	background: auto;
}

.top-block {
	display: grid;
	grid-template-columns: 1fr 3fr;
	grid-template-areas:
	  "img title"
	  "img text"
	  "img link";
	gap: 1px 20px;
	align-content: start;
}

.top-block > * {
	background-color: auto;
}

.top-img {
	width: 130px;
	grid-area: img;
}

.top-title {
	grid-area: title;
	font-size: 2em;
	font-weight: 900;
}

.top-text {
	grid-area: text;
}

.top-link {
	grid-area: link;
	padding-top: 10px;
}


@media only screen and (min-width : 0px) and (max-width : 800px) { 
	.top-section {
		grid-template-columns: 1fr;
	}
	
	.top-block {
		grid-template-columns: .1fr 1fr;
		grid-template-areas:
		  "img title"
		  "text text"
		  "link link";
		gap: 20px;
	}
	
	.top-img {
		width: 50px;
		grid-area: img;
	}
}








/* =============
    Testimonials
   ============= */
.testimonial-section {
	background: #1a237e;
	color: white;
	padding: 50px 20px;
	margin-bottom: 200px;
}

.testimonial-card {
	width: 1000px;
	margin: 0px auto;
	display: grid;
	grid-template-columns: 1fr 3fr;
	align-items: center;
}
   
.test-img {
	width: 200px;
	border-radius: 100px;
	border: 3px solid white;
}

.test-content {
	text-align: left;
}

.test-title {
	font-size: 30px;
	font-weight: 900;
}
   
.test-quote {
	line-height: 2em;
	font-family: 'Raleway', sans-serif;
	font-style: italic;
}
   
.test-name {
	margin-top: 20px;
	color: #ee1d4d;
	text-transform: uppercase;
	font-weight: 900;
	font-size: 1.2em;
}
   
.test-org {
	
}
   
.show-more-testimonials {
	margin-top: 20px;
	cursor: pointer;
}

.more-testimonials {
	margin-top: 50px;
	display: none;
}

.more-testimonials .testimonial-card {
	margin-bottom: 50px;
}

.more-testimonials-shown {
	display: block !important;
}
   
@media only screen and (min-width : 0px) and (max-width : 800px) { 
	.testimonial-card {
		width: 100%;
		grid-template-columns: 1fr;
		justify-content: center;
	}
	
	.test-img {
		margin: 0px auto;
		margin-bottom: 20px;
	}
	
	.test-title {
		display: none;
	}
}
   
   
   
   
   
/* ===============
   Integrations
   =============== */
.integrate-section {
	
}

.integrate-logos {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
	gap: 50px 20px;
	opacity: .8;
	width: 80%;
	margin: 50px auto;
}

.integrate-logos img {
	width: 100%;
}
   
@media only screen and (min-width : 0px) and (max-width : 800px) { 
	.integrate-logos {
		grid-template-columns: 1fr 1fr;
		gap: 20px;
	}
}
   
   
   
   
   
   
   
   
   
   
   
   
   
/* ===============
   Integrations
   =============== */
.marketing-section {
	
}

.marketing-section .big-title {
	font-weight: 900;
}   

.marketing-highlights {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
	margin-top: 50px;
}

.highlight {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.highlight > * {
	background-color: auto;
}

.highlight-icon {
	width: 130px;
	grid-area: icon;
}
   
.highlight-title {
	font-size: 1.5em;
	grid-area: title;
}

.highlight-box {
	padding: 20px;
	text-align: left;
	margin-top: 10px;
	flex-grow: 1;
	background: #eeeeee;
	grid-area: box;
}

.highlight-logo {
	max-width: 300px;
	display: block;
	margin: 0px auto;
	margin-top: 30px;
}
   
.marketing-triplet {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 20px;
	margin-top: 50px;
}

.marketing-triplet .highlight-icon {
	width: 75px;
}
   
@media only screen and (min-width : 0px) and (max-width : 800px) { 
	.marketing-highlights {
		grid-template-columns: 1fr;
	}
	
	.marketing-triplet {
		grid-template-columns: 1fr;
	}
	
	.marketing-triplet .highlight {
		display: grid;
		text-align: left;
		grid-template-columns: 1fr 5fr;
		grid-template-areas:
			"icon title"
			"box  box";
	}
	
	.marketing-triplet .highlight .highlight-icon {
		width: 50px;
	}
	
	.marketing-triplet .highlight > * {
		background: auto;
	}
}
   
   
   
   
/* ===========
   API Section
   =========== */
.api-section {
	position: relative;
}

.api-background {
    position: absolute;
    right: -50px;
    bottom:-100px;
    width: 50%;
    height: auto;
    opacity: .5;
    z-index: 1;
}

   
.api-grid {
	z-index: 2;
	position: relative;
	max-width: 900px;
	margin: 0px auto;
	display: grid;
	grid-template-columns: 1fr 10fr;
	gap: 0px 50px;
	align-content: start;
	grid-template-areas:
		"----- title"
		"icons content";
}

.api-grid > * {
	background: auto;
}

.api-title {
	grid-area: title;
	margin: 0;
}

.api-icons {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	grid-area: icons;
}
   
.api-icons img {
	width: 75px;
	margin: 20px;
}

.api-content {
	grid-area: content;
}

.api-links {
	padding-top: 20px;
}

.api-links a {
	margin-right: 20px;
}


@media only screen and (min-width : 0px) and (max-width : 800px) {
	.api-background {
	    bottom: -20px;
	    right: 0;
	    width: 90%;
	    opacity: .2;
	}
	
	.api-grid {
		gap: 1px;
		grid-template-columns: 1fr 4fr;
		grid-template-areas:
			"title icons"
			"content content";
		
	}
	
	.api-grid > * {
		background: auto;
	}
	
	.api-icons img {
		width: 40px;
		margin: 0px 20px;
	}
	
	.api-icons {
		justify-content: start;
		flex-direction: row;
	}
}






/* ===============
   Widget Section
   =============== */
.widget-section {

}
   
.widget-grid {
	gap: 0px 50px;
	margin: 0px auto;
	display: grid;
	grid-template-columns: 5fr 5fr 1fr;
	grid-template-areas:
		"image content icons";
}

.widget-grid > * {
	background: auto;
}

.widget-title {
	grid-area: title;
	margin: 0;
}

.widget-icons {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	grid-area: icons;
}
   
.widget-icons img {
	width: 75px;
	margin: 20px;
}

.widget-content {
	grid-area: content;
}

.widget-image {
	width: 100%;
	margin-top: 40px;
}

.widget-links {
	padding-top: 20px;
}

.widget-links a {
	margin-right: 20px;
}


@media only screen and (min-width : 0px) and (max-width : 800px) {
	.widget-background {
	    bottom: -20px;
	    right: 0;
	    width: 90%;
	    opacity: .2;
	}
	
	.widget-grid {
		gap: 1px;
		grid-template-columns: 1fr;
		grid-template-areas:
			"icons"
			"content"
			"image";
		
	}
	
	.widget-grid > * {
		background: auto;
	}
	
	.widget-icons img {
		width: 75px;
		margin: 0px 20px;
	}
	
	.widget-icons {
		justify-content: center;
		flex-direction: row;
		margin-bottom: 20px;
	}
}







/* ==================
   Left/Right Section
   ================== */
.left-right-section {
	display: grid;
	grid-template-columns: 1fr 1fr;
	grid-template-areas:
		"left right";
	align-items: center;
	gap: 50px;
}

.heavy-left {
	grid-template-columns: 3fr 1fr;
}

.left-content {
	grid-area: left;
}

.right-content {
	grid-area: right;
}

.left-content img, .right-content img {
	max-width: 100%;
	display: block;
} 

@media only screen and (min-width : 0px) and (max-width : 800px) {

.left-right-section {
	text-align: center;
}
	
.left-right-section {
	grid-template-columns: 1fr;
	grid-template-areas:
		"left"
		"right";
}

.heavy-left {
	grid-template-columns: 1fr;
}
	
.text-on-right-section {
	grid-template-columns: 1fr;
	grid-template-areas:
		"right"
		"left";
}
	
}



/* ===============
   Image Section
   =============== */
.image-section {
	
}

.image-section img {
	max-width: 100%;
}

.rounded-image {
	border-radius: 10px;
}

.caption {
	font-size: .8em;
	color: #888888;
	text-align: center;
	font-style: italic;
}


/* =======================
    Live streaming virtual
   ======================= */
.early-access {

}
   
.design-virtual-event-section {
	margin-top: 150px;

}

.design-image {
	
}

.design-image-desktop {
	display: block;
}

.design-image-mobile {
	display: none;
}

.virtual-marketing-section {
	gap: 150px;
}

.virtual-marketing-section .vicon {
	
}

.virtual-marketing-section .vicon1 {
	grid-area: icon1;
}

.virtual-marketing-section .vicon2 {
	grid-area: icon2;
}

.virtual-marketing-section .vicon3 {
	grid-area: icon3;	
}

.virtual-marketing-section .vtext {
	grid-area: text;
	text-align: center;
}

.virtual-marketing-section .vlogo {
	grid-area: logo;
	margin: 0px auto;
}

.virtual-marketing-images {
	display: grid;
	gap: 20px;
	grid-template-columns: 1fr 1fr 1fr;
	grid-template-areas:
		"icon1 icon2 icon3"
		"text text text"
		"logo logo logo";
}

.virtual-syndication {
	margin-top: 20px;
}

.virtual-syndication-logos {
	
}

.virtual-syndication-logos img {
	height: 30px;
	display: inline-block;	
}


.virtual-timeline {
	margin-top: 50px;
}

.virtual-timeline-mobile {
	display: none;
}


@media only screen and (min-width : 0px) and (max-width : 800px) {
	.virtual-marketing-section {
		gap: 50px;
	}
	
	.virtual-timeline {
		display: none;
	}
	
	.virtual-timeline-mobile {
		display: block;
	}
	
	.design-image-desktop {
		display: none;
	}
	
	.design-image-mobile {
		display: block;
	}
}



/* =============
   Services row
   ============= */
.services-row {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	align-items: stretch;
	gap: 10px;
}

.services-row > * {
	
}

.service {
	text-align: center;
	background: #f3f3f3;
	padding: 20px;
}

.service img {
	max-width: 100%;
	width: 50px;
	margin: 0px auto;
}


@media only screen and (min-width : 0px) and (max-width : 800px) { 

.services-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	align-items: stretch;
	gap: 10px;
}
	
}


/* ======================
	Features main section
   ====================== */
.features-main-section {
	
}

.feature-main {
	display: grid;
	grid-template-columns: 1fr 5fr;
	grid-template-areas:
		"icon title"
		"icon text";
	grid-template-rows: auto 1fr; 
	gap: 1px 50px;
	margin-bottom: 50px;
	align-content: start;
}

.feature-main > * {
	background: auto;
}

.feature-main p {
	margin: 0;
}

.feature-main-icon {
	grid-area: icon;
	width: 100%;
}

.feature-main-title {
	grid-area: title;
	font-size: 2em;
	font-weight: 900;
}

.feature-main-text {
	grid-area: text;
}

@media only screen and (min-width : 0px) and (max-width : 800px) {
	.feature-main {
		display: grid;
		grid-template-columns: 2fr 4fr;
		grid-template-rows: auto;
		grid-template-areas:
			"icon title"
			"text text";
		gap: 0px 10px;
		align-items: center;
	}
	
	.feature-main > * {
		background: auto;;
	}
}













/* ================
	Features grid
   ================ */
.features-title {
	font-size: 2em;
	border-bottom: 1px solid #dddddd;
	margin-bottom: 10px;
}
   
.feature-grid {
	display: grid;
	grid-template-columns: 2fr 2fr 1fr;
	gap: 1px;
}

.feature-grid > * {
	background: auto;
} 

.feature-grid-item {
	padding: 20px 0px;;
}

@media only screen and (min-width : 0px) and (max-width : 800px) {
	.feature-grid {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 10px;
	}
}








/* ==================
	Features Verbose
   ================== */
.features-verbose {
	
}

.features-verbose .features-title {
	margin-bottom: 30px;
}

.feature-verbose-item {
	margin-bottom: 20px;
}

.feature-versbose-title {
	font-weight: bold;
}

.feature-verbose-text {
	
}









/* =======================
	Pricing table desktop
   ======================= */
.pricing-main-image img {
	margin-top:-50px;
}
   
.pricing-table-desktop {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	gap: 20px;
	min-width: 800px;
	margin-left: 10%; 
	margin-right: 10%;
}

.pricing-column {
	display: flex;
	flex-direction: column;
	gap: 1px;
	text-align: center;
	justify-content: center;
}

.pricing-column > * {
	background: auto;
	height: 30px;
	border-bottom: 1px solid #dddddd;
	margin-top: auto;
  	margin-bottom: auto;
	display: flex;
	align-items: center;
	justify-content: center;
}

.pricing-column-labels {
	text-align: left;
}

.pricing-column-labels .pricing-row,
.pricing-column-labels .pricing-tall-row {
	justify-content: start;
}

.pricing-row {
	height: 40px;
}

.pricing-row-callout {
	font-weight: 900;
}

.pricing-button-row {
	height: 40px;
	border: 0px solid white;
}

.pricing-tier-title {
	font-weight: 900;
	font-size: 1.2em;
	border-bottom: 10px solid #222222;
	padding-bottom: 10px;
	height: 50px;
}

.pricing-column-labels .pricing-tier-title {
	border: 0px solid white;	
}

.pricing-tier-desc {
	height: 75px;
	border: 0px solid white;
}

.pricing-tall-row {
	height: 50px;
}

.pricing-checkmark {
	height: 50%;
}

.custom-tier {
	color: #1a237e;
	border-color: #1a237e;
}

.pricing-amount {
	font-weight: 900;
	color: #00b95e;
}

.pricing-amount-desc {
	font-size: .8em;
	font-weight: normal;
	display: flex;
	align-items: center;
	color: #00b95e;
}

.pricing-amount-desc .question-link-icon {
	height: 15px;
}

.hidden-help {
	display: none;
}

@media only screen and (min-width : 0px) and (max-width : 800px) {
	.pricing-main-image img {
		margin-top: 0px;
	}
	
	.pricing-table-desktop {
		display: none;
	}
}





/* ======================
	Pricing table mobile
   ====================== */
@media only screen and (min-width : 800px) {
	.pricing-table-mobile {
		display: none;		
	}
}
   
@media only screen and (min-width : 0px) and (max-width : 800px) {
   
	.pricing-table-mobile {
		
	}
	
	.pricing-mobile-header {
		border-bottom: 1px dashed #dddddd;
		margin-bottom: 50px;
		text-align: center;
	}
	
	.pricing-mobile-title {
		font-weight: 900; 
		font-size: 2em;
	}
	
	.pricing-mobile-tier {
		border-bottom: 1px solid #dddddd;
		margin-bottom: 50px;
	}
	
	.pricing-mobile-fee {
		font-weight: bold;
		color: #00b95e;
	}
	
	.pricing-mobile-tier .dark-button {
		margin-top: 20px;
	}
	
	.mobile-options-grid {
		display: grid;
		grid-template-columns: 1fr 1fr;
		margin: 20px 0px;
		gap: 1px;
		align-items: center;
	}
	
	.mobile-options-grid div:nth-child(odd) {
		background-color: #f3f3f3;
		padding: 5px;
	}
	
	.mobile-options-grid div:nth-child(even) {
		text-align: center;
	}
	
	.pricing-table-mobile .pricing-checkmark {
		height: 20px;
	}

}













/* ===================
	Spark marketing
   =================== */
.spark-highlights-section {
	
}

.spark-highlights {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 50px;
	margin-bottom: 100px;
}

.spark-highlight {
	
}
   
.spark-highlight-icon {
	width: 100px;
	grid-area: icon;
}
   
.spark-highlight-title {
	font-size: 1.5em;
	font-weight: 900;
	grid-area: title;
}

.spark-highlight-text {
	margin-top: 20px;
	grid-area: text;
}

.spark-screenshot {
	background-color: #dddddd;
	padding: 20px;
	border-radius: 20px;
	border: 1px solid #bbbbbb;
}

.spark-screenshot img {
	width: 100%;
	border-radius: 5px;
}

.pricing-text {
	color: #00b95e;
}

@media only screen and (min-width : 0px) and (max-width : 800px) { 
	.spark-highlights {
		grid-template-columns: 1fr;
		gap: 50px;
	}
	
	.spark-highlight {
		display: grid;
		grid-template-columns: 1fr 3fr;
		grid-template-areas:
			"icon title"
			"text text";
		gap: 0px 20px;
		text-align: left;
	}
}



/* ==================
	Spark testimonial
   ================== */
.spark-testimonial-section {
	font-size: 2em;
	font-weight: 900;
	padding: 100px 20%;
}

.spark-num {
	color: #cb163a;
}




/* ============
	Spark Vs.
   ============ */
.spark-vs-section {
	text-align: center;	
}

.spark-vs {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 20px;
	align-items: center;
	margin-bottom: 100px;
}

.spark-vs > * {
	background: auto;
} 

.spark-vs-block {
	text-align: center;
}

.spark-vs-icon {
	height: 100px;
}

.spark-vs-number {
	font-size: 6em;
	font-weight: 900;
}

.spark-vs-text {
	font-size: 2em;
	color: #aaaaaa;
}

@media only screen and (min-width : 0px) and (max-width : 800px) { 

	.spark-vs {
		display: grid;
		grid-template-columns: 1fr;
		gap: 20px;
		align-items: center;
		margin-bottom: 100px;
	}
	
.spark-vs-number {
	font-size: 4em;
	font-weight: 900;
}
}

















/* ====================
    Support Page
   ==================== */
.support-section .big-title {
	border-bottom: 1px solid #dddddd;
	margin-bottom: 50px;
}
   
.support-ticket-buyers-section {

}

.support-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 50px;
}

.support-grid > * {
	background: auto;
}

.support-block {
	display: grid;
	grid-template-columns: 1fr 5fr;
	grid-template-areas:
		"icon title"
		"icon text";
	gap: 1px 20px;
	align-content: start;
}

.support-block > * {
	background: auto;
}

.support-icon {
	width: 100%;
	grid-area: icon;
}

.support-title {
	grid-area: title;
	font-size: 1.2em;
	font-weight: bold;
}

.support-text {
	grid-area: text;
}



@media only screen and (min-width : 0px) and (max-width : 800px) { 
	.support-grid {
		display: grid;
		grid-template-columns: 1fr;
		gap: 50px;
	}
}





/* ====================
    Support Portal
   ==================== */
.covid-message {
	margin-top: 20px;
	background: rgba( 255, 255, 255, .4 );
	padding: 15px 20px;
	color: #222222;
	border-radius: 2px;
	font-size: .8em;
}

.support-portal-section {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 50px;
}

.support-option {
	text-align: center;
	background: #f3f3f3;
	padding: 50px;
}

.support-option .big-title{
	border-bottom: 0px solid white;
	margin-bottom: 10px;	
}

.support-option-subtitle {
	margin-bottom: 50px;
}

.support-option a {
	width: 100%;
}

.support-option input {
	width: 100%;
}

.support-option button {
	width: 100%;
	font-size: 1em;
	margin-top: 10px;
}

.support-option .button-desc {
	font-size: .8em;
}

.support-login-option {
	margin-bottom: 30px;
}

.support-checks {
	text-align: left;
	font-size: .8em;
}

.support-checks img {
	height: 20px;
}

.done {
	background: #00b95e;
	color: white;
	padding: 20px;
} 

@media only screen and (min-width : 0px) and (max-width : 800px) { 
	.support-portal-section {
		display: grid;
		grid-template-columns: 1fr;
		gap: 20px;
	}
}




/* ====================
    About Us Page
   ==================== */
.extra-links-about-us {
	font-style: italic;
}

.about-us-main-image {
	
}

.about-us-main-image-wrapper {
	text-align: right;
	border: 10px solid rgba( 255, 255, 255, .5);
	border-radius: 5px;
	background:  rgba( 255, 255, 255, .5);
	box-shadow: 2px 2px 5px rgba( 0, 0, 0, .3 );
	width: 100%;
}

.about-us-main-image img {
	width: 100%;
	display: block;
	border-radius: 5px;
}
   
.about-section .big-title {
	border-bottom: 1px solid #dddddd;
	margin-bottom: 50px;
}

.logostable {
	width: 100%;
	border-collapse: separate;
	border-spacing: 2px;
}

.logostable th,
.logostable td {
	text-align: center;	
	padding: 5px;
	vertical-align: middle;
}

.logostable th {
	
}

.logostable td {
	background-color: #f3f3f3;
	font-style: italic;
}

.logostable img {
	width: 100%;
	display: block;
	margin: 0px auto;
}

.light-logo-bg {
	
}

.dark-logo-bg {
	background-color: #333333 !important;
}

.about-address-grid {
	display: grid;
	grid-template-columns: 1fr 2fr;
}

.about-address-top {
	font-weight: bold;
}

.map-responsive {
	border: 10px solid white;
	border-bottom: 5px solid white;
	box-shadow: 2px 2px 5px rgba( 0, 0, 0, .3 );
	border-radius: 5px;
}

.map-responsive iframe {
    left:0;
    top:0;
    height: 300px;
    width:100%;
    position:relative;
}

.contact {
	margin-top: 20px;
	font-weight: bold;
}

@media only screen and (min-width : 0px) and (max-width : 800px) { 
	.about-address-grid {
		grid-template-columns: 1fr;
		gap: 20px;
	}

}











/* =============
    Legal
   ============= */
.rcolumns {

}

.rboxannotation {
	color: #aaaaaa;
}

.rboxheader {
	font-size: 1.2em;
	font-weight: 900;
}

.rbox {
	margin-bottom: 50px;
}

.rbox h3 {
	font-weight: 900;	
}
		
.c6 {
	font-weight: 900;
}
		
		
		
		
		
		
		
		
		
		
		
		
		
/* ******** */
/*   JOIN   */
/* ******** */
.join-columns {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 50px;
}

.joincolumn1 {
	width: 400px;
	float: left;
}

.joincolumn2 {
	width: 400px;
	float: right;
}

.join table {
	width: 100%;
}

.join table td {
	padding-bottom: 2px;
}

.join .feedbackPanel {
	margin-top: 10px;
}

.join .feedbackPanelERROR {
	color: red;
}

.joinsystems {
	max-width: 100%;
	margin-top: 10px;
}

.join input {
	width: 100%;
}
		
@media only screen and (min-width : 0px) and (max-width : 800px) { 
	.join-columns {
		grid-template-columns: 1fr;
	}
}
		
		
		
		
		
		
		
		
		
		
		
/* ===============
   Integrations
   =============== */
.pricing-highlights-section {
	
}

.pricing-highlights-section .big-title {
	font-weight: 900;
}   

.pricing-highlights {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
	margin-top: 50px;
}

.pricing-highlight {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.pricing-highlight > * {
	background-color: auto;
}

.pricing-highlight-icon {
	width: 130px;
	grid-area: icon;
}
   
.pricing-highlight-title {
	font-size: 1.5em;
	grid-area: title;
}

.pricing-highlight-box {
	padding: 20px;
	text-align: left;
	margin-top: 10px;
	flex-grow: 1;
	background: #eeeeee;
	grid-area: box;
}

.pricing-highlight-logo {
	max-width: 300px;
	display: block;
	margin: 0px auto;
	margin-top: 30px;
}
   
.pricing-triplet {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 20px;
	margin-top: 50px;
}

.pricing-triplet .pricing-highlight-icon {
	width: 75px;
}
   
@media only screen and (min-width : 0px) and (max-width : 800px) { 
	.pricing-highlights {
		grid-template-columns: 1fr;
	}
	
	.pricing-triplet {
		grid-template-columns: 1fr;
	}
	
	.pricing-triplet .pricing-highlight {
		display: grid;
		text-align: left;
		grid-template-columns: 1fr 5fr;
		grid-template-areas:
			"icon title"
			"box  box";
	}
	
	.pricing-triplet .pricing-highlight .pricing-highlight-icon {
		width: 50px;
	}
	
	.pricing-triplet .pricing-highlight > * {
		background: auto;
	}
}



/* ==========
	Signup 
   ========== */
.signup-form {
	display: grid;
	grid-template-columns: 1fr;
}

.signup-title {
	font-size: 1.5em;
}

.signup-subtitle {
	padding-bottom: 20px;
}

.signup-button {
	margin-top: 20px;
}

.signup-legal {
	margin-top: 50px;
	font-size: .8em;
	text-align: center;
}

.signup-feedback {
	
}

.pwreq {
	font-size: .8em;
	margin-left: 10px;
	margin-top: 10px;
	color: #555555;
}

.signup-warn {
	display: grid;
	grid-template-columns: 1fr 3fr;
	align-items: center;
	gap: 20px;
}

.signup-warn img {

}

.signup-buttondesc {
	font-size: .8em;
	text-align: center;
	margin-top: 5px;
}

/* ===============
	New Feedback
   =============== */
   
.newfeedback .newFeedbackPanel {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	padding: 20px;
	text-align: center;
	box-sizing: border-box;
	z-index: 999;
	display: flex;
	align-items: center;
	justify-content: space-between;
	cursor: pointer;
	box-shadow: 0px 0px 5px rgba( 0, 0, 0, .5);
}

.new-feedback-msg {
	color: white;
}

.new-feedback-errors .newFeedbackPanel {
	background-color: #ff0033;
}

.new-feedback-info .newFeedbackPanel {
	background-color: #00b95e;
}

.feedback-close {

}

.feedback-close img {
	width: 30px;
}










/* ===============
	Contact Sales
   =============== */
.schedule-grid {
	display: grid;
	grid-template-columns: 1fr;
	border-top: 1px solid #dddddd;
	padding-top: 40px;
	gap: 10px;
}
   
.schedule-box {
	
}

.schedule-grid a {
	width: 100%;
}

@media only screen and (min-width : 0px) and (max-width : 800px) { 
	.schedule-grid {
		grid-template-columns: 1fr;
		gap: 20px;
	}
}





/* ===========
   Articles
   =========== */
.publish {
	display: flex;
	align-items: center;
}

.publish-date {
	font-size: .8em;
	color: #1a237e;
}

.publish-icon {
	height: 15px;
	margin-right: 5px;
}