/** MCG theme :: 09.11.19 **/

/* Overrides only :: See teutonic-base.css */

@charset "UTF-8";

/*

Variables & helpers
===================

*/

/* ::::::::::::::::::::  color-map  :::::::::::::::::::: */

:root {
  --main-1: #fff;
  --main-2: #f1f1f1;
  --main-3: #d9d9d9;
  --main-4: #888;
  --main-5: #424242;
  --main-6: #212f33;
  --main-7: #011c25;
  --prime-1: #ff5182;
  --prime-2: #de3e94;
  --prime-3: #ba437e;
  --prime-4: #d92256;
  --prime-5: #9d3158;
  --prime-6: #992c8a;
  --warn-1: #fbad97;
  --warn-2: #fbd475;
  --warn-3: #fdbe28;
  --warn-4: #ff7112;
  --warn-5: #fb433c;
  --danger-1: #c5db62;
  --danger-2: #98d98a;
  --danger-3: #70d9a7;
  --danger-4: #38b078;
  --danger-5: #008629;
  --success-1: #6dcfe2;
  --success-2: #2fa8c8;
  --success-3: #5fb4e4;
  --success-4: #0763d5;
  --success-5: #9d99eb;
  --success-6: #7d5ba4;
  --success-7: #b9f0ff;
  --success-8: #f3dcff;
  --success-9: #7b3194;
  --highlight-1: rgba(244, 244, 241, 0.1);
  --highlight-2: rgba(244, 244, 241, 0.25);
  --color-main-6: var(--main-6);
  --color-main-7: var(--main-7);
  --color-prime-6: var(--prime-6);
  --color-success-6: var(--success-6);
  --color-success-7: var(--success-7);
  --color-success-8: var(--success-8);
  --color-success-9: var(--success-9);
}


/* ::::::::::::::::::::  vars-space-scale  :::::::::::::::::::: */

:root {
  --space-m: 15px;
  --space-l: 25px;
  --space-xl: 50px;
  --space-xxl: 75px;
  --space-xxxl: 100px;
}


/* ::::::::::::::::::::  typeface-vars  :::::::::::::::::::: */

:root {
  --font-body: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Plus Jakarta Sans', Montserrat, Helvetica, Arial, sans-serif;
  --font-standard: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Plus Jakarta Sans', Montserrat, Helvetica, Arial, sans-serif;
  --font-headline: 'Plus Jakarta Sans', Montserrat, Helvetica, Arial, sans-serif;
  --text-serif: Georgia, 'Palatino Linotype', serif;
  --text-sans: 'Plus Jakarta Sans', Monteserrat, Helvetica, Arial, sans-serif;
}



/* ::::::::::::::::::::  basics  :::::::::::::::::::: */

/** {
  color: var(--color-main-6);
}*/

body {
  background-color: var(--color-main-1);
}
body {
  --line-height: calc(var(--text-ratio) + .25); /* 1.5 */
  line-height: var(--line-height);
}

/* ::::::::::::::::::::  media-queries :::::::::::::::::::: */

@media (max-width: 860px) {
  .hide-t {
    display: none !important;
  }
  .columns.collapse-t {
    column-count: 1 !important;
  }
}

@media (max-width: 600px) {
  .hide-p {
    display: none !important;
  }
  .columns.collapse-p {
    column-count: 1 !important;
  }
}

@media (max-width: 800px) {
  html {
    font-size: 100%;
  }
}

@media (max-width: 400px) {
  html {
    font-size: 100%;
  }
}


/*

Forms
=====

*/


/* ::::::::::::::::::::  forms  :::::::::::::::::::: */

label, p label {
	display: block;
	margin-bottom: 5px;
	font-family: var(--font-headline);
	font-size: var(--text-s);
}

input[type="text"], textarea, select {
	padding: var(--space-s);
	border: 1px solid #c3c3c3;
	border-radius: 3px;
	box-shadow: var(--color-main-2) -1px -1px 1px inset;
	font-family: var(--font-standard);
	font-size: var(--text-s);
	color: var(--color-success-5);
}
	input[type="text"] {
		width: 100%;
	}

input[type="text"]:focus, 
select:focus, 
textarea:focus {	
	box-shadow: var(--color-success-4) 0px 0px 4px;
}

/* ::::::::::::::::::::  button, focus, active  :::::::::::::::::::: */


