/* Minification failed. Returning unminified contents.
(83,84): run-time error CSS1046: Expect comma, found '0'
(83,88): run-time error CSS1046: Expect comma, found '/'
(111,122): run-time error CSS1046: Expect comma, found '0'
(111,126): run-time error CSS1046: Expect comma, found '/'
(129,122): run-time error CSS1046: Expect comma, found '0'
(129,126): run-time error CSS1046: Expect comma, found '/'
(279,108): run-time error CSS1034: Expected closing parenthesis, found '/'
(279,108): run-time error CSS1042: Expected function, found '/'
(279,112): run-time error CSS1062: Expected semicolon or closing curly-brace, found ')'
(286,121): run-time error CSS1046: Expect comma, found '184'
(286,128): run-time error CSS1046: Expect comma, found '/'
(287,121): run-time error CSS1046: Expect comma, found '184'
(287,128): run-time error CSS1046: Expect comma, found '/'
(355,101): run-time error CSS1046: Expect comma, found '0'
(355,105): run-time error CSS1046: Expect comma, found '/'
(355,129): run-time error CSS1046: Expect comma, found '0'
(355,133): run-time error CSS1046: Expect comma, found '/'
(635,133): run-time error CSS1046: Expect comma, found '0'
(635,137): run-time error CSS1046: Expect comma, found '/'
(635,161): run-time error CSS1046: Expect comma, found '0'
(635,165): run-time error CSS1046: Expect comma, found '/'
 */
/* colour list */
/* Dark blue     #23194A */
/* Bright orange #FC9B55 */
/* Dark orange   #E8885E */
/* Green 1       #88BF4E */
/* Green 2       #76A644 */
/* Green 3       #26B870 */
/* Green 4       #1C8550 */
/* White         #FFFFFF */
/* Grey 1        #F4F4F4 */
/* Grey 2        #8C8B8B */
/* Grey 3        #707070 */
/* Black         #0D0D0D */

/*font-styles, custom css styles goes here*/
@import url('https://fonts.googleapis.com/css2?family=Lexend:wght@300;400;600&display=swap');

