@charset "UTF-8";

:root {
  --gorilla-color: #00e676;
  --monkey-color: #ffea01;
  --gorillaColorInverted: #0d1a66;
  --stageBlue:#180a6e;
  --matrixBG: #f6f6f6;
  --Indigo500: #5C6BC0;
  --Indigo300: #7986CB;
  --Indigo100: #C5CAE9;
  --backgroundBlue: #011d71;
  --IndigoDark: #121952;
  --plainWhite: #fff;
  --plainBlack: #000;
  --mouseGrey: #e6e8e6;
  --transparent: #00000000;
}


/*reset*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font: inherit;
	vertical-align: baseline;
}

a{text-decoration: none !important}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

body {
	font-family: 'SourceCodePro';
	line-height: 1;
}

ol, ul {
	/* list-style:disc !important; */
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/*reset*/

b, strong {
  font-weight: bold !important;
}

html {
  scroll-behavior: smooth !important;
}
.gorillaColorBlueBG {
  background-color: var(--backgroundBlue) !important;
}
.blockTextOutline{

}
.blockText{
  margin:auto;
  width:70%;
  text-align:justify;
}

.gorillaColor{
  color: var(--gorilla-color) !important;
}
.gorillaColorInverted{
  color: var(--gorillaColorInverted);
}
.gorillaColorBlueBG{
  background-color: var(--gorillaColorInverted) !important;
}

.forceWhite{
  color:var(--plainWhite);
}

.forceIndigo300{
  color: var(--Indigo300) !important;
}

.forceIndigo500{
  color: var(--Indigo500) !important;
}

.forceBold{
  font-weight:1000;
}
.forceGorillaColor{
  color: var(--Indigo300) !important;
}

.forceGorillaBGColor{
  background-color: var(--gorilla-color) !important;
}
.forcePreventTextDecoration{
    text-decoration: none;
}

@font-face {
  font-family: "Antonio";
  src: url("fonts/Antonio-Regular.ttf");
}

@font-face {
  font-family: "SourceSansPro";
  src: url("fonts/SourceSansPro-Regular.otf");
}

@font-face {
  font-family: "SourceCodePro";
  src: url("fonts/SourceCodePro-Regular.otf");
}

.topBar{
  background: linear-gradient(180deg,rgba(24, 10, 110, 1) 56px, rgba(255, 255, 255, 1) 0px, rgba(255, 255, 255, 1) 100%);
}

main{
  padding-bottom:90px !important;
}


#footer{
  display:none;
}

#footerContainer{
    display: flex;
    justify-content: space-between !important;
    vertical-align: middle !important;
    margin-top: -4px;
    margin-bottom: 2px;
    width: 100%;
    padding-bottom: 6px;
}

.footerText{
  text-align: center;
  font-size:12px;
  font-family: sourceSansPro;
  color:var(--gorilla-color) !important;
  width:75px;
}
#footerLinks{
    margin-top: 17px;
    margin-right: 40px;
    display: flex;
    gap: 20px;
}

.footerLink{
  text-align:center;
  color:var(--gorilla-color) !important;
  text-decoration: none !important;
}

.footerLink img{
  margin-left:-9px;;
}


.footerAdditional{
  display:flex;
  flex-direction: row;
  justify-content: space-between;
  font-family: sourceCodePro;
  margin-left: 40px;
  font-size: 14px;
  line-height: 16px;;
  color: var(--gorilla-color);
}


#epicMegaGrant{
margin-top: 9px;
    display: block;
    width: 67px;
}

#shopStoerer{
  display:block;
  margin-top: 356px;
}

#tisaxStoerer{
  margin-top: 18px;
  width: 82px;
}

#legalStuff{
    display: flex;
    flex-direction: row;
    gap: 20px;
    justify-content: flex-end;
    margin-right: 40px;
    color:var(--gorilla-color);
    text-decoration: none !important;
}
#legalStuff a{
  display:block;
  color:var(--gorilla-color) !important;
  text-decoration: none !important;
}

.footerAdditionalRight{
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 2px;
    margin-right: 40px;
}

.footerAdditionalStamps{
    display: flex;
    gap: 30px;
    flex-direction: row;
    margin-top: -10px;
}

#footerYearNumber{
  margin-top: 13px;
  margin-left: 10px;
}

#asEasyAs{
    font-family: 'Antonio';
    font-size: 18px;
    color: var(--gorilla-color);
    margin-top: -16px;
    margin-left: 74px;
}



.presentationdownloader{
  color:var(--Indigo500);
}
h1{
  margin-top:0px;
  margin-bottom:0px;
}

#username_form{
  display:none;
}

#monkeyLogo{
  width:340px !important;
  height:50px !important;
}
@media(max-width:976px){
  #monkeyLogo{
    width:220px !important;
    height:30px !important;
  }
}

/*---General utility-------------------------------------*/
.normalButton{
  width: 194px;
  font-family: sourceSansPro;
  font-size: 20px;
  color: #000;
  padding-top: 6px;
  text-decoration: none;
}

.flexContainer{
  display:flex;
}

.stackedOnTop{
  width:100%;
  margin-left:-100%;
}

.headlineBox{
  text-align: center;
  margin:auto;
  margin-top:60px;
  height:auto;
  padding:10px;
  max-width:900px;
  font-weight:700;
}

.bottomHeadline{
  text-align: center;
  margin:auto;
  margin-top:10px;
  height:auto;
  padding:10px;
  max-width:900px;
}

.subHeadline{
  font-family:SourceSansPro;
  font-size:20px;
  font-weight:600;
}

.headLine{
  font-family:SourceCodePro;
  font-size: 40px;
  font-weight:700;

  margin-bottom:10px;
  font-weight: 700;
  text-transform: uppercase;
}

#postSubmitHeadline{
  display: none;
  font-size: 15pt;
  font-weight: bold;
  text-align: center;
  margin-bottom: 20px;
  background-color: #fff;
  padding: 30px;
  font-family: "SourceCodePro";
}

@media(max-width:576px){
  .headLine{
    font-family:SourceCodePro;
    font-size: 30px;
  }
}
.forceCenter{
  margin: auto;
  margin-bottom: 21px;
  margin-top: -2px;
}
.forceNonPointer{
  cursor:default !important;
}

.forceColorWhite{
  color:var(--plainWhite) !important;
}
.forceBlack{
  color:var(--plainBlack) !important;
}

.forceBGGorillaGreen{
  background-color:var(--gorilla-color) !important;
}
.forceGorillaGreen{
  color:var(--gorilla-color) !important;
}

.forceHeadline{
  font-size:20pt;
  font-weight:800;

}

.forceBGColorIndigoDark{
  background-color:var(--IndigoDark) !important;
}

.forceBGColorIndigo{
  background-color:var(--Indigo500) !important;
}
.forceColorIndigo{
  color:var(--Indigo500) !important;
}

.forcePlainBlack{
  color:var(--plainBlack) !important;
}

.cutMarginsAwayFromHeadlines{
  margin-block-start: 0px !important;
  margin-block-end: 0px !important;
}

/* Tooltip container */
.tooltips {
  position: relative;
}

