/*
Theme Name: Twenty Twenty-One Child theme of twentytwentyone
Theme URI: 
Description: Child theme of twentytwentyone theme for the Twenty Twenty-One theme
Author: Christoph Eibl
Author URI: 
Template: twentytwentyone
Version: 1.2
*/

:root {
    --purple: #574897; 
    --blue: #004C97;
    --lightBlue: #F4F7FD;
    --petrol: #45B9D9;
    --black:#000;
    --purpleLight:#e2e7ed;
    
    /*--text-primary: #110F0F;*/
    --text-primary: #425466;
    --text-secondary: #757580;
    --text-heading: #110F0F;
    --text-negative-color: #fff;
    --text-green-color:#28a835;
    --text-red-color:#d4381b;
    --text-grey-color:#bfbfbf;
    --a-hover-color:#7061B0;
    
    --body-bg-color: #F4F9FF;
    --select-text-color: #868686;
    --input-border-color: #ccc;
    --input-border-color-focus: var(--purple);

    --btn-primary-text-color: #fff;
    --btn-primary-bg-color: var(--purple);
    --btn-primary-border-color: var(--purple);
    --btn-primary-hover-text-color: #fff;
    --btn-primary-hover-bg-color: var(--petrol);
    --btn-primary-hover-border-color: var(--petrol);

    --btn-secondary-text-color: var(--purple);
    --btn-secondary-bg-color: #fff;
    --btn-secondary-border-color: var(--purple);
    --btn-secondary-hover-text-color: #fff; 
    --btn-secondary-hover-bg-color: var(--purple);
    --btn-secondary-hover-border-color: var(--purple);

    --btn-negative-text-color: var(--purple);
    --btn-negative-bg-color: #fff;
    --btn-negative-border-color: #fff;
    --btn-negative-hover-text-color: var(--purple);
    --btn-negative-hover-bg-color: var(--lightBlue);
    --btn-negative-hover-border-color: var(--lightBlue);


    --text-secondary-color: #949494;

    --seperator-bg-color: #E0E7EC;

    --menu-text-color: var(--text-primary);
    --menu-hover-text-color: var(--petrol);
    
    --menu-dev-text-color:var(--purple);
    --menu-dev-hover-text-color:var(--petrol);
    --menu-dev-hover-border-color:var(--petrol);
    --menu-dev-active-text-color:var(--petrol);
    --menu-dev-active-border-color:var(--petrol);
    
    --sourceCode-wrapperBackground: #fff;
    --sourceCode-LinesBackground: #F4F7FD;
    --sourceCode-background: #fff;
    --sourceCode-lineColor: #110F0F;
    --sourceCode-textColor: #110F0F;
    --sourceCode-textHightlightColor: #037FA1;
    --sourceCode-textLowlightColor: #004C97;
    --sourceCode-borderColor: #B4B4B4;
    
    --btn-slider-border-color: #F4F7FD;
    
    --imagePlaceholderColor: var(--lightBlue);
    
    --global--color-background: var(--lightBlue);
}


html,body,body div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,figure,footer,header,menu,nav,section,time,mark,audio,video,details,summary{margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline;background:transparent}article,aside,figure,footer,header,nav,section,details,summary{display:block}html{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}img,object,embed{max-width:100%; height: auto;}html{overflow-y:scroll}ul{list-style:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent;color:var(--purple);text-decoration:none;border-bottom:2px solid var(--purple);transition:color 400ms ease,border-color 400ms ease, background 400ms ease}.external .external-icon{width:12px;fill:#aaa}.no-text-decoration{text-decoration:none;border:none}table{border-collapse:separate;border-spacing:0}th{font-weight:700;vertical-align:bottom}td{font-weight:400;vertical-align:top}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}input[type="radio"]{vertical-align:middle}input[type="checkbox"]{vertical-align:middle}select,input,textarea{font:99% sans-serif}table{font-size:inherit;font:100%}small{font-size:85%}strong{font-weight:700}td,td img{vertical-align:top}.clickable,label,input[type=button],input[type=submit],input[type=file],button{cursor:pointer}button,input,select,textarea{margin:0}button,input[type=button]{width:auto;overflow:visible}




/* roboto-regular - latin */
@font-face {
  font-family: 'Roboto'; 
  font-style: normal;
  font-weight: 400;
  src: url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-v27-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-v27-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-v27-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-v27-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-v27-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-v27-latin-regular.svg#Roboto') format('svg'); /* Legacy iOS */
    font-display: optional;
}
/* roboto-500 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-v27-latin-500.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-v27-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-v27-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-v27-latin-500.woff') format('woff'), /* Modern Browsers */
       url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-v27-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-v27-latin-500.svg#Roboto') format('svg'); /* Legacy iOS */
    font-display: optional;
}


/* roboto-mono-300 - latin */
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-weight: 300;
  src: url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-mono-v13-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-mono-v13-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-mono-v13-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-mono-v13-latin-300.woff') format('woff'), /* Modern Browsers */
       url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-mono-v13-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-mono-v13-latin-300.svg#RobotoMono') format('svg'); /* Legacy iOS */
    font-display: optional;
}

/* roboto-mono-500 - latin */
@font-face {
  font-family: 'Roboto Mono';
  font-style: normal;
  font-weight: 500;
  src: url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-mono-v13-latin-500.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-mono-v13-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-mono-v13-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-mono-v13-latin-500.woff') format('woff'), /* Modern Browsers */
       url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-mono-v13-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/wp-content/themes/twentytwentyone-child-theme/assets/fonts/roboto-mono-v13-latin-500.svg#RobotoMono') format('svg'); /* Legacy iOS */
    font-display: optional;
}


body {
	font-family: 'Roboto', sans-serif; 
	font-weight: 400;
    
	background-color: var(--body-bg-color);
	font-size:20px;
	line-height: 30px;
	-webkit-text-size-adjust: none;
	-webkit-font-smoothing: antialiased;
    
    overflow-x: hidden;
    
}
h1, h2, h3, h4, h5 {
	font-weight: 600;
}
body, select, input, textarea, button {
    color: var(--text-primary);
	font-family: 'Roboto', sans-serif; 
}
select {
	color: var(--select-text-color);
	font-weight: 200;
	font-size: 18px;
    background-color: #fff;
}
input {
	font-family: 'Roboto', sans-serif; 
	padding: 2px 10px;
	border-width: 1px;
	border-style: solid;
	border-color: var(--input-border-color);
}
input:focus {
	border-color: var(--input-border-color-focus);
	border-style: solid;
	border-width: 1px;
}
input[type="text"],
input[type="email"],
input[type="password"],
input[type="tel"] {
    padding: 5px 10px;
    border-radius: 4px;
}
textarea,
input.text,
input[type="text"],
input[type="button"],
input[type="submit"] {
	-webkit-appearance: none;
}
input[type="radio"] {
    background: var(--lightBlue);
    width: 1px;
    height: 1px;
    padding: 5px;
    -webkit-border-radius: 100%;
    border-radius: 100%;
    
    border: 10px solid var(--lightBlue);
    
    -moz-appearance: None;
    -webkit-appearance: none;
    
    -webkit-transition: background 400ms ease;
    -moz-transition: background 400ms ease;
    -ms-transition: background 400ms ease;
    -o-transition: background 400ms ease;
    transition: background 400ms ease;
}
input[type="radio"]:checked {
    background: #fff;
    border-color: var(--petrol);
}

label:hover input[type="radio"] {
    -webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,0.2);
box-shadow: 0 0 10px 0 rgba(0,0,0,0.2);
}

ul {
    margin: 10px 0;
}
li {
    margin-left: 20px;
    margin-bottom: 5px;
    list-style-type: disc;
    list-style-position: outside;
}
li.no-listing-points,
.no-listing-points li {
    
    list-style-type: none;
    margin: 0;
}
.default-content p,
.release p {
    margin: 10px 0 20px 0;
}
.default-content .wp-block-image {
    text-align: center;
}
.default-content .wp-block-image .aligncenter {
    text-align: center;
}
.default-content .wp-block-image .alignleft {
    text-align: left;
}
.default-content .wp-block-image .alignright {
    text-align: right;
}
.default-content .wp-block-image .size-large img {
    width: 820px;
    max-width: min(100vw , 100%);
}
.default-content .wp-block-embed__wrapper {
    text-align: center;
}
.default-content .wp-block-button {
    text-align: center;
    margin: 40px 0;
}
.default-content .wp-block-button__link {
    
	display: inline-block;
	margin-bottom: 0;
	text-align: center;
	text-decoration: none;
	vertical-align: middle;
	-ms-touch-action: manipulation;
	touch-action: manipulation;
	cursor: pointer;
	background-image: none;
	border: 1px solid transparent;
	white-space:inherit;
	padding: 12px 20px;
	/*font-size: 14px;*/
    letter-spacing: 0.7px;
    font-size: 14px;
	line-height: 1.42857143;
	border-radius: 4px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
    
    -webkit-transition: background 400ms ease;
    -moz-transition: background 400ms ease;
    -ms-transition: background 400ms ease;
    -o-transition: background 400ms ease;
    transition: background 400ms ease;
	
	
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
    
    border-radius: 8px;
    background: var(--btn-primary-bg-color);
    color: var(--btn-primary-text-color);
    border: 2px solid var(--btn-primary-border-color);
    
    /*text-transform: uppercase;*/
    font-weight: 600;
}