.button {
  padding: var(--space-m) var(--space-xxl);
  font-family: var(--font-headline);
  font-size: var(--text-m);
  text-align: center;  
  border-radius: var(--space-xxl);
}
	.button:hover {
		background: var(--color-prime-4);
		background: linear-gradient(to top right, var(--color-prime-4), var(--color-warn-2));
  		z-index: 2;
	}
	.button:focus {		
		border: none;
		background: linear-gradient(to top right, var(--color-prime-4), var(--color-warn-2));
  		z-index: 2;
  		box-shadow: none;
  		color: var(--color-main-1);
	}
	.button:focus span {		
		color: var(--color-main-1);
	}
	
.button-padl {
  padding: var(--space-l) var(--space-xxl);
}
	
.button-light {
	border: var(--space-px) solid var(--color-success-1);
	background-color: var(--color-main-1);
}
	.button-light span {
    	font-size: var(--text-xl);
    	color: var(--color-main-3);
    	vertical-align: middle;
	}
	.button-light:hover {
		border-color: var(--color-main-1);
	}
	.button-light:hover,
	.button-light:hover span {
		color: var(--color-main-1);
	}
.button-dark {
	border: var(--space-px) solid var(--color-main-4);
	background-color: var(--color-main-7);
	color: var(--color-main-1);
}
	.button-dark:hover {
		border-color: var(--color-main-7);
		color: var(--color-main-1);
	}
.button-small {
	padding: var(--space-xs) var(--space-l);
	border-color: var(--color-main-4);
	font-size: var(--text-s);
	font-weight: 700;
	color: var(--color-prime-4);
}

/*
button[type="submit"]
button[type="submit"]:hover
*/

.box.active, 
.button.active, 
label.active, 
.active {
  background-color: transparent;
  border-color: transparent; 
  color: var(--color-main-7);
  cursor: pointer;
}
.box.active:hover, 
.box.active:focus, 
.button.active:hover, 
.button.active:focus, 
label.active:hover, 
label.active:focus, 
.active:hover, 
.active:focus {
    background-color: transparent;
    cursor: pointer;
}

/* ::::::::::::::::::::  mini-info  :::::::::::::::::::: */

.mini-info {
  position: absolute;
  bottom: 0;
  right: 0;
  background-color: var(--color, var(--color-main-2)); /* --color: not defined */
  color: var(--color-bg-1, var(--color-main-5)); /* --color-bg-1: not defined */
  border: 0;
}

/*

Typography
==========

*/

/* ::::::::::::::::::::  typography  :::::::::::::::::::: */

body {
  --font-size: calc(var(--text-base) + 2px); /* 20px */
}

h1, h2, h3, h4, h5 {
  line-height: calc(var(--text-ratio) + .15);
}
h1 {
  font-size: calc(var(--text-xxl) + 5px);
  font-weight: 800;
  letter-spacing: -1.25px;
    /*text-transform: uppercase;*/
}

h2 {
  font-size: calc(var(--text-xl) + 3px);
  font-weight: 800;
  letter-spacing: -1.25px;
  /*text-transform: uppercase;*/
}

h3, h4, h5 {
  font-weight: 700;
}

h3 {
	font-size: calc(var(--text-l) + 3px);
	line-height: var(--text-ratio);
}
	.nawbo-qa h3 {
		margin-top: var(--space-l);
	}

h4 {
  font-size: calc(var(--text-m) + .15em);
  text-transform: uppercase;
  font-weight: 300;
}
	.gradBdr h4 {
		font-weight: 600;
		text-transform: none;
	}
	
	footer h4 {
      font-size: calc(var(--text-s) + .15rem);
  	  line-height: calc(var(--line-height) + .5);
  	  font-weight: 500;
	}

*::selection {
  background-color: var(--color-success-8);
}
*::-moz-selection {
  background-color: var(--color-success-8);
}

p, li {
	padding-top: var(--space-s);
    padding-bottom: var(--space-s);
	font-size: var(--font-size); /* calc(var(--font-size)) 20px; */
	color: var(--color-main-6);
}
p {	
    line-height: calc(var(--line-height) + .1);
}
li {	
    line-height: calc(var(--line-height) - .1);
}

#community.bo-t_content p, #community.bo-t_content li {	
	font-size: 1em; /* 18px; */
}

/* Quotes - main page top and client buzz */

.quote  {
  font-size: calc(var(--text-m) - 2px);
  line-height: calc(var(--line-height) + .15);
  letter-spacing: .5px;
}
.quote blockquote {
	position: relative;
	padding-right: calc(var(--space-l) + 5px);
	padding-left: calc(var(--space-l) + 15px);
}
	.testimonials .quote blockquote {
		padding-right: calc(var(--space-l) + 15px);
	}