/* Tooltip text */
.tooltipstext {
  position:absolute;
  bottom: 50px;
  right: 0px;
  width:340px;
  height: auto;

  visibility: hidden;
  font-family: sourceCodePro;
  line-height: 1.4;
  font-size: 18px;
  text-align: left;
  background-color: var(--gorilla-color);
  color: var(--gorillaColorInverted);
  text-align: center;
  padding: 15px;
  border-radius: 1px;
  z-index: 3;
}

.tooltipsContent {
  position:absolute;
  bottom: 50px;
  right: 0px;
  width:340px;
  height: auto;

  visibility: hidden;

  z-index: 3;
}
.tooltips:hover .tooltipsContent {
  visibility: visible;
  animation: fade 0.2s linear;
  opacity: 1;
}

.elementToFadeInAndOut {


}
@keyframes fade {
0%,100% { opacity: 0 }
100% { opacity: 1 }
}

.forceNoBG{
  background-color: #00000000 !important;
}

.forceDropShadow{
  box-shadow: rgba(50, 50, 93, 0.25) 200px 200px 200px 200px, rgba(0, 0, 0, 0.3) -200px 200px 200px 200px;
}


/* Show the tooltip text when you mouse over the tooltip container */
.tooltips:hover .tooltipstext {
  visibility: visible;
}


.tooltips .tooltipstext::after {
  content: " ";
  position: absolute;
  top: 100%; /* At the bottom of the tooltip */
  left: 93%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color:  var(--gorilla-color) transparent transparent transparent;
}

.topBorder{
  border-top: 1px solid #ccc;
}


/*---Nav Footer-----------------*/


.hamButton{
  outline:none !important;
}
.hamburger{
  margin-top:3px;
  margin-right:30px;
  border:none !important;
}

.hamLink{
  color:var(--gorilla-color);
}


#footer{
  display:none;
  z-index:100;
  position:fixed;
}

#footerFlex{
  margin-top: 9px;
  display: flex;
  flex-wrap: nowrap;
  flex-direction: row;
  gap: 12px;
  margin-left: 40px;
}

.footerSmText{
  font-family: SourceSansPro;
  font-size: 16px;
  font-weight: 600;
  margin-top: 6px;
  text-decoration: none !important;
}
.footerSmTextLight{
  font-family: SourceSansPro;
  font-size: 16px;
  font-weight: 300;
  margin-top:-4px;
  text-decoration: none !important;
  /* margin-right: 10px; */
}

#footer p{
  margin-top: 5px;
}

#footerAlt{
  display:block;
  position:fixed;
  bottom:0px;
  height:75px;
  width:100%;
}

.footerIconGS{
  width:44px;
  height:44px;
}

#gorillaLogo{
  width:340px !important;
  height:50px !important;
}
@media(max-width:768px){
  #gorillaLogo{
    width:220px !important;
    height:30px !important;
  }
}

#mainNav{
  background-color: var(--backgroundBlue);
  justify-content: space-between;
  background-image: url("../images/gsLogo.svg");
  background-repeat: no-repeat;
  background-size: auto 80%;
  background-position-x: 5px;
  background-position-y: 5px;
  height: 50px;
}

.navbar {
  padding-top:0px !important;
  padding-bottom:0px  !important;
}

.navbar-nav {
    --bs-nav-link-padding-x: 0;
    --bs-nav-link-padding-y: 0.5rem;
    --bs-nav-link-font-weight: ;
    --bs-nav-link-color: var(--bs-navbar-color);
    --bs-nav-link-hover-color: var(--bs-navbar-hover-color);
    --bs-nav-link-disabled-color: var(--bs-navbar-disabled-color);
    display: flex;
    flex-direction: column;
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
    gap: 14px;
}

#navContainer{
  display:block;
  width:100%;
}
#navContainerAlt{
  display:none;
  width:100%;
  background-color: #0000;
  font-family: 'SourceSansPro';
  font-size: 18px;
}

@media(min-width:992px){
  #footer{
    display:block;
    position:fixed;
    bottom:0px;
    height:60px;
    width:100%;}

  #footerAlt{display:none;}
  #navContainer{display:none;}
  #navContainerAlt{display:block;}
}


#navbarResponsive{
  text-align:center;
}

#navbarStuff{
  justify-content: end;
  padding-right: 30px;
}

@media(max-width:988px){
  .hamLink{
    font-family:sourceCodePro;
    font-weight:500;
    font-size:26px;
  }
  #navbarResponsive{
    background: var(--IndigoDark) !important;
  }
}


/*------------------------------------------------------*/
#privacypolicy{
  padding-top: 130px;
}




#pricing_flexor{
  display:flex;
  flex-direction:column;
  width:100%;
}

#pricing_upperpart{
  margin-top: 120px;
  line-height: 20pt;;
  order:1;
}

#pricing_subtext{
  max-width:600px;
  margin:auto;
  font-weight:700;
  text-align:center;
  order:2;
}

#pricing_center{
  display:flex;
  flex-direction: column;
  margin:auto;
  width:1000px;
  margin-top:50px;
  text-align: center;
  /* background: url("../images/howwedoit_landscape.webp") no-repeat center; */
  order:3;
  font-weight:700;
}
.cell3{
  border-bottom:4px solid #6d72ad;
}
.cell4{
  text-align:left;
  font-size:8pt;
  font-weight:500;
}

#pricing_footnote{
  max-width:600px;
  font-weight:700;
  text-align:center;
  order:4;
}


.pricing_headElements{
  margin: auto;
  display:flex;
  flex-direction: row;
  border-bottom: 4px solid #6d72ad;
  width:1000px;
  font-family: Antonio;
  text-align: left;
  font-size: 26pt;
  font-weight: 700;
  padding-bottom:2px;
  color: #6d72ad;
}

.pricing_headElements_1{
  padding-left:5px;
  width:167px;
}
.pricing_headElements_2{
  padding-left:5px;
  width:322px;
}
.pricing_headElements_3{
  padding-left:5px;
  width:200px;
}

.pricing_cell{
    margin:auto;
    width:1000px;
    display:flex;
    flex-direction: row;
}
.pricing_cell_base{
  width:400px;
  text-align: left;
  font-size: 10pt;
  font-weight: 500;
  padding:10px;
  border-bottom: 2px dotted #000;
}

.noBottom{
  border:none;
}

.pricing_cell_phase{
  width:250px;
  font-weight: 700;
}
.pricing_cell_cost{
  list-style: outside;
  width:500px;
  background-color:#e9ecf3 ;
}
.pricing_cell_details{
  width:800px !important;
}

.pricing_cell_details li::marker{
    font-size:13pt;
}

/* ol, ul, dl {
  margin-top: 0;
  margin-bottom: 1rem;
  padding-left: 20px;
} */


.specialChar{
  list-style: none;
  margin-left: 0;
  padding-left: 0;
}

.specialChar{
  text-indent: -1.4em;
}

.specialChar:before{
  content: "→";
  padding-right: 5px;
}


.pricing_button{
  margin-top:50px !important;
  order:4;
  background-color: var(--gorilla-color);
}

#pricing_stoerer{
  position:absolute;
  margin-top:-468px;
  margin-left:calc(50vw - 418px);
}
#pricing_stoerer img{
  width:65px;
}

#pricingSub{
  display:block !important;
}

@media(max-width:360px){
  #pricing_flexor{
    width:125%;
  }
}