select {
    border:2px solid var(--purple);
    padding: 12px 20px;
    
    position: relative;
    
    outline: none;
    
        -moz-appearance:none; /* Firefox */
    -webkit-appearance:none; /* Safari and Chrome */
    appearance:none;
    
    -webkit-border-radius: 100px;
    border-radius: 100px;
    
    
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    
    color: var(--purple);
    font-size: 14px;
    line-height: 16px;
    font-weight: 600;
}
.select-wrapper {
    position: relative;
    display: inline-block;
}
.select-wrapper::before {
    content: "";
    right: 15px;
    top: 50%;
    position: absolute;
    z-index: 1;
    
    width: 10px;
    height: 10px;
    background: #333;
    
    
    display: inline-block;
    
    -moz-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-o-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
    
}
.webinar-timezone-select {
    max-width: 250px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.trainer-link.nolink {
    color: var(--text-secondary);
    cursor: unset;
    border: none;
}
.trainer-link {
    position: relative;
}
.trainer-link::before {
    width: 18px;
    height: 18px;
    
    position: absolute;
    left: -30px;
    top: 1px;
    
    content: "";
}
.trainer-link.linkedin {
    margin-left: 30px; 
}
.trainer-input {
    max-width: 200px;
}
.select {
    min-width: 200px;
}

.bold .strong {
    font-weight: 600;
}
.regular {
    font-weight: 400;
}
.text-italic,
.italic {
    font-style: italic;
}
.position-relative {
    position: relative;
}
.left {
    float: left;
}
.right {
    float: right;
}
.text-right,
.has-text-align-right  {
    text-align: right;
}
.text-center,
.has-text-align-center {
    text-align: center;
}
.text-left,
.has-text-align-left  {
    text-align: left;
}
.text-uppercase {
    text-transform: uppercase;
}

.text-roboto-mono {
    font-family: "Roboto Mono";
}
blockquote {
    position: relative;
}
blockquote:after {
    position: absolute;
    content: "\"";
    right: 0;
    bottom: 0;
    
    color: var(--purple);
    font-size: 220px;
    line-height: 20px;
    
    opacity: 0.2;
}
.gherkin-nav-link.no-uppercase,
.no-uppercase {
    text-transform:none;
}
.letter-spacing-0-7 {
    letter-spacing: 0.7px;
}
.letter-spacing-1-6 {
    letter-spacing: 1.6px;
}
.letter-spacing-2-2 {
    letter-spacing: 2.2px;
}
.bold {
    font-weight: bold;
}
.inline {
    display: inline;
}
.inline-block {
    display: inline-block;
}
.table-cell {
    display: table-cell;
}
.block,
.btn.block {
    display: block;
} 
.grid-100.no-margin,
.grid-50.no-margin,
.no-margin {
    margin: 0;
    padding: 0;
}
.grid-100.no-padding,
.grid-50.no-padding,
.no-padding {
    padding: 0;
}

.btn  {
    
	display: inline-block;
	margin-bottom: 0;
	text-align: center;
	text-decoration: none;
	vertical-align: middle;
	-ms-touch-action: manipulation;
	touch-action: manipulation;
	cursor: pointer;
	background-image: none;
	border: 1px solid transparent;
	white-space:inherit;
	padding: 12px 20px;
    letter-spacing: 0.7px;
	line-height: 1.42857143;
	border-radius: 4px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
    
    -webkit-transition: background 400ms ease, border 400ms ease;
    -moz-transition: background 400ms ease, border 400ms ease;
    -ms-transition: background 400ms ease, border 400ms ease;
    -o-transition: background 400ms ease, border 400ms ease;
    transition: background 400ms ease, border 400ms ease;
	
	
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
    
    border-radius: 8px;
    background: var(--btn-primary-bg-color);
    color: var(--btn-primary-text-color);
    border: 2px solid var(--btn-primary-border-color);
    
    font-weight: 600;
}

.btn:disabled {
    opacity: 0.5;
}
.btn:focus, .btn:active:focus {
	outline: 0;
    border: 2px solid transparent;
}
.btn-secondary {
    background: var(--btn-secondary-bg-color);
    color: var(--btn-secondary-text-color);
    border: 2px solid var(--btn-secondary-border-color);
}
.btn-negative {
    background: var(--btn-negative-bg-color);
    color: var(--btn-negative-text-color);
    border: 2px solid var(--btn-negative-border-color);
}
.btn-negative:focus, .btn-negative:active:focus,
.btn-secondary:focus, .btn-secondary:active:focus {
    border: 2px solid var(--btn-secondary-border-color);    
}

.btn-slider {
    width: 80px;
    height: 80px;
    text-align: center;
    vertical-align: middle;
    
    -webkit-border-radius: 100%;
    border-radius: 100%;
    
    background: #fff;
    border:4px solid var(--btn-slider-border-color);
}

.btn-slider-prev {}
.btn-slider-next {}
.btn-slider-svg {
    width: 12px;
    height: auto;
}
.btn-slider-svg-prev {
    -moz-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
    
    margin-right: 4px;
}
.btn-slider-svg-next {
    margin-left: 4px;
}

.double-btn-wrapper {
    padding: 10px;
    border-radius: 100%;
    box-shadow: 0px 0px 20px #DEDEDE;
    background: #fff;
    
    width: 80px;
    height: 80px;
    text-align: center;
}
.double-btn-inner {
    border-radius: 100%;
    background: var(--lightBlue);
    border-radius: 100%;
    padding: 12px;
    width: 60px;
    height: 60px;
    
    
    text-align: center;
    
}

.double-btn-wrapper.integrations {
    width: 100px;
    height: 100px;
}
.integrations .double-btn-inner {
    width: 80px;
    height: 80px;
    
    position: relative;
}

.integrations svg {
    max-height: 60px;
    max-width: 60px;
    width: 100%;
    
    position: absolute;
    left: 50%;
    top: 50%; 
    
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}
.double-btn-inner-con {
    background: #fff;    
}
.double-btn-wrapper .svg-icon-role {
    width: auto;
    height: 30px;
    vertical-align: middle;
}
.double-btn-wrapper .svg-icon-role-dev {
    height: 25px;
} 
.svg-icon-role {
    width: auto;
    height: 40px;
    vertical-align: middle;
}/*
.svg-icon-role-dev {
    height: 25px;
} /**/
.svg-icon-pro-con {
    width: 20px;
    height: auto;
    vertical-align: middle;
}
.btn-gherkin {
    padding-left: 0;
    padding-right: 0;
    width: 100%;
    text-align: center;
}

.bg-white {
    background-color: #fff;
}
.bg-secundary,
.bg-lightpurple {
    background: #E9E7EE;
}
.bg-lightblue {
    background: var(--lightBlue);
}

.bg-purple {
    background-color: var(--purple);
}
.bg-purple-light {
    background-color: var(--purpleLight);
}
.bg-black {
    background-color: var(--black);
}

.bg-purple a {
    color: #fff;
    border-color: #fff;
}

.bg-purple .btn-negative {
    color: var(--btn-negative-text-color);
}

.text-black,
.gherkin-feedback-container .text-black {
    color: #000;
}
.text-dark {
    color:#52565B;
}
.text-darker {
    color: #110F0F;
}
.text-purple {
    color: var(--purple) ;
}
.text-primary {
    color: var(--text-primary);
}
.text-secondary {
    color: var(--text-secondary-color);
}
.text-white {
    color: #fff;
}
.text-petrol {
    color: var(--petrol) ;
}
.text-darkblue {
    color: var(--purple);
}
.text-negative {
    color: var(--text-negative-color);
}
.text-green {
    color: var(--text-green-color);
}
.text-red {
    color: var(--text-red-color);
}
.text-grey {
    color: var(--text-grey-color);
}

.seperator {
    border: none;
    border-bottom: 1px solid var(--seperator-bg-color); 
}
.seperator.grid-100 {
    margin-left: 10px;
    margin-right: 10px;
}
.wrapper {
    max-width: 1440px;
    width: 100%;
    margin: 0 auto;
    display: table;
}
.inner-wrapper {
    max-width: 1280px;
    width: 100%;
    margin: 0 auto;
    display: table;
}
.full-width {
    width: 100%;
}

/* navigation  */
.navbar {
    margin-top: 40px; 
    /*
    -webkit-transition: all 400ms ease;
    -moz-transition: all 400ms ease;
    -ms-transition: all 400ms ease;
    -o-transition: all 400ms ease;
    transition: all 400ms ease; /**/
}
.navbar-brand {
    display: inline-block;
    border: none;
}
.navbar-brand .logo {
    height: 40px;  
    border: none;
    
    /*
    -webkit-transition: all 400ms ease;
    -moz-transition: all 400ms ease;
    -ms-transition: all 400ms ease;
    -o-transition: all 400ms ease;
    transition: all 400ms ease; /**/
}
.navbar-brand {
}
.navbar-brand .logo-typo  { 
    transition: fill 0.4s ease; 
    fill:var(--purple);
} 
.navbar-wrapper {
    display: inline-block;
    vertical-align: top;
}
#menu-main-navigation {
    display: table;
    width: 100%;
}
.menu-item {
    display: inline-block;
}
.section-header > a {
    cursor: unset;
}
#menu-main-navigation > .menu-item {
    display: table-cell;
}
#menu-main-navigation > .menu-item > a {
    border: none;
    font-size: 14px;
    line-height: 16px;
    letter-spacing: 0.7px;
    /*text-transform: uppercase;*/
    color: var(--menu-text-color);
    /*font-weight: bold;*/
    padding-left: 25px;
    padding-right: 25px;
    padding-top: 12px;
    padding-bottom: 12px;
    
    display: block;
    
    -webkit-transition: background 400ms ease;
    -moz-transition: background 400ms ease;
    -ms-transition: background 400ms ease;
    -o-transition: background 400ms ease;
    transition: background 400ms ease;
}