.quote blockquote:before {
	content: url(../img/quotemarks-open.png);
	position: absolute;
	top: 0;
	left: 0;
}
.quote blockquote:after {
	content: url(../img/quotemarks-close.png);
	position: absolute;
	bottom: 0;
	right: 0;
}
.quote .quoteBdr {
	padding-right: calc(var(--space-l) + 5px);
	padding-left: calc(var(--space-l) + 10px);
	font-size: var(--text-m);
}
.quote .quoteBdr:before {
    content: "";
    display: block;
    width: 15%;
    padding-top: 20px;
    margin-bottom: 15px;
    border-bottom: 1px solid var(--color-main-4);
}

.buzz .quote blockquote:before {
	content: url(../img/quotemarks-open-light.png);
	position: absolute;
	top: 0;
	left: -5px;
}
.buzz .quote blockquote:after {
	content: url(../img/quotemarks-close-light.png);
	position: absolute;
	bottom: 0;
	right: 0;
}

@media (min-width: 600px) and (max-width: 899px) {

	.quote {
		font-size: 90%;
	}
	
}

hr {
  margin-bottom: var(--space-px);
  border-color: var(--color-main-4);
  border-top-width: var(--space-px);
  border-style: dotted;
}
hr.thin {
  border-top-width: var(--space-px);
}
hr.mrgn {
	margin-top: var(--space-xl);
	margin-bottom: var(--space-xl);
}

.ltrSpc-loose {
	letter-spacing: .25rem;
}
.ltrSpc-regular {
	letter-spacing: 1px;
}
.ltrSpc-tight {
	letter-spacing: .5px;
}
.ltrSpc-tightest {
	letter-spacing: -.5px;
}


/* ::::::::::::::::::::  link  :::::::::::::::::::: */


.link, p a, td a, li a, .block-link, footer .fNav a {
  color: var(--color-prime-4);
}

p a, ul.list li a {
	font-weight: 400;
}
p.text-bio a {
	font-size: calc(var(--font-size) - 4px);
	font-weight: 400;
}

.link:hover, p a:hover, td a:hover, li a:hover, .block-link:hover {
  background-color: var(--color-success-6);
  color: var(--color-main-1);
}
.link:visited, p a:visited, td a:visited, li a:visited, .block-link:visited {
  /*color: var(--color-main-4); changed per Monika's request 01.21.20 */
  color: var(--color-prime-5);
}
.link:visited:hover, p a:visited:hover, td a:visited:hover, li a:visited:hover, .block-link:visited:hover {
  background-color: var(--color-success-5);
  color: var(--color-main-1);
}

p a.link-no-hover {
	background-color: transparent;
}


/* ::::::::::::::::::::  text-helpers  :::::::::::::::::::: */

.text-thin {
  font-weight: 300;
}
.text-normal {
  font-weight: 400;
}
.text-medium {
  font-weight: 500;
}
.text-bold {
  font-weight: 600;
}
.text-black {
  font-weight: 700;
}

.text-normal {
  text-transform: none;
}

.text-Jak {
  font-family: 'Plus Jakarta Sans', Helvetica, Arial, sans-serif;
  letter-spacing: -.15px;
}
.text-Mont {
  font-family: Montserrat, Helvetica, Arial, sans-serif;
}
.text-Segoe {
  font-family: 'Segoe UI', Helvetica, Arial, sans-serif;
}
.text-serif {
  font-family: Georgia, 'Palatino Linotype', serif;
}

.text-white {
  color: var(--color-main-1);
}
.text-light {
  color: var(--color-main-3);
}
.text-dark {
  color: var(--color-main-7);
}

.text-spacing-s {
	letter-spacing: var(--space-px);
}
.text-spacing-m {
	letter-spacing: calc(var(--space-px) * 3);
}
.text-spacing-l {
	letter-spacing: calc(var(--space-px) * 5);
}

.lowercase {
	text-transform: lowercase;
}

.arrw {
	color: var(--color-main-4);
}
.caps {
	text-transform: uppercase;
}
.has-dropcap:first-letter {
	float: left;
	margin: .175em .1em .1em 0;
	font-family: Montserrat, serif;
	font-size: 4rem;
	line-height: .70;	
}