@media(max-width:1000px){

  #pricing_center{width:auto; gap:20px;border-bottom:none;border-radius: 10px;}
  .pricing_headElements{ display:none;}
  .headlineBox{height:auto;}
  #pricing_subtext{padding-left:20px;padding-right:20px;}
  .pricing_cell{
    margin:5px;
    flex-direction:column;
    gap:0px;
    max-width:390px;
    background-color:#e9ecf3;
    border-radius: 10pt;
  }

  .pricing_cell_base{
    width:300px;
    border-bottom:none;
    border-radius:10px;
    padding-left: 20px;
    padding-right: 20px;
  }

  .pricing_cell_phase{
    font-size: 30pt;
    font-family: Antonio;
     width:auto;
     text-align:center;
     order:1;
    }
  .pricing_cell_cost{
    width:auto;
    text-align:center;
    order:3;
    font-size: 30pt;
    color:#00f;
  }
  .pricing_cell_details{
    width:auto;
    order:2;
    display:inline-block;
    width: auto;
    max-width: 390px;
  }
  .pricing_cell_details ul {max-width:380px;}

  #pricing_stoerer{
    margin-top:-1151px;
    margin-left:calc(50vw + 140px);
  }

  #pricingSub{
    display:block !important;
    margin:auto;
  }

  .cell2{background-color:#e1e2ff;}
  .cell2 .pricing_cell_cost{background-color:#e1e2ff;}
  .cell3 .pricing_cell_cost{font-size:10pt;}
  .cell3{border-bottom:none;}
  .cell4{background-color:#fff; font-size:10pt;margin-top:-20px;}
}



/*---options--------------------*/


#options_flexor{
  display:flex;
  flex-direction:column;
}

#options_upperpart{
  margin-top: 120px;
  line-height: 20pt;;
  order:1;
}

#options_subtext{
  max-width:600px;
  margin:auto;
  font-weight:700;
  text-align:center;
  order:2;
  margin-bottom:20px;
}

#options_center{
  display:flex;
  flex-direction: row;
  margin:auto;
  width:1000px;
  margin-top:50px;
  order:3;
  border-bottom:4px solid #6d72ad;
}

#options_center ul{
  text-align:left;
  width:350px;
  margin: auto;
  padding-top:20px;
}
#options_center li{
  padding-bottom:20px;
}

.options_cell_base{
  width:100%;
  font-size: 12pt;
  font-weight: 700;
}

.options_cell_base span
{
  font-weight:800;
  font-size:13pt;
}

.options_cell_base ul{
  margin-top: 15px;
}

.optionsCell{
  width:90%;
  margin:auto;
}

.optionsCell .subHeadline{
  font-family:Antonio;
  font-size:30px;
}

.noBottom{
  border:none;
}

.options_cell_alwaysOn{
}
.options_cell_onDemand{
  list-style: outside;
  background-color:#e9ecf3 ;
}

.options_headElements{
  flex-direction: row;
  border-bottom: 4px solid #6d72ad;
  width: 100%;
  font-family: Antonio;
  font-size: 26pt;
  font-weight: 700;
  padding-bottom:2px;
  margin-bottom: 20px;
}

.options_headElements_1{
  padding-left:5px;
  color: #6d72ad;
  background-color:#fff;
  text-align:center;
}
.options_headElements_2{
  padding-left:5px;
  color: var(--gorilla-color);
  background-color:#fff;
  text-align:center;
}

.optionsImageContainer{
  width:200px;
  margin-top:40px;
}


ol, ul, dl {
  margin-top: 0;
  margin-bottom: 1rem;
  padding-left: 20px;
}

#options_button{
  margin: auto;
  margin-top:50px !important;
  order:4;
  background-color: #ff0;
}

@media(max-width:1000px){

  #options_center{
    margin:auto;
    display:flex;
    flex-direction: column;
    max-width: 400px;
    gap:40px;
    border-bottom: none;
  }

  .options_cell_base{
    background-color:#eee;
    border-radius: 20px;
    padding-bottom: 50px;
  }

  .options_cell_onDemand{
    background-color:#e1e2ff;
  }

  .options_headElements{
    border-bottom: none;
  }

  .options_headElements_1{
    margin-top:25px;
    background-color:#eee;
    border-radius: 20px;
  }
  .options_headElements_2{
    margin-top:25px;
    background-color:#e1e2ff;
    border-radius: 20px;
  }

  .optionsCell .subHeadline{
    font-size:23px;
    color: #6d72ad;
  }

  .headlineBG{
    width:80%;
    background-color:#6d72ad;
    color: #fff;
    padding: 1px;
    margin: auto;
    white-space:nowrap;
    border-radius: 15px;
    font-size:40px;
  }
}


/*---Section: Stage -----------------------*/

#mainStageBG{

  width:100%;
  background-color: var(--backgroundBlue);
}

#mainStageFG{
  text-align: left;
}

.hugeButton{
  padding: 20px;
    border: 0px;
    font-weight: 800;
    font-size: 15pt;
}

#stageImgLS{
  display:none;
  width:100%;
}

#stageImgPT{
  display:block;
  width:100%;
}

@media(min-width:722px){
  #stageImgLS{
    display:block;
  }
  #stageImgPT{
    display:none;
    width:100%;
  }
}

#patentStamp{
  display: block;
  width: 74px;
}

@media(max-width:576px){
  #patentStamp{
    display:none;
  }
}

.lessHugeButton{
	padding: 12px;
	border: 0px;
	font-weight: 800;
	font-size: 15pt;
	/* border-radius: 5px; */
	font-family:sourceCodePro;
}

#mainStage .text {
  margin-top:134px !important;
  margin-bottom:80px !important;
}

.stageFont{
  font-family: Antonio;
  font-size:160px;
  font-weight:500;
  line-height:1.2
}
#mainStageText {
  margin-top:117px !important;
  margin-left:23px;
}

@media (max-width: 722px){
  .stageFont{font-size:68px;}

  #mainStageText {margin-top:283px !important;}

  #stageText{
    margin-left:-11px;
    margin-top:424px;
    width:445px;
  }

  #stageStoerer{
    margin-left:-30%;
    margin-top:106px;
  }
  #gorillaStageStoerer{
    width:140px !important;
    height:140px !important;
  }
}

@media (max-width: 320px){
  #mainStageText {margin-top:265px !important;}
}
#stage{
}

#stageBG{
  background-color:var(--stageBlue);
  width:100%;
}


.stageFontLittle{
  font-family: SourceCodePro;
  font-size: 17px;
  font-weight: 300;
  line-height: 20px;
}




#stageStoerer{
  background:none !important;
  margin-top:10vh;
  margin-left:-20%;
  width:300px;
  height:300px;
}

#gorillaStageStoerer{
  width:200px !important;
  height:200px !important;
}




/*---Section: Statistics---------------------------------*/



#statisticsBG{
  width:100%;
}

#statisticsFG{
  margin-top:0px;
  text-align: center;
}
#statisticsFG_IMG{
  width:100%;

  margin:auto;
  margin-top: 200px;
  vertical-align:top !important;
}


#statisticsHeadline{
  text-align: center;
  color: var(--plainWhite);
}


#statisticsInfo{
  margin:auto;
  display:flex;
  flex-direction:row;
  width:66%;
  gap:80px 120px;
  flex-wrap:wrap;
  justify-content:space-evenly;

  margin-top:100px;
  text-align: center;
}

