@charset "UTF-8";

:root {
  --pongo-color: #FF00A4;
  --gorillaColorInverted: #121952;
  --stageBlue:#021d71;
  --matrixBG: #f6f6f6;
  --Indigo500: #5C6BC0;
  --Indigo300: #7986CB;
  --Indigo100: #C5CAE9;
  --backgroundBlue: #121952;
  --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;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
  font-family: SourceCodePro !important;
}
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*/
.imprintBlock{

}
@media (min-width: 1200px) {
h1{
  margin-top:0px;
  margin-bottom:0px;
  display: block !important;
}

h3{
  font-family:sourceCodePro !important;
  font-size:16px !important;
}
}
html {
  scroll-behavior: smooth !important;
}
.gorillaColorBlueBG {
  background-color: var(--backgroundBlue) !important;
}
.blockTextOutline{

}
.blockText{
  margin:auto;
  width:70%;
  text-align:justify;
}
#googleaboutIcon{
  width:200px;
}
.pongoColor{
  color: var(--pongo-color) !important;
}
.gorillaColorInverted{
  color: var(--gorillaColorInverted);
}
.gorillaColorBlueBG{
  background-color: var(--gorillaColorInverted) !important;
}
.pongoPinkBG{
  background-color: var(--pongo-color) !important;
}
.forcePreventTextDecoration{
  text-decoration:none !important;
}
.forceIndigo300{
  color: var(--Indigo300) !important;
}
.forceMouseGrey{
  color: var(--mouseGrey) !important;
}
.forceBold{
  font-weight:800;
}
@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:140px !important;
}


.footerText{
  text-align: center;
  font-size: 12px;
  font-family: sourceSansPro;
  color: var(--pongo-color) !important;
  width: 84px;
}

.footerLink{
  text-align:center;
  color:var(--pongo-color) !important;
  width:20px;
  text-decoration:none;
}

.footerLink img{
  margin: auto;
  width:40px;
}

.presentationdownloader{
  color:var(--Indigo500);
}

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

.flexContainer{
  display:flex;
}

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

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

}

.subHeadline{
  font-family:SourceSansPro;
  font-size:20px;
  font-weight:600;
}
.headLine{
  font-family:SourceCodePro;
  font-size: 30px;
  font-weight:700;
}
.headline{
  margin-bottom:10px;
  font-weight: 700;
}

@media(max-width:576px){
  .headLine{
    font-family:SourceCodePro;
    font-size: 20px;
  }
}
.forceCenter{
  margin:auto;
}

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

.forceBGPongoPink{
  background-color:var(--pongo-color) !important;
}
.forcePongoPink{
  color:var(--pongo-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(--pongo-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(--pongo-color) transparent transparent transparent;
}

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




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

#mainNav{
  background-color: var(--backgroundBlue);
  justify-content: space-between;
  background-image: url("../images/GR-LOGO-RGB-PINK.svg");
  background-repeat: no-repeat;
  background-position-x: 5px;
  background-position-y: 0px;
}

#gorillaLogo{
  width:300px;
  height:50px;
}

.navbarToggler{
  display: block;
}

.stageLogo{
  margin-left: 3px;
  margin-top: 3px;
  height: 60px;
}
.doSomeMargin{
  height:50px;
  margin-left:3px;
  margin-top:-5px;
}

.hamburger{
  margin-top:-9px;
  margin-right:10px;
}

.navbar{
  padding:0px !important;
  height: 60px;
}

.contento {
  display: none;
}
#toggle{
  position:absolute; opacity:0; width:0; height:0;
}
#toggle:checked ~ .contento {
  display: flex;
}

.navbarToggler {
  cursor: pointer;
}

.hamButton{
  outline: none !important;
  background-color: #00000000;
  border: none;
  margin-right: 20px;
}
.hamburger{
  margin-top:-6px;
  margin-right:0px;
  border:none !important;
}

.hamLink{
  font-family: sourceCodePro;
  font-weight: 500;
  font-size: 23px;
  text-decoration: none;color:var(--pongo-color);
}