/*.nawbo-qa h3 {
	margin: 0;
	margin-bottom: var(--space-s);
	padding: 0;
	padding-left: var(--space-s);
	font-size: calc(var(--text-l) - 2px);
	font-weight: 600;
	flex: 1 1;
}    
.nawbo-qa .bgCircle {   	
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin-bottom: calc(var(--space-s) + 5px);
	background: rgba(47, 168, 200, 0.80);
	border-radius: 50%;
	font-size: var(--text-xl);
	font-weight: 700;
	color: var(--color-main-1);
}
.nawbo-qa .flex p {
	margin-left: var(--space-xl);
	padding-top: 0;
}
.nawbo-qa .flex ul {
	margin-left: var(--space-xl);
}
.ma-no {
  margin: 0;
}*/

/* ::::::::::::::::::::  text-sizes  :::::::::::::::::::: */






/* ::::::::::::::::::::  text-size-hero  :::::::::::::::::::: */

.text-hero_l {
  --text-hero-l: var(--text-l);
  line-height: 1;
  font-size: calc(var(--text-xl) + var(--text-hero-l, 4vw));
}
.text-hero_m {
  --text-hero-m: var(--text-m);
  line-height: 1;
  font-size: calc(var(--text-xl) + var(--text-hero-m, 2.5vw));
}

/* ::::::::::::::::::::  anchor  :::::::::::::::::::: */

*:target {
  background-color: transparent;
  box-shadow: 0 0 0 0 transparent;
}


/* ::::::::::::::::::::  article  :::::::::::::::::::: */

.article ul, .article ul ul {
    list-style-type: none;
    list-style-position: inside;
}

.article li.text-sans {
    font-family: var(--text-sans);
}

.article li::before {
	content: "\25BA"; /*content: "\25CF";*/
	font-size: var(--text-s);
	font-weight: 700;
	color: var(--color-success-4);
	margin-right: var(--space-s);
}
.article p:first-child {
	margin-top: 0;
    padding-top: 0;
}


/*

Interface & navigation
======================

*/

/* ::::::::::::::::::::  box  :::::::::::::::::::: */

.affiliateLogos .box {
  padding: 0;
  border: 0 none;
  text-align: center;
}
.affiliateLogos a.box {
  background-color: transparent;
}
.affiliateLogos a.box:hover {
  background-color: transparent;
}

/* ::::::::::::::::::::  media  :::::::::::::::::::: */

.media {
  background-color: transparent;
}
.logo img {
	max-width: 165px;
}
.media.Bdr img {
	padding: var(--space-s); 
	border: var(--space-m) solid var(--color-main-2);
}

figcaption {
	font-size: var(--text-s);
	font-style: italic;
	line-height: calc(var(--line-height) - .25);
	color: var(--color-main-5);
}
figure.bio img {
	padding: 10px !important; 
	border-radius: 50%;
	max-width: 480px;
}

.videoCaption {
    padding: calc(var(--space-xs) * 6);
    text-align: center;
}
.videoCaption:hover {
    background-color: var(--color-success-5);
}
.videoCaption a {
    color: var(--color-main-7);
}
.videoCaption a:hover,
.videoCaption:hover a {
    color: var(--color-main-1);
}

/*   images   */

.imgRight {
	float: right;
	max-width: 100%;
	height: auto;
	margin-top: calc(var(--space-px) * 10);
	margin-bottom: var(--space-l);
	margin-left: var(--space-l);
	/*clip-path: polygon(20% 0%, 80% 0%, 100% 20%, 100% 80%, 80% 100%, 20% 100%, 0% 80%, 0% 20%);*/
}
.imgLeft {
	float: left;
	max-width: 100%;
	height: auto;
	margin-top: calc(var(--space-px) * 10);
	margin-bottom: var(--space-l);
	margin-right: var(--space-l);
}
.imgQuestionLeft {
	float: left;
	margin-top: calc(var(--space-px) * 5);
	margin-right: var(--space-s);
}
.imgNumberLeft {
	margin-right: var(--space-xs);
	vertical-align: middle;
}


/* ::::::::::::::::::::  grid  :::::::::::::::::::: */


/* See @media (max-width: 860px) for customizations */

.grid {
	padding-right: var(--space-m);
	padding-left: var(--space-m);
}



/* ::::::::::::::::::::  grid-gaps  :::::::::::::::::::: */

[class*="grid"].gap_l {
  --gap-space: var(--space-l); /* 25px */
}
[class*="grid"].gap-h_l {
  grid-row-gap: var(--space-l); /* 25px */
}

/*

Breakpoints - Custom
====================

*/


/* ::::::::::::::::::::  CSS grid-breakpoints  :::::::::::::::::::: */

/* -t = tablet; -p = phone */