.StatInfoCluster{
  margin-top: 0px;
  line-height: 1.2;
  font-weight:700;
  justify-content: space-evenly;
  text-align: center;
}
.statisticsInfoBottom{
  margin:auto;
  display:flex;
  flex-direction:row;
  width:66%;
  gap:80px 120px;
  flex-wrap:wrap;
  justify-content:space-evenly;

  margin-top:00px;
  text-align: center;
}


  .StatInfoCluster .icon{
    font-family: Antonio;
    color:var(--gorilla-color);
    font-size:10px;
    line-height: 0.2;
    margin-bottom: -25px;
  }
  .StatInfoCluster .icon .iconGFX{
    width:105px;
  }
  .StatInfoCluster .icon .iconGFX2{
    width:70px;
  }

  .StatInfoCluster .stat{
    font-family: Antonio;
    color:var(--gorilla-color);
    font-size:87px;
    font-weight:700;
    margin-bottom: -30px;
  }

  #gorilla-streaming .StatInfoCluster:nth-child(1) .stat {
    margin-left:-39px;
  }
  #statisticsInfoBottom .StatInfoCluster:nth-child(1) .stat {
    margin-left:auto;
  }


  @media(max-width:726px){

    .StatInfoCluster:nth-child(1) .stat {
      margin-left:-16px;
    }

    #statisticsInfoBottom{
    margin-top:40px;
    }
    .StatInfoCluster{
      margin-top: -5px;
    }
    .StatInfoCluster .stat {
      font-size:50px;
      margin-bottom:-25px;
    }

    .StatInfoCluster .icon{
      margin-bottom:-20px;
    }
    #statisticsInfo{
      margin-top:80px;
    }
  }

  .StatInfoCluster .unit{
    font-family: Antonio;
    font-size:40px;
    background-color: var(--gorilla-color);
    color:var(--gorillaColorInverted);

    padding-left:7px;
    padding-right:7px;
    padding-bottom:1px;
  }
  .StatInfoCluster .timescale{
    line-height: 2.2;
    font-family: Antonio;
    font-size: 20px;
    background-color: var(--gorilla-color);
    color: var(--gorillaColorInverted);
    padding-top: 1px;
    padding-left: 4px;
    padding-right: 4px;
    width: 218px;
    margin: auto;
    height: 35px;
  }

#StatisticsSub{
  margin-top:100px;
  text-align: center;
  margin-bottom: 83px;
}

#StatisticsSubText{
  display: inline-block;
  font-family: SourceCodePro;
  font-size:18px;
  font-weight:200;
  line-height:1.6;
  color:#fff;
  width: 90%;
  max-width:890px;
}
@media(max-width:726px){
  #StatisticsSub{
    margin-top:40px;
  }
}

/*
@media (max-width: 720px){
  #StatisticsSubText{
    width:484px;
  }
} */

/*------------------------------------------------------*/

#featureMatrixSection{
  /* height:2350px !important; */
  background-color: var(--matrixBG);
}


#featureMatrixBG{
  width:100%;
  background-color: var(--matrixBG);
}

#featureMatrixFG{
  text-align: center;
}

#matrixGadgetMobile{
  display:none;
  margin-top:10px;
}

@media(max-width:1320px){
  #matrixGadgetMobile{
    display:inline-block;
  }

}





#matrixGadgetMobile .greenBox{
  display:inline-block;
  border: var(--gorilla-color) 6px solid;
  border-radius: 20px;
  min-width:320px;
  /* width:80%; */
  margin:auto;
  margin-top: 30px;
}

#matrixGadgetMobile .infoBox #explText{
  margin-top: 20px;
  margin-left: 30px;
  margin-right: 30px;
  font-family: sourceCodePro;
  font-weight: 500;
  font-size: 14;
  color: #000000;
}

.infoBox .expandCollapseButton{
  margin-top: 20px;
  padding-bottom: 20px;
  font-family: sourceSansPro;
  font-size:20px;
  font-weight: 600;

}

.infoBox .collapse-button:not(.collapsed) {
  display:none;
}


.infoBox .cellText{
  display:flex;
  width:90%;
  margin:auto;
  margin-top: 20px;
  padding-right:10px;
  font-family: sourceCodePro;
  font-size: 16x;
  border-bottom: 1px #ccc solid;
  font-weight: 700;
}

.infoBox .cellText:hover{
  font-weight: bold;
}

.infoBox .keepRight{
  margin-left:auto;
  margin-top: -10px;
  margin-bottom: 5px;
}

.infoBox .cell{
  width:20%;
  margin-left:3%;
  border-bottom: 1px #ccc solid;
  text-align: center;
}


.infoBox .cell2{
  width:20.0%;
  margin-left:4%;
  border-bottom: 1px #ccc solid;
  text-align: center;

}



.infoBox .checkmark{
  width:45px;
  height:45px;
}
.infoBox .x{
  padding-top:2px;
  width: 34px;
}



.infoBox .infoButton{
  width:24px;
  margin-left:20px;
}

#matrixGadgetMobile .blueBox{
  display:inline-block;
  border: var(--Indigo300) 6px solid;
  border-radius: 20px;
  min-width:320px;
  margin:auto;
  margin-top: 30px;


}

.boxShadow{
  -moz-box-shadow: 0 0 10px #ccc;
  -webkit-box-shadow: 0 0 10px #ccc;
  box-shadow: 0 0 10px #555;
}

#carouselIndicators{
  position:relative;
  margin:auto;
  top:-166px;
  z-index: 0;
}

ol.carousel-indicators {
  position: absolute;
  bottom: 5px;
  margin: 0;
  left: 0;
  right: 0;
  width: auto;
}

ol.carousel-indicators li, ol.carousel-indicators li.active {
  width: 1.5rem;
  height: 1.5rem;
  margin: 0;
  border-radius: 50%;
  border: 0;
  background: transparent;
  margin-top: -26px;
  list-style-type:none;
}

ol.carousel-indicators li {
  background: #aaa;
  margin-left: 2rem;
  margin-right: 2rem;

}

ol.carousel-indicators li.active {
  background: #555;
  margin-left: 2rem;
  margin-right: 2rem;
}

/************************************/




.matrix-line{
  height:200px;
}

#engine-line{
  height:100px;
}

.featurematrix_font{
  font-size: 11pt;
  line-height: 20px;
}

.forceLeftAlign{
  text-align:left !important;
}

#matrixGadget{
  display:block;
  margin:auto;
  width:1255px;
  height:1200px;
  background-image: url("../images/featureMatrix2Bars_new.webp");
  background-repeat: no-repeat;
  background-position-x: 260px;
  background-position-y: -32px;

}
@media(max-width:1320px){#matrixGadget{display:none;}}



#featureMatrix_mainField{
  margin-top:72px;
}


#featureMatrix_headers{
  margin-top:20px;
}

#featureMatrix_headers #topSigns{
  display: flex;
  padding-top: 43px;
  margin-left: 555px;
  margin-top: -14px;
  width: 425px;
  height: 192px;
  flex-direction: row;
  gap: 20px;
  justify-content: space-between;
}

#featureMatrix_headers #topSigns .StatInfoCluster{
  width:200px;
}

