@charset "UTF-8";

@-webkit-keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

.fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn; }
.pop-in { -webkit-animation-name: pop-in; animation-name: pop-in; -webkit-transform-origin: center bottom; transform-origin: center bottom; }

.animated[animation=pop-in] { opacity: 0; }

@-webkit-keyframes pop-in { from, 0% { opacity: 0; -webkit-transform: scale(0.5); } 100% { opacity: 1; -webkit-transform: scale(1); } }
@-moz-keyframes pop-in { from, 0% { opacity: 0; -moz-transform: scale(0.5); } 100% { opacity: 1; -moz-transform: scale(1); } }
@keyframes pop-in { from, 0% { opacity: 0; transform: scale(0.5); } 100% { opacity: 1; transform: scale(1); } }

.animated { -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both; }
.animated.infinite { -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; }
.animated.delay-1s { -webkit-animation-delay: 1s; animation-delay: 1s; }
.animated.fast { -webkit-animation-duration: 800ms; animation-duration: 800ms; }
.animated.faster { -webkit-animation-duration: 500ms; animation-duration: 500ms; }
.animated.slow { -webkit-animation-duration: 2s; animation-duration: 2s; }
.animated.slower { -webkit-animation-duration: 3s; animation-duration: 3s; }

@media (print), (prefers-reduced-motion) {
  .animated {
    -webkit-animation: unset !important;
    animation: unset !important;
    -webkit-transition: none !important;
    transition: none !important;
    opacity: 1.0 !important;
  }
}

/*!
 * Start Bootstrap - Modern Business (http://startbootstrap.com/)
 * Copyright 2013-2016 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap/blob/gh-pages/LICENSE)
 */

/* Global Styles */