@media (max-width: 860px) {
  [class*="grid"].collapse-t {
    grid-template-columns: 1fr;
  }
  [class*="grid"] > .span-3-t {
    grid-column: span 3;
  }
  [class*="grid"] > .span-4-t {
    grid-column: span 4;
  }
  [class*="grid"] > .span-5-t {
    grid-column: span 5;
  }
  [class*="grid"] > .span-6-t {
    grid-column: span 6;
  }
  [class*="grid"] > .span-7-t {
    grid-column: span 7;
  }
  [class*="grid"] > .span-8-t {
    grid-column: span 8;
  }
  [class*="grid"] > .span-9-t {
    grid-column: span 9;
  }
  [class*="grid"] > .span-10-t {
    grid-column: span 10;
  }
  [class*="grid"] > .span-11-t {
    grid-column: span 11;
  }
  [class*="grid"] > .span-12-t {
    grid-column: span 12;
  }
  
  .copyright p {
	text-align: left;
	font-size: var(--text-s);
  }
}

@media (max-width: 600px) {
  [class*="grid"].collapse-p {
    grid-template-columns: 1fr;
  }
  [class*="grid"] > .span-6-p {
    grid-column: span 6;
  }
  [class*="grid"] > .span-7-p {
    grid-column: span 7;
  }
  [class*="grid"] > .span-8-p {
    grid-column: span 8;
  }
  [class*="grid"] > .span-9-p {
    grid-column: span 9;
  }
  [class*="grid"] > .span-10-p {
    grid-column: span 10;
  }
  [class*="grid"] > .span-11-p {
    grid-column: span 11;
  }
  [class*="grid"] > .span-12-p {
    grid-column: span 12;
  }
  
  .logo {
	padding-left: var(--space-xxxl);
  }
	
}


/* ::::::::::::::::::::  flex-breakpoints  :::::::::::::::::::: */

/* -t = tablet; -p = phone */

@media (max-width: 860px) {
  .flex.collapse-t {
    display: block;
  }
  .flex.collapse-t.gap-no .input {
    width: 100%;
  }
  .flex.collapse-t.gap-no > * {
    margin-left: 0;
  }
  .flex .collapse-t {
    flex-basis: 100% !important;
  }
  .flex > .span-half-t {
    flex-basis: 50% !important;
  }
  .flex > .span-full-t {
    flex-basis: 100% !important;
  }
}

@media (max-width: 600px) {
  .flex.collapse-p {
    display: block;
  }
  .flex .collapse-p {
    flex-basis: 100% !important;
  }
  .flex > .span-half-p {
    flex-basis: 50% !important;
  }
  .flex > .span-full-p {
    flex-basis: 100% !important;
  }
}


/*

layout Helpers
==============

*/


/* ::::::::::::::::::::  borders  :::::::::::::::::::: */

[class*="bo-"], [class*="bo_"] {
  border-style: var(--border-style, dotted);
}

.curve-top,
.curve-bottom {
  position: relative;
}
.curve-top:before,
.curve-bottom:after {  
  content: '';
  height: 155px;
  position: absolute;
  width: 100%;
}
.curve-top:before {
  bottom: 100%;
  background-image: url('../img/curve-top.svg');
  background-position: center bottom;
  background-repeat: no-repeat;
}
.curve-bottom:after {
  top: 100%;
  background-image: url('../img/curve-bottom.svg');
  background-position: center bottom;
  background-repeat: no-repeat;
}

@media (min-width: 2000px) {

	.curve-top:before {
		height: 205px;
  		background-image: url('../img/curve-top-2600.svg');
	}
	.curve-bottom:after {
		height: 205px;
  		background-image: url('../img/curve-bottom-2600.svg');
	}
	
}

.bo-b_px {
  border-style: dotted;
  border-color: var(--color-main-3);
}

.bo-b {
  border-style: solid;
  border-color: var(--color-main-2);
  border-bottom-width: calc(var(--space-px) * 8);
}
.bo-grey {
  border-style: solid;
  border-color: var(--color-main-2);
  border-width: calc(var(--space-px) * 8);
}

a.bo_px {
  --border-width: calc(var(--space-px) * 20);
  border-width: var(--border-width);
  border-color: var(--color-main-1);
}
a.bo_px.gradBdr {
	display: block;
	min-height: 200px;
}
	a.bo_px.gradBdr:hover {
		/*border-color: var(--color-prime-4);*/
		border-image: linear-gradient(135deg, var(--color-success-2), var(--color-prime-5)) 1;
		background-color: var(--color-main-1);
	}
	a.bo_px.gradBdr:hover h3,
	a.bo_px.gradBdr:hover span {
		color: var(--color-prime-5);
	}
	