#featureMatrix_headers #topSigns .stat{
  font-size: 35px;
}

#featureMatrix_headers #topSigns .unit{
  font-size: 21px;
  color: var(--gorillaColorInverted);
  background-color: var(--plainWhite);
}

.featurematrixMobileHeader{
  padding:20px;
}

.featurematrixMobileHeader .stat{
  font-size: 58px;
}
.featurematrixMobileHeader .unit{
  padding: 20px;
  font-size: 35px;
  background-color: #00000000;
}


/* #featureMatrix_headers #topSigns div:nth-child(3){
  margin-left:0px;
  margin-top: 45px;
} */



#featureMatrix_headers #explanationText{
  display:flex;
  margin-left:408px;
  width: 450px;
  height:200px;
  flex-direction: row;
  gap: 26px;
  justify-content:left;
}

#featureMatrix_headers #explanationText .text{
  width: 200px;
  text-align: center;
  font-family: SourceCodePro;
  font-size:18px;
  font-weight:500;
  line-height:2;
  color:#000;

}

#featureMatrix_headers #explanationText .text:nth-child(1){
  margin-top:24px;
}

#featureMatrix_headers #explanationText .text:nth-child(2){
  margin-top:68px;
}




#featureMatrix_table{
  margin-top:-75px;
}

#featureMatrix_MatrixText{
  margin-left: 250px;
  text-align: right;
  line-height: 2.1;
  font-family: SourceCodePro;
  font-size: 16px;
  font-weight: 500;
}

#featureMatrix_MatrixText .matrix-line{
  display: flex;
  flex-flow: row wrap;
  height: 50px;
  color: #000;
  gap: 39px;
  margin-left: -10px;
}
#featureMatrix_MatrixText #engine-line{
  height:66px;
}


#engine-line .cellText,
#engine-line .cell,
#engine-line .cell2{
  border:none;
}

/* #engine-line .cell{
  height: 200px;
} */

#featureMatrix_MatrixText:nth-child(1){
  height:320px;
}

.featureMatrixMobileTextBlock{
  width: 309px;
  text-align: left;
  padding-left: 15px;
  padding-top: 20px;
  padding-right: 20px;
}

#featureMatrix_table .cellText{
  width:285px;
  display:inline-block;
  margin-top:10px;
  padding-right:10px;
  border-bottom: 1px #ccc solid;
  font-weight: 500;
}


#featureMatrix_table .cellText:hover{
  font-weight: bold;
}

#featureMatrix_table .cell{
  width:187px;
  border-bottom: 1px #ccc solid;
  text-align: center;
  background-color: #ffffff00;
}

#featureMatrix_table .noLine{
  border-bottom: none;
}

#featureMatrix_table .checkmark{
  width:45px;
  height:45px;
}
#featureMatrix_table .x{
  padding-top:2px;
  width: 45px;
  height:45px;
}

#featureMatrix_table .infoButton{
  width:24px;
  margin-left:20px;
}

#matrixGadgetMobile .checkmark{
  width:45px;
  height:45px;
}


#matrixGadgetMobile .x{
  width:32px;
  height:32px;
  margin-left: 12px;
  margin-top:6px;
  margin-bottom:7px;
}


.featureMatrixCTA{}


#featureMatrixCTAContainer1{
  margin-top: 336px;
  margin-left: 356px;
  width: 180px;
  z-index:200;
}

.hyperscaler1{
  margin-top: -14px;
  width: 96px;
}
.hyperscaler2{
  width:75px;
}
.hyperscaler3{
  width:40px;
}
#callUsToDefineYourNeeds{
  position: relative;
  margin-top: 475px;
  margin-left: -7px;
  font-size: 26pt;
  font-family: Antonio;
  color: var(--gorilla-color);
}

#featureMatrixDownArrow{
  position: relative;
  margin-top: 263px;
  margin-left: 59px;
}

#featureMatrixGreenDot{
  position: relative;
  margin-top: -347px;
  margin-left: 780px;
}


#featureMatrixCTAContainer2{
  margin-top: 163px;
  margin-left: -25px;
  width: 302px;

  z-index:200;
}

@media(max-width:1320px){#featureMatrixCTAContainer{ margin:auto;margin-top:80px;}};

.noBorder{
  border:none !important;
}

#thanksForContactBox{
  /* margin-top:-1000px; */
  position:relative;
  margin: auto;
  margin-top:-880px;
  max-width:70%;
  display:none;
  opacity:0.0;
  transition: opacity 2.0s;
}

.engineLogo1{
  width:40px;
  margin-top: 7px;
  margin-right:20px;
}

.engineLogo2{
  width:75px;
}

#featureMatrixBlueBox{
  margin:auto;
  padding-top:40px;
  padding-bottom:40px;
  margin-top:-380px;
  min-width: 36%;
  max-width: 600px;
  border: var( --Indigo500) 4px solid;
  background-color: var(--plainWhite);

  max-height:4000px;
  transition: max-height 2s ;
}


@media(max-width:920px){
  #featureMatrixBlueBox{
  width:650px;}
}

@media(max-width:1320px){
  #featureMatrixBlueBox{width:90%;margin-top:-50px;}

  #thanksForContactBox{
    margin:auto;
    width:75%;
}
}

.group:has(input[name="city"]) {
    visibility: hidden;
    height: 0;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

#featureMatrixFormHeadline{
  /* padding-top:50px; */

  margin: auto;
  text-align: center;
}

#featureMatrixFormContainer{
  margin-top:103%;
}

#featureMatrixForm{
  display:flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  gap:20px;
  padding-top:40px;
  min-width:290px;
  max-width:500px;
  margin: auto;

  opacity:1.0;
  transition: opacity 0.3s;
}


#featureMatrixForm .group{
  width:232px !important;
}


#featureMatrixForm .fullGroup{
  max-width:500px !important;
  margin:auto;
}

@media(max-width:920px){
  #featureMatrixForm .group{
    width:88% !important;
    margin-left:12px;
  }

  #featureMatrixForm .fullGroup{
    width:94% !important;
    margin:auto;
  }

}

.featureMatrixCheckbox{
  font-family:sourceSansPro;
  font-size: 16px;
  text-align:left;

}

.featureMatrixFormElement{
  font-family:sourceSansPro !important;
  font-size: 16px !important;
  text-align:left !important;
  width:100% !important;
  padding-left:6px !important;
}


.featureMatrixFormElement{
  font-family:sourceSansPro;
  font-size: 16px;
  text-align:left;

}

.featureMatrixFormElement:nth-child(2){
  margin:auto;
  width:97% !important;
}

.featureMatrixFormElementFull{
  font-family: sourceSansPro;
  font-size: 16px;
  width: 95%;
  text-align: left;
  margin-left: 4px;
}

#featureMatrixForm select{
  padding: 8px !important;
}

#featureMatrixFormMessage{
  height:100px;
  width: 800px;
  font-size: 14px !important;
  font-family: sourceSansPro;
  text-align:left;
  max-width:95%;
  resize: none;
}

#featureMatrixFormBottom {
  display:flex;
  width:500px;
  justify-content:flex-end;
}

#featureMatrixForm button{
  height: 48px ;
  width:123px;
  font-family:sourceCodePro;
  font-size: 20px;
  text-align: center;
  border: none;
  margin-top: 10%;
  align-self: center;
}