#menu-main-navigation > .menu-item.current_page_item > a {
    color: var(--menu-hover-text-color);
}
#menu-main-navigation > .menu-item.nav-btn {
    
    width: 1%;
    padding-left: 80px;
    white-space: nowrap;
}
#menu-main-navigation > .menu-item.nav-btn a {
    padding-top: 12px;
    padding-bottom: 12px;
    
    background: var(--purple);
    color: #fff;
    -webkit-border-radius: 8px;
    border-radius: 8px;
    text-align: center;
    
}
#menu-main-navigation > .menu-item.nav-btn a .sub {
    display: none;
}
.r-arr {
    width: 8px;
    height: 10px;
    display: inline-block;
    padding-left: 10px;
}

.sub-menu-ux-wrap {
    padding-top: 20px;
    display: none;
    
    position: absolute;
    z-index: 10;
    width: 100vw;
    max-width: 1440px;
    left: 0;
    top: 68px;
    
    
    
}
#menu-main-navigation > .menu-item-has-children > .sub-menu-ux-wrap {
-webkit-box-shadow: 0 20px 20px 0 rgba(0,0,0,0.1);
box-shadow: 0 20px 20px 0 rgba(0,0,0,0.1);
}
/*
.background-blur {
    content: "";
    position: absolute;
    left: 0;
    top: 88px;
    
    background: rgb(87 72 151 / 20%); 
    
    width: 100%;
    height: 100vh;
    display: none;
    
    backdrop-filter: blur(1px);
    
    z-index: -1;
    
}
.scrolled .background-blur {
    top:54px;
}
.submenu-scrolled .background-blur {
    top:95px;
} /**/

.sub-menu-wrap {
    width: 100vw;
    max-width: 1440px;
    
    background: #fff;
    /*border-top: 1px solid #ccc; */
    
    position: relative;
    z-index: 100;
}
.sub-menu {
    display: inline-block;
    width: 100%;
    padding: 0;
    background: #fff;
    
}
.sub-menu-ux-wrap .sub-menu-ux-wrap {
    position: static;
    width: unset;
    padding: 0;
    margin: 0;
    display: block;
    
    
    -webkit-box-shadow: none;
    box-shadow: none;
}

.sub-menu-wrap .sub-menu {
    max-width: calc(min(900px,100vw));
    display: table;
    margin: 0 auto;
    padding-top: 40px;
    padding-bottom: 40px;
}
.sub-menu .sub-menu {
    padding-top: 0;
    padding-bottom: 0;
}

.sub-menu > .menu-item {
    display: block;
    margin-left: 0;
    margin-bottom: 0;
}
.sub-menu > .menu-item a {
    display: block;
    border: none;
    
    position: relative;
}
.menu-item a .sub {
    color: #999;
    padding-top: 3px;
    display: block;
}
.sub-menu > .menu-item:not(.no-border-effect) > a::after {
    content: ""; 
    position: absolute;
    display:block;
    left: 20px;
    top:90%;
    margin:0 auto;
    height: 2px;
    background-color: var(--purple);
    width: 0%;
    max-width: 200px;
    
    
    -webkit-transition: all 800ms ease;
    -moz-transition: all 800ms ease;
    -ms-transition: all 800ms ease;
    -o-transition: all 800ms ease;
    transition: all 800ms ease;
}

.sub-menu > .menu-item.bg-lightblue {
    margin-left: 20px;
    max-width: calc(100% - 20px);
}

.sub-menu .sub-menu-wrap {
    display: inline-block; 
    position: static;
    width: unset;
    padding: 0;
    
    border: none;
}

.sub-menu a {
    font-size: 14px;
    line-height: 16px;
    padding: 12px 20px;
    color: var(--text-primary);
}
.submenu-grid-100 {
    width: 100%;
    clear: both;
    float: left;
}
.hide-menu-text a,
.sub-menu > .menu-item.hide-menu-text > a {
    text-indent: -90000px;
    padding: 0;
    margin: 0;
    display: none;
}
.sub-menu > .menu-item.inline-menu-text > a {
    display: inline-block;
    vertical-align: top;
}

.inline-menu-text .menu-icon-facebook a {
    margin-left: 0;
} 
.sub-menu > .inline-menu-text .menu-item.menu-icon {
    margin-top: 12px;
}
.sub-menu > .menu-item.inline-menu-text .sub-menu-ux-wrap {
    display: inline-block;
}
.bg-lightblue .sub-menu-wrap,
.bg-lightblue .sub-menu {
    background: none;
}
.submenu-grid-50 {
    width: 50%;
    float: left;
}
.submenu-grid-33 {
    width: 33%;
    float: left;
}
.section-header > a {
    font-weight: 600;
    /*text-transform: uppercase; */
    color: var(--purple);
    letter-spacing: 0.7;
}
.sub-menu-toggle {
    display: none;
    border: none;
    position: absolute;
    right: -20px;
    height: 8px;
    top: calc(50% - 8px);
}
.sub-menu-toggle .icon-plus,
.sub-menu-toggle .icon-minus,
.sub-menu-toggle .screen-reader-text {
    display: none;
    
}
.nav-icon > a {
    position: relative;
}
.nav-icon > a::before {
    content: "";
    width: 20px;
    height: 20px;
    
    left: 20px;
    top: 50%;
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    
    position: absolute;
}

.nav-icon > a {
    padding-left: 55px;
}

.tricentis-logo {
    height: 20px;
    aspect-ratio: 274 / 57;
    display: inline-block;
    color: transparent;
    position: relative;
    top: 4px;
    margin-left: 10px;
}
.footer-nav .nav-icon > a::before { 
    left: 0;
}
.footer-nav .menu-item .menu-item.menu-item-has-children.nav-icon > a { 
    padding-bottom: 15px; 
}
.footer-nav .sub-menu .nav-icon > a { 
    padding-left: 30px;
}

/* benefits-menu CSS */

.dev-submenu .menu-item {
    padding-right: 80px;
}
.dev-submenu .menu-item:last-child {
    padding-right: 0px;
}
.dev-submenu .menu-item a {
    color: var(--menu-dev-text-color);
    border-bottom:3px solid transparent;
    border-bottom:none;
    padding-bottom: 7px;
    text-transform: uppercase;
    font-size: 14px;
    line-height: 16px;
    font-weight: 600;
    letter-spacing: 0.7px;
    display: block;
    
    position: relative;
    z-index: 0;
}

.dev-submenu .menu-item a::after {
    
    content: "";
    position: absolute;
    z-index: 0;
    display:block;
    left: 0px;
    top:100%;
    margin:0 auto;
    height: 3px;
    background-color: var(--menu-dev-hover-border-color);
    width: 0%;
    max-width: 200px;
    
    
    -webkit-transition: all 800ms ease;
    -moz-transition: all 800ms ease;
    -ms-transition: all 800ms ease;
    -o-transition: all 800ms ease;
    transition: all 800ms ease;
}

.dev-submenu .menu-item.current-menu-item a {
    color: var(--menu-dev-active-text-color);
    
    border-bottom:3px solid var(--menu-dev-active-border-color);
}


.headernav {
    position: fixed;
    z-index: 1000;
    max-width: 1440px;
    width: 100%;
    top: 0;
    
    /*
    -webkit-transition: all 400ms ease;
    -moz-transition: all 400ms ease;
    -ms-transition: all 400ms ease;
    -o-transition: all 400ms ease;
    transition: all 400ms ease; /**/
    
    
    background: #fff;
    border-bottom: 1px solid #ccc;
}
/*
.headernav.scrolled {
}
.headernav.scrolled .navbar {
    margin-top: 10px;
    margin-bottom: 5px;
}
.headernav.scrolled .logo {
    height: 30px;
}
.scrolled #menu-main-navigation > .menu-item > a,
.scrolled #menu-main-navigation > .menu-item.nav-btn a {
    padding-top: 8px;
    padding-bottom: 8px;
}
.scrolled .sub-menu-ux-wrap {
    top:34px;
    z-index: 100;
} /**/
.headernav .navbar {
    margin-top: 10px;
    margin-bottom: 5px;
}
.headernav .logo {
    height: 30px;
    width: auto;
    margin-left: 10px;
}
#menu-main-navigation > .menu-item > a,
#menu-main-navigation > .menu-item.nav-btn a {
    padding-top: 8px;
    padding-bottom: 8px;
}
.sub-menu-ux-wrap {
    top:34px;
    z-index: 100;
}