/* other lead-in box styles */

a.bo_px.grey {
	/*min-height: 300px;*/
	border-color: var(--border-color, var(--color-main-2));
}

/*.bluLeft {
	border-left: var(--space-s) solid var(--color-success-3);
}
.prplLeft {	
	border-left: var(--space-s) solid var(--color-prime-4);
}
.grnLeft {
	border-left: var(--space-s) solid var(--color-danger-3);
}
.bluRight {
	border-right: var(--space-s) solid var(--color-success-3);
}
.prplRight {	
	border-right: var(--space-s) solid var(--color-prime-4);
}
.grnRight {
	border-right: var(--space-s) solid var(--color-danger-3);
}

.prplTop {
	border-top: var(--space-s) solid var(--color-prime-4);
}*/

/* subpage CTAs */

/*.spCTA {
	padding-right: var(--space-s);
	padding-left: var(--space-s);
}
.spCTA a {
	display: block;
	padding: var(--space-xl);
	--color: #f6f6f6;
	background-color: var(--color, var(--color-main-2));
}
.spCTA a:hover h3,
.spCTA a:hover h3 span {
	color: var(--color-main-7);
}
.spCTA img {
	opacity: .75;
}

.spCTA.grnRight,
.spCTA.bluRight,
.spCTA.prplRight {
  --border-right-width: calc(var(--space-px) * 30);
  border-right-width: var(--border-right-width);
}
.spCTA.grnLeft,
.spCTA.bluLeft,
.spCTA.prplLeft {
  --border-left-width: calc(var(--space-px) * 30);
  border-left-width: var(--border-left-width);
}*/


/* ::::::::::::::::::::  margin  :::::::::::::::::::: */
	
.ma-Content {
  margin-right: var(--space-xxxl);
  margin-left: var(--space-xxxl);
}

/* main page only */
.ma-Portfolio {
  margin-right: var(--space-l);
  margin-left: var(--space-l);
}
	.ma-Slider {
  	   margin-left: var(--space-xxl);
	}
/* end main page */

@media (max-width: 1200px) {

	.ma-Content,
	.ma-Portfolio {
	   margin-right: var(--space-s);
  	   margin-left: var(--space-s);
	 }
	 .ma-Slider {
  	   margin-left: 0;
	 }
	
}

.ma-r_px {
  margin-right: calc(var(--space-px) * 5);
}
.ma-t_xxxl {
  margin-top: calc(var(--space-xxl) + 5px);
}

.ma-rtCol {
	margin-left: calc(var(--space-xxl) + 5px);
}
@media (max-width: 600px) {

	.ma-rtCol {
		margin-left: 0;
	}
	
}

	
/* ::::::::::::::::::::  padding  :::::::::::::::::::: */

.pa-t_xxl {
  padding-top: var(--space-xxl);
}
.pa-t_xxxl {
  padding-top: var(--space-xxxl);
}
.pa-v_xxl {
  padding-top: var(--space-xxl);
  padding-bottom: var(--space-xxl);
}
.pa-b_xxl {
  padding-bottom: var(--space-xxl);
}

/* client buzz column padding */

.buzz div[class*="pa_l"] {
	padding: calc(var(--space-l) + 10px);
}


/*

Color theming
===================

*/

/* ::::::::::::::::::::  colors-alphabet  :::::::::::::::::::: */

.bg-a {
  background-color: #eaeff3;
}
.bg-b {
  background-color: var(--color-main-2);
}

.red { 
	color: #e01d39;
}

/* ::::::::::::::::::::  background-colors  :::::::::::::::::::: */


[class*="bg-main-7"] {
  background-color: var(--color-main-7);
}

/*

Non-Teutonic framework custom styles
====================================

*/


/* ::::::::::::::::::::  floats  :::::::::::::::::::: */

.left { float: left; }	
.right { float: right; }	
.clr { clear: both; }


/* ::::::::::::::::::::  basics  :::::::::::::::::::: */

ul.li-border {
  margin-bottom: var(--space-l);
}
ul.li-border li {
  padding-top: var(--space-s);
  padding-bottom: var(--space-s);
  margin-top: var(--space-m);
  margin-bottom: var(--space-m);
  border-bottom: var(--space-px) dotted var(--color-main-4);
}

ul.pdf li {
	padding-top: 0;
	padding-bottom: var(--space-s);
	padding-left: calc(var(--space-px) * 21);	
	background: url("../img/acrobat.png") 0 4px no-repeat;
}
	
