nav li a:hover { color: #ff005d; text-decoration: none; }

body { margin: 0; padding: 0; background-color: black; }

.container { max-width: 960px; padding: 0 12px; margin: 0 auto; box-sizing: content-box; }

p { font-family: CarganLig, sans-serif; -webkit-font-smoothing: antialiased; color: black; font-weight: 400; font-size: 15px; line-height: 1.4em; }

a { text-decoration: none; color: black; }

a:hover { color: black; }

h1 { font-size: 1.4em; font-family: CarganBol, sans-serif; font-weight: normal; margin: 0; }

h2 { font-size: 1.2em; font-family: CarganBol, sans-serif; font-weight: normal; }

h3 { font-size: 1.0em; font-family: CarganBol, sans-serif; font-weight: normal; }

.content-area { width: 100%; display: block; background-color: #fff; }

.subpage-content { padding: 60px; width: 50%; float: left; box-sizing: border-box; }

.subpage-content img { padding: 0; float: left; }

.logo { float: left; margin: 24px 4px; }

.logo a { display: block; width: 245px; height: 55px; }

.svg-logo { width: 245px; }

/* Start nav */
nav { margin: 24px 0 8px 0; width: 65%; float: right; font-family: CarganBol, sans-serif; }

navnav ul { margin: 0; padding: 0; float: right; }

nav li { font-size: 1.1em; float: left; padding: 8px; list-style: none; }

nav li a { color: black; }

.sm-menu { display: none; }

/* End nav */
.bold { font-family: CarganBol; }

.topstrip { background-color: #33d4f3; padding: 12px 0px 10px 0px; }
.topstrip .container { text-align: center; }

header { background-color: white; height: 100px; padding: 12px 0; }

.slideshow { background: url(../images/Background.jpg) #ff005d; background-position: center center; background-size: cover; display: block; height: 400px; }

.slideshow-content { padding: 56px; }

.slideshow p { padding: 0; color: white; font-size: 1.4em; line-height: 1.1em; font-family: CarganBol, serif; }

.slideshow-intro-text { color: white; max-width: 40%; font-size: 1.4em; line-height: 1.1em; font-family: CarganBol, serif; }

.slideshow-content a { border-radius: 6px; text-align: center; border: #fff solid 1px; padding: 12px 10px 10px 10px; display: block; width: 80px; color: white; font-size: 1.0em; line-height: 1.0em; font-family: CarganLig, serif; }

.slideshow-content a:hover { color: #404042; background-color: white; text-decoration: none; }

/* --- Offering ---*/
.offering { padding: 20px 0; }

.offering ul { padding: 0; margin: 0; }

.offering li { margin: 12px 0; padding: 0 36px 0 0; list-style: none; width: 33%; float: left; box-sizing: border-box; }

.offering p { color: #e5e6e8; margin: 12px 0; }

.offering h2 { font-size: 1.2em; color: white; margin: 12px 0; }

.offering-container { width: 100%; background-color: #404042; margin: 0; }

/* --- End Offering ---*/
/* --- Table Styles ---*/
table { font-size: 0.9em; line-height: 1.3em; display: block; border-spacing: 0; border-collapse: collapse; width: 100%; padding: 0 0 60px 0; }

table th { font-weight: normal; text-align: left; border-bottom: 2px solid #404042; font-size: 1.1em; }

table th, table td { vertical-align: top; padding: 12px 6px; }

table tr { border-bottom: 1px solid #e5e6e8; }

table tbody tr:nth-child(even) td { background-color: #f8f9f9; }

.col-feature { width: 25%; }

.col-feature td { font-family: CarganBol, sans-serif; }

.col-powerpoint, .col-keynote, .col-google-slides { width: 25%; }

.col-before, .col-after { width: 40%; }

.col-to { width: 20%; }

/* --- End Table Styles ---*/
/* Start Links */
a:link { text-decoration: none; }

a:hover { text-decoration: underline; }

/* End Links */
/* Applications */
.applications-box { width: 100%; height: 162px; background-color: white; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-direction: row; -moz-direction: row; -ms-direction: row; -o-direction: row; flex-direction: row; justify-content: center; align-items: center; }

.application { width: 240px; height: 160px; border-right: 1px solid #e5e6e8; font-family: CarganBol, serif; font-size: 1.2em; text-align: center; }

.application-1 { border-left: 1px solid #e5e6e8; }

.application:hover { background-color: #f8f9f9; }

.application a:hover { text-decoration: none; }

.application img { display: block; margin: 40px auto 10px auto; }

@media screen and (max-width: 780px) { .applications-box { height: auto; -webkit-direction: column; -moz-direction: column; -ms-direction: column; -o-direction: column; flex-direction: column; }
  .application { width: 100%; height: 100px; font-size: 1em; border-bottom: 1px solid #e5e6e8; }
  .application-1 { border-top: 1px solid #e5e6e8; }
  .application img { display: block; margin: 15px auto 5px auto; } }
/* End Applications */
/* Trusted */
.trusted { text-align: center; padding: 16px 8px; background-color: #e5e6e8; height: auto; }

.trusted img { margin: 0 24px; }

.trusted-logos { margin: 16px 0; display: inline-block; }

.trusted h3 { padding: 8px 0 0 0; font-size: 0.9em; font-family: CarganBol, serif; text-transform: uppercase; color: #9e9e9e; }

/* End Trusted */
/* Start Client Quote */
blockquote { padding: 8px 0; max-width: 80%; margin: 0 auto; font-size: 1.2em; line-height: 1.3em; }

.client-quote { padding: 24px; background-color: #404042; color: white; text-align: center; }

.client-quote p { font-size: 0.8em; color: #e5e6e8; margin-bottom: 0; }

/* End Client Quote */
/* Start Clearfix */
group .group:before, .group:after { content: ""; display: table; }

.group:after { clear: both; }

.group { zoom: 1; }

/* End Clearfix */
.contact-left, .contact-right { padding: 60px; width: 45%; display: inline-block; vertical-align: top; box-sizing: border-box; }

.contact-right { padding: 60px 20px 50px 80px; }

form { margin: 0px; text-align: left; font-family: CarganLig, sans-serif; -webkit-font-smoothing: antialiased; color: black; }

textarea, input, select { border: none; font-family: CarganLig, sans-serif; color: black; font-weight: 400; font-size: 15px; line-height: 20px; width: 100%; display: block; border-radius: 4px; padding: 11px 8px 9px 14px; margin: 0px 0px 14px 0px; background: #fff; border: 1px solid #e5e6e8; box-sizing: border-box; }

select { -webkit-appearance: none; -moz-appearance: none; appearance: none; }

form button { background: #404042; font-family: CarganBol, serif; color: white; font-size: 18px; line-height: 22px; padding: 14px 28px 12px 28px; margin: 10px 0px 10px 0px; border: none; border-radius: 4px; }

form button:hover { background: #ff005d; color: white; cursor: pointer; }

@media screen and (max-width: 780px) { .contact-left, .contact-right { width: 49%; padding: 50px 20px 40px 20px; } }
@media screen and (max-width: 560px) { .contact-left, .contact-right { width: 100%; padding: 40px 20px 30px 20px; display: block; }
  .contact-right { padding: 0px 20px 40px 20px; } }
@media screen and (max-width: 380px) { .contact-left { padding: 40px 10px 30px 10px; }
  .contact-right { padding: 0px 10px 40px 10px; } }
.fullspan { text-align: center; padding: 30px; }
.fullspan img { display: inline-block; height: 312px; margin: 20px 0px 20px 0px; cursor: pointer; }
.fullspan .dividerarrow { display: inline-block; vertical-align: top; height: 312px; width: 94px; text-align: center; }
.fullspan .dividerarrow svg { fill: #c3c3c3; height: 42px; margin-top: 150px; }

.odd { background-color: #f0f0f0; }

.even { background-color: #e6e6e6; }

.mobiletextonly { display: none; }

.intro { margin: 20px auto 0px auto; max-width: 700px; }
.intro .before, .intro .after { font-size: 1.4em; display: inline-block; margin: 30px 230px 0px 0px; }
.intro .after { margin-right: 0; margin-left: 230px; }

p.outro { margin: 40px auto 20px auto; max-width: 700px; }

@media screen and (max-width: 1024px) { .intro .before { margin-right: 210px; }
  .intro .after { margin-left: 210px; }
  .fullspan img { height: 290px; margin: 10px 0px 10px 0px; }
  .fullspan .dividerarrow { height: 290px; width: 74px; }
  .fullspan .dividerarrow svg { margin-top: 140px; } }
@media screen and (max-width: 930px) { .intro .before { margin-right: 170px; }
  .intro .after { margin-left: 170px; }
  .fullspan img { height: 240px; margin: 10px 0px 10px 0px; }
  .fullspan .dividerarrow { height: 240px; width: 54px; }
  .fullspan .dividerarrow svg { margin-top: 110px; } }
@media screen and (max-width: 760px) { .intro .before { margin-right: 150px; }
  .intro .after { margin-left: 150px; }
  .fullspan img { height: 220px; margin: 10px 0px 10px 0px; }
  .fullspan .dividerarrow { height: 220px; width: 44px; }
  .fullspan .dividerarrow svg { height: 32px; margin-top: 100px; } }
footer { margin: 0 auto; background-color: black; color: #e5e6e8; padding: 8px 0; }

footer p { font-size: 0.9em; line-height: 1.4em; margin: 0; color: #9b9b9b; }

footer a { text-decoration: none; color: #9b9b9b; }

footer a:hover { text-decoration: none; color: #9e9e9e; }

.footer-block { width: 25%; float: left; margin: 16px 36px 16px 0; }

.footer-block ul { font-size: 0.9em; padding: 0; margin: 0 0 0 0; }

.footer-block li { list-style: none; margin: 0 0 0.4em 0; -webkit-font-smoothing: antialiased; }

.footer-block li a { color: #9b9b9b; }

.footer-block li a:hover { text-decoration: none; color: #404042; }

.footer-social { -webkit-font-smoothing: antialiased; clear: both; display: block; font-size: 0.9em; margin: 12px 0px 40px 0px; }

.footer-social img { display: block; float: left; vertical-align: middle; }

.footer-social p { float: left; padding: 6px 0 0 8px; }

.certification { color: #9b9b9b; -webkit-font-smoothing: antialiased; font-size: 0.9em; display: block; margin: 16px 0; float: right; width: 30%; }

.certification p { float: left; margin: 20px 0 0 0; }

.certification img { display: block; vertical-align: middle; float: left; margin-right: 12px; }

/*---OFF CANVAS---*/
.offcanvas { background: black; }

.nav-button { position: absolute; top: 55px; width: 50px; height: 50px; cursor: pointer; background-image: url(../images/pp-nav-icon.svg); }

.nav-button.right { right: 15px; }

/*---END OFF CANVAS---*/
.keynote-info { color: white; margin-bottom: 60px; background: url(../images/Background-keynote.jpg); background-position: center center; background-size: cover; display: block; }

.keynote-info p { color: white; }

.powerpoint-info { color: white; margin-bottom: 60px; background: url(../images/Background-powerpoint2.jpg); background-position: center center; background-size: cover; display: block; }

.powerpoint-info p { color: white; }

.google-slides-info { color: white; margin-bottom: 60px; background: url(../images/Background-google-slides.jpg); background-position: center center; background-size: cover; display: block; }

.google-slides-info p { color: white; }

.about-info { background: url(../images/Background-desk.jpg); background-position: center center; background-size: cover; display: block; }