.sticky-submenu.sticky {
    position: fixed;
    background: #fff;
    
    border-bottom: 1px solid #ccc;
    
    left: 50%;
    top: -36px;
    z-index: 100;
    
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    
    width: 100%;
    max-width: 1440px;
}
.sticky-submenu.sticky-submenu-pagelinks.sticky {
    background: #fff;
}
.sticky-submenu.sticky-submenu-anchorlinks.sticky {
    background: var(--lightBlue);
    top: -26px;
}
.sticky-submenu .navbar-nav {
    display: table;    
}
.sticky-submenu.sticky .navbar-nav {
    margin: 0 auto;
    display: table;
    
}
.sticky-submenu .menu-item.visited a {
    color: var(--text-secondary);
}
.sticky-submenu .menu-item.visited.current a {
    color: var(--petrol);
}
.sub-menu > .menu-item.menu-icon {
    display: inline-block;
}
.menu-icon a {
    text-indent: -9999px;
    
    width: 20px;
    height: 20px;
    margin: 0 25px 0 0;
    padding: 0;
    
    box-sizing: content-box;
    
}
.menu-icon-path {
    fill:var(--text-secondary);
}
.github-icon {
    width: 20px;
    height: 20px;
    display: inline-block;
    position: relative;
    top: 3px;
}
.menu-icon.menu-icon-github a {
    
    
    text-indent: 30px;
    padding-top: 3px;
}
.footer-nav .menu-icon.menu-icon-github {
    margin-top: 0;
}
.footer-nav .menu-icon.menu-icon-github a {
    padding-top: 3px;
}
.menu-icon.menu-icon-twitter a {
    width: 25px;
}
.menu-icon-facebook a {
    margin-left: 20px;
}
.menu-icon.menu-icon-facebook a {
    
    width: 20px;
}
.menu-icon.menu-icon-youtube a {
    
    width: 29px;
}
.menu-icon.menu-icon-discord a {
    
    width: 29px;
}

.footer-nav {
    font-size: 16px;
    line-height: 20px;
}
.footer-nav > .menu-item { /* footer - 1. level */
    margin: 10px 0;
    vertical-align: text-top;
    width: 16%;
}
.footer-nav > .menu-item.menu-social { 
    width: 50%;
}
.footer-nav > .menu-item.specflow-logo { 
    color: transparent;
}
.footer-nav > .menu-item.specflow-logo a {
    color: transparent;
    border: none;
    aspect-ratio: 102 / 27;
    display: block;
    margin-right: 50px;
}
.footer-nav .menu-social .menu-icon {
    margin-top: 0;
}
.footer-nav .menu-item a { /* footer - 1. level */
    color: var(--purple);
}
.footer-nav .sub-menu {
    background: unset;
    margin: 0;
    padding: 0;
}
.footer-nav .sub-menu a {
    padding: 10px 0 10px 0;
}

.footer-nav .sub-menu > .menu-item:not(.section-header .menu-icon) > a::after {
    left: 0;
}/**/
.footer-nav .menu-item .menu-item { /* footer - 2. level */
    max-width: 100%;
    
}
.footer-nav .menu-item .menu-item a { /* footer - 2. level */
    /*color: var(--purple);
    font-weight: 400;*/
    color:var(--text-primary);
}
.footer-nav .menu-item .menu-item.menu-item-has-children > a { /* footer - 2. level */
    padding-bottom: 0;
}
.footer-nav .menu-item .menu-item.menu-item-has-children { /* footer - 2. level */
    padding-bottom: 10px;
}
.footer-nav .menu-item .menu-item .menu-item { /* footer - 3. level */
    
}
.footer-nav .menu-item .menu-item .menu-item a { /* footer - 3. level */
    
    color: var(--text-primary);
    font-weight: 400;
}
.footer-nav .menu-icon-facebook a {
    margin-left: 0
}
.footer-nav .section-header > a {
    border: none;
}
.footer-nav .menu-icon {
    margin-top: 20px;
}


.footer-bottom-nav {
    margin: 0;
    padding: 0;
}
.footer-bottom-nav .menu-item {
    margin: 0;
    padding: 0;
}
.footer-bottom-nav .menu-item a {
    color: #fff;
    font-size: 14px;
    
    padding: 5px 0;
    margin-right: 60px; 
    display: block;
    border: none;
}
.svg-failed {
    display: inline;
    width: 45px;
}
.icon {
    width: 20px;
    height: 20px;
    
    background: #333;
    
    text-indent: -9999px;
    margin: 0 auto;
}

.double-btn-wrapper.width-100px {
    width: 100px;
    height: 100px;
    display: inline-block;
}
.svg-runner-comparison {
    height: 80px;
    float: left;
    
}

.runner-compare-td {
    width: 13%;
}
.about-icons svg {
    display: inline;
    width: 20px;
    margin-right: 10px;
}
/* benefits-menu CSS END */

/* navigation END  */


.max-width-20 {
    max-width: 20px;
}
.max-width-150 {
    max-width: 150px;
}
.max-width-260 {
    max-width: 260px;
}
.max-width-350 {
    max-width: 350px;
}
.max-width-380 {
    max-width: 380px;
}
.max-width-400 {
    max-width: 400px;
}
.max-width-460 {
    max-width: 400px;
}
.max-width-510 {
    max-width: 510px;
}
.max-width-620 {
    max-width: 620px;
}
.max-width-700 {
    max-width: 700px;
}
.max-width-840 {
    max-width: 840px;
}
.max-width-950 {
    max-width: 950px;
}
.center {
    margin: 0 auto;
    display: table;
}
.vertical-center-display {
    
    display: table-cell;
    vertical-align: middle;
}
.vertical-center {
    position: absolute;
    left: 50%;
    top: 50%;
    
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}
.vertical-center-2 {
    position: absolute;
    top: 50%;
    
    -moz-transform:  translateY(-50%);
    -webkit-transform:  translateY(-50%);
    -o-transform:  translateY(-50%);
    -ms-transform:  translateY(-50%);
    transform:  translateY(-50%);
}

.lean-bdd-wrapper {
    -webkit-border-radius: 20px;
    border-radius: 20px;
    
    
    -webkit-box-shadow: 0 0 20px 0 rgba(222,222,222,1);
    box-shadow: 0 0 20px 0 rgba(222,222,222,1);
    padding: 20px;
    
}
.lean-bdd-img {
    background: var(--imagePlaceholderColor);
    -webkit-border-radius: 10px;
    border-radius: 10px;
    
    width: 100%;
    min-height: 189px;
    position: relative;
    float: left;
}
.hero-blog-overview .lean-bdd-img {
    min-height: 395px;
    float: none;
}
.tag-wrapper {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    min-height: 10px;
    background: var(--purple);
    -webkit-border-radius: 0 0 10px 10px;
    border-radius: 0 0 10px 10px;
    
    font-size: 14px;
    color:#fff;
    font-weight: bold;
}
.tag-wrapper .tag {
    padding: 5px 10px;
}
.lean-bdd-link-wrapper {
    border: none;
}
.lean-bdd-link {
    border: none;
    color: var(--purple);
}
.lean-bdd-rect {
    height: 10px;
    width: auto;
}
.btn-icon {
    height: 20px;
    width: auto;
    float: left;
    margin-right: 10px;
}
.lean-bdd-slider-element {
    width: 350px;
    display: inline-block;
}
.lean-bdd-slider .slick-track {
    padding: 20px; 
}

.gherkin-nav-ul {
    
}
.gherkin-nav-li {
    margin-left: 0;
    list-style-type: none;
    
}
.gherkin-nav-link {
    text-transform: uppercase;
    color: var(--purple);
    text-decoration: none;
    border: none;
    
    padding: 5px 0;
    
    font-size: 14px;
    font-weight: bold;
    
    position: relative;
    
    display: block;
}
.gherkin-nav-link.active::before  {
    content: "";
    
    width: 10px;
    height: 100%;
    position: absolute;
    left: -20px;
    top: 0;
    margin-top: 0;
}
.gherkin-nav-link.active  {
    color:var(--petrol);
    padding-left: 0px;
}
.gherkin-nav-parent {
    font-size: 14px;
    line-height: 20px;
    display: block;
    font-weight: bold;
    color: var(--black);
}

.gherkin-nav-ul-testautomation .gherkin-nav-link {
    text-transform: none;
    margin-left: 20px;
    line-height: 20px;
}

.gherkin-learn-element {
    display: none;
}
.gherkin-learn-element.active {
    display: block;
}
.gherkin-learn-element-description {
    min-height: 90px;
}
.svg-net-icon {
    height: 80px;
    width: auto;
    float: left;
    padding: 0 !important;
}
.svg-net-icon-small {
    height: 60px;
    width: auto;
    float: left;
}
.net-icons-wrapper {
    padding: 10px;
    display: inline-block;
    
    -webkit-border-radius: 100px;
    border-radius: 100px;
    
    
    -webkit-box-shadow: 0 0 20px 0 rgba(222,222,222,1);
    box-shadow: 0 0 20px 0 rgba(222,222,222,1);
    
    -webkit-transition: all 400ms ease;
    -moz-transition: all 400ms ease;
    -ms-transition: all 400ms ease;
    -o-transition: all 400ms ease;
    transition: all 400ms ease;
}
.integration-link {
    border: none;
    text-decoration: none;
}
.integrations-icon-external {
    height: 12px;
}
.light-border-left {
    border-left: 1px solid var(--seperator-bg-color);
}
.position-relative .trainer-image-wrapper {
    position: static;
}
.slick-slider.trainer-image-wrapper {
    max-width: 120px;
    margin-left: auto;
    margin-right: auto; /**/
}
.slick-arrow {
    
    width: 80px;
    height: 80px;
    
    text-indent: -99999px;
    border: none;
}
.slick-arrow.slick-prev {
    -moz-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    transform: rotate(180deg);
}
.trainer-image-wrapper .slick-arrow {
    position: absolute;
    top: 50%;
    
}
.trainer-image-wrapper .slick-arrow.slick-prev {
    
    left: 100px;
    -moz-transform: translateY(-50%) rotate(180deg);
    -webkit-transform: translateY(-50%) rotate(180deg);
    -o-transform: translateY(-50%) rotate(180deg);
    -ms-transform: translateY(-50%) rotate(180deg);
    transform: translateY(-50%) rotate(180deg);
}
.trainer-image-wrapper .slick-arrow.slick-next {
    right: 100px;
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}
.gherkin-online-editor-iframe {
    min-height: 640px;
}

