/* ===================
	Index:
		1. Colors
		2. Backgrounds
		3. Borders
 ===================*/

/*------------------- Colors -------------------*/
h3, h5, a, nav.mainNav ol > li > a, dt,
nav.mainNav .dropDown ul li a:hover,
.optionsRibbon ul li a:hover, footer div:not(.footerBase) a.language:hover, header h1 a:hover, #contentBody h2, .alternateBg h2, .alternateBg h4, #wrapper.comparisons p.center span, .columnR p strong, .primaryColorText, .resources .fullColumn h2, .lrgTopHeading, .contactForm .smallHint, #facebox .frmLogin .loginOptions a, .floatingNav + .mid_page_parallax_header .contentHeader h2
{
    color: #645892; /* purple */
}
footer .footerBase span a {
    color: #9e8fd8; /* light purple */
}

/*------------------- Backgrounds -------------------*/
#socialBlocks li a:hover, .floatingNav > a:hover {
    background-color: #423963;  /* dark purple */
}
nav.mainNav ol > li.signupHolder a:hover span, .tp-caption.solidButton,
.difSignIn, input[type="submit"], input[type="button"], button,
#facebox .header, .jconfirm .jconfirm-box div.title, .colorBtn, .navButtons a.button, .newsHolder div > a, .awardsNav div, #wrapper.tour .contentHeader, .comparisonsBlocks a.contentBlock:nth-child(3n+2), .mm-menu .signupMobile, .colorBtn:hover, .navButtons a.button:hover, .floatingNav > a, .colorBtn2 {
    background-color: #645892;  /* purple */
}
.comparisonsBlocks a.contentBlock, .imgIcons li:nth-child(3n+3) span, .colorBtn.blue {
    background-color: #7897b3; /* blue */
}
.imgIcons li:nth-child(3n+2) span, .tour .colorBtn, .tour_nav a, .newsHolder div > a:hover, .tour_progress {
    background-color: #7575b4; /* light purple */
}
.comparisonsBlocks a.contentBlock:nth-child(3n+3), .imgIcons li span {
    background-color: #505161; /* purple grey */
}
.colorBtn.aqua, nav.mainNav ol > li.signupHolder a span, .brochure .columnL h2:before, .resources .colorBtn {
    background-color: #57ad9c; /* aqua */
}
a.smlSignupButton {
    background-color: #e8a300; /* golden yellow */
}
.timeline .timeline-text > div, .timeline-footer-wrap > div, .timeline-arrow:after {background-color: #645892}
.timeline ul li:nth-child(3n+2) .timeline-text > div, .timeline ul li:nth-child(3n+2) .timeline-arrow:after {background-color: #6a8285}
.timeline ul li:nth-child(3n+3) .timeline-text > div, .timeline ul li:nth-child(3n+3) .timeline-arrow:after {background-color: #444d4f}

.home .implementation .timeline .timeline-text > div > div:first-child,
.home .implementation .timeline-arrow:after,
.home .implementation .timeline .timeline-date p {background-color: #4a3e6d}
.home .implementation .timeline li:nth-child(4n+2) .timeline-text > div > div:first-child,
.home .implementation .timeline li:nth-child(4n+2) .timeline-arrow:after,
.home .implementation .timeline li:nth-child(4n+2) .timeline-date p {background-color: #4fad9e}
.home .implementation .timeline li:nth-child(4n+3) .timeline-text > div > div:first-child,
.home .implementation .timeline li:nth-child(4n+3) .timeline-arrow:after,
.home .implementation .timeline li:nth-child(4n+3) .timeline-date p {background-color: #43857b}
.home .implementation .timeline li:nth-child(4n+4) .timeline-text > div > div:first-child,
.home .implementation .timeline li:nth-child(4n+4) .timeline-arrow:after,
.home .implementation .timeline li:nth-child(4n+4) .timeline-date p {background-color: #655592}

.columnL h2:before {background: #ecbd0c}

.tour_progress li a:hover span,
.tour_progress[selected-item="nav_item1"] li.nav_item1 a span,
.tour_progress[selected-item="nav_item2"] li.nav_item2 a span,
.tour_progress[selected-item="nav_item3"] li.nav_item3 a span,
.tour_progress[selected-item="nav_item4"] li.nav_item4 a span,
.tour_progress[selected-item="nav_item5"] li.nav_item5 a span,
.tour_progress[selected-item="nav_item6"] li.nav_item6 a span,
.tour_progress[selected-item="nav_item7"] li.nav_item7 a span,
.tour_progress[selected-item="nav_item8"] li.nav_item8 a span,
.tour_progress[selected-item="nav_item9"] li.nav_item9 a span,
.tour_progress[selected-item="nav_item10"] li.nav_item10 a span,
.tour_progress[selected-item="nav_item11"] li.nav_item11 a span,
.tour_progress[selected-item="nav_item12"] li.nav_item12 a span {background-color: #5a5a94 !important}

.top_bg_circle:before {
    background: linear-gradient(135deg, #695490 50%, #36376d 85%)
}
#wrapper.faq #contentHeader, #wrapper.privacy #contentHeader, #wrapper.brochure #contentHeader, .brochure .hosted_by, .brochure .videos {
    background: linear-gradient(135deg, #58ad9d, #28716e)
}
#wrapper.resources #contentHeader, #wrapper.infographics #contentHeader {
    background: linear-gradient(135deg, #49a79e, #3a6592)
}
#wrapper.implementation #contentHeader, #wrapper.comparisons #contentHeader {
    background: linear-gradient(135deg, #494967, #8787a2)
}
#wrapper.stories #contentHeader, #wrapper.about #contentHeader, #wrapper.terms #contentHeader, #wrapper.gdpr #contentHeader, #wrapper #contentHeader {
    background: linear-gradient(135deg, #6aad64, #1d5c4a)
}
#wrapper.tour #contentHeader, #wrapper.story #contentHeader, #wrapper.sitemap #contentHeader, .contactSales #contentWrap {
    background: linear-gradient(-45deg, #36376d, #695490)
}
#wrapper.tour.comparison #contentHeader, #wrapper.error404 #contentHeader {
    background: linear-gradient(-45deg, #d07f07, #f7bd0e)
}
#wrapper.pricing #contentHeader {
    background: linear-gradient(135deg, #a74e6c, #6b233c)
}
#wrapper.news #contentHeader {
    background: linear-gradient(135deg, #d47134, #a94571);
}
#wrapper.contact #contentHeader {
    background: linear-gradient(135deg, #0d8198, #7658b1);
}
.signup #contentWrap {background: linear-gradient(-52deg, #58ad9d, #645792)}
#contentFooter {background: linear-gradient(135deg, #695490, #36376d)}

/*------------------- Borders -------------------*/
header {
    border: 1px solid #7575b4; /* light purple */
}
ul.dotNav li a.selected span, .no-touch ul.dotNav li a:hover span {
    border: 1px solid #645892 !important; /* purple */
}