#footer{
  display:none;
  z-index:100;
  position:fixed;
}
#stageTextBox{
  width:90%;
  line-height: 20px;
}
#footerContainer{
    display: flex;
    margin: auto;
    justify-content: space-between !important;
    vertical-align: middle !important;
    margin-left: 40px;
    margin-right: 40px;
    margin-top: -2px;
}

#footerFlex{
  display:flex;
  flex-wrap: nowrap;
  flex-direction: row;
  gap:12px;
  margin-top: 7px;
  text-decoration:none !important;
}

#footerLinks{
  margin-top: 11px;
  text-decoration: none !important;
  display: flex;
  gap: 25px;
  font-family:SourceCodePro;
  font-size: 25px;
}

.footerSmText{
  font-family: 'SourceCodePro';
  font-size: 16px;
  font-weight: 600;
  margin-top: 4px;
  text-decoration: none;
}
.footerSmTextLight{
  font-family: SourceSansPro;
  font-size: 16px;
  font-weight: 300;
  margin-top:0px;
  text-decoration:none !important;
}
.footerSmTextLightYear{
  margin-top:5px;
}

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


.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);
}

#stoerer{
  display:block;
  margin-left:85%;
  margin-top:-760px;
}

#patentStamp {
    display: block;
    width: 61px;
    margin-top: 11px;
}

#epicMegaGrant{
  margin-top: 18px;
  display:block;
  width: 50px;
}

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

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

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

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

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

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

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


#footerAlt{
  display:block;
  position:fixed;
  bottom:0px;
  height:75px;
  width:100%;
  padding-top:10px;
  background-color: var(--backgroundBlue);
}

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

#navContainer{
  display: none;
  flex-direction: column;
  width: 100%;
  margin: auto;
  margin-top: 3px;
  padding-top:40px;
  padding-bottom:40px;
  background-color: var(--backgroundBlue);
}

#navContainerAlt{
  display:none;
  width:500px;
  background-color: #0000;
  margin-top: 0px;
  gap:20px;
  font-family:SourceCodePro;
  font-size: 18px;
  font-weight:700;
  justify-content:flex-end;
  margin-right:25px;
}

.nav-item{
  font-family: SourceCodePro !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  margin:auto;
  width: 14%;
}

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

@media(min-width:992px){
  #footer{
    display:block;
    position:fixed;
    bottom:0px;
    height:66px;
    width:100%;
    background-color: var(--backgroundBlue);
  }
  .navbarToggler{display:none;}

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


#navbarResponsive{
  text-align:center;
}


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

/*---Section: Gorilla Rendering -----------------------*/

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

#gorillaRenderingFG{
  height:auto;
  text-align: center;
}

#gorillaRenderingFG>div:nth-child(1)>img{
  margin-top:60px;
  width:200px;
}
#gorillaRenderingFG>div:nth-child(2){
  max-width:740px;
  margin:auto;
  margin-top:30px;
  margin-bottom: 40px;
  padding-left:20px;
  padding-right:20px;
  font-size:17px;
}
#solsketchdesktop{
  display:block;
  margin: auto;
  margin-top: 20px;
  margin-bottom: 40px;
}
#solsketchmobile{
  display:none;
  margin: auto;
  width: 56%;
  margin-bottom: 20px;
}

#gorillaRenderingFG>div:nth-child(5){
  max-width:700px;
  margin:auto;
  margin-top:30px;
  color: var(--gorilla-rendering-pink);
  padding-left:20px;
  padding-right:20px;
  font-size:17px;
}

#gorillaRenderingFG>div:nth-child(6){
  margin:auto;
  margin-top:50px;
}

@media(max-width:772px){
  #solsketchdesktop{
    display:none;
  }
  #solsketchmobile{
    display:block;
    margin-top: 30px;
    margin-bottom: 40px;
  }
}

/*---Section: Gorilla Rendering -----------------------*/

#keyFeaturesBG {
  width: 100%;
  background-color: #c8cbc7;  
}

#keyFeaturesFG{
  height:auto;
  text-align: center;
}
.smallHeadline{
  font-family: sourceCodePro;
  font-size: 14px;
  font-weight: 500;
  margin-top: -10px;  
}
#keyFeaturesContent{
  max-width: 700px;
    margin: auto;    
    margin-bottom: 40px;
    padding-left: 20px;
    padding-right: 20px;
    font-size: 17px;
    height: 440px;
}