ul.list li:before,
ul.list ul li:before {
  	content: url(../img/bullet.png);
	line-height: calc(var(--line-height) - .1);
	color: var(--color-success-4);
	margin-right: calc(var(--space-xs) + 2px);
}
ul.list {
	margin-top: var(--space-s);
	margin-bottom: var(--space-l);
}
ul.list li {	
	padding-top: var(--space-xs);
	padding-bottom: var(--space-xs);
}	

ul.states li {
	padding-top: 0;
  padding-bottom: 0;
	font-size: var(--text-m);
	line-height: calc(var(--line-height) + .5);
}
ul.resources li {
	padding-top: 0;
  padding-bottom: 0;
	font-size: var(--text-s);
	line-height: calc(var(--line-height) + .75);
}
ul.resources.pdf li {
	padding-bottom: var(--space-s);
	line-height: calc(var(--line-height) + .25);
}

ol li:first-child {
	margin-top: var(--space-s);
}
ol li {
	margin-left: var(--space-l);
}
ul.list ol li:before {
	content: none;
	margin-right: 0;
}

.custom-counter {
  list-style-type: none;
}
.custom-counter li {
  counter-increment: step-counter;
  margin-bottom: var(--space-s);
  margin-left: 0;
}
.custom-counter li::before {
  content: counter(step-counter)".";
  margin-right: 5px;
  font-size: var(--text-l);
  font-weight: 700;
}


/* ::::::::::::::::::::  fixed-sizes + custom  :::::::::::::::::::: */

.fullwidth_content {
	width: 100%
}
.width_content {
  max-width: 1600px;
}

.centerFlex {
	display: flex;
	justify-content: center;
}
.center {
	margin: 0 auto;
}

/* ::::::::::::::::::::  background banners  :::::::::::::::::::: */

#bgBanner { 
	background-position: top center;
	background-repeat: no-repeat;
	background-color: var(--color-main-7);
}

.fullwidth_content.buzz {
	background-image: url('../img/bg-deco-bg1.png');
	background-position: bottom center;
	background-repeat: no-repeat;
}
.fullwidth_content.buzz.about {
	background-image: url('../img/bg-deco-rpy3.png');
	/*background-image: url('../img/bg-deco-tcm3.png');*/
	background-position: bottom center;
	background-repeat: no-repeat;
}
.fullwidth_content.buzz.nawbo-qa {
	background-image: url('../img/bg-deco-bp3.png');
	background-position: bottom center;
	background-repeat: no-repeat;
}
.fullwidth_content.buzz.testimonials {
	background-image: url('../img/bg-deco-tcm1.png');
	background-position: bottom center;
	background-repeat: no-repeat;
}
.fullwidth_content.buzz.services {
	background-image: url('../img/bg-deco-tcm2.png');
	background-position: bottom center;
	background-repeat: no-repeat;
}
.fullwidth_content.buzz.portfolio-logos {
	background-image: url('../img/bg-deco-rd1.png');
	background-position: bottom center;
	background-repeat: no-repeat;
}
.fullwidth_content.buzz.portfolio-brochures {
	background-image: url('../img/bg-deco-bp2.png');
	background-position: bottom center;
	background-repeat: no-repeat;
}
.fullwidth_content.buzz.portfolio-signs {
	background-image: url('../img/bg-deco-rd2.png');
	background-position: bottom center;
	background-repeat: no-repeat;
}
.fullwidth_content.buzz.portfolio-websites {
	background-image: url('../img/bg-deco-bg3.png');
	background-position: bottom center;
	background-repeat: no-repeat;
}
.fullwidth_content.buzz.404 {
	background-image: url('../img/bg-deco-bg3a.png');
	background-position: bottom center;
	background-repeat: no-repeat;
}

@media (min-width: 2000px) {

	#bgBanner,
	.fullwidth_content.buzz,
	.fullwidth_content.buzz.about,
	.fullwidth_content.buzz.services,
	.fullwidth_content.buzz.portfolio,
	.fullwidth_content.buzz.404 {
		background-size: contain;
	}
	
}
	

/*::::::::::::::: Back to Top link :::::::::::::::*/