.id-anchor {
    
}

.id-anchor-element {
    display: none;
    position: absolute;
    
    border: none;
    text-decoration: none;
    padding-left: 10px;
    color: var(--text-secondary);
}
.tooltipp {
    position: absolute;
    
    margin-left: 15px;
    border: none;
    text-decoration: none;
    padding: 5px;
    color: #fff;
    background: var(--petrol);
    font-size: 14px;
    line-height: 1.2;
    border-radius: 4px;
}
.gherkin-hero-svg-arrow {
    position: absolute;
    right: 0;
    top: 150px;
}

/* CSS for Code-Blocks */
code::before {
    
    width: calc(100% + 40px);
    height: 100%;
    position: absolute;
    left: -40px;
    top: 0;
    content: "";
    display: block;
        
    -webkit-border-radius: 5px;
    border-radius: 5px;
    
    -webkit-box-shadow: 0 0 20px 0 rgba(222,222,222,1);
    box-shadow: 0 0 20px 0 rgba(222,222,222,1);
    
}
code::after {
    
    height: 100%;
    content: "";
    
    position: absolute;
    left: -40px;
    width: 40px;
    top: 0;
    
    background: var(--sourceCode-wrapperBackground);
    
    -webkit-border-radius: 5px 0 0 5px;
    border-radius: 5px 0 0 5px;
    
    
}
code {
    position: relative;
    font-family: 'Roboto Mono', monospace;
    counter-reset: code;
    font-weight: 300;
    font-size: 14px;
    
    white-space: break-spaces;
    
    display: block;
    
    
    margin-left: 40px;
    padding: 20px 40px 20px 20px;
    
    -webkit-border-radius: 0 5px 5px 0;
    border-radius: 0 5px 5px 0;
    
    background: var(--sourceCode-background);
    color:var(--sourceCode-textColor);
    
    margin-top: 50px;
    margin-bottom: 50px;
    
}

code div,
code p {
    position: relative;
    counter-increment: code;
    display: flow-root;
    
    text-indent: -20px;
    padding-left: 20px;
}
code div::before,
code p::before {
    position: absolute;
    content: counter(code);
    left: -25px;
    top: 0;
    z-index: 1;
    
    color: var(--sourceCode-lineColor);
    
}



.code-block {
    font-family: 'Roboto Mono', monospace;
    counter-reset: code;
    font-weight: 300;
    font-size: 14px;
    
    -webkit-border-radius: 5px;
    border-radius: 5px;
    
    border:0.5px solid var(--sourceCode-borderColor);
    
    /*
    -webkit-box-shadow: 0 0 20px 0 rgba(222,222,222,1);
    box-shadow: 0 0 20px 0 rgba(222,222,222,1); /**/
}
.source-code::before {
    /*background: #484D75;*/
    height: 100%;
    content: "";
    
    position: absolute;
    left: -40px;
    width: 40px;
    top: 0;
    
    -webkit-border-radius: 5px 0 0 5px;
    border-radius: 5px 0 0 5px;
    
    background: var(--sourceCode-LinesBackground);
}
.source-code {
    position: relative;
    
    margin-left: 40px;
    padding: 20px 40px 20px 20px;
    
    -webkit-border-radius: 0 5px 5px 0;
    border-radius: 0 5px 5px 0;
    
    background: var(--sourceCode-background);
    color:var(--sourceCode-textColor);
    
}

.source-code .line {
    position: relative;
    counter-increment: code;
    display: flow-root;
    
    text-indent: -20px;
    padding-left: 20px;
}
.source-code .line::before {
    position: absolute;
    content: counter(code);
    left: -25px;
    top: 0;
    /*color: #fff;*/
    
    color: var(--sourceCode-lineColor);
    
}

.source-code .line.c-tab {
    padding-left: 40px;
}
.source-code .line.c-tab-twice {
    padding-left: 60px;
}
.source-code .line .grid-50 {
    padding: 0;
}
.source-code .line .grid-50:nth-child(2n) {
    padding-left: 7px;
}
code .text-highlight,
.source-code .text-highlight {
    /*color: #6EBECE;*/
    color:var(--sourceCode-textHightlightColor);
    font-weight: 500;
}
code .text-lowlight,
.source-code .text-lowlight {
    /*color: #ccc;*/
    color:var(--sourceCode-textLowlightColor);
}
code .bold,
.source-code .bold {
    font-weight: 500;
}

    /* Code Block - variations */
    .gherkin-editor.grid-100 {
        padding: 0;
    }

    .gherkin-learn-element .code-block, 
    .gherkin-learn-element .source-code {
        min-height: 250px;
    }

    /* Code Block - variations END */
/* CSS for Code-Blocks END */

.border-radius-20 {
    -webkit-border-radius: 20px;
    border-radius: 20px;
}
.border-radius-bottom-20 {
    -webkit-border-radius: 0 0 20px 20px;
    border-radius: 0 0 20px 20px;
}
.border-radius-top-20 {
    -webkit-border-radius: 20px 20px 0 0;
    border-radius: 20px 20px 0 0;
}
.border-radius-lb-20 {
    -webkit-border-radius: 0 0 0 20px;
    border-radius: 0 0 0 20px;
}
.border-radius-rb-20 {
    -webkit-border-radius: 0 0 20px 0;
    border-radius: 0 0 20px 0;
}
.border-radius-10 {
    -webkit-border-radius: 10px;
    border-radius: 10px;
}
.border-radius-5 {
    -webkit-border-radius: 5px;
    border-radius: 5px;
}
.border-radius-100 {
    -webkit-border-radius: 100px;
    border-radius: 100px;
}
.border-radius-100prz {
    -webkit-border-radius: 100%;
    border-radius: 100%;
}
.border-purple {
    border: 3px solid var(--purple);
}

.border-left-purple {
    border-left: 3px solid var(--purple);
}