.blueSubText{
  display: inline-block;
  font-family: SourceCodePro;
  font-size: 14px;
  line-height: 1.3;
  color: var(--IndigoDark);
  max-width: 580px;
  margin: 10px;
  margin-top: -10px;
  margin-bottom: 36px;
}

.keyFeatureBlackBox{
    position:relative;
    background-color: var(--pongo-color);
    color:var(--plainWhite);
    font-family: Antonio;
    font-size: 20px;
    padding: 3px;
    margin: auto;
    margin-bottom:10px;
	line-height:24px;
}

#keyFeaturesBGImage{
  height: 800px;
  margin-left: -70px;
  background-image: url(/images/DefenderClassic03.webp);
  background-repeat: no-repeat;
  background-position-x: center;
  background-size: clamp(271px, 100%, 569px) auto;
}

#keyFeatureBlackBox1{max-width: 227px;margin-top:-785px;}
#keyFeatureBlackBox2{max-width: 227px;}
#keyFeatureBlackBox3{max-width: 174px;}
#keyFeatureBlackBox4{max-width: 172px;}
#keyFeatureBlackBox5{max-width: 194px;}
#keyFeatureBlackBox6{max-width: 175px;}


@media (min-width: 800px) {
    #keyFeaturesContent {
        height: 320px;
    }
    #keyFeaturesBGImage{
      height: 500px;
    }
}

@media(min-width:740px){
  .keyFeatureBlackBox{
    position:relative;
    background-color: var(--plainBlack);
    color:var(--plainWhite);
    font-family: Antonio;
    font-size: 24px;
    padding: 3px;
  }
  
  #keyFeaturesContent{
      height: 202px;
  }


  #keyFeaturesBGImage{
    width: 582px;
    height: 800px;
    background-size: 100%;
    margin:auto;
  }

  #keyFeatureBlackBox1{
    margin-top: -555px;
    margin-left: 20px;
    max-width:180px;
  }
  #keyFeatureBlackBox2{
    margin-top: -64px;
    margin-left: 230px;
    max-width: 228px;
  }
  #keyFeatureBlackBox3{
    margin-top: -64px;
    margin-left: 480px;
    max-width: 151px;
  }
  #keyFeatureBlackBox4{
    margin-top: 20px;
    margin-left: 20px;
    max-width: 180px;
  }
  #keyFeatureBlackBox5{
    margin-top: -64px;
    margin-left: 250px;
    max-width: 189px;
  }
  #keyFeatureBlackBox6{
    margin-top: -64px;
    margin-left: 466px;
    max-width: 173px;
  }
}

@media(max-width:726px){
  #keyfeaturesSub{
    margin-top:40px;
  }
}



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

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

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

#ecosystemLayout{
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  margin: auto;
  max-width: 833px;
  width: 71%;
  min-width: 200px;
  margin-top: 30px;
  margin-bottom: 40px;
}
#ecosystemLayout>div{
  width:253px;
}

#ecosystemSectionFG > div:nth-child(3){
  margin: auto;
  margin-top: 40px;
  margin-bottom: 60px;
  max-width: 740px;
  width: 70%;
}

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