.back-to-top {
	position: fixed;
	bottom: 2em;
	right: 0px;
	margin-bottom: var(--space-xxxl);
	text-decoration: none;
	background-color: rgba(47, 168, 200, 0.80); /* var(--color-prime-5) */
	border-radius: var(--space-xl) 0 0 var(--space-xl);
	font-size: calc(var(--text-s) + .1em);
	color: var(--color-main-1);
	padding: 1.15em;
	padding-left: 2em;
	display: none;
	z-index: 40000 !important;
}
	.back-to-top:hover {	
		background-color: rgba(186, 67, 126, 0.80); /* var(--color-success-5) */
		color: var(--color-main-1);
	}


/*::::::::::::::: Footer :::::::::::::::*/

footer {
	margin-top: var(--space-xl);
}

footer li {
	display: inline-block;
	padding-top: 0;
	padding-left: var(--space-s);
	
}

footer a, footer p {
	font-family: var(--font-headline);
	font-size: calc(var(--text-s) + .1rem);
	line-height: calc(var(--line-height) + .5);
}
footer p {
	font-size: var(--text-s);
} 
footer li a:hover, 
footer li a:visited:hover {
  background-color: transparent;
}
footer .copyright {
	font-size: var(--text-s);
}
	
	
@media (max-width: 600px) {

	footer a,
	footer p {
		font-size: var(--text-m);
	}
	footer a {
		padding: var(--space-s);
	}
	footer .copyright {
		font-size: var(--text-m);
	}
}


/* ::::::::::::::::::::  NAWBO-SV Page  :::::::::::::::::::: */

.nawbo-sv p,
.nawbo-sv li {
	font-size: calc(var(--text-m) - 2px);
}
.nawbo-sv ol li {
	font-size: var(--text-m);
}

.nawbo-sv p span.text_l {
	font-weight: 600;
	line-height: 1;
}
	
/*.benefits {
	width: 100%;
	border-collapse: separate;
	border-spacing: 5px;	
}
.benefits th {
	text-align: center;
}
.benefits th:first-child {
	width: 50%;
	text-align: left;
}
.benefits th h3 {
	font-size: 18px;
	font-weight: 600;;
}
.benefits th,
.benefits td {
	padding: 10px;
	padding-left: 0;
	border-bottom: 1px dotted var(--color-main-3);
}
.benefits td {
	width: 10%;
	font-size: 16px;
}
.benefits td.on {
	background: url(../img/icon-check.png) center center no-repeat;
}
.benefits td:first-child {
	font-weight: 500;
}

.benefits ul.list li,
.benefits ul.list li a {
	font-size: 16px;
	font-weight: 500;
}
.benefits ul.list ol {
  	margin-top: 10px;
  	margin-bottom: 10px;
}
.benefits ul.list ol li:before {
  	content: '';
}*/

ul.iconLink img {
	vertical-align: middle;
}
ul.iconLink .button {
	width: 100%;
	padding: var(--space-m) var(--space-l);
	text-align: left;
}
ul.iconLink .button-light,
.button-light.topBtn {
	border: 0 none;
	background-color: var(--color-main-2);
	font-size: calc(var(--text-m) - .1rem);
}
	ul.iconLink .button-light:hover,
	.button-light.topBtn {
		border: 0 none;
	}
	
.button-light.topBtn {
	padding: var(--space-l) var(--space-xl);
	font-size: var(--text-l);
}

ul.nawboList li {
	font-size: 17px;
}
ul.nawboList li a {
	font-weight: 700;
}
ul.nawboList li h4 {
	font-weight: 500;
}

.nawbo-sv {
	background-color: var(--color-main-7);
}

.nawbo-sv .text-bold {
  font-weight: 700;
}
.nawbo-sv h2,
.nawbo-sv h3 {
	color: var(--color-success-9);
}
.nawbo-sv h3.blu {
	font-size: 24px;
	color: var(--color-success-4);
}

p.grey,
div.grey {
	padding: 30px 20px;
	margin: 30px 0;
	background-color: #f5f5f5;
}
p.grey2,
div.grey2 {
	padding: 30px 20px;
	margin: 0 0 30px 0;
	background-color: #f5f5f5;
}
p.white,
div.white {
	padding: 0 20px;
}

@media (max-width: 860px) {

	.benefits th {
		writing-mode: vertical-rl;
		text-orientation: mixed;
		/*transform: rotate(-90deg);
		transform-origin: left;*/
	}
	.benefits th,
	.benefits td {
		padding: 0;
		padding-left: 0;
		border-bottom: 0 none;
	}
	.benefits td {
		height: 30px !important;
	}

}

@media (max-width: 700px) {

	.benefits th h3,
	.benefits td {
		font-size: 80%;
	}
	.text_l {
    	--font-size: var(--text-m);
	}
}