body { font-family: 'Lexend', Arial, Tahoma, sans-serif; }
h1 { font-weight: 700; margin-bottom: 1em; line-height: 1.6em; letter-spacing: 0px; }
h2 { font-weight: 700 !important; margin-bottom: 1em; line-height: 1.2em; letter-spacing: 0px; }
h3 { font-weight: 700 !important; margin-bottom: 1em; line-height: 1.4em; letter-spacing: 0px; }
h4 { font-weight: 700 !important; margin-bottom: 1em; line-height: 1.4em; letter-spacing: 0px; }
p { font-weight: 400; margin-top: 1rem; color: #0D0D0D; margin-bottom: 1rem; line-height: 1.4em; letter-spacing: 0.25px; }
p > small { line-height: 0; }




/* buttons */
.btn { line-height: 1.6em; background-color: #26b870; color: #fff; margin:15px 0 0; padding: 1em 2em; font-weight: 500; border-color: #26b870; border-width: 0.15em; font-size: 0.8em; width: 200px; }
.btn-primary { border-color: #26b870; min-width: 150px; min-height: 60px; display: flex; align-items: center; justify-content: center; }
.btn-secondary { color: #26b870; background-color: #FFFFFF; width: 220px; }
.btn-default { border-color: #26b870; width: 220px; }
.btn-primary:hover, .btn-default:hover { background-color: #1C8550; color: #fff; border-color: #26b870; }
.btn-primary:focus, .btn-default:focus { background: #1C8550; border-color: #1c8550; box-shadow: 0 0 0 0.25rem #26b870 !important; }
.btn-primary:active, .btn-default:active { background-color: #1C8550; border-color: #1C8550; box-shadow: inset 0px 0px 5px #146f41; }
.btn-secondary:hover { background-color: #26b870; color: #fff; border-color: #26b870 }
.btn-secondary:active { background-color: #1C8550; color: #f4f4f4; box-shadow: inset 0px 0px 5px #146f41; }
.btn-secondary:focus { background-color: #26b870; color: #fff; border-color: #26b870; box-shadow: 0 0 0 0.25rem #1C8550 !important; }
.btn:disabled { opacity: 0.6; cursor: not-allowed; }

/*ask Craig about a blue border that momentarily pops up before focus comes on*/

/*!CK-EXCLUDE*/
/*!CK-EXCLUDE*/
/*anything below will be excluded from the CMS editor*/


/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt { white-space: normal; }

/*navbar*/
.navbar { padding-top: 0; }
.navbar-nav { min-width: 500px; justify-content: right; }
.navbar-brand { max-width: 200px; }
.fixed-top { background-color: #fff; padding: 30px 0 20px 0; box-shadow: 0 2px 4px 0 rgba(0,0,0,.2); }
.home { background-color: transparent; box-shadow: 0; }
.navbar-expand-lg { width: 100%; }
.navbar-toggler { border: none !important; }
.navbar-toggler:focus { box-shadow: none !important; }
.navigation ul { margin: 0; padding: 0; }
.navigation > li > ul { padding: 20px 25px; }
.navigation > li > ul ul { margin-bottom: 10px !important; }
.navigation > li > a { text-transform: uppercase; font-size: 0.9em; font-weight: bold; padding: 0.5rem 1rem !important; }
.navigation > li ul a { padding: 4px 0; background-color: #fff !important; color: #000; text-decoration: none; width: 100%; display: inline-block; }
.navigation > li > ul > li > a { text-transform: uppercase; font-size: 0.8em; font-weight: bold; }
.navigation > li > ul > li > ul > li > a { font-size: 0.8em; padding-left: 15px; }
.navigation .has-children > a { font-weight: bold; }
.navigation > li > ul > li > ul > li li > a { font-size: 0.8em; padding-left: 28px; }
.navigation > li > ul > li > ul { margin: 0; padding: 0; }
.navigation ul > li { list-style: none; margin: 0; }
.navigation #nav-31629 + ul { width: 100%; left: 0; }
.navigation #nav-31629 + ul > li { float: left; width: 348px; }
.navigation a.show { color: #26b870 !important; }
.navigation a.active, .dropdown-item.active, .dropdown-item:active { color: #26b870 !important; }

nav > div > div { position: relative; }

/*transparent navbar on the home page*/
body.home > .fixed-top { background-color: transparent; box-shadow: none; }
body.scrolled > .fixed-top { background-color: #fff; box-shadow: 0 2px 4px 0 rgb(0 0 0 / 20%); }


/*toggler animation*/
.navbar-toggler { border: none; }
.navbar-toggler:focus, .navbar-toggler:active, .navbar-toggler-icon:focus { outline: none; box-shadow: none; border: 0; }
.toggler-icon { width: 30px; height: 3px; background-color: #8b8b8b; display: block; transition: all 0.2s; }
.middle-bar { margin: 5px auto; }
.navbar-toggler .top-bar { transform: rotate(45deg); transform-origin: 16% 16%; }
.navbar-toggler .middle-bar { opacity: 0; }
.navbar-toggler .bottom-bar { transform: rotate(-45deg); transform-origin: 9% 9%; }
.navbar-toggler.collapsed .top-bar { transform: rotate(0); }
.navbar-toggler.collapsed .middle-bar { opacity: 1; }
.navbar-toggler.collapsed .bottom-bar { transform: rotate(0); }
.navbar-toggler.collapsed .toggler-icon { background-color: #8b8b8b; }

/*navbar is transparent on the homepage*/
/*.navbar.fixed-top { background-color: transparent; box-shadow: none;}*/
/*small desktop*/
@media screen and (min-width:992px) and (max-width:1199px) { /*navbar styling*/
    .navbar-brand { max-width: 150px; }
    .navigation > li > a { padding: 0.5rem 1rem !important }
    .navigation #nav-31629 + ul > li { width: 238px; }
}

/*tablet-adjustments*/
@media (min-width: 760px) and (max-width: 992px) {
    /*navbar styling*/
    .navbar-nav { min-width: auto; max-width: 340px; float: right; background-color: #fff; box-shadow: 0 2px 4px 0 rgb(0 0 0 / 20%); padding: 15px; }
    .navbar-brand { max-width: 150px; }
    .navigation > li > a { padding: 0.5rem 0 !important; }
    .navigation a::after { border: none; }
    .navigation { overflow-y: scroll; -webkit-overflow-scrolling: touch; }
    .navigation ul { float: left; width: 100%; top: 0 !important; margin-bottom: 10px; position: relative !important; display: inline-block; border: 0; padding: 0; }
    .navigation > li > ul { display: inline-block !important; border-bottom: solid 1px #eee; padding: 0 0 15px 0 !important; }
    .navigation > li { float: left; width: 100% !important; }
    .navigation #nav-31629 + ul { width: 100%; }
    .navigation #nav-31629 + ul > li { width: 100%; }
    header > .navbar > .container { padding-left: 0; padding-right: 0; }
    .fixed-top { height: 113px; }
    .navbar-collapse { top: 53px; position: absolute; right: 0; }
}

/*mobile adjustments*/
@media screen and (max-width:768px) {
    /*navbar styling*/
    .navbar-nav { min-width: auto; max-width: 340px; float: right; background-color: #fff; box-shadow: 0 2px 4px 0 rgb(0 0 0 / 20%); padding: 15px; }
    .navbar-brand { max-width: 150px; }
    .navigation > li > a { padding: 0.5rem 0 !important; }
    .navigation a::after { border: none; }
    .navigation { overflow-y: scroll; -webkit-overflow-scrolling: touch; }
    .navigation ul { float: left; width: 100%; top: 0 !important; margin-bottom: 10px; position: relative !important; display: inline-block; border: 0; padding: 0; }
    .navigation > li > ul { display: inline-block !important; border-bottom: solid 1px #eee; padding: 0 0 15px 0 !important; }
    .navigation ul li { float: left; width: 100% !important; }
    .navigation #nav-31629 + ul { width: 100%; }
    .navigation #nav-31629 + ul > li { width: 100%; }
    .fixed-top { height: 113px; }
    .navbar-collapse { top: 53px; position: absolute; right: 0; }
}

/*mobile adjustments*/
/*pane ovverrirde*/
@media screen and (max-width:768px) {
    .content-width, .full-width { padding-top: 35px !important; padding-bottom: 35px !important; }
    .content-width .content-width, .full-width .full-width { padding-top: 0 !important; padding-bottom: 0 !important; }
    .widget > div { padding-left:0!important; padding-right:0!important; }
}


/*large desktop*/
@media screen and (min-width:1200px) and (max-width:1399px) {
    .navigation #nav-31629 + ul > li { width: 288px; }
}

/*image styling*/
.img-responsive { display: inline-block; max-width: 100%; height: auto; }

/*mobile adjustments*/
@media screen and (max-width:768px) {
    /*image styling*/
    .body-content img { width: 100%; max-width: 100%; margin-bottom: 0.5em; }
}

/*hero section*/
.content-width { background-size: cover; }
.full-width.wave { background-color: transparent !important; padding: 0; margin-top: -140px; height: 175px; overflow: hidden; }
.full-width.wave .widget { background-color: transparent !important; }
.full-width.wave .wrap-layer { position: relative; }
.full-width.wave .background-layer { position: absolute; width: 100%; height: auto; top: 0; left: 0; }

/*large desktop*/
@media screen and (min-width:1199px) and (max-width:1399px) {
    /*wave styling*/
    .full-width.wave { margin-top: -104px; height: 222px; }
}

/*small desktop*/
@media screen and (min-width:991px) and (max-width:1199px) {
    /*wave styling*/
    .full-width.wave { margin-top: -95px; height: 210px; }
}

/*tablet-adjustments*/
@media screen and (min-width: 759px) and (max-width: 991px) {
    /*wave styling*/
    .full-width.wave { margin-top: -70px; height: 142px; }
}

/*mobile adjustments*/
/*the wave in mobile needs several adjustments to hide the background*/
@media screen and (min-width:599px) and (max-width:759px) {
    /*wave styling*/
    .full-width.wave { margin-top: -100px; height: 150px; }
}

@media screen and (min-width:499px) and (max-width:599px) {
    /*wave styling*/
    .full-width.wave { margin-top: -75px; height: 135px; }
}

@media screen and (min-width: 400px) and (max-width:499px) {
    /*wave styling*/
    .full-width.wave { margin-top: -70px; height: 110px; }
}

@media (max-width:400px) {
    /*wave styling*/
    .full-width.wave { margin-top: -60px; height: 100px; }
}



/*video*/
.home #video { padding-right: 0; padding-left: 0; }
iframe { width: 100%; }

/*testimonals*/
#testimonials { background-color: #F4F4F4; }
.marker { color: #26b870; }
#testimonials > .container > .row > div > div { margin-top: 1rem; }


/*footer*/
footer { background-color: #26b870; padding: 60px 0 0 0; }
footer > .container > .row > div { display: inline-block; vertical-align: top; }
footer .menu-group { margin-bottom: 2rem; }
footer > .container > .row { padding: 1.2rem 0 0.6rem 0; }
footer h3 { color: #fff; font-size: 0.8rem; font-weight: 500; }
footer a { color: #fff; text-decoration: none; font-size: 0.8rem; font-weight: 300; letter-spacing: 0.5px; }
footer a:hover { color: #0D0D0D; }
footer ul { padding-left: 0; }
footer li { list-style-type: none; margin: 0.2em 0; }
footer > .container-fluid { padding: 3rem 0.75rem 3rem 0.75rem; background-color: #1C8550; }
.footer-copyright { color: #fff; text-align: center; font-size: 0.7rem; font-weight: 300; line-height: 1.8em; }

#sap-logo { margin-bottom: 1rem; }
#microsoft-logo { margin-bottom: 1rem; }

/*#meta {
    height:20px;
    position: relative;
    top: 3px;
  
}*/
#ngage-logo { padding-bottom: 15px; }
.business-address { color: #fff; font-weight: 300; font-size: 0.8rem; }
.business-phone { font-weight: 700; color: #fff; font-size: 0.8rem; padding-bottom: 1rem; }


/*mobile adjustments*/
@media screen and (max-width:768px) {
    /*footer styling*/
    #ngage-logo { margin-top: 30px; }
    footer * { text-align: center; }
}


/*Form fields base code*/
.widget.emailform { height: auto !important; overflow: hidden; width: 100%; }
.widget.emailform > div { display: inline-block; width: 100%; }
.widget.emailform .textarea > .input-group > textarea { height: 150px; resize: none; font-size: 0.8em; padding: 25px 15px 10px; }
.widget.emailform .textarea > .input-group > textarea:focus { z-index: 1; }
.widget.emailform .input-group > .form-control { height: 50px; padding-top: 1.4em; }
.widget.emailform .input-group > .form-control:focus { z-index: 1; }
.widget.emailform label { padding: 0 13px; font-size: 0.7em; color: #707070; z-index: 3; position: absolute; margin-top: 6px; }
.widget.emailform .form-check > div > label { font-size: 1em; width: calc(100% + -20px); margin-top: 0; cursor: pointer; }
.widget.emailform .radio > div > label { font-size: 1em; width: calc(100% + -20px); margin-top: 0; cursor: pointer; }
.wiget.emailform .invalid-tooltip { z-index: 3; }
.widget.emailform > div > div > div { position: relative; padding: 4px; }
.widget.emailform .input-group > span { display: none; }
.widget.emailform input[type=email] { border-top-left-radius: 0.25rem !important; border-bottom-left-radius: 0.25rem !important; }
.widget.emailform .questions > div { width: 50%; display: inline-block; padding: 0 0 0 15px; }
.widget.emailform .questions > div:nth-child(2n+1) { padding: 0 15px 0 0; }
.widget.emailform .form-check { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
.widget.emailform .form-check > div > input[type=checkbox] { cursor: pointer; }
.widget.emailform .form-check > div > input[type=checkbox]:hover { background-color: #f4f4f4; }
.widget.emailform .form-check > div > input[type=checkbox]:focus { box-shadow: 0 0 0 0.25rem rgb(38,184,112/50%); }
.widget.emailform .form-check > div > input[type=checkbox]:checked { background-color: #1C8550; color: #fff; }
.was-validated .form-check-input:valid, .form-check-input.is-valid { border-color: #ced4da; }
.was-validated .form-check-input:valid ~ .form-check-label, .form-check-input.is-valid ~ .form-check-label { color: #707070; }
.widget.emailform .form-check { padding-left: 0; }
.widget.emailform .form-check .form-check-input { margin-left: 0; }
.widget.emailform .form-group > div > input[type=radio] { cursor: pointer; margin-top: 5px; }
.widget.emailform .form-group > div > input[type=radio]:hover { border-color: #1C8550; box-shadow: 0 0 0 0.25rem rgb(38 184 112/20%); }
.widget.emailform .form-group > div > .form-check-input:focus { border-color: #1C8550; box-shadow: 0 0 0 0.25rem rgb(38 184 112/50%) !important; }
.widget.emailform .form-group > div > .form-check-input:checked { background-color: #1C8550; border-color: #1C8550; }
.widget.emailform > div > div > div > .form-group { text-align: center; }
.widget.emailform > div > div > div > div:nth-last-child(2) { width: 100%; }
.widget.emailform .form-group > .widget-submit { margin: 1.5rem 1.5rem; }


/*mobile adjustments*/
/*email form section*/
@media screen and (max-width:768px) {
    .widget.emailform > div { display: initial; }
    .widget.emailform .questions > div { width: 100%; display: inline-block; padding: 0; }
    .widget.emailform .questions > div:nth-child(2n+1) { padding: 0; }
}
/*tablet-adjustments*/
/*email form section*/
@media (min-width: 760px) and (max-width: 992px) {
    .widget.emailform .questions > div { width: 100%; display: inline-block; padding: 0; }
    .widget.emailform .questions > div:nth-child(2n+1) { padding: 0; }
}
/*small desktop*/
/*email form section*/
@media screen and (min-width:992px) and (max-width:1199px) {
    .widget.emailform .questions > div { width: 50%; display: inline-block; padding: 0 0 0 15px; }
    .widget.emailform .questions > div:nth-child(2n+1) { padding: 0 15px 0 0; }
}



/*scroller*/
.widget.scrollingcontent .scrolling-wrapper { position: absolute; width: 100%; overflow: hidden; }
.widget.scrollingcontent .scrolling-wrapper > span.btn-right { cursor: pointer; right: 0; top: initial; font-size: 2em; position: absolute; z-index: 10; line-height: 1.2em; width: 50px; display: inline-block; background-color: #fff; }
.widget.scrollingcontent .scrolling-wrapper .scrolling-item { padding: 0; position: absolute; display: inline-block; float: left; width: 0; background: no-repeat center center; }
.widget.scrollingcontent .scrolling-wrapper > span.btn-left { cursor: pointer; left: 0; top: initial; font-size: 2em; position: absolute; z-index: 10; line-height: 1.2em; width: 50px; display: inline-block; background-color: #fff; }
.widget.scrollingcontent .scrolling-wrapper > span > i { font-size: 1.2em; margin: 164px 12px 0; }
.widget.scrollingcontent .scrolling-wrapper .icons { position: absolute; width: 100%; bottom: 10px; text-align: center; font-size: 0.8em; }
.widget.scrollingcontent .scrolling-wrapper .icons > i { margin: 0 4px; }
.widget.scrollingcontent .scrolling-wrapper .icons .selected { color: orange; }
.widget.scrollingcontent .scrolling-wrapper .scrolling-item > div { height: 100%; background-size: cover; }
.widget.scrollingcontent .image-box > div::after { z-index: 2; content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 200px; background-color: #fff; background: url(/Images/photo-overlay-white.png); background-size: contain; background-repeat: no-repeat; }
.widget.scrollingcontent .image-box > div img { width: 150px !important; height: 150px !important; }
.widget.scrollingcontent .image-box > div { width: 200px !important; height: 200px !important; position: relative; text-align: right; }
.widget.scrollingcontent .image-box { text-align: right; }
.widget.scrollingcontent { background-color: #fff; border-radius: 0; box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; }
.widget.scrollingcontent .scrolling-item * { color: #000; }
.widget.scrollingcontent.green { background-color: #1C8550; border-radius: 1rem; }
.widget.scrollingcontent.green .scrolling-wrapper > div > .scrolling-item > .content-width { background-color: transparent !important; }
.widget.scrollingcontent.green .scrolling-wrapper > span.btn-left { background-color: transparent; }
.widget.scrollingcontent.green .scrolling-wrapper > span.btn-right { background-color: transparent; }
.widget.scrollingcontent.green .scrolling-wrapper > span.btn-left > i.fas.fa-chevron-left { color: #fff; }
.widget.scrollingcontent.green .scrolling-wrapper > span.btn-right > i.fas.fa-chevron-right { color: #fff; }
.widget.scrollingcontent.green .scrolling-wrapper > div > .scrolling-item > div.content-width > div.container > div.widget.contentblock { color: #fff; float: left; }
.widget.scrollingcontent.green .scrolling-item * { color: #fff; }
.widget.scrollingcontent.green .scrolling-item > div > div.container { display: flex }
.widget.scrollingcontent.green .image-box > div::after { background-image: url(/Images/photo-overlay.png); }



@media screen and (max-width:576px) {
    .widget.scrollingcontent .scrolling-wrapper { width: 100%; }
    .widget.scrollingcontent .scrolling-wrapper .scrolling-item { width: 100% !important; }
    .scrollingcontent > div > .scrolling-wrapper .scrolling-item { padding: 0; margin-left: 0; }
}

/* Content-Listing */
.body-content > .container > .ngage-heading { padding-top: 150px; text-align: center; }
#default { margin: 30px 0 50px 0; }

.ngage-listing .card { justify-content: center; background-size: cover; box-shadow: 0 3px 6px rgb(0 0 0 / 16%), 0 3px 6px rgb(0 0 0 / 23%); border-radius: 0.8rem; text-align: center; height: 400px; }
.ngage-listing .card-img-overlay { border-radius: 0.8rem; background-color: #3331318c; padding-top: 8em; }
.ngage-listing .card-img-overlay > div { height: 140px; }
.ngage-listing .card a { width: 50%; font-size: 0.8em; padding: 10px; width: 13rem; }
.ngage-listing .card p { color: #fff; font-weight: 300; text-align: center; }

/*mobile adjustments*/
@media screen and (max-width:768px) {
    .ngage-listing .card { height: auto; min-height: 300px; }
    .ngage-listing .card-img-overlay > div { height: auto; min-height: 125px; }
    .ngage-listing .card-img-overlay { padding-top: 3em; }
}
/*tablet-adjustments*/
@media (min-width: 760px) and (max-width: 992px) {
    .ngage-listing .card { height: auto; min-height: 300px; }
    .ngage-listing .card-img-overlay > div { height: auto; min-height: 120px; }
    .ngage-listing .card-img-overlay { padding-top: 3em; }
    .ngage-listing .card a { width: 10rem; }
}

/*small desktop*/
@media screen and (min-width:992px) and (max-width:1199px) {
    .ngage-listing .card { height: auto; min-height: 324px; }
    .ngage-listing .card-img-overlay > div { height: auto; min-height: 150px; }
    .ngage-listing .card-img-overlay { padding-top: 4em; }
}


/* Template style for the base content */
.ngage-content > div p { }
#header.green-background p { color: #fff; }
#header.green-background h1 { color: #fff; }

/*Template style for the content-page*/
.content-page 

.content-listing-page { }

/* Template for the content-tab*/
.content-tabs-page 












/* Case study template */
/*.case-studies { padding-top: 5rem; }
.case-studies #header > .container > .row > div p { color: #fff; }
.case-studies #header > .container > .row > div h1 { color: #fff; }
.case-studies #header > .container > .row > div p { color: #fff; }
.case-studies #why-content > .container > .row > div > div { padding: 0 4rem 2rem 0; }
.case-studies #why-content > .container > .row > div > div p { color: #000000 }
.case-studies #why-content > .container > .row > div > div a { color: #26B870; text-decoration: none; }
.case-studies #why-content > .container > .row > div > div > ul { padding: 0 0 0 20px; }
.case-studies #why-content { padding-bottom: 30px; }
.case-studies #quotes > .container > .row > .green > div > .scroll-wrapper > .content-width { background-color: #26B870; }*/

/*background overlay*/
/*.case-studies #header { position: relative; }
.case-studies #header::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(33,33,33,.4); }
.case-studies #header > .container > .row > .contentblock { z-index: 3; }*/


/*green background*/
/*.green-background { background: linear-gradient(180deg, #26B870 0%, #1C8550 100%); }
.green-background * { color: #fff; }*/


/* Green background Header banner*/
/*.content-width.green-background > .container > .row > .contentblock > div { padding: 5rem 0 3rem 0; }
.content-width.green-background > .container > .row > .contentblock > div > p > img { position: relative; top: -100px; }*/


/*tablet-adjustments*/
/*header banner*/
/*@media (min-width: 760px) and (max-width: 992px) {
    .content-width.green-background > .container > .row > .contentblock { padding-top: 2rem; }
    .green-background > .container > .row > widget > div { padding: 0; }
    .green-background > .container > .row > widget > div.text > div { padding: 0 0 10rem 0; }
    .content-width.green-background > .container > .row > .contentblock > div { padding: 0; }
    .content-width.green-background > .container > .row > .contentblock.text { padding: 0 0 5rem 0; padding-top: 0; }
    .content-width.green-background > .container > .row > .contentblock > div > p > img { position: relative; top: -10px; }
}*/

/*mobile adjustments*/
/*header banner */
/*@media screen and (max-width:768px) {
    .content-width.green-background > .container > .row > .contentblock > div { padding: 0; }
    .content-width.green-background > .container > .row > .contentblock.text { padding-top: 0; padding: 0 0 5rem 0; }
    .content-width.green-background > .container > .row > .contentblock > div > p > img { top: 60px; }
}*/


/* Marketplace connect */
/*.marketplace-connect #wave { background: linear-gradient(to top, #f3f3f3 50%, transparent 50%); }
.marketplace-connect #online-store { background-color: #f4f4f4; }
.marketplace-connect #online-store > .container > .row > div > div { padding: 0rem 7rem 32px 112px; }
.marketplace-connect #online-store > .container > .row > div > div > p > img { margin: auto; }*/


/*small desktop*/
/*marketplace connect*/
/*@media screen and (min-width:992px) and (max-width:1199px) {
    .marketplace-connect #online-store > .container > .row > div > div { padding: 0 0 16px 0; }
}*/

/*tablet-adjustments*/
/*marketplace connect*/
/*@media (min-width: 760px) and (max-width: 992px) {
    .marketplace-connect #online-store > .container > .row > div > div { padding: 0 0 32px 0; }
}*/

/*mobile adjustments*/
/*marketplace connect*/
/*@media screen and (max-width:768px) {
    .marketplace-connect #online-store > .container > .row > div > div { padding: 0 40px 32px 40px; }
}*/

/*card with avatar image on the left*/
/*.card.quote-box { padding: 30px; }*/


/*About page*/
/*.contact-us #case-studies > .container > .row > div > div { margin: 0; }
.contact-us #why-ngage > .row > .widget > div > p > img { width: 80%; display: flex; }
.contact-us #why-ngage > .row > .widget > div { text-align: left; }
.contact-us #demo-expectations { background-color: #f4f4f4; }
.contact-us #demo-expectations > .container > .row > .widget > .card { background-color: #fff; }
.contact-us #demo-expectations > .container > .row > .widget > .card > p > img { max-height: 175px; width: auto; }
.contact-us #why-ngage > .row > .widget > div > p > img { position: relative; top: -190px; }
.contact-us #why-ngage > .row > .widget > div > h1 { color: #26b870; }

.widget > .card { border-radius: 2rem; background-color: #fff; background: no-repeat; background-size: cover; }
.contact-us #cards > .container > .row > .widget > .card > p { margin: auto; color: #fff; }
.contact-us #cards > .container > .row > .widget > .card > p.btn { width: 220px; display: flex; justify-content: center; margin-top: 3rem; }
.contact-us #cards > .container > .row > .widget > .card > p > strong { color: #fff; }

.card.quotebox > p > img { width: 35%; float: left; content: url(/Images/person.png); }
.card.quotebox > p { width: 100%; }
.card.quote-box-no-image > .card { padding-top: 8rem !important; }

.contact-us #why-ngage > .row > .widget.text { padding-right: 175px; }*/



/*small desktop*/
/*about us section*/
/*@media screen and (min-width:992px) and (max-width:1199px) {
    .contact-us #why-ngage > .row > .widget > div > p > img { width: 80%; top: 25px; }
    .contact-us #why-ngage > .row > .widget > div { padding-right: 0px; }
    .contact-us #cards > .container > .row > .widget > .card > p > img { width: 65% !important; padding: 1rem; margin: 10% 20% !important; }
    .contact-us #why-ngage > .row > .widget.text { padding-right: 175px; }
}*/

/*tablet-adjustments*/
/*about us section*/
/*@media (min-width: 760px) and (max-width: 992px) {
    .contact-us #why-ngage > .row > .widget > div > p > img { width: 70%; position: initial; top: 0; margin: auto; }
    .contact-us #cards > .container > .row > .widget > .card > p > img { width: 65% !important; padding: 1rem; margin: 10% 20% !important; }
    .contact-us #why-ngage { padding-right: 0 !important; }
    .contact-us #submit-enquiry > .container > .row > .contentblock > div { padding-left: 10% !important; padding-right: 10% !important; }
    .contact-us #case-studies { padding-top: 2rem; }
    .contact-us #why-ngage > .row > .widget.text { padding-right: 0; }
}*/
/*mobile adjustments*/
/*about us section*/
/*@media screen and (max-width:768px) {
    .contact-us #why-ngage > .row > widget { padding-top: 45px; }
    .contact-us #why-ngage > .row > .widget > div > p > img { width: 70%; position: initial; top: 0; margin: auto; }
    .contact-us #cards > .container > .row > .widget > .card > p > img { width: 65% !important; padding: 1rem; margin: 5% 20% !important; }
    .contact-us #why-ngage { padding-top: 45px; }
    .contact-us #why-ngage > .row > .widget > div { padding: 0; }
    .contact-us #why-ngage { padding-right: 0 !important; }
    .contact-us #submit-enquiry { padding-left: 0 !important; padding-right: 0 !important; }
    .contact-us #case-studies { padding-top: 2rem; }
    .contact-us #why-ngage > .row > .widget > div { padding: 0 !important; }
    .contact-us #submit-enquiry > .container > .row > .contentblock > div { padding-left: 10% !important; padding-right: 10% !important; }
    .contact-us #why-ngage > .row > .widget.text { padding-right: 0; }
    .contact-us #why-ngage > .row > .widget.image { padding-top: 90px; }
}*/

/* Request a demo page */
/*.request-a-demo #demo-cards { background-color: #f4f4f4; }
.request-a-demo #demo-cards > .container > .row > .widget > .card { background-color: #fff; }
.request-a-demo #locations > .container > .row > .contentblock.location { margin-top: 16px; margin-bottom: 16px; text-align: center; }
.request-a-demo #locations > .container > .row > .location:nth-child(2) { margin-right: 48px; }
.request-a-demo #locations > .container > .row > .location:nth-child(3) { margin-left: 48px; margin-right: 48px; }*/

/*mobile adjustments*/
/*request a demo section*/
/*@media screen and (max-width:768px) {
    .request-a-demo #locations > .container > .row > .location:nth-child(2) { margin-right: 0px; }
    .request-a-demo #locations > .container > .row > .location:nth-child(3) { margin-left: 0px; margin-right: 0px; }
}*/

/*404 error page*/

/*.pages #404-error > .container > .row > .contentblock > p.btn { margin: auto; display: flex; justify-content: center; }*/

/* server error page */
/*.pages #server-error > .container > .row > .widget > div { text-align: center; }*/





/********************************************************/
/* Components and commonly repeated widget and sections */
/********************************************************/




/*Card component section*/
/*******************************************************************/
/* Types of cards: home page cards, pricing cards, and minicards
   (3-4 cards in a row. Mincards come with white or grey backgrounds 
    in a row with white and grey backgrounds called minicards */
/******************************************************************/

/*Home page card*/

.home #software-platform > .container > .row > div > div > p > #btn-spacing { margin: 2rem 1.5rem 4rem 1.5rem; }
#software-platform > .container > row > contentblock > .card p { min-height: 95px; }

/* card styling */
.card { background-position-y: -2px; padding: 70px; box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; height: 100%; }
.card h3 { justify-content: center; min-height: 75px; }
.card h4 { font-weight: 300; color: #707070; }
.card p > strong { color: #000; }
.card .btn { margin: auto; width: auto; }
.card > p > img { width: 100%; }


/*widget styles*/
.widget.contentblock { display: inline-block; }
.contentblock > div { display: inline-block; width: 100%; }

ul.two-cols { padding-left: 0; margin: 0 0 20px 0; float: left; columns: 2; }
ul.two-cols li { list-style: none; background: url(/Images/small-check-icon.png) no-repeat 0 4px; padding: 0 15px 0 50px; color: #707070; display: inline-block; height: 110px; }


/*small desktop*/
@media screen and (min-width:992px) and (max-width:1199px) {
    /*card styling*/
    ul.two-cols { columns: 1; }
}

/*tablet-adjustments*/
@media (min-width: 760px) and (max-width: 992px) {
    /*card styling*/
    ul.two-cols { columns: 1; }
    ul.two-cols li { height: 90px; }
    .widget > div.card { padding: 2rem !important; }
}

/*mobile adjustments*/
@media screen and (max-width:768px) {
    /*card styling*/
    ul.two-cols { columns: 1; }
    #software-platform > .container > .row > div > .card > h3 > img { width: 10%; height: auto; }
    ul.two-cols li { height: 80px; }
    .widget > div.card { padding: 2rem !important; }
}


/* Pricing card section */
.grey-box p > a { color: #26b870; text-decoration: none; }
.grey-box > .card { background-color: #f4f4f4; border-radius: 2rem; padding: 2rem 3rem; box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); height: 100%; }
.grey-box > .card > h3 { min-height: 0px !important; }
.grey-box p { color: #000;}

/*Mini cards for 3-4 cards in a row base code*/
.mini-box .card { border-radius: 2rem; padding: 40px; height: 100%; border: 1px solid rgba(0,0,0,.125); box-shadow: 0 1px 3px rgb(0 0 0 / 12%), 0 1px 2px rgb(0 0 0 / 24%); }
.mini-box .card > p > img { margin-bottom: 4rem; }
.mini-box .card > p { color: #000;}

/*Mini cards for 3-4 cards in a row with a grey background*/
.mini-grey-background .card { background-color: #f4f4f4; }

/*Mini cards for 3-4 cards in a row with a white background*/
.mini-white-background .card { background-color: #fff;}



/* Gallery slider area */
.ngage-tabs .nav-tabs { background-color: #23194A; padding: 0rem 10rem; height: 70px; }
.ngage-tabs .nav-tabs .nav-link { margin-bottom: 0; border-top-left-radius: 0; border-top-right-radius: 0; color: #fff; }
/*.ngage-tabs .nav-tabs > button { background-color: #23194A; color: #fff; border: #23194A; padding: 1.5rem 3rem; }*/
.ngage-tabs .nav-tabs > .active { color: #fff; background-color: rgba(255 255 255 / 50%); border-radius: 0; border-color: rgba(255 255 255 / 10%); }
.ngage-tabs nav > .triangle { border-left: 25px solid transparent; border-right: 25px solid transparent; border-top: 20px solid #23194A; position: absolute; left: 227px; top: 69px; transition: left ease-out 0.3s; }
.ngage-tabs nav { position: relative; }

/*small desktop*/
/*gallery area*/
@media screen and (min-width:992px) and (max-width:1199px) {
    .ngage-tabs .nav-tabs { padding: 0rem 5rem; }
    .ngage-tabs nav > .triangle { left: 150px; }
}
/*tablet-adjustments*/
/* gallery area */
@media (min-width: 760px) and (max-width: 992px) {
    .ngage-tabs .nav-tabs { padding: 0; display: flex; justify-content: center; }
    .ngage-tabs > .triangle { left: 220px; }
}

/*mobile adjustments*/
/* gallery area */
@media screen and (max-width:768px) {
    .ngage-tabs .nav-tabs { padding: 0; display: flex; justify-content: center; }
    .ngage-tabs .nav-tabs > button:not(:first-child):not(:nth-child(2):not(:last-child)) { display: none; }
    .ngage-tabs .nav-tabs > .active { background-color: #23194A; padding: 1.2rem 5.5rem; }
    .ngage-tabs .nav-tabs > span.prev { cursor: pointer; left: 40px; top: 20px; font-size: 2em; position: absolute; z-index: 10; line-height: 1.2em; width: 50px; display: inline-block; color: white; }
    .ngage-tabs .nav-tabs > span.next { cursor: pointer; left: 455px; top: 20px; font-size: 2em; position: absolute; z-index: 10; line-height: 1.2em; width: 50px; display: inline-block; color: white; }
    .ngage-tabs .nav-tabs { position: relative; height: 80px; }
}

/* Everything you need to manage your online store across Amazon etc. section*/
.online-store > .container > .row > .contentblock > div > p{ color: #fff; }









/* Do more with ngage bottom section */

/*tablet-adjustments*/
/* do more with ngage */
/*@media (min-width: 760px) and (max-width: 992px) {
    #do-more-with-ngage > .container > .row > .componentblock > div > .container-fluid > .row > .contentblock > div { text-align: center; }
    #do-more-with-ngage > .container > .row > .componentblock > div > .container-fluid > .row > .contentblock > div > p:last-child { display: flex; justify-content: center; }
}*/

/*mobile adjustments*/
/* do more with ngage */
/*@media screen and (max-width:768px) {
    #do-more-with-ngage > .container > .row > .componentblock > div > .container-fluid > .row > .contentblock > div { text-align: center; }
    #do-more-with-ngage > .container > .row > .componentblock > div > .container-fluid > .row > .contentblock > div > p:last-child { display: flex; justify-content: center; }
}*/

/* 2 Day Ngage Developer bottom section */
/*#two-day > .container > .row > .text > div { padding-top: 100px; }*/

/*small desktop*/
/*2 day ngage developer area*/
/*@media screen and (min-width:992px) and (max-width:1199px) {
    #two-day > .container > .row > .text > .div { padding: 100px 30px; }
}*/

/*tablet-adjustments*/
/* 2 day ngage developer */
/*@media (min-width: 760px) and (max-width: 992px) {
    #two-day > .container > .row > .text > div { padding-top: 25px; }
}*/

/*mobile adjustments*/
/* 2 day nage developer */
/*@media screen and (max-width:768px) {
    #two-day > .container > .row > .text > div { padding-top: 0px; }
}*/

/* POS hardware bottom section*/
/*#pos-ordering > .container > .row > .contentblock.text > div { padding-top: 100px; }
#pos-ordering > .container { padding-bottom: 60px; }*/

/*small desktop*/
/*2 day ngage developer area*/
/*@media screen and (min-width:992px) and (max-width:1199px) {
    #pos-ordering > .container > .row > .contentblock.text > div { padding-top: 0px !important; }
}*/

/*tablet-adjustments*/
/* 2 day ngage developer */
/*@media (min-width: 760px) and (max-width: 992px) {
    #pos-ordering > .container > .row > .contentblock.text > div { padding-top: 0 !important; }
}*/

/*mobile adjustments*/
/* 2 day nage developer */
/*@media screen and (max-width:768px) {
    #pos-ordering > .container > .row > .contentblock.text > div { padding-top: 0 !important; }
}*/