/*****************************************/

#featureMatrix_Partners{
font-family: SourceCodePro;
    padding-top: 30px;
    margin: auto;
    margin-top: 0px;
    text-align: left;
    height: 140px;
    margin-bottom: 240px;
    width: 100%;
}

#featureMatrix_Partners #wrapper{
  margin:auto;
  margin-top: 40px;
  max-width:552px;
  min-width:320px;
  text-align:center;

}

.partnerLogos{
  display:flex;
  margin:auto;
  width:100%;
  justify-content:space-around;
}

.featureMatrix_Partner{
  height: 35px;
  font-size: 12px;
  margin-bottom: 10px;
  line-height: 32px;
}
#featureMatrix_Partners a:hover{
  text-decoration: none !important;
}

#featureMatrix_Partner_MW{
  margin-top:-10px;
  height:28px;
}

#featureMatrix_Partner_Google{
  height:45px;
  margin-top: -25px;
}

#featureMatrix_Partner_Epic{
  height:35px;
}

#featureMatrix_Partner_NVIDIA{
  height:35px;
}

#featureMatrix_Partners .wrapAround{
  display:none;
}

@media(max-width:860px)
{
  #featureMatrix_Partners .wrapAround{
    display:block;
    padding-bottom:20px;
  }


  #featureMatrix_Partner_MW{
    margin-bottom:15px;
  }
}





/*------------------------------------------------------*/

#projectsSection{

}

#projectsBG{
  width: 100%;
  background-color:var(--plainWhite);
}
#projectsFG{
  text-align:center;
  font-family: sourceCodePro;
}

#projectsFG{
  width:100%;
}



#carousel {
  margin-top:90px;
  display:flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap:112px;
  justify-content: space-evenly;
}


.caroIndicators{
  top:800px;
}

.projectsCarousel{
  margin:auto;
  margin-top:60px;
  max-width:1100px;
}

#carousel .bigTile{
  display:flex;
  flex-direction: column;
  flex-wrap: wrap;
  width:90%;
  min-width:320px;
  max-width:420px;
  text-align: center;
}

#carousel .bigTile a{
  height:20px;
  width:20px;
  /* margin-left: calc(100% - 316px); */
}


#formerProjects{
  margin: auto;
  margin-top:20px;
  display: flex;
  max-width: 745px;
  gap: 20px;
  flex-wrap: wrap;
}

#formerProjectsHeadline{
  font-family: 18px;
  color:var(--plainBlack);
  font-weight:700;
  margin:auto;
  margin-top:40px;

}

.formerProjectsTile{
  width:130px;
}

.formerProjectsHeadline{
  font-family:Antonio;
  font-size:14px;
  color:var(--IndigoDark);
  margin-bottom:8px;
  text-transform: uppercase;
}

@media(max-width:760px){
  #formerProjects{
    width:292px;
  }
}



/*----------------------------------------------*/


 #glide {
  margin-left: auto;
  margin-right: auto;
  margin-top: 20px;
  padding-top: 20px;
  padding-bottom: 20px;
  height: 331px;
  background-color: var(--mouseGrey);
}


#glide .glide__slides {
	display: flex;
	padding: 0;
	margin-top: 0;
	margin-bottom: 0;
}

#glide .glide__slide {
display:flex;
  flex-direction: column;
  height: 300px !important;
}


.glide__slide .image{
  margin: auto;
  width: 90%;
  min-width: 280px;
  max-width: 300px;
  margin-top: 47px;
  margin-bottom: 0px;
}

.glide__slide .projectText{
  margin:auto;
  width:300px;
  text-align: justify;
  font-size: 16px;
  font-family: sourceCodePro;
  line-height: 1.5;
}

.glide__slide .projectHeadline{
  display: block;
  margin: auto;
  font-family: Antonio;
  font-size: 18px;
  font-weight: 600;
  margin-top: -316px;
  text-align: center;
  width: 189px;
  background-color: var(--gorillaColorInverted);
  color: var(--gorilla-color);
  text-transform: uppercase;
}

.glide__slide button{
  width:194px;
  height: 48px;
  font-family:sourceSansPro;
  font-size: 20px;
  text-align: center;
  border: none;
  margin-top: 25px;
  margin-bottom: 20px;
  align-self: center;
}



.glide__arrows {
	display: flex;
	justify-content: space-between;
	padding: 1em;
}
.glide__arrow {
	border: none;
	border-radius: 20em;
	padding: 0.5em 3em;
	background-color: #ffc400;
	font-size: 1.1em;
	cursor: pointer;
	transition: 0.3s;
}
.glide__arrow:focus {
	outline: none;
}
.glide__arrow:active {
	transform: scale(0.88);
}




/*---Section: Gorilla Rendering -----------------------*/
#ecosystemSection{
  font-size:17px;
}

#ecosystemSectionBG{
  width:100%;
  background-color: var(--plainWhite);
  font-size:17px;
}

#ecosystemSectionFG{
  height:auto;
  text-align: center;
  font-family: sourceCodePro;
}
#ecosystemSectionFG>img{
  display:block;
  margin: auto;
  margin-top:30px;
}



#ecosystemSectionFG>img:nth-child(3){
  display:none;
  width: 70%;
}

#ecosystemSectionFG > div:nth-child(3){
  margin: auto;
  margin-top: 40px;
  max-width: 700px;
  width: 90%;
}

@media(max-width:732px){
  #ecosystemSectionFG>img:nth-child(2){
    display:none;
  }
  #ecosystemSectionFG>img:nth-child(3){
    display:block;
  }
}


/*------------------------------------------------------*/

#spacerGFX{
  width: 100%;
  height:45px;
  margin-top:00px;
  border:none;
}

#productSupportSection{
  background-color: var(--gorillaColorInverted);
}

#productSupportBG{
  width: 100%;
  background-color: var(--gorillaColorInverted);
}


#productSupportSection_Main{
  width:100%;
}

#productSupportSection_Main .textArea{
  width:95%;
  margin:auto;
  font-family: sourceSansPro;
  text-align:center;
  margin-top: 10%;
  margin-bottom: 8%;
  color: var(--gorilla-color);
}

#productSupportSection_Main .textArea #line1{
  font-size: 36px;
  font-weight:600;
}
#productSupportSection_Main .textArea #line2{
  font-family: sourceSansPro;
  font-size: 18px;
}
#productSupportSection_Main .textArea #line3{
  font-family: sourceCodePro;
  font-size: 36px;
  font-weight: 700;
}
#productSupportSection_Main .textArea #line4{
  font-family: sourceSansPro;
  font-size: 18px;
  font-weight:600;
}


/*------------------------------------------------------*/


#gorilla-streaming{
  text-align:center;
  background-color: var(--mouseGrey);
}

#aboutUsBG{
  width:100%;
  background-color: #ffffff00;
}

#aboutUsFG{
  text-align: center;
}

#aboutUsHeadline{
  margin-top:120px;
  color:var(--plainBlack);
  text-align: center;
  margin-bottom: 60px;
}



#aboutUsTopBox{
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
}
#downloadprese{
  font-family:SourceCodePro;
}