.padding-20 {
    padding: 20px;
}
.padding-40 {
    padding: 40px;
}
.box-shadow {
    -webkit-box-shadow: 0 0 20px 0 rgba(222,222,222,1);
    box-shadow: 0 0 20px 0 rgba(222,222,222,1);
}
.box-shadow-darker {
    -webkit-box-shadow: 0 0 20px 0 rgba(180,180,180,1);
    box-shadow: 0 0 20px 0 rgba(180,180,180,1);
}
.hidden {
    display: none;
}
.lower-opacity {
    opacity: 0.7;
    -webkit-transition: all 400ms ease;
    -moz-transition: all 400ms ease;
    -ms-transition: all 400ms ease;
    -o-transition: all 400ms ease;
    transition: all 400ms ease;
}
.play-icon {
    position: relative;
}
.play-icon::after {
    position: absolute;
    left: 50%;
    top: 50%;
    content: "";
    
    width: 200px;
    height: 200px;
    
    
    
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    
    
    
    opacity: 1;
    
    -webkit-transition: all 400ms ease;
    -moz-transition: all 400ms ease;
    -ms-transition: all 400ms ease;
    -o-transition: all 400ms ease;
    transition: all 400ms ease;
}
.play-icon-small::after {
    
    width: 80px;
    height: 80px;
}
.page-template-frontpage .light-icon {
    max-width: 110px;
    width: 100%;
    margin-top: 10px;
    
}
.light-icon {
    max-width: 110px;
    width: 100%;
    
}
.light-icon-results {
    max-width: 200px;
    width: 100%;
    
}
.light-icon-arrow {
    width: 8px;
}
.release-icons {
    height: 20px;
}
.svg-icon-galery-wrapper {
    position: absolute;
    left: 50%;
    bottom: -85px;
    
    max-width: 100%;
    width: 292px;
    
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
}
.svg-icon-galery {
    width: 100%;
}
.svg-runner-icon {
    max-height: 280px;
    height: 100%;
}
.md-file-text {
    
    font-family: 'Roboto Mono', monospace;
    font-weight: 600;
    color: var(--text-secondary);
}
.md-file-text p {
    margin-bottom: 5px;
    margin-top: 5px;
}
.md-file-text li {
    margin-bottom: 15px;
}
.trainer-image {
    height: 150px;
    width: 150px;
    
    background: var(--lightBlue);
}
.location-wrapper {
    
}
.location-wrapper .location {
    padding: 0 5px;
    border-right: 1px solid #ccc;
}
.location-wrapper .location:last-child {
    border: none;
    color: var(--text-secondary);
}
.location-icon {
    height: 20px;
    position: relative;
    top: 3px;
}
.location-icon-path {
    fill:#ccc;
}
.testimonial-hero-image-wrapper {
    width: 100%;
    min-height: 395px;
    
    background: var(--lightBlue);
}
.testimonial-evergreen-image-wrapper {
    width: 100%;
    min-height: 160px;
    
    background: var(--lightBlue);
}
.testimonial-image-wrapper {
    width: 100%;
    
    background: var(--lightBlue);
    
    position: relative;
}
.testimonial-topic {
    padding: 10px;
    font-size: 14px;
    letter-spacing: 0.7px;
    text-transform: uppercase;
    font-weight: bold;
}
.testimonial-image-topics {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    background: var(--purple);
    color: #fff;
    -webkit-border-radius: 0 0 10px 10px;
    border-radius: 0 0 10px 10px;
}
.testimonial-author-image {
    max-width: 40px;
}
.testimonial-author-blank {
    width: 40px;
    height: 40px;
    background: var(--lightBlue);
}
.testimonial-hero-text {
    min-height: 141px;
}
.testimonial-text {
    min-height: 141px;
    height: 141px;
    overflow: hidden;
    
}
.testimonial-icons.svg-date {
    height: 20px;
    position: relative;
    top: 7px;
}
.press.svg-date {
    position: relative;
    top: 5px;
}
.testimonial-all-wrapper.odd .testimonial-wrapper {
    margin-left: 10px; 
}
.testimonial-all-wrapper.even .testimonial-wrapper {
    margin-right: 10px;
}
.trainer-team-size-wrapper.active {
    background: var(--purple);
    color: #fff;
}
.trainer-team-size-wrapper {
    border:2px solid var(--purple);
    padding: 10px 0;
    display: block;
    
    -webkit-border-radius: 20px;
    border-radius: 20px;
    
    -webkit-transition: all 400ms ease;
    -moz-transition: all 400ms ease;
    -ms-transition: all 400ms ease;
    -o-transition: all 400ms ease;
    transition: all 400ms ease;
}
.grid-50.no-margin {
    margin: 0;
    padding: 0;
}
.grid-50.no-left-margin {
    margin-left: 0;
    padding-left: 0;
}
.contributor-icon-wrapper svg {
    height: 20px;
    position: relative;
    top: -2px;
    
}
.webinar-svg-date {
    height: 20px;
    position: relative;
    top: 3px;
    vertical-align: top;
}
.tz-all:not(.active) {
    display: none;
}
.what-tested .pp-svg-icon svg {
    height: 100%;
    max-width: 80px;
}
.what-tested .pp-svg-icon svg.e2e {
    max-width: 200px;
}
.pp-svg-icon {
    height: 80px;
}
.pp-svg-icon-wrapper {
    width: 80px;
    height: 80px;
    display: table-cell;
    vertical-align: middle;
}
.pp-svg-icon-wrapper svg {
    max-width: 56%;
    vertical-align: middle;
}
.cta-svg-icon-wrapper {
    width: 80px;
    height: 80px;
    display: inline-block;
    position: relative;
}
.cta-svg-icon-wrapper svg {
    max-width: 56%;
    
    position: absolute;
    top: 50%;
    left: 50%;
    
    
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}
.hidden {
    display: none;
}
.what-tested-tr {
    padding: 20px;
    -webkit-border-radius: 20px;
    border-radius: 20px;
}
.what-tested-tr:first-child .what-tested-td-left {
    -webkit-border-radius: 10px 10px 0 0;
    border-radius: 10px 10px 0 0;
}
.what-tested-tr:last-child .what-tested-td-left {
    -webkit-border-radius: 0 0 10px 10px;
    border-radius: 0 0 10px 10px;
}
.what-tested-td-right {
    vertical-align: middle;
}
.review-wrapper.slick-slider {
    position: static;
}
.trusted_companies_wrapper .slick-list,
.review-wrapper .slick-list {
    padding-left: 20px;
}
/*
.company_logo_wrapper {
    display: inline-block;
    max-height: 100px;
    max-width: 200px;
    
    margin: 40px;
    padding: 20px;
    
    -webkit-box-shadow: 0 0 20px 0 #DEDEDE;
    box-shadow: 0 0 20px 0 #DEDEDE;
    -webkit-border-radius: 20px;
    border-radius: 20px;
    
} /**/
.trusted_companies_wrapper {
    overflow: hidden;
    width: 100%;
    height: 50px;
}
.company_logo_wrapper {
    display: inline-block;
    max-height: 50px;
    max-width: calc(min(100px, 30vw));
    width: 100%;
    height: auto;
    
    margin-right: calc(min(20px, 3vw));
    text-align: center;
    
}
.company_logo_wrapper svg {
    width: auto;
    height: 50px;
    filter: grayscale(0.9);
    opacity: 0.4;
    
    max-width: calc(min(100px, 30vw));
}
.lean-bdd-slider.slick-slider {
    position: static;
}
.lean-bdd-slider .slick-arrow.slick-prev,
.lean-bdd-slider .slick-arrow.slick-next,
.trusted_companies_wrapper .slick-arrow.slick-prev,
.trusted_companies_wrapper .slick-arrow.slick-next,
.review-wrapper .slick-arrow.slick-prev,
.review-wrapper .slick-arrow.slick-next
{
    position: absolute;
    right: 0;
    top: 0px;
}
.trusted_companies_wrapper .slick-arrow.slick-next {
    
}
.lean-bdd-slider .slick-arrow.slick-prev,
.trusted_companies_wrapper .slick-arrow.slick-prev,
.review-wrapper .slick-arrow.slick-prev {
    right: 100px;
    
}
.course-table {
    
}
.course-table-tr {
}
.course-table-td {
    border-bottom: 1px solid var(--lightBlue);
    padding: 20px 10px 20px 0;
    
}
.course-table-th {
    color: var(--purple);
    font-weight: 600;
    text-align: left;
}
.contribution-category-table .course-table-th {
    text-align: center;
}

.contribution-category-table .course-table-td {
    text-align: center;
}

.sp-f-1-t {
    position: absolute;
    font-size: 18px;
    /*
    color: var(--purple); /**/
    color: var(--text-primary);
}
.sp-f-1-t1 {
    left: 50%;
    top: 10px;
    
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    
    width: 100%;
}
.sp-f-1-t2 {
    left: 20px;
    top: 50%;
    
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}
.sp-f-1-t3 {
    left: 40px;
    bottom: 20px;
}
.sp-f-1-t4 {
    right: 60px;
    bottom: 20px;
    
}
.sp-f-1-t5 {
    right: 20px;
    top: 50%;
    
    
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}
.sp-f-1-t6 {
    right: 20px;
    bottom: 20px;
}

.svg-cicd {
    max-height: 500px;
}
.icon-bdd-afflect {
    width: 60px;
}
.social-share-link {
    border: none;
    text-decoration: none;
    
    display: block;
    
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}
.filling-path {
    -webkit-transition: all 300ms ease;
    -moz-transition: all 300ms ease;
    -ms-transition: all 300ms ease;
    -o-transition: all 300ms ease;
    transition: all 300ms ease;
}

/* adding styles for the editor */
.wp-block-quote {
    
    position: relative;
    
    margin: 40px 40px;
    display: inline-block;
    
    padding: 20px 20px 20px 40px;
    
    border-left: 4px solid var(--purple);
    background: var(--lightBlue); 
    
    line-height: 1.8;
    
    
    -webkit-box-shadow: 0 0 20px 0 rgba(222,222,222,1);
    box-shadow: 0 0 20px 0 rgba(222,222,222,1);
    
    -webkit-border-radius: 0 20px 20px 0;
    border-radius: 0 20px 20px 0;
    
    max-width: calc(100% - 60px);
    width: 100%;
}
.wp-block-quote:after {
    position: absolute;
    right: 20px; 
    top: 0px;
    content: '"';
    font-size: 100px;
    line-height: 100px;
    font-family: 'Roboto Mono';
    opacity: 0.3;
}

.blog-posts p,
.release p {
    margin: 35px auto;
    max-width: 820px;
}
.blog-posts h2,
.release h2 {
    color: var(--purple);
    font-size: 32px;
    line-height: 1.5;
    margin-top: 50px;
    margin-bottom: 20px;
}
.blog-posts h3,
.release h3 {
    color: var(--purple);
    font-size: 28px;
    line-height: 1.5;
    margin-top: 50px;
    margin-bottom: 20px;
}
.blog-posts h4,
.release h4 {
    color: var(--purple);
    font-size: 26px;
    line-height: 1.5;
    margin-top: 50px;
    margin-bottom: 20px;
}
.release h2,
.release h3,
.release h4 {
    font-weight: 400;
}
.blog-posts h2,
.blog-posts h3,
.blog-posts h4 {
    margin: 35px auto;
    max-width: 820px;
}

.blog-posts ul,
.blog-posts ol,
.release ul,
.release ol {
    margin-top: 40px;
    margin-bottom: 40px;
    margin-left: auto;
    margin-right: auto;
    
    max-width: 820px;
}
.blog-posts li,
.release li {
    margin-top: 15px;
    margin-bottom: 15px;
}
.blog-posts li ul,
.release li ul {
    margin-top: 5px;
    margin-bottom: 5px;
    padding-left: 20px;
}
.default-content .spacing-table td {
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 30px;
}
.default-content .spacing-table th {
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 30px;
    vertical-align: top;
    text-align: left;
}


.md-file-text h2 {
    color: var(--purple);
    font-size: 28px;
    line-height: 1.5;
    margin-top: 30px;
    margin-bottom: 10px;
}