html, body { height: 100%; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; font-weight: 400; font-size: 17px; line-height: 1.6; background: #f0f0f0; }

/* Required padding for .navbar-fixed-top. Remove if using .navbar-static-top. Change if height of navigation changes. */
body { padding-top: 7.5rem; }
body.homePage { padding-top: 1rem; }
p {line-height: 1.5;}
p.center { text-align: center; }
p.code { font-family: 'Courier New', Courier, monospace; font-size: .9rem; font-weight: 600; padding: .3rem .5rem; background: #f8f8f8; color: #404040; margin-top: .8rem; }

blockquote { font-size: 1.1em; width: 70%; margin: 50px auto; font-style: italic; font-weight: bold; color: #555555; padding:1.2em 30px 1.2em 30px; border-left:8px solid #1e73be ; line-height:1.6;  position: relative;  background: #f0f0f0; }
blockquote::after { content: ''; }
blockquote span { display:block; color:#333333; font-style: normal; font-weight: bold; margin-top:1em; }

/* Tabs */
div.tab-pane { min-height: 500px; }

/* Standard controls */
select { padding: 4px 10px; min-width: 120px; border: 1px solid #e0e0e0; -webkit-appearance: none; -moz-appearance: none; appearance: none; }

/* Hyperlink */
a:hover { color: #30a0e0; }

/* Rows and standard containers */
.row { margin: 0; }
.container { padding: 0; background: white;  }
.pageContent { padding: 2rem 4rem 4rem 4rem; min-height: 40rem; }
table td { font-size: 1rem; padding: .1rem .4rem .1rem 0 }

/* Headers */
h1 { font-size: 1.5rem; font-weight: 600; }
h2, h3, h4 { font-size: 1.2rem; margin: 30px 0 15px 0; font-weight: 600; }
h4 { font-size: 1.11rem;  margin-bottom: .4rem; }

/* Title Area */
div.title { background: #f8f8f8; box-shadow: 0 2px 5px 0 rgba(0,0,0,.16), 0 2px 10px 0 rgba(0,0,0,.12); text-align: center; color: #1e73be; padding: 60px 0; }
div.title h1 { font-weight: 600; margin-bottom: .5rem; color: #303132; font-size: 1.5rem; }
div.title h2 { font-weight: 400; margin: 0; color: #303132; font-size: 1.2rem; }
div.title .container { background: #1e73be; padding: 0 2rem; }

/* Images */
.pageContent p.screenShot { text-align: center; margin: 1rem 0 0 0; background: #fff; padding-top: 1rem;}
.pageContent p.screenShot img { width: 90%; }
.pageContent p.screenShotCaption { text-align: center; margin-top: 0; font-size: .8rem; padding: .7rem 0; font-weight: bold; background: #fff; }

/* Panel Types */
.panel-default { margin: 3rem 1rem 3rem 1rem; }
.panel-default i { margin: 1rem 2rem; font-size: 6rem; color: #1e73be; }
.panel-heading h3 { text-align: center; font-weight: 600; line-height: 1.5; margin-top: 0%; }
.panel-body.center { text-align: center; }

.row-text-image { padding: 1rem 0; }
.row-text-image h3 { text-align: left; padding:  10% 10% 0 10%;}
.row-text-image p { text-align: left; padding: 0 10% }

.customers { margin-top: 3rem; border-top: 2px solid #c0c0c0; border-bottom: 2px solid #c0c0c0; padding: 2rem 5%; text-align: center; background-color: #f0f0f0; }
.customers h3 { font-size: 1.5rem; text-align: center; }
div.customerLogos { margin-top: 1rem; margin-bottom: 1.5rem; text-align: center; }
div.customerLogos img { width: 100px; margin: .3rem; border: 10px solid #888; border-radius: 5px; }

/* Cookie Message */
.cookieConsent { width: 100%; padding: .5rem 2rem .5rem 2rem; color: white; background: #5f905f; z-index: 100; position: fixed; bottom: 0; border-top: 2px solid #e0e0e0; display:none; }
.cookieConsent a { color: white; text-decoration: underline;  margin-left: .5rem; }
.cookieConsent span:first-child { float: left; margin-left: 1rem; padding-top: 1rem; font-weight: 600; }
.cookieConsent span:last-child { width: 10rem; float: right; margin-right: 1rem; }

/* Top Bar */
.topbar { text-align: right; padding: 0; }
.topbar ul { height: 3rem; }
.topbar .navbar-nav {color:white; flex-direction: row-reverse; white-space: nowrap; width: 100%; }
.topbar .navbar-nav .nav-item { padding-top: .4rem; }
.topbar .navbar-nav .nav-item:last-child { background: #456C9D; padding-left: 1rem; padding-right: 1rem; }
.topbar .navbar-nav .nav-item a { padding-top: .4rem; font-weight: 600; }
.menubar { background-color: white; top: 3rem;padding: 1rem; }

/* Navigation */
a { color: #0070b0; }
nav.navbar { width: inherit; }
nav.fixed-top { left: auto; right: auto; }
.nav-link { font-size: 0.9rem; font-weight: 400; }
.navbar.navbar-dark .nav-link:hover { color: #f0f0f0 !important; }
.topbar .nav-link { font-size: 0.80rem; font-weight: normal; }
.nav-item { text-align: center; padding: 0 15px }
.navbar-brand { font-size: 1.6rem; padding: 0 0 0 20px; }
.navbar { margin: 0; border: 0;   }
.navbar-collapse { text-align: right; }

.dropdown-menu  { background: #404040; }
.navbar .dropdown-menu a { color: white; padding-left: 1.2rem; padding-right: 1.5rem; font-size: 0.9rem }
.navbar .dropdown-menu a:hover { background: #606060; }

/* Product Overview */ 
div.product-overview { max-width: 100vw; overflow: hidden; color: #434343; padding: 0px; margin: 0px; }
div.product-overview.white { padding-left: 2rem; }
div.product-overview.blue { background-color: #f4f8fb; border-top: none; padding-left: 3rem; }
div.product-overview span.word-cloud { border: 2px solid #4b86c0; border-radius: 20px; padding: .5rem; background-color: #dae6f2; color: #2a5279; overflow: hidden; display: inline-block; align-items: center;}
div.product-overview h1 { font-size: 2.2rem; margin-top: 3rem; }
div.product-overview h2 { font-size: 2.1rem; margin-top: 3rem; }
div.product-overview h3 { font-size: 2rem; margin-top: 2.5rem; }
div.product-overview h4 { font-size: 2rem;  margin-top: 3rem; margin-bottom: 1rem; text-align: center; }
div.product-overview img { border-radius: 1%; }
.pageContent.product-overview div.row.scroll-animations { border: none; margin-top: 2rem; }
img.blackborder { margin-right: 2rem; border: 1px solid #3d3d3d; border-radius: 1%; box-shadow: 10px 10px 10px 10px #c0c0c0; }
div.indent { margin-left: 1.5rem; }
div.word-cloud { margin-top: 6rem; text-align: center; margin-bottom: 4rem; padding: 2rem; }
p.word-cloud { margin-left: 5rem; margin-right: 5rem; }

/* Narrower Paragraph widths */
div.textMargin { margin-left: 5rem; margin-right: 5rem; }

/* Blog */
.container.blogPost h3 { margin-top: 3rem; }
.container.blogPost .pageContent img { max-width: 100%; border: 1px solid #f0f0f0; }
.container.blogPost .pageContent img.no-border { border: 0; }
div.featured { color: #585858; margin-left: 1rem; margin-top: 0; margin-bottom: -2rem; }
span.featured { border: 2px solid #588DC1; padding: 4px; margin-bottom: 0px; border-radius: 5px; }
.subfeatured { border-bottom: none; margin-bottom: 0; padding-top: 1rem; padding-bottom: 1rem; }

.container.blogPost div.blogPostMainImage { text-align: center; background: #f8f8f8; margin-bottom: 2rem; }
.container.blogPost div.blogPostMainImage img { margin-top: 0; padding-top: 0; border-radius: 5px; }
div.blogQuote, p.blogQuote { padding: 1.5rem 6rem 1.5rem 3rem; }

.container.blog .pageContent .row h3 { margin-top: 1.5rem; }
@media(max-width:992px) {  .container.blog .pageContent .row h3 { margin-top: 1rem; } }
.container.blog .pageContent .row { margin: 0; padding-top: 3rem; padding-bottom: 2rem; border-bottom: 2px dotted #e0e0e0; }
.container.blog .pageContent .row.featured { border-bottom: none; }
.container.blog .pageContent .subfeatured > div.col-lg-4 { padding: 20px; border-radius: 10px; overflow: hidden; position: relative; background-color: white; }
.container.blog .pageContent .subfeatured > div.col-lg-4 img { height: auto; position: absolute; top: 0px; left: 0px; opacity: 0.2 !important; z-index: 0; }
.container.blog .pageContent .subfeatured > div.col-lg-4 > div { position: relative; min-height: 360px; }
.container.blog .pageContent .subfeatured .btn { z-index: 10;  position: absolute; bottom: 20px; }
.container.blog .pageContent .subfeatured { padding: 10px; border-radius: 10px; background-color: #e5edf6; }
.container.blog .pageContent .row.quick-update { padding: 1rem 0 0 0 ; text-align: left; }
.container.blog .pageContent .row.quick-update > div:first-child > div { text-align: center; background: #f8f8f8; margin-bottom: 1rem; padding-top: 4rem; border: 1px solid #e0e0e0; font-weight: bold; min-height: 10rem;  }
.container.blog .pageContent img.borderLight { border: 1px solid #c0c0c0; border-radius: 3%; }
.container.blog .pageContent img { margin-bottom: 1rem; }
.container.blog div.postDate { font-size: .9rem; padding-bottom: .5rem; }

.container.blogPost p.blogPostImage { text-align: center; margin: 1rem 0 0 0; background: #f0f0f0; }
.container.blogPost p.blogPostImageCaption { text-align: center; margin-top: 0; font-size: .8rem; padding: .7rem 0; font-weight: bold; background: #f0f0f0; }

.container .blogPromo { background: #f0f0f0; text-align: center; padding: 2rem 3rem; border-radius: 5px; }
.container .blogPromo a { text-decoration: underline; }

/* Newsletter */
.container.newsletter .pageContent p { margin-bottom: .7rem; }
.container.newsletter .pageContent img { max-width: 100%;  margin: 1rem 0; border: 1px solid #f0f0f0; }

/* Updates column */
.updates-column { padding: 0; font-size: .9rem; margin-top: 2rem; }
.updates-column > div { background: #f0f0f0; padding: 0.1rem 1.5rem 1rem 1.5rem; border-radius: 8px; margin-bottom: 1rem; }
.updates { margin: 0; padding: 1rem 2rem; background: #ffffff; border-top: 2px solid #c0c0c0; }

/* FAQ */
.container.faq .pageContent .row { margin-bottom: 0; }
.container.faq .accordion-toggle { color: #000000; }
.container.faq h2 { margin: 1rem 0 5px 0; }
.container.faq .accordion-toggle { padding: .2rem 0; }
.container.faq .accordion-toggle span { width: 1.6rem; height: 1.6rem; font-size: 1rem; background: #1e73be; color: white; border-radius: 3px; text-align: center; display:inline-block; margin-right: 2rem; }
.container.faq .panel-default { margin: 1rem 0; }
.container.faq .panel-title { font-weight: 400; margin-top: 0; font-size: 1.1rem; }
.container.faq .panel-body { font-weight: 400; padding: 1rem .5rem .5rem 1.6rem; }

.container.faq [data-toggle="collapse"] span
{
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 1.5rem;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\f054";
    transform: rotate(90deg) ;
    transition: all linear 0.25s;
    margin-right: 0.5rem;
}   

.container [data-toggle="collapse"].collapsed span {  transform: rotate(0deg); }

/* Buttons */
.btn { max-width: 20rem; background-color: #155085 !important; font-weight: 600; margin-left: 0; }
.btn:hover { background-color: #155085 !important; }
.btn-default { background-color: #155085 !important; }
.btn-primary { background-color: #155085 !important; }
.btn-back { background-color: #808080 !important; max-width: 10rem; margin-right: 0.5rem; }
.btn-back:hover { color: white; }
.btn-dark-2 { background: #155085; border: 2px solid white; font-weight: 800; font-size: 13px; padding: .9rem 2rem; }
.btn-default.disabled { background-color: #c0c0c0 !important; pointer-events: "none"; }
.btn-download { background-color:  #155085 !important; color:white;; }
.btn-download.disabled { background-color: #c0c0c0 !important; pointer-events: "none"; }
.btn-download.dark { background-color: #155085 !important; border: 2px solid #e0e0e0; }
.btn-download:hover { background-color: darkorange !important; }
.btn-portal { padding: .5rem .9rem !important; text-transform: none; font-size: .9rem; font-weight: 400; }

/* Inputs */
input[type=text], input[type=password] { width: 100%; padding: .4rem .8rem; border: 1px solid #e0e0e0; border-radius: 3px; }
input[type=text].error { background: #ffd0d0; }

/* Images */
.img-hover:hover { opacity: 0.8; }

/* Home Page Elements */
  
body { margin: 0; }

* { box-sizing: border-box; }


@keyframes scrolling-left { 0% { transform: translateX(0); } 100% { transform: translatex(-137.5vw); } }

@keyframes scrolling-right { 0% { transform: translateX(0); } 100% { transform: translatex(120vw); } }

.container.homepage img.mainHomeGraphic { margin-top: 10rem; position: relative; left: 30%; }
.container.homepage div.mainHomeMessage { text-align: center; }
.container.homepage div.mainHomeMessage .mainTitle h1 { font-weight: 600; color: #202020; font-size: 2.5rem; margin-top: 1.5rem; }
.container.homepage div.mainHomeMessage .mainSubtitle { font-size: 26px; font-weight: 600;}
.container.homepage div.mainHomeMessage .mainMessage { font-size: 1.1rem; font-weight: normal; padding-top: 0px; padding-bottom: 25px; line-height: 1.8; color: #404040; }
.container.homepage div.mainHomeMessage .exampleButtonsDiv { margin-top: 0; padding: 0 3rem; }
.container.homepage div.mainHomeMessage .exampleButtonsDiv .btn { min-width: 310px; margin-top: 0; margin-bottom: 2rem; }

.container.homepage .featureImages { text-align: center; padding-top: 100px; padding-left: 80px; padding-right: 80px; height: 520px; }

.container.homepage .homeh1h2 { background: #606060; width: 100%; text-align: center; padding: 1rem 0; }
.container.homepage .homeh1h2 h1 { color: white; margin: 0; padding-top: 1rem; }
.container.homepage .homeh1h2 h2 { color: white; margin: 0; padding: .5rem 0 1rem 0; }

.container.homepage .featureImages { justify-content: center; margin-top: 75px; }
.container.homepage .featureImages .img-fluid {  -webkit-transition: 1s; transition: 2s; padding: 20px; border-radius: 5px; position: initial; border: 1px solid #e0e0e0; }
.container.homepage .featureImages .img-fluid:last-child { opacity: 0; position: relative; top: -50%; }

@media(max-width: 970px) 
{
  .container.homepage div.mainHomeMessage .mainTitle h1 { font-size: 34px; }
  .container.homepage div.mainHomeMessage .mainMessage { font-size: 17px; }
}

@media(max-width: 850px) 
{
  .container.homepage div.mainHomeMessage .mainTitle h1 { font-size: 30px; }
  .container.homepage div.mainHomeMessage .mainMessage { font-size: 15px; }
}

@media(max-width: 780px) 
{
    .container.homepage .featureImages { padding-top: 150px; padding-left: 10px; padding-right: 10px; }
    .container.homepage div.mainHomeMessage { padding: 0; }
    .container.homepage div.mainHomeMessage .mainTitle h1 { font-size: 28px; }
    .container.homepage div.mainHomeMessage .mainMessage { font-size: 16px; }
    .container.homepage div.mainHomeMessage .exampleButtonsDiv .btn { margin-top: 10px; min-width: 210px; }

}

@media(max-width: 640px) 
{
    .featureImages div { max-width: 100%; flex: 0 0 100%;  }
    .featureImages div:nth-child(1) { display: none; }
    .featureImages div:nth-child(2) { display: none; }
    .marquee-item { border: 3px solid; }
}

/* Footer Styles */
footer { margin: 0; padding: 1rem 0; background-color: #606060;}
footer h3 { margin-top: 0; font-weight: 600; }
footer .col-md-6 { font-size: .89rem; color: white;}
footer p { margin-bottom: .5rem; font-size: 14px; }
footer .col-md-6 { padding: 1rem 1rem 0 2rem; }
footer .col-md-6:first-child img { width: 10rem; margin-bottom: 1rem;}
footer .col-md-6:last-child { text-align: right; }

footer div.copyright { font-size: 0.8rem; color: #f0f0f0;  text-align: center; margin: 0; padding: 1rem; }

footer a { color: white; display:block; }
footer a:hover { text-decoration: underline }
footer a:visited { color: white; }
footer div.copyright  { text-align: center; padding: .5rem 0; font-size: .75rem; }

/* Download banner */
div.downloadBanner { padding: 1rem 4rem; background: #f0f0f0; text-align: center; border-top: 1px solid #e0e0e0; }

/* Slide down banners */
div.ffBanner { border: 1px solid #80c080; padding: 15px 30px; background: #40c040; color: white; border-radius: 3px; display: none; }
div.ffBanner.error { border: 1px solid #e06040; background: #e06040;}

/* Defaults for responsive styles */
.container { max-width: 100%; margin: 0; box-shadow: 0 2px 5px 0 rgba(0,0,0,.16), 0 2px 10px 0 rgba(0,0,0,.12); }

.container { margin: auto;}
nav.navbar { width: inherit; }

/* Download page */
div.container.download img { margin-top: 50px; }

/* Large devices (desktops, 992px and up) */
@media(max-width:992px) 
{
    .container { max-width: 100%; margin: 0; }
    nav.navbar { width: inherit; }
}

/* Medium devices (tablets, 768px and up) */
@media(max-width:768px) 
{
    .container { max-width: 100%; margin: 0; }

    .row-customers {  padding: 2rem 0rem; }

    h1 { font-size: 1.2rem; }
    h2 { font-size: 1rem; }

    .panel-body { font-size: 1rem; }
}

/* Small devices (landscape phones, 576px and up) */
@media (max-width: 576px) 
{
    body { font-size: 15px; }
    table td { font-size: 15px; }
    .container { max-width: 100%; margin: 0; }
    .pageContent { padding: 2rem .5rem 4rem .5rem; }

    .nav-item:last-child { padding-left: .7rem; padding-right: .7rem; }
    .nav-item-hideable { display: none; }

    .navbar .dropdown-menu a { padding-top: .1rem; padding-bottom: .1rem; }

    /* Shrink headings */
    h1 { font-size: 1.1rem; }
    h2 { font-size: .9rem; }

    .panel-body { font-size: .9rem; }

    ul.portalTabs { display: flex; flex-direction: column; }
    ul.portalTabs li.nav-item a { padding: .4rem .4rem; border-radius: 6px; }
}

/* Portal CSS */
div.pageContainer { margin: 0; padding-bottom: 100px; font-weight: 500; }
div.pageContainer input { font-weight: 500; }

ul.tabList { border-bottom: 2px solid #f0f0f0; padding: 10px; }
ul.nav a { color: #404040; font-weight: 500; }
.nav-link { margin-right: 5px; }
.nav-link.active { background-color: #2984C5 !important; color: white !important; }
div.tab-content { padding: 10px 0px; }

#home, #downloads { padding-left: 1rem; padding-right: 1rem; }
#changePasswordForm { display: none; }

#downloads > div { margin-bottom: 1rem; }
#downloads > div > div { padding: .0rem .0rem; }
#downloads > div > div:first-child { font-size: 1rem; }
#downloads .previousRelease { padding-bottom: .5rem; display:none; }
#downloads .previousRelease:first-child { font-weight: bold; }
#downloads .previousRelease:last-child { font-size: .8rem;}

div.pageContainer h3 { font-size: 18px; color: #606060; margin-top: 40px; }

table.portal tr { border: 0; }
table.portal td { text-align: left; width: auto; border: 0; padding: 0; }
table.portal td p { font-size: 16px; margin-bottom: 4px; }
table.portal > tbody > tr > td:first-child { text-align: right; padding-left: 1rem; }

table.portal > tbody > tr > td input { border: 0; color: #606060; padding: 2px 6px; border-radius: 4px; }
table.portal td input:focus { outline-color: transparent; outline-style: none; }
table.portal td:first-child { padding-right: 8px; }

#agentTicketHistoryMessage { height: 140px; border: 1px solid #f0f0f0;; margin: 0; background: #f8f8f8; padding: .3rem; }
#pendingCommentText { height: 140px; border: 1px solid #f0f0f0;; margin: 0; background: #f8f8f8; padding: .3rem; width: 100%; }

div.contacts { margin: 20px 0 30px 0; }
div.contacts > div { margin-bottom: 1rem; }
div.contacts input { margin-top: .3rem; }
div.contacts input.readOnly { border: 0; background: #f8f8f8; margin-top: .2rem; }
span.expired { color: #e04050; }
p.expired { color: #e04050; }

span.downloadLink { text-decoration: underline; cursor: pointer; }

div.reply table { width: 100%; }

#agentTicketList > div:nth-child(odd) { background: #f8f8f8; }
#agentTicketList > div { padding: .5rem 0; cursor: default }
#agentTicketList > div > div:first-child { font-size: .9rem; font-weight: 600; }
#agentTicketList > div { padding: .7rem 1rem; }

#userTicketList > div:nth-child(odd) { background: #f8f8f8; }
#userTicketList > div { padding: .5rem 0; cursor: default }
#userTicketList > div > div:first-child { font-size: .9rem; font-weight: 600; }
#userTicketList > div { padding: .7rem 1rem; }

div.ticketHistoryDiv {display: none;/* margin-left: 16px; */}
div.ticketHistoryDiv input[type=text] {padding: 4px 8px;border-radius: 3px;border: 1px solid #e0e0e0;width: 100%;font-weight: 500;}
div.ticketHistoryDiv select {padding: 4px 10px;text-align: center;min-width: 120px;border: 1px solid #e0e0e0;-webkit-appearance: none;-moz-appearance: none;appearance: none;}
div.ticketHistoryDiv textarea { width: 100%; height: 200px; border: 1px solid #e0e0e0; margin: 10px 0 8px 0; padding: 10px; }
div.ticketHistoryDiv > div > table td { text-align: left; vertical-align: top; padding-left: 30px; padding-right: 30px;}
div.ticketHistoryDiv > div > table td p { font-size: 16px; }
div.ticketHistoryDiv > div > table td p:first-child { text-align: right; font-size: 14px; }
div.ticketHistoryDiv > div > table td:first-child { padding: 20px 5px; }
div.ticketHistoryDiv > div > table td:first-child { background: #f8f8f8; width: 120px; text-align: center; }
div.ticketHistoryDiv > div.newReply div:first-child { padding-top: 10px; }
div.ticketHistoryDiv > div.newReply div:last-child { padding-bottom: 10px; }
div.ticketHistoryDiv > div.newReply table { width: 100%; }
div.ticketHistoryDiv table td:first-child { width: 140px; }
div.ticketHistoryDiv i.fa-user { font-size:24px; color: #808080; margin-top: 10px; }

.ticketHistoryDiv { padding-left: .5rem; padding-right: .5rem; }
.ticketHistoryDiv > div { padding: 1rem .5rem 0 0rem; }
.ticketHistoryDiv > div.ffBanner {  padding: 15px 30px; }
.ticketHistoryDiv > div > div > span { background: #f0f0f0; border-radius: 3px; padding: .2rem .3rem .2rem .3rem; display: block; min-height: 2rem;}
.ticketHistoryDiv > div > div > div > div { padding-bottom: .5rem;  }
.ticketHistoryDiv input[type=text] { width: 100%; max-width: 100%; }

#ticketHistorySubject { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }

#ticketHistoryFilesTable { margin-bottom: 6px; }
#ticketHistoryFilesTable td:first-child { text-align: left; border: 0; }
#ticketHistoryFilesTable tr { border: 0 }

div.ticketHistoryReplies table td { vertical-align: top; padding-bottom: 20px; }
div.ticketHistoryReplies table td:first-child { background: #f8f8f8; text-align: center; width: 120px; padding-top: 20px; padding-bottom: 30px; }
div.ticketHistoryReplies table td:last-child { text-align: left; padding: 0 30px 20px 30px }
div.ticketHistoryReplies .replyMessage { text-align: left; padding: 10px; background: #f8f8f8; outline: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; resize: none; }
div.ticketHistoryReplies div.reply { border-top: 2px solid #e0e0e0; padding: 1rem 0 }
div.ticketHistoryReplies div.replyMessage:focus { outline-color: transparent; outline-style: none; }
div.ticketHistoryReplies span.replyTime { text-align: left; padding: 10px; }

@media (max-width: 576px) 
{
    div.ticketHistoryDiv > div > table td:first-child { width: 80px; }
    div.ticketHistoryDiv > div.newReply table td:first-child  { width: 80px; }

    div.ticketHistoryDiv table td:first-child { width: 80px; }
    div.ticketHistoryReplies td:first-child { width: 80px; }
    div.ticketHistoryDiv i.fa-user { font-size: 1rem; }
}

table.tickets { max-width: 1000px; margin-top: 20px; margin-left: 5px; }
table.tickets tr { border: 0; }
table.tickets thead { border: 0; }
table.tickets tbody { border: 0; }
table.tickets td { text-align: left; border: 0; border-top: 1px solid #e0e0e0; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; padding: .4rem; }
table.tickets td:nth-child(1):hover { text-decoration: underline; cursor: pointer; }
table.tickets td:nth-child(3) { max-width: 500px; overflow: ellipsis; }
table.tickets td:nth-child(3):hover { text-decoration: underline; cursor: pointer; }
table.tickets th { text-align: left; font-weight: normal; border: 0; }

table.newTicket { margin-top: 20px;}
table.newTicket tr { border: 0; }
table.newTicket td { vertical-align: top; text-align: left; padding: .5rem 0; }
table.newTicket td:first-child { width: 100px; text-align: right; padding-right: 10px; }
table.newTicket textarea { padding: 3px 6px; border-radius: 3px; border: 1px solid #e0e0e0; width: 100%; height: 200px; }
table.newTicket select { padding: 4px 10px; text-align: center; min-width: 120px; border: 1px solid #e0e0e0; -webkit-appearance: none; -moz-appearance: none; appearance: none; }

table.ticketSummary td { white-space: nowrap; padding: .3rem 0 }
table.ticketSummary td:first-child { text-align: right; vertical-align: top; padding-right: .5rem; }

span.status { border-radius: 3px; color: white; padding: 5px 12px; font-size: 16px; min-width: 130px; display: inline-block; text-align: center; }
span.status.small { min-width: 7rem;; font-size: .9rem; padding: .8rem .5rem; margin-right: .5rem; margin-left: .5rem;}
span.status-submitted.small::after { content: "Submitted"; }
span.status-inprogress.small::after { content: "In Progress"; }
span.status-onhold.small::after { content: "On Hold"; }
span.status-closed.small::after { content: "Closed"; }

/* Small devices (landscape phones, 576px and up) */
@media (max-width: 576px) { span.status { padding: 3px 8px; font-size: .9rem; min-width: 60px; }}

span.status-new { background: #808080; }
span.status-submitted { background: #45c0f0; }
span.status-inprogress { background: #45c070; }
span.status-onhold { background: #b0b060; }
span.status-closed { background: #808080; }
span.status-newticket { background: #306090; }

#startNewTicketDiv { padding: .5rem 1rem; margin-bottom: 30px; }

#newTicketDiv { display: none; margin-bottom: 20px; padding-left: 1rem; }
#newTicketDiv input[type=text] { width: 100%; border: 1px solid #e0e0e0; border-radius: 3px; padding: 3px 8px;  }

#newTicketFilesTable { margin-bottom: 6px; }
#newTicketFilesTable span { background: #f0f0f0; padding: .3rem .5rem; display:block; margin-bottom: .3rem; }

#agentTicketHistoryFilesTable { margin-bottom: 6px; }
#agentTicketHistoryFilesTable div { background: #f0f0f0; padding: .3rem .5rem; display:block; margin-bottom: .3rem; }

#newTicketFollowersTable td { white-space: nowrap; }
#newTicketFollowersTable td:first-child { text-align: left; border: 0; padding-left: 0; }

table.ticketHistoryFollowersTable tr { border: 0; }
table.ticketHistoryFollowersTable td:first-child { text-align: left; border: 0; padding-left: 0; }

div.uploading { display:none; background: #208020; color: white; width: 200px; margin: 4px 0; border-radius: 3px; text-align: center; padding: 4px 8px; }
div.uploadComplete { background: #40c040; }

.btn-primary { background: #2984C5; }
.btn:hover { color: #ffffff; }
.btn { color: #f0f0f0; border-radius: .3rem; }
.btn-simple { font-weight: 600; margin-left: 0; background: #155085 !important; box-shadow: none !important; }
.btn-simple:hover { background: darkorange !important; color: white; text-decoration: underline; }

span.logoutButton { float:right; }
span.changePasswordButton { float:right; }
#changePasswordForm input { margin-top: .3rem; }

#ticketHistoryBanner { margin-bottom: 15px; }

#accountMessage { margin-top: 25px; }

/* Search box */
div.searchContainer { display: flex; flex-wrap: wrap; padding: 15px 20px 20px 20px; background: #70a0c0; border-radius: 10px; color: white; font-weight: bolder; font-size: 18px; }
div.searchContainer div:first-child { padding-top: 8px; padding-left: 12px; }
div.searchContainer div:last-child { width: 100%; padding-left: .5rem; }
div.searchContainer input { width: 100%; background: #70a0c0; color: white; border: 0; border-bottom: 2px solid #80b0d0; font-weight: bolder; outline: none; font-size: 20px; padding: .5rem .2rem .1rem .2rem; }
div.searchContainer input::placeholder { color: #a0d0f0; }
div.noMatches { display: none; font-size: 1.2rem; padding-top: 20px; }

div.searchContainer { background: #93bb61; }
div.searchContainer input { background: #93bb61; border-bottom: 2px solid #b3eb81; }
div.searchContainer input::placeholder { color: #c3fb91; }

.searchContainerRow { background: #f8f8f8; padding: 40px 8% 5px 8%; border-top: 2px solid #606060;  }
.searchContainerRow > div { padding: 0; }
.searchResultsRow .popularLabel { display: none; padding: 10px 0; }

.searchResultsRow { background: #f8f8f8; padding: 5px 8% 0 8%; transition: .3s; }
.searchResultsContainer { display: flex; flex-wrap: wrap; padding-bottom: 2rem; }
.searchResultsContainer > div { display: none; flex: 1; min-width: 25%; background: white; transition: .5s; border: 1px solid #e0e0e0; border-radius: 5px; padding: 0; margin: .2rem; font-size: 15px; color: #606060; cursor: pointer; }
.searchResultsContainer > div > div { padding: 15px 20px; }
.searchResultsContainer > div > div a { margin-right: 15px; white-space: nowrap; }
.searchResultsContainer > div > h3 { font-size: 15px; color: #404040; margin: 0; padding: 10px 20px; background: #f0f0f0; border-bottom: 1px solid #e0e0e0; transition: .5s; }
.searchResultsContainer > div > div:nth-child(3) { font-size: 14px; font-weight: bold; padding-top: 0; }

.searchResultsContainer > div:hover { box-shadow: 3px 3px 10px #e0e0e0; }
.searchResultsContainer > div:hover h3 { background: #e0e0e0; }

.searchResultsContainer .more { display: none; border: 0; background: transparent; border: 1px solid transparent; }
.searchResultsContainer .more:hover { border: 1px solid #e0e0e0; }
.searchResultsContainer .more h3 { border: 0; background: transparent; padding-bottom: 0; padding-top: 15px; }
.searchResultsContainer .more div { padding-top: 0; }
.searchResultsContainer .noMatches { display: none; }

/* Small devices (landscape phones, 576px and up) */
@media (max-width: 576px) 
{
    div.searchContainer { font-size: 18px; align-items: flex-start; }
    div.searchContainer input { font-size: 16px; }
    .searchResultsContainer > div { min-width: 50%; }
}

/* 30 days of FrameFlow project */
p.ff-30-days img { text-align: center; width: 100%; }
p.ff-30-days { border: 1px solid #e0e0e0; }

/* Event monitor references technical resources section */
.monitor-reference a.tag { color: white; }
.monitor-reference h1 { font-size: 25px; margin-top: 30px; margin-bottom: 2px; }
.monitor-reference h2 { font-size: 22px; margin-top: 30px; margin-bottom: 3px; }
.monitor-reference h3 { font-size: 18px; margin-top: 30px; margin-bottom: 5px; }
.monitor-reference img.sample-output { border: 1px solid #e0e0e0; }
.monitor-reference div.tag { display: inline-block; border: 2px solid #e0e0e0; padding: 6px 12px; border-radius: 4px; background: yellow; color:white }
.monitor-reference div.tip { border-left: 4px solid yellow; padding: 15px 0 15px 15px; font-size: 14px; color: #404040; background: #f8f8f8; margin-top: 20px; }
.monitor-reference .monitor-header { border-bottom: 3px solid yellow; padding-bottom: 4px; }
.monitor-reference .monitor-header img { width:64px; }
.monitor-reference table.spreadSheet td { text-align: left; padding-left: 10px; border-color: #e0e0e0; }
.monitor-reference table.spreadSheet th { text-align: left; padding-left: 10px; }
.monitor-reference.red div.tip { border-color: red; }
.monitor-reference.red .monitor-header { border-color: red; margin-bottom: 10px; }
.monitor-reference.red div.tag { background: red; }
.monitor-reference.darkred div.tip { border-color: #8b0000; }
.monitor-reference.darkred .monitor-header { border-color: #8b0000; margin-bottom: 10px; }
.monitor-reference.darkred div.tag { background: #8b0000; }
.monitor-reference.burgundy div.tip { border-color: #ac2566; }
.monitor-reference.burgundy .monitor-header { border-color: #ac2566; margin-bottom: 10px; }
.monitor-reference.burgundy div.tag { background: #ac2566; }
.monitor-reference.magenta div.tip { border-color: #fe77fe; }
.monitor-reference.magenta .monitor-header { border-color: #fe77fe; margin-bottom: 10px; }
.monitor-reference.magenta div.tag { background: #fe77fe; }
.monitor-reference.bubblegum div.tip { border-color: #ff69b4; }
.monitor-reference.bubblegum .monitor-header { border-color: #ff69b4; margin-bottom: 10px; }
.monitor-reference.bubblegum div.tag { background: #ff69b4; }
.monitor-reference.pink div.tip { border-color: #d198c5; }
.monitor-reference.pink .monitor-header { border-color: #d198c5; margin-bottom: 10px; }
.monitor-reference.pink div.tag { background: #d198c5; }
.monitor-reference.orange div.tip { border-color: #ed820e; }
.monitor-reference.orange .monitor-header { border-color: #ed820e; margin-bottom: 10px; }
.monitor-reference.orange div.tag { background: #ed820e; }
.monitor-reference.yellow div.tip { border-color: #d0a92c; }
.monitor-reference.yellow .monitor-header { border-color: #d0a92c; margin-bottom: 10px; }
.monitor-reference.yellow div.tag { background: #d0a92c; }
.monitor-reference.lime div.tip { border-color: #8bc41a; }
.monitor-reference.lime .monitor-header { border-color: #8bc41a; margin-bottom: 10px; }
.monitor-reference.lime div.tag { background: #8bc41a; }
.monitor-reference.green div.tip { border-color: #19b17a; }
.monitor-reference.green .monitor-header { border-color: #19b17a; margin-bottom: 10px; }
.monitor-reference.green div.tag { background: #19b17a; }
.monitor-reference.teal div.tip { border-color: #199ebd; }
.monitor-reference.teal .monitor-header { border-color: #199ebd; margin-bottom: 10px; }
.monitor-reference.teal div.tag { background: #199ebd; }
.monitor-reference.blue div.tip { border-color: #6666ff; }
.monitor-reference.blue .monitor-header { border-color: #6666ff; margin-bottom: 10px; }
.monitor-reference.blue div.tag { background: #6666ff; }
.monitor-reference.navy div.tip { border-color: #000083; }
.monitor-reference.navy .monitor-header { border-color: #000083; margin-bottom: 10px; }
.monitor-reference.navy div.tag { background: #000083; }
.monitor-reference.purple div.tip { border-color: #9370db; }
.monitor-reference.purple .monitor-header { border-color: #9370db; margin-bottom: 10px; }
.monitor-reference.purple div.tag { background: #9370db; }
.monitor-reference.eggplant div.tip { border-color: #880080; }
.monitor-reference.eggplant .monitor-header { border-color: #880080; margin-bottom: 10px; }
.monitor-reference.eggplant div.tag { background: #880080; }
.monitor-reference.gray div.tip { border-color: #7c6e7f; }
.monitor-reference.gray .monitor-header { border-color: #7c6e7f; margin-bottom: 10px; }
.monitor-reference.gray div.tag { background: #7c6e7f; }
.monitor-reference.brown div.tip { border-color: #ca9e7b; }
.monitor-reference.brown .monitor-header { border-color: #ca9e7b; margin-bottom: 10px; }
.monitor-reference.brown div.tag { background: #ca9e7b; }

.comment-title { font-weight: bold; text-decoration: none; }
.comment-date { font-weight: normal; text-decoration: none; font-size: 15px; }

table.spreadSheet { border-collapse: collapse; width: 100%; }​

table.spreadSheet tr:focus { outline-style: none; box-shadow: none; border-color: transparent; }
table.spreadSheet th, table.spreadSheet td { padding: 2px 6px 0 6px; border: solid 1px #e0e0e0; white-space: nowrap; -moz-user-select: none; -webkit-user-select: none; -khtml-user-select: none; -ms-user-select: none; user-select: none; }
table.spreadSheet th { height: 32px; vertical-align: middle; background: #f8f8f8; text-align: left; cursor: default; }
table.spreadSheet td:first-child { background: #f8f8f8; text-align: center; width: 16px; cursor: default; -moz-user-select: none; user-select: none; }
table.spreadSheet td { overflow: hidden; cursor: default; height: 28px; }

.article-cta
{
    background: #2984C5;
    border-radius: 5px;
    padding: 1rem 2rem;
    color: white;
}

.article-cta a
{
    color: white;
    text-decoration: none;
}

.article-cta a.yellow
{
    color: #ffff60;
    text-decoration: none;
}