/*---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(--pongo-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%;
  max-height: 920px;
  background-color: var(--stageBlue)
}

#mainStageFG{
  text-align: left;
}

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

.stageMonkeyLS{
    width:100%;
}

.stageMonkeyPT{
  display:none;
  width:500px;
}


@media(max-width:780px){
  .stageMonkeyLS{
    display:none;
  }
  .stageMonkeyPT{
    display:block;
    width:100%;
  }
}

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

#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-left: 20px;
  margin-top:117px !important;
}

@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:1.2
}




#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{
  margin-top:80px;
  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(--pongo-color);
    font-size: 17px;
    line-height: 0.2;
    margin-bottom: -25px;
  }
  .StatInfoCluster .icon .iconGFX{
    width:105px;
  }
  .StatInfoCluster .icon .iconGFX2{
    width:70px;
  }

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

  #pongo-pix .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(--pongo-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(--pongo-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{
  margin-top:20px;
  text-align: center;
}

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

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

}





#matrixGadgetMobile .greenBox{
  display:inline-block;
  border: var(--pongo-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:-128px;
  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;
}

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: 6px;
  width: 125px;
}
.hyperscaler2{
  width:51px;
}
.hyperscaler3{
  width:40px;
}
#callUsToDefineYourNeeds{
  position: relative;
  margin-top: 475px;
  margin-left: -7px;
  font-size: 26pt;
  font-family: Antonio;
  color: var(--pongo-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:20px;}};


.noBorder{
  border:none !important;
}
.form-control-lg{
  font-size:10pt !important;
}

#formPostSuccessBox{
  display:none;
  flex-direction: row;
  column-gap:40px;
  margin:auto;
  max-width:1050px;
  flex-wrap:wrap;
  justify-content:center;
  font-size:11pt;
  font-weight:bold;
  text-align:center;
  margin-bottom:20px;
  background-color:#fff;
  padding:30px;
  font-family: 'SourceCodePro';
  margin-top: 80px;
}
#formPostSuccessBox img{
  width: 210px;
}

.engineLogo1{
  width:50px;
  margin-top: 7px;
}

.engineLogo2{
  width:75px;
}


@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-wrap: wrap;
    max-width: 500px;
    margin: auto;
    gap: 20px;
    margin-top:30px;
}


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


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

#postSubmit {
  display:none;
}

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



#featureMatrix_Partners{
  padding-top: 0px;
  margin: auto;
  text-align: left;
  height: 60px;
  background-color: var(--mouseGrey);
  padding-bottom: 130px;
}

#featureMatrix_Partners #wrapper{
  margin:auto;
  width:100%;
  min-width:320px;
  text-align:center;
}

.featureMatrix_Partner{
  margin-right:40px;
  height: 35px;
  font-size:12px;
}
#featureMatrix_Partners a:hover{
  text-decoration: none !important;
}

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

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

#featureMatrix_Partner_Epic{
  height:35px;
}

#featureMatrix_Partner_NVIDIA{
  height:35px;
}

#featureMatrix_Partners .wrapAround{
  display:none;
}

textarea.form-control{
  min-height: calc(1.5em + 0.75rem + calc(var(--bs-border-width) * 2));
    width: 100%;
    height:100px;
    max-width: 800px;
}

@media(max-width:570px)
{
  #featureMatrixForm{
        max-width: 310px;
        margin: auto;
  }
  .form-control {
    width:310px !important;
     margin:auto;
  }
}





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

#projectsSection{
  font-size:17px;
}

#projectsBG{
  width: 100%;
  background-color:var(--mouseGrey);
}

#projectsFG{
  text-align:center;
  width:100%;
}

#projectsFG>h2>div{
  width: 872px;
  margin: auto;
  margin-top: 30px;
  margin-bottom: 10px;
  font-size: 17px;
  font-family: 'SourceCodePro';
}

#projectsImageRoster{
    display: flex;
    max-width: 900px;
    flex-wrap: wrap;
    gap: 20px;
    margin: auto;
    margin-top: 25px;
}

.projectpic{
  margin-top: 10px;
	  max-width: 280px;	
}


.subline{
  border-bottom: 1px dotted var(--IndigoDark);
  width: 70%;
  margin: auto;
  margin-bottom: 13px;
}

#partners{
  margin-bottom: -10px;
}

.goToProject{
    margin-top: -21px;
    font-family: sourceSansPro;
    font-size: 14px;
    font-weight: 600;
    color: var(--pongo-color);
}

#benefitsText{
  background-color: var(--plainBlack);
  color: var(--plainWhite);
  width: 79px;
  padding-left:8px;
  margin-bottom: 5px;
}


.benefitPic{
  margin-top: 10px;
  max-width: 320px;
  box-shadow: #00000050 0px 0px 28px, #00000022 0px 10px 10px;
}

#benefitsBox{
  margin-top: 10px;
    margin-bottom: 60px;
    display: flex;
    flex-direction: column;
    /* gap: 14px; */
    justify-content: start;
    /* line-height: 10px; */
    font-family: 'Antonio';
    font-size: 21px;
    color: var(--bs-black);
    font-weight: 900;  
    text-align: left;;  
}