.md-file-text h3 {
    color: var(--purple);
    font-size: 26px;
    line-height: 1.5;
    margin-top: 30px;
    margin-bottom: 10px;
}

.md-file-text h4 {
    color: var(--purple);
    font-size: 24px;
    line-height: 1.5;
    margin-top: 30px;
    margin-bottom: 10px;
}
.md-file-text h5 {
    color: var(--purple);
    font-size: 22px;
    line-height: 1.5;
    margin-top: 30px;
    margin-bottom: 10px;
}
.svg-share {
    height: 30px;
    width: auto;
}
.svg-blue {
	fill:#4267b2;
	fill-rule:evenodd;
}
.svg-green {
	fill:#25d366;
	fill-rule:evenodd;
}
.press-img-wrapper .img {
    max-height: 160px;
    max-width: 357px;
    width: 100%;
    height: 100%;
}
.ide-selector {
    cursor: pointer;
    text-align: right;
}
.ide-selector-wrapper {
    position: relative;
}
.ide-name {
    display: table-cell;
    vertical-align: middle;
    padding-left: 20px;
}
.ide-selector-row {
    padding: 10px 10px;
    cursor: pointer;
}

.ide-selector-lightbox {
    position: absolute;
    left: 0;
    top: 100px;
    
    background: #fff;
    padding: 15px 0;
    
    
    width: 100%;
}
.ide-content:not(.active) {
    display: none;
}

.ide-selector .pp-svg-icon-wrapper {
    display: inline-block;
    text-align: center;
    position: relative;
}
.ide-selector .pp-svg-icon-wrapper svg {
    
    position: absolute;
    left: 50%;
    top: 50%;
    
    -moz-transform: translateX(-50%) translateY(-50%);
    -webkit-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}
.svg-github {
    width: 30px;
    height: auto;
}
.masterclass-svg-wrapper svg {
    max-height: 80px;
    width: auto;
}

.masterclass-svg-wrapper .svg path {
    fill:var(--text-secondary);
}
.progress-bar-wrapper {
    position: relative;
    margin-top: 8px;
    height: 4px;
    width: 400px;
    max-width: calc(100% - 100px);
    
    background: var(--purpleLight);
}
.progress-bar {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    z-index: 0;
    
    -webkit-transition: all 400ms ease;
    -moz-transition: all 400ms ease;
    -ms-transition: all 400ms ease;
    -o-transition: all 400ms ease;
    transition: all 400ms ease;
}
.progress-bar-counter {
    position: relative;
    z-index: 1;
}
.svg-case-study {
    max-width: 60px;
    width: 100%;
}
.c-max-height {
    /*max-height: calc(100vw - 80px);*/
}

/* adding styles for the editor END */

.svg-code-icon {
    max-width: 22px;
    height: auto;
    width: 100%;
}
.code-icon-wrapper .svg-code-icon {
    max-width: 55px;
    max-height: 55px;
    width: 100%;
    height: auto;
}
.double-btn-inner .svg-code-icon {
    max-width: 40px;
    max-height: 40px;
}
.svg-sf-icon {
    max-height: 30px;
    
}
.net-svg-hero {
}
.net-svg {
    max-height: 300px;
    max-width: 80%;
}
/*****************************************/
/*****************************************/
/*****************************************/
/* SpecFlow School - CSS changes */
.progress-bar-passthreshold {
    position: absolute;
    top: -8px;
    width: 2px;
    background: var(--purple);
    height: 20px;
}
.qustion-text {
    text-indent: -27px;
    padding-left: 27px;
}
.lesson-header {
    
}
.lesson-content {
    
}
.lesson-content-complete,
.lesson-heading-icon {
    display: none;
}
.complete .lesson-content-complete {
    display: block;
}
.complete .lesson-heading-icon {
    display: inline-block;
}
.complete .lesson-content,
.complete .lesson-footer {
    display: none;
}
#exam.complete .lesson-footer {
    display: none;
}
.certificate-valid .lesson-footer {
    display: none;
}
.complete .lesson-header {
    padding-left: 20px;
}
.complete .lesson-header-heading {
    text-indent: -40px;
}
.complete .clock-outer-wrapper {
    display: none;
}
.complete .lesson-content .default-content {
    overflow: hidden;
    max-height: 100px; /**/
    position: relative;
}
.complete .lesson-content .default-content:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 60px;
    
background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);
    
}
.inactive .lesson-header,
.inactive .lesson-content {
    opacity: 0.5;
}
.lesson-footer {
    
}
.incomplete .bg-purple.lesson-footer {
    background: var(--lightBlue);
    color: var(--text-primary)
}
.camouflage-link {
    border: none;
    color: inherit;
    text-decoration: none;
}
.border-lightest {
    border:1px solid #f5f5f5;
}
.school-navigation {
    
}
.breadcrumb-link {
    border-bottom: none;
}
.school-navigation-li {
    position: relative;
}
.school-navigation-li.active:before {
    content: "";
    width: 10px;
    height: 10px;
    margin-top: -10px;
    left: -20px;
    top: 50%;
    position: absolute;
    background: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%208%2010%22%3E%3Cpath%20fill%3D%22%23574897%22%20d%3D%22M8%205l-8%205V0l8%205z%22%2F%3E%3C%2Fsvg%3E') no-repeat center center;
}
.school-navigation-li.done:before {
    content: "";
    width: 10px;
    height: 10px;
    margin-top: -10px;
    left: -20px;
    top: 50%;
    position: absolute;
    background: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2020%2020%22%3E%3Cdefs%3E%3Cstyle%3E.icon-fullsupport-2%7Bfill%3Anone%3Bstroke%3A%23574897%3Bstroke-width%3A2px%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Ccircle%20cx%3D%2210%22%20cy%3D%2210%22%20r%3D%2210%22%20fill%3D%22none%22%2F%3E%3Ccircle%20class%3D%22icon-fullsupport-2%22%20cx%3D%2210%22%20cy%3D%2210%22%20r%3D%229%22%2F%3E%3Cpath%20class%3D%22icon-fullsupport-2%22%20d%3D%22M5%209.69L8.55%2013%2015%207%22%2F%3E%3C%2Fsvg%3E') no-repeat center center;
}
.school-navigation-li.active .school-navigation-a {
    font-weight: 600;
}
.school-navigation-a {
    border-bottom:none;
}
.border-left {
    border-left: 1px solid #ccc;
}
.border-right {
    border-right: 1px solid #ccc;
}
.icons-wrapper svg {
    max-height: 70px;
    width: auto;
}
.question-answer-label {
    display: table;
}
.answer-wrapper {
    display: table-cell;
    width: 1%;
    padding-right: 20px;
}
.question-answer-label-caption {
    display: table-cell;    
}

/* SpecFlow School - CSS changes END */
/*****************************************/
/*****************************************/
/*****************************************/

.ad-space {
    display: none;
}
.header-popup-image {
    position: absolute;
    right: 30px;
    top: 0;
    
    max-width: 100px;
}
.header-popup-image-left {
    left: 30px;
}
.header-popup-image-right {
    right: 30px;
}


/* style changes overrides - requested by tricentis */
h1.text-darkblue,
h2.text-darkblue,
h3.text-darkblue,
h4.text-darkblue,
h5.text-darkblue,
h1.text-purple,
h2.text-purple,
h3.text-purple,
h4.text-purple,
h5.text-purple {
    color: var(--text-heading);
}
.usp-icon-wrapper svg,
.usp-icon-wrapper img {
    max-height: 70px;
    width: auto;
}
.livingdoc-usp-icon-wrapper svg {
    max-height: 175px;
    width: auto;
    
}

/* style changes overrides - requested by tricentis END */