#aboutUsTopImageBox{
  width: 517px;
}
.aboutUsTextImageBox{
  display:flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap:40px;
  max-width:730px;
  min-width:280px;
  margin: auto;
  justify-content: center;
}
.blockText2{
  font-family:'sourceCodePro';
  max-width:300px;
  text-align:justify;
  font-size: 13px;
}

#googleCloudLogo{
  width:210px;
}

#aboutUsTopimage{
  min-width: 292px;
  width: 78%;
  max-width: 413px;
}

#AboutUsText{
  width: 400px;
  margin-top: -4px;
  margin-left: 20px;
  margin-right: 20px;
}

#about-logo-box{
  display:flex;
  flex-direction: row;
  margin: auto;
  margin-top:40px;
  margin-bottom:40px;
  width: 270px;
}

#aboutUsDeco{
  z-index: -1;
  position: fixed;
  bottom: calc(-30vw + 100px);
}

.aboutLogoLeft{
  width:auto;
}

.aboutLogoRight{
  width:99px;
  margin-top:-4px;
}


#sponsoring{
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
}

#sponsoringLeft{
  width: 300px;
  text-align: justify;

}
#wwf{
  width:60px;
  height:auto;
  margin-right: 66px;
}

#hellabrunn{
  width:120px;
  height:auto;
}

#spidermonkey {
  min-width:280px;
  margin-left: 20px;
  margin-right: 20px;
  margin-bottom: 30px;

}
.smallsubtext{
  font-size:12px;
}

.headlineImprint0{
  font-weight:900;
  font-size: 22px;
}

.headlineImprint {
  font-size: 20px;
}
.headlineImprint2{
  font-size: 18px;
}

#aboutUsBottom{
  background-color:#f6f6f6;
  padding-bottom: 120px;
}

.pdfIcon{
  width:80px;
}

.logoStyle{
  width:340px;
  height:auto;
}

@media(max-width:973px){
  #AboutUsText{
    margin-top:35px;
  }
}

/*------------------------------------------------------*/
#linkToKeyFactorsButton{
  width: 314px;
  font-family: sourceSansPro;
  font-size: 20px;
  text-align: center;
  border: none;
  margin-top: 15px;
  margin-bottom: 20px;
  align-self: center;
  line-height: 25px;
  padding: 8px;
}
.headLine3{
	font-size:20px;
	font-weight: 700;
}
#keyfactorsButton{
	margin: auto;
    width: 172px;
    margin-top: 60px;
}

#keyfactorsBG{
	width:100%;
	background-color: #5C6BC0;
	height: 1040px;
  }

#keyfactorsFG{
  background-color: var(--backgroundBlue);
  font-family: sourceCodePro;
}

#keyFactorsMainLayout{
  background-color: var(--backgroundBlue);
  display: flex;
  margin: auto;
  max-width: 790px;
  margin-top: 40px;
  flex-wrap: wrap;
  /* column-gap: 68px; */
}


#keyFactorsMainLayout>div{
  width: 340px;
  height: 200px;
  /* text-align: right; */
  padding-left: 21px;
  padding-right: 30px;
  padding-top: 30px;
  border-bottom: 1px dashed #fff;
}

#keyFactorsMainLayout>div:nth-child(2n-1){
  border-right: 1px dashed #fff;
}

#keyFactorsMainLayout>div:nth-child(n+5){
  border-bottom: none;
}

@media(max-width:650px){
  #keyFactorsMainLayout{
    width:300px;
  }

  #keyFactorsMainLayout>div:nth-child(2n-1){
    border-right: none;
  }
  #keyFactorsMainLayout>div:nth-child(n+5){
    border-bottom: 1px dashed #fff;
  }
}

#keyFactorsMainLayout>div>div:nth-child(1){
  display: flex;
  justify-content: space-between;
  vertical-align: middle;
  gap: 20px;
  width: 100%;
  height: 70px;
  float: inline-end;
}

#keyFactorsMainLayout>div>div>.headline{
  font-family: Antonio;
  font-size: 40px;
  font-weight: 400;
  /* width: 165px; */
  margin-top: 3px;
  color: var(--gorilla-color);
}
#keyFactorsMainLayout>div:nth-child(6)>div>.headline{
  color:var(--monkey-color);
}

#keyFactorsMainLayout>div>div:nth-child(2){
  margin-top: 5px;
  margin-bottom: 5px;
  font-size: 9pt;
  color: var(--plainWhite);
  text-align: right;
  width: 291px;
  float: inline-end;
}
#keyFactorsMainLayout>div:nth-child(2n)>div:nth-child(2){
	text-align: left !important;
}

.bottomText{
	display: flex;
	width: 100%;
	justify-content: end;
}

#keyFactorsMainLayout>div:nth-child(2n)>div:nth-child(3){
	justify-content: start !important;
}

#keyFactorsMainLayout>div>div:nth-child(3){
  margin: auto;
  margin-top:10px;
}


#keyFactorsMainLayout>div>div:nth-child(3)>img{
	width: 42px;
    height: 40px;
}

#keyFactorsMainLayout>div>div:nth-child(3)>span{
	display:block;
	line-height: 14px;
	padding-top:7px;
	max-width: 200px;
  font-family: Antonio;
  font-size:10pt;
  color:var(--gorilla-color);
}



#keyFactorsMainLayout>div:nth-child(6)>div:nth-child(3)>span{
  color:var(--monkey-color);
}


/*------------------------------------------------------*/

#jobSection{}

#jobsBG{
  width: 100%;
  background-color: var(--plainWhite
  ) ;
}

#jobsFG{
  margin-top:50px;
  height:20%;
  text-align: center;
}

#jobsHeadline{
  margin-top:50px;
  color:var(--plainBlack);
  text-align: center;
  margin-bottom:40px;
}

#jobsSectionTextParagraph{
  margin:auto;
  margin-top: 50px;
  max-width:1200px;

}

#jobsTextbox{
  margin:auto;
  margin-left: 30px;
  margin-right: 30px;
  display:flex;
  flex-direction: row;
  flex-wrap:wrap;
  gap:30px;
  justify-content: space-between;

}

#gorilla-streaming .imageBox {
  text-align: center;
  margin-bottom:30px;
}

#gorilla-streaming .solutionSketch{
  width:60%;
  max-width:1300px;
}
#gorilla-streaming .solutionSketchMobile{
  width:59%;
  max-width:1300px;
}
/*------------------------------------------------------*/


#FAQSection{

}

.card{
  border: none !important;
  background-color:none;
}

.card-header{
  border: none !important;
  background-color:#00000000 !important;
}

.subheadline{
	margin:auto;
	font-family:sourceCodePro;
	font-size: 18px;
	color: var(--plainBlack);
	width: 80%;
}

.headLineSubtext{
  margin-top:10px;
  margin-bottom:30px;
	max-width:900px;
	font-weight:bold;
	font-size:18px;
}

.headLineSubtextNoBold{
  margin-top:10px;
  margin-bottom:30px;
	max-width:900px;
	font-size:18px;
  font-weight:500 !important;
}

.wrap {
  max-width: 900px;
  margin: 0 auto;
}



#FAQ_Main{
	margin:auto;
	margin-top:50px;
	width:80%;
	padding-bottom: 100px;
	font-family: sourceCodePro !important;
	font-size: 10pt;
}

#FAQ_Main .ACCButton{
	font-family: sourceCodePro !important;
	font-size: 20px;
	text-align: left;
}