.projectTile{
  display:flex;  
  flex-direction: column;
  width:280px;
  text-align: center;
  font-family:Antonio;
  font-size:16pt;
  color:var(--backgroundBlue);
  margin: auto;
}
.goToProject a{
  text-decoration:none;
  color:var(--pongo-color);
}

#projectsBottomBox{
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  gap:14px;
  justify-content:center;
  margin-top:50px;
}

@media(max-width:620px){
	#projectsFG>h2>div{
		width: 300px;
		margin: auto;
		margin-top: 30px;
		margin-bottom: 10px;
	  }

	#projectsImageRoster{
		display: flex;
		max-width: 320px;
		flex-wrap: wrap;
		gap: 20px;
		margin: auto;
		margin-top: 40px;
	}
	.projectpic{
		max-width: 320px;		
	}

  .benefitPic{
    display:none
  }
  #benefitsText{
    margin:auto;
    background-color: var(--pongo-color);
    color: var(--plainWhite);
    margin-bottom:10px;
  }
  #benefitsBox{
    color: var(--pongo-color);
  }
}



#carousel {
  margin-top:90px;

  display:flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap:112px;
  justify-content: space-evenly;
}

.caroTile{
  display:flex;
  flex-direction: column;
  column-gap:30px;
  width:365px;
 }


.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); */
}

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

#carousel div{
  font-family:sourceCodePro;
  font-size: 16px;
  font-weight:500;
  width:100%;
  text-align: center;
}

.caroTile .projectText{
  margin:auto;
  width:300px;
  text-align: justify;
  font-size: 12pt;
}

.caroTile .projectHeadline{
  font-family:sourceSansPro;
  font-size: 18pt;
  font-weight:600;
  margin-bottom: 5%;
  text-align:center;
}

.caroTile 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;
}


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

#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(--pongo-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;
}


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


#pongo-pix{
  text-align:center;
  background-color: var(--mouseGrey);
}

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

#aboutUsFG{
  /* margin-top:15%;  */
  text-align: center;
  background-color: #00000000;
}

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

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

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

#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;
}

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

.pdfIcon{
  width:80px;
}

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

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

#privacypolicy{
  margin-top:  60px;
}

#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;

}

#pongo-pix .imageBox {
  text-align: center;
  margin-bottom:30px;
}

#pongo-pix .image{
  width:60%;
  max-width:740px;
}

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


#FAQSection{
  background-color: var(--plainWhite);
}
.faqwhite {
  background-color: var(--plainWhite) !important;
}


#FAQ_Main{

}
#FAQ_Main h3{
  all:unset;
  text-transform: uppercase;
  color:var(--Indigo500);
  font-weight:bold;
}

.faqLine{
  width:75%;
  margin:auto;
  height:2px;
}

.faqSubtext{
  width:320px;
  margin:auto;
  margin-top:30px;
}
.faqSubButton{
  width: 157px;
  margin: auto;
}
.faqCard{
  margin-bottom:30px;
}

.faqCardHeader{
  width:100%;
  text-align: left;
  color: var(--Indigo500);
  font-weight:bold;
  background-color: var(--plainWhite);
}

.faqCardBody{
  background-color:none;
}

.questions{
  font-family: sourceCodePro;
  font-size: 20px;
  font-weight: bold;
  margin: auto;
  width: 180px;
  margin-bottom: 17px;
}


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

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

}

#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(--mouseGrey);
}
#contactFG{
  width:100%;
  background-color: var(--mouseGrey);
  margin-bottom: 40px;
}

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

@media(max-width:1322px)
{
  #contact{

}
  #Contact_Text{  margin-bottom:170px;}
}


.blueDot {
  position:absolute;
  margin-top:-50px;
  margin-left: calc(50% + 300px);
}


@media(max-width:768px){
  .blueDot {
    display:none;
  }

}

/*------------------------------------------------------*/
#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.4s 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;
}