/* grid-layout https://unsemantic.com/ */
/* ================================================================== */
/* This file has a mobile-to-tablet, and tablet-to-desktop breakpoint */
/* ================================================================== */
@media (max-width: 400px) {
  @-ms-viewport {
    width: 320px;
  }
}
.clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0}.grid-container:before,.mobile-grid-5:before,.mobile-grid-10:before,.mobile-grid-15:before,.mobile-grid-20:before,.mobile-grid-25:before,.mobile-grid-30:before,.mobile-grid-35:before,.mobile-grid-40:before,.mobile-grid-45:before,.mobile-grid-50:before,.mobile-grid-55:before,.mobile-grid-60:before,.mobile-grid-65:before,.mobile-grid-70:before,.mobile-grid-75:before,.mobile-grid-80:before,.mobile-grid-85:before,.mobile-grid-90:before,.mobile-grid-95:before,.mobile-grid-100:before,.mobile-grid-33:before,.mobile-grid-66:before,.tablet-grid-5:before,.tablet-grid-10:before,.tablet-grid-15:before,.tablet-grid-20:before,.tablet-grid-25:before,.tablet-grid-30:before,.tablet-grid-35:before,.tablet-grid-40:before,.tablet-grid-45:before,.tablet-grid-50:before,.tablet-grid-55:before,.tablet-grid-60:before,.tablet-grid-65:before,.tablet-grid-70:before,.tablet-grid-75:before,.tablet-grid-80:before,.tablet-grid-85:before,.tablet-grid-90:before,.tablet-grid-95:before,.tablet-grid-100:before,.tablet-grid-33:before,.tablet-grid-66:before,.grid-5:before,.grid-10:before,.grid-15:before,.grid-20:before,.grid-25:before,.grid-30:before,.grid-35:before,.grid-40:before,.grid-45:before,.grid-50:before,.grid-55:before,.grid-60:before,.grid-65:before,.grid-70:before,.grid-75:before,.grid-80:before,.grid-85:before,.grid-90:before,.grid-95:before,.grid-100:before,.grid-33:before,.grid-66:before,.grid-offset:before,.clearfix:before,.grid-container:after,.mobile-grid-5:after,.mobile-grid-10:after,.mobile-grid-15:after,.mobile-grid-20:after,.mobile-grid-25:after,.mobile-grid-30:after,.mobile-grid-35:after,.mobile-grid-40:after,.mobile-grid-45:after,.mobile-grid-50:after,.mobile-grid-55:after,.mobile-grid-60:after,.mobile-grid-65:after,.mobile-grid-70:after,.mobile-grid-75:after,.mobile-grid-80:after,.mobile-grid-85:after,.mobile-grid-90:after,.mobile-grid-95:after,.mobile-grid-100:after,.mobile-grid-33:after,.mobile-grid-66:after,.tablet-grid-5:after,.tablet-grid-10:after,.tablet-grid-15:after,.tablet-grid-20:after,.tablet-grid-25:after,.tablet-grid-30:after,.tablet-grid-35:after,.tablet-grid-40:after,.tablet-grid-45:after,.tablet-grid-50:after,.tablet-grid-55:after,.tablet-grid-60:after,.tablet-grid-65:after,.tablet-grid-70:after,.tablet-grid-75:after,.tablet-grid-80:after,.tablet-grid-85:after,.tablet-grid-90:after,.tablet-grid-95:after,.tablet-grid-100:after,.tablet-grid-33:after,.tablet-grid-66:after,.grid-5:after,.grid-10:after,.grid-15:after,.grid-20:after,.grid-25:after,.grid-30:after,.grid-35:after,.grid-40:after,.grid-45:after,.grid-50:after,.grid-55:after,.grid-60:after,.grid-65:after,.grid-70:after,.grid-75:after,.grid-80:after,.grid-85:after,.grid-90:after,.grid-95:after,.grid-100:after,.grid-33:after,.grid-66:after,.grid-offset:after,.clearfix:after{content:".";display:block;overflow:hidden;visibility:hidden;font-size:0;line-height:0;width:0;height:0}.grid-container:after,.mobile-grid-5:after,.mobile-grid-10:after,.mobile-grid-15:after,.mobile-grid-20:after,.mobile-grid-25:after,.mobile-grid-30:after,.mobile-grid-35:after,.mobile-grid-40:after,.mobile-grid-45:after,.mobile-grid-50:after,.mobile-grid-55:after,.mobile-grid-60:after,.mobile-grid-65:after,.mobile-grid-70:after,.mobile-grid-75:after,.mobile-grid-80:after,.mobile-grid-85:after,.mobile-grid-90:after,.mobile-grid-95:after,.mobile-grid-100:after,.mobile-grid-33:after,.mobile-grid-66:after,.tablet-grid-5:after,.tablet-grid-10:after,.tablet-grid-15:after,.tablet-grid-20:after,.tablet-grid-25:after,.tablet-grid-30:after,.tablet-grid-35:after,.tablet-grid-40:after,.tablet-grid-45:after,.tablet-grid-50:after,.tablet-grid-55:after,.tablet-grid-60:after,.tablet-grid-65:after,.tablet-grid-70:after,.tablet-grid-75:after,.tablet-grid-80:after,.tablet-grid-85:after,.tablet-grid-90:after,.tablet-grid-95:after,.tablet-grid-100:after,.tablet-grid-33:after,.tablet-grid-66:after,.grid-5:after,.grid-10:after,.grid-15:after,.grid-20:after,.grid-25:after,.grid-30:after,.grid-35:after,.grid-40:after,.grid-45:after,.grid-50:after,.grid-55:after,.grid-60:after,.grid-65:after,.grid-70:after,.grid-75:after,.grid-80:after,.grid-85:after,.grid-90:after,.grid-95:after,.grid-100:after,.grid-33:after,.grid-66:after,.grid-offset:after,.clearfix:after{clear:both}.grid-container{margin-left:auto;margin-right:auto}.mobile-grid-5,.mobile-grid-10,.mobile-grid-15,.mobile-grid-20,.mobile-grid-25,.mobile-grid-30,.mobile-grid-35,.mobile-grid-40,.mobile-grid-45,.mobile-grid-50,.mobile-grid-55,.mobile-grid-60,.mobile-grid-65,.mobile-grid-70,.mobile-grid-75,.mobile-grid-80,.mobile-grid-85,.mobile-grid-90,.mobile-grid-95,.mobile-grid-100,.mobile-grid-33,.mobile-grid-66,.tablet-grid-5,.tablet-grid-10,.tablet-grid-15,.tablet-grid-20,.tablet-grid-25,.tablet-grid-30,.tablet-grid-35,.tablet-grid-40,.tablet-grid-45,.tablet-grid-50,.tablet-grid-55,.tablet-grid-60,.tablet-grid-65,.tablet-grid-70,.tablet-grid-75,.tablet-grid-80,.tablet-grid-85,.tablet-grid-90,.tablet-grid-95,.tablet-grid-100,.tablet-grid-33,.tablet-grid-66,.grid-5,.grid-10,.grid-15,.grid-20,.grid-25,.grid-30,.grid-35,.grid-40,.grid-45,.grid-50,.grid-55,.grid-60,.grid-65,.grid-70,.grid-75,.grid-80,.grid-85,.grid-90,.grid-95,.grid-100,.grid-33,.grid-66{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;padding-left:10px;padding-right:10px}.grid-parent{padding-left:0;padding-right:0}.grid-offset{clear:both;margin-left:-10px;margin-right:-10px}

.top-5{margin-top:5px}.top-10{margin-top:10px}.top-15{margin-top:15px}.top-20{margin-top:20px}.top-25{margin-top:25px}.top-30{margin-top:30px}.top-35{margin-top:35px}.top-40{margin-top:40px}.top-45{margin-top:45px}.top-50{margin-top:50px}.top-60{margin-top:60px}.top-65{margin-top:65px}.top-70{margin-top:70px}.top-80{margin-top:80px}.top-90{margin-top:90px}.top-100{margin-top:100px}.top-120{margin-top:120px}.top-130{margin-top:130px}.top-140{margin-top:140px}.top-150{margin-top:150px}.top-160{margin-top:160px}.top-180{margin-top:180px}.top-200{margin-top:200px}.bottom-5{margin-bottom:5px}.bottom-10{margin-bottom:10px}.bottom-15{margin-bottom:15px}.bottom-20{margin-bottom:20px}.bottom-25{margin-bottom:25px}.bottom-30{margin-bottom:30px}.bottom-35{margin-bottom:35px}.bottom-40{margin-bottom:40px}.bottom-50{margin-bottom:50px}.bottom-60{margin-bottom:60px}.bottom-70{margin-bottom:70px}.bottom-80{margin-bottom:80px}.bottom-90{margin-bottom:90px}.bottom-100{margin-bottom:100px}.bottom-200{margin-bottom:200px}.bottom-300{margin-bottom:300px}.right-5{margin-right:5px}.right-10{margin-right:10px}.right-15{margin-right:15px}.right-20{margin-right:20px}.right-25{margin-right:25px}.right-30{margin-right:30px}.right-40{margin-right:40px}.right-50{margin-right:50px}.right-60{margin-right:60px}.right-70{margin-right:70px}.right-80{margin-right:80px}.right-90{margin-right:90px}.right-100{margin-right:100px}.left-5{margin-left:5px}.left-10{margin-left:10px}.left-15{margin-left:15px}.left-20{margin-left:20px}.left-25{margin-left:25px}.left-30{margin-left:30px}.left-40{margin-left:40px}.left-50{margin-left:50px}.left-60{margin-left:60px}.left-70{margin-left:70px}.left-80{margin-left:80px}.left-90{margin-left:90px}.left-100{margin-left:100px}
.no-marin, .no-margin {margin: 0; padding: 0;}
.no-lr-padding {padding-left: 0; padding-right: 0;}
.f-12, .f-13,.f-14,.f-15,.f-16,.f-17,.f-18,.f-19,.f-20,.f-21,.f-22,.f-23,.f-24,.f-26,.f-28,.f-30,.f-32,.f-34,.f-36{line-height:1.5}.f-38,.f-40,.f-44,.f-50,.f-60,.f-80{line-height:1.2}.f-12{font-size:12px}.f-13{font-size:13px}.f-14{font-size:14px}.f-15{font-size:14px}.f-16{font-size:16px}.f-17{font-size:17px}.f-18{font-size:18px}.f-19{font-size:19px}.f-20{font-size:20px}.f-21{font-size:21px}.f-22{font-size:22px}.f-23{font-size:23px}.f-24{font-size:24px}.f-26{font-size:26px}.f-28{font-size:28px}.f-30{font-size:30px}.f-32{font-size:32px}.f-34{font-size:34px}.f-36{font-size:36px}.f-38{font-size:38px}.f-40{font-size:40px}.f-44{font-size:44px}.f-50{font-size:50px}.f-60{font-size:60px}.f-80{font-size:80px; line-height: 80px;}.f-120{font-size:120px; line-height: 120px;}
.lh-20 {line-height: 20px;}.lh-50 {line-height: 50px;}.lh-60 {line-height: 60px;}.lh-70 {line-height: 70px;}