/*------------------------------------------------------*/

#ContactSection{

}


#contactBG{
  width:100%;
  background-color: var(--Indigo100);
}

#Contact_Text{
  margin-top: 180px;
  font-family:sourceCodePro;
  font-size: 10pt;
  margin-bottom: 80px;
  text-align: center;
}

@media(max-width:992px)
{
  #Contact_Text{  margin-bottom:170px;}
}


#contactform{
  margin-bottom:40px;
}


/*****************customerProject***************************/
#customerProject{
  margin-top:80px;
  text-align:center;
  font-family: sourceCodePro;
}

#customerProject #smallHeadline{
    font-family: SourceSansPro;
    font-size: 20px;
    font-weight: 600;
    width: 679px;
    margin: auto;
}

#customerProject #bigHeadline{
    font-family: SourceCodePro;
    font-size: 40px;
    font-weight: 700;
    font-weight: 700;
    width: 693px;
    margin: auto;
    margin-bottom: 10px;
}

#blueBox{
  display:flex;
  margin:auto;
  flex-wrap: wrap;
  background-color:var(--backgroundBlue);
  max-width:680px;
  min-height:100px;
  margin-top:30px;
  gap: 20px;
}


#blueBox #left{
  margin: 10px;
  width: 206px;
  text-align: right;
}

#blueBox #right{
  width: 434px;
}


.subHeadlineBig{
  font-family: Antonio;
  font-size: 23px;
  height: 31px;
}
.subHeadlineSmall{
  font-family: sourceCodePro;
  font-size: 12px;
  line-height: 12px;
}
.subTextSmall{
  margin-top: 10px;
  font-family: SourceCodePro;
  font-size: 11px;
  margin-bottom: 20px;
  line-height: 12px;
  font-weight: 300;
}


#blueBox #right .image{
  width:434px;
}



.whiteTextBox{
  width:600px;
  margin:auto;
  margin-top:40px;
}

#greyBox{
  gap:20px;
  width:680px;
  background-color: var(--Indigo100);
  margin:auto;
  margin-top:40px;
}

#greyBox .image{
  margin: 10px;
  width: 658px;
}

#greyBox .left{
  width:600px;
}

#greyBox .right{
  width:600px;
  padding:15px;
  text-align: left;
  padding-top: 0px;
}

.dividerLine{
  width:100%;
  max-width:808px;
  border: 1px dotted #000;
  margin:auto;
  margin-top: 30px;
  margin-bottom:30px;
}

#partners{
  width:100%;
  margin-bottom: 60px;
}

#partners #logoBox{
  height:30px;
  margin-top:10px;
  margin-bottom:70px;
}

#partners #logoBox .partner{
  height:30px;
}

#bottomPartnertext{
  font-family:sourceCodePro;
  font-size:9px;
  margin:auto;
  color: var(--Indigo500);
}


@media(max-width:680px){
  #blueBox{
    width:800px;
  }
  .subTextSmall{
    font-size: 24px;
    line-height: 40px
  }
  #blueBox #left{
    margin: 10px;
    width: 800px;
    text-align: center;
  }
  .subHeadlineBig{
    font-size: 50px;
    line-height: 52px;
    margin-bottom: 48px;
  }
  .subHeadlineSmall{
    font-size: 30px;
    line-height: 37px;
  }

  #blueBox #right .image{
    width: 680px;
  }

  #customerProject{
    width: 693px;
  }
  #partners{
    width:100%;
    margin-bottom: 140px;
  }

}


/*****************customerProject end***********************/
#FAQSection #mainBody{
  background-color: #fefefe;
  margin:auto;
  max-width:100%;
}

#FAQSection #mainBody .item{
  width:650px;
  margin: auto;
}


#FAQSection #mainBody .sub{
  display:flex;
  flex-direction: row;
  width:650px;
  margin:auto;
}

#FAQSection #mainBody .category{
  width: 569px;
  height: 29px;
  border-bottom: 1px dotted #a0a0a0;
  margin-left: 6px;
}
#FAQSection .section{
  width: 100%;
  background-color:var(--mouseGrey);
  padding-top:40px;
  padding-bottom:30px;

}

#FAQSection .icon{
  width: 47px;
  margin-top: -19px;
}

#FAQSection h1{
  all:unset;
  font-family: SourceCodePro;
  font-size: 24pt;
}

#FAQSection h2{
  all:unset;
  font-family: SourceCodePro;
  font-size: 12pt;
}

#FAQSection h3{
  all:unset;
  font-family: SourceCodePro;
  font-size: 18pt;
  font-weight: bold;
}

#FAQSection h4{
  all: unset;
  display: block;
  color: var(--backgroundBlue);
  font-size: 12px;
  font-family: sourceCodePro;
  font-weight: bold;
  text-transform: uppercase;
  line-height: 15px;
  margin-bottom: 5px;
  margin-top: 4px;
}


#FAQSection p{
  font-family: sourceCodePro;
  font-size:14px;
}

@media(max-width:680px){
  #FAQ_Headline{
    width:340px;
    margin-bottom:30px;
  }
  #FAQSection #mainBody .item{
    width:320px;
  }

  #FAQSection #mainBody .sub{
    width:320px;
  }

  #FAQSection h1{
    font-size: 15pt;
  }

  #FAQSection h2{
    font-size: 10pt;
  }

  #FAQSection h3{
    font-size: 18pt;
  }



}

.lessHugeButton{
  padding: 12px;
    border: 0px;
    font-weight: 800;
    font-size: 15pt;
    border-radius: 5px;
    font-family:SourceCodePro;
}

.faqSubButton{
  width: 157px;
  margin: auto;
}

#getInTouchButton{
  display: block;
}

.questions{
  font-family: sourceCodePro;
  font-size: 20px;
  font-weight: bold;
  margin: auto;
  width: 180px;
  margin-bottom: 17px;
}
/*------------------------------------------------------*/
#notFoundText{
  max-width:600px;
  min-width:280px;
  margin:auto;
  padding:20px;
}

#notFoundImage{
  max-width:600px;
  min-width:280px;
  margin:auto;
  padding:20px;
}

#notFoundLogo{
  max-width:200px;
  min-width:200px;
  margin:auto;
  padding:20px;
}

@font-face {

  font-family: 'Material Icons';

  font-style: normal;

  font-weight: 400;

  font-display: block;

  src: url(../font/MaterialIcons-Regular.eot);

  /* For IE6-8 */

  src: local("☺"), url(../font/MaterialIcons-Regular.woff2) format("woff2"), url(../font/MaterialIcons-Regular.woff) format("woff"), url(../font/MaterialIcons-Regular.ttf) format("truetype"); }

#mainNav, #footer, #hamburger {
  transition: all 0.2s ease-out;
}

/* Utility for centering modal content */
.modal-center {
  margin-top: 30% !important;
  border: 0px !important;
}

/* Transparent modal background */
.modal-bg-transparent {
  background-color: #00000000 !important;
}

/* Loader image centering and sizing */
.img-loader-center {
  max-width: 150px !important;
  margin: auto !important;
  display: block;
}

/* Full width image */
.img-full-width {
  width: 100% !important;
}

/* Specific width for unreal image */
.img-width-154 {
  width: 154px !important;
}