<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">/**
 * @Author: Kenan Emre BADAY
 * @Date:   2020-01-09T00:40:16+03:00
 * @Email:  kenan@ikiwebtasarim.com
 * @Project: pentageni.com
 * @Filename: base.css
 * @Last modified by:   Kenan Emre BADAY
 * @Last modified time: 2020-01-19T05:23:20+03:00
 * @License: This code is product of iKi WEB DESIGN (Bu Kod Bir iKi(YazÄ± ile 2) WEB TASARIM ÃœrÃ¼nÃ¼dÃ¼r.).
 * @Copyright: iKi WEB TASARIM
 */
 @font-face {
 	font-family: 'fontawesome';
 	src:url('../fonts/fontawesome/fontawesome.eot?-e43dk9');
 	src:url('../fonts/fontawesome/fontawesome.eot?#iefix-e43dk9') format('embedded-opentype'),
 		url('../fonts/fontawesome/fontawesome.woff?-e43dk9') format('woff'),
 		url('../fonts/fontawesome/fontawesome.ttf?-e43dk9') format('truetype'),
 		url('../fonts/fontawesome/fontawesome.svg?-e43dk9#fontawesome') format('svg');
 	font-weight: normal;
 	font-style: normal;
 }
 @font-face {
 	font-family: 'icomoon';
 	src:url('../fonts/icomoon.eot');
 	src:url('../fonts/icomoon.eot?#iefix') format('embedded-opentype'),
 		url('../fonts/icomoon.woff') format('woff'),
 		url('../fonts/icomoon.ttf') format('truetype'),
 		url('../fonts/icomoon.svg#icomoon') format('svg');
 	font-weight: normal;
 	font-style: normal;
 }

html, body {  margin:0; padding: 0;  scroll-behavior:smooth; width: 100%; max-width: 100%; max-height: 100%;}
::-webkit-scrollbar {display: none; }
article::-webkit-scrollbar {display: visible !important;}
main {  margin: 0; padding: 0; display: block; max-width: 100%; max-height: 100vh; background: #fff;}
main .Pentageni_Mobile-Logo {display:none;}
main .WeThinkGlobal {display: none;}
main .main .section .Pentageni_Background_Video {margin: 0; padding: 0; width: 200%; height: 200%; top: -50%; left: -50%; position: absolute; z-index:0;}
main .main .section .Pentageni_Background_Video video {position: absolute; z-index: 1; top:0; bottom:0; left: 0; right:0; margin:auto; padding: 0;  min-width: 50%; min-height: 50%;}
main .main .section .Pentageni_Background_Video .Video_Overlay { margin: 0; padding: 0; background: rgba(199,178,153,0.0); display: block; position: fixed; z-index: 2; top:0; left: 0; min-width: 100%; min-height: 100%;}
main .main .section header {max-width:100%; position: absolute; left:0%; right: 0%; top:43%; padding: 0 5% 0 5%; height:70px; }
main .main .section header .Pentageni_01 {max-width: 40%; margin:-35px 0 0 0; padding: 0;}
main .main .section header .Pentageni_01 h1.Pentageni_Main-Logo {z-index: 0 !important; position: relative;z-index: 5;  margin:0; padding: 0; top:9px; max-width:300px;}
main .main .section header .Pentageni_01 h1 img {margin: 0; padding: 0; width: 100%; height: auto;}
main .main .section .Pentageni_LogoFrame {position: absolute;width: 80px; min-height: 100vh; padding-top:10%; margin: 0; left: 0; top:0;  background: rgba(255,255,255,0.55); display: block; text-align: center;}
main .main .section .Pentageni_LogoFrame img {max-width:60px; margin:0 2px 0 0; }
main .main .section .Pentageni_LogoFrame .SideMenu  {margin: 20px 0 0 0; padding: 0; width:80px; height: 80px;}
main .main .section .Pentageni_LogoFrame .SideMenu  #SideMenuToggle{ color:#c01818; display: block;  position: relative;  top: 25px;  left:22px;  z-index: 100;  -webkit-user-select: none;  user-select: none;}
main .main .section .Pentageni_LogoFrame .SideMenu  #SideMenuToggle a{  text-decoration: none;  color: #c01818;  transition: color 0.3s ease;}
main .main .section .Pentageni_LogoFrame .SideMenu  #SideMenuToggle a:hover{  color: #181818;}
main .main .section .Pentageni_LogoFrame .SideMenu  #SideMenuToggle input{  display: block;  width: 40px;  height: 32px;  position: absolute;  top: 0px;  left: 0px;  cursor: pointer;  opacity: 0;   z-index: 2;  -webkit-touch-callout: none;}
main .main .section .Pentageni_LogoFrame .SideMenu  #SideMenuToggle span{  display: block;  width: 33px;  height: 4px;  margin-bottom: 5px;  position: relative;  background: #c01818; border-radius: 3px;  z-index: 1;  transform-origin: 4px 0px;  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0), background 0.5s cubic-bezier(0.77,0.2,0.05,1.0), opacity 0.55s ease;}
main .main .section .Pentageni_LogoFrame .SideMenu  #SideMenuToggle span:first-child{  transform-origin: 0% 0%;}
main .main .section .Pentageni_LogoFrame .SideMenu  #SideMenuToggle span:nth-last-child(2){  transform-origin: 0% 100%;}
main .main .section .Pentageni_LogoFrame .SideMenu  #SideMenuToggle input:checked ~ span{  opacity: 1;  transform: rotate(45deg) translate(-2px, -1px);  background: #232323;}
main .main .section .Pentageni_LogoFrame .SideMenu  #SideMenuToggle input:checked ~ span:nth-last-child(3){  opacity: 0;  transform: rotate(0deg) scale(0.2, 0.2);}
main .main .section .Pentageni_LogoFrame .SideMenu  #SideMenuToggle input:checked ~ span:nth-last-child(2){  transform: rotate(-45deg) translate(0, -1px);}
main .main .section .Pentageni_LogoFrame .SideMenu  #SideMenu{ box-shadow: 1.51px 1.51px 4px rgba(0,0,0,0.1); position: absolute;  min-width: 100vw;  margin: -60px 0 0 -50px;  padding: 20px; background: #ededed;  list-style-type: none;  -webkit-font-smoothing: antialiased;  /* to stop flickering of text in safari */  transform-origin: 0% 0%;  transform: translate(-100%, 0);  transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);}
main .main .section .Pentageni_LogoFrame .SideMenu  #SideMenuToggle input:checked ~ ul{  transform: none;}
main .main .section .Pentageni_LogoFrame .SideMenu  #SideMenu li {margin: 0 5px 0 5px; display:inline-block; padding: 10px 0 10px 0; list-style: none;}
main .main .section .Pentageni_LogoFrame .SideMenu  #SideMenu li a {font-family: 'Barlow Condensed', sans-serif; font-weight: 400; letter-spacing: 2.1px; font-size: 1.2em; text-decoration: none; color:rgba(192,24,24,1);}
main .main .section .Pentageni_LogoFrame .SocialMedia {margin: 0; padding: 0;  position: relative;  top: 22px;  left:22px;  z-index: 100; }
main .main .section .Pentageni_LogoFrame .SocialMedia ul {margin: 0; padding: 0;}
main .main .section .Pentageni_LogoFrame .SocialMedia ul li {list-style: none; margin:10px 0 10px 0 ; display: block; max-width: 32px; max-height: 32px; text-align: center;}
main .main .section .Pentageni_LogoFrame .SocialMedia ul li a {padding: 0; margin: 0; color:#fff; text-decoration: none;}
main .main .section .Pentageni_LogoFrame .SocialMedia ul li a img {margin: 0; padding: 0; max-width: 30px; max-height: 30px;}
main .main .section header .Pentageni_01 .Pentageni_MainMenu { box-shadow: 0.51px 1.51px 4px rgba(0,0,0,0.1);position: absolute; left:383px; top:-2px;  height: 50px; margin:0; padding: 0; border-radius: 10px; background: rgba(255,255,255,1);}
main .main .section header .Pentageni_01 .Pentageni_MainMenu h1 {display: inline-block; margin: 0; padding: 0; top:10px; max-width: 195px; max-height: 50px;}
main .main .section header .Pentageni_01 .Pentageni_MainMenu h1 img {margin: 0; padding: 0; height: 50px;}
main .main .section header .Pentageni_01 .Pentageni_MainMenu nav {margin:11px auto; padding:0 15px 10px;}
main .main .section header .Pentageni_01 .Pentageni_MainMenu ul {display:block; padding: 0;margin:0 auto; list-style-type: none;   margin-block-start: 0; margin-block-end: 0; margin-inline-start: 0px; margin-inline-end: 0px; padding-inline-start: 0;}
main .main .section header .Pentageni_01 .Pentageni_MainMenu ul li {margin: 0 5px 0 5px; display:inline-block; padding: 0; list-style: none;}
main .main .section header .Pentageni_01 .Pentageni_MainMenu ul li a {font-family: 'Barlow Condensed', sans-serif; font-weight: 400; letter-spacing: 2.1px; font-size: 1.2em; text-decoration: none; color:rgba(192,24,24,1);}
main .main .section header .Pentageni_01 .Pentageni_MainMenu ul li .active {text-decoration: none; color:rgba(24,24,24,0.8);}
main .main .section header .Pentageni_01 .Pentageni_MainMenu ul li a:hover {text-decoration: none; color:rgba(24,24,24,0.8);}
main .geometry {opacity:1;margin:0; padding: 0;position: fixed; z-index: 200; max-width: 100%;}
main .geometry .triangle_01 {width:135px; height: 113px;position: fixed;  margin: 0; padding: 0;   top:0; left:0; background: url("../media/images/Triangle_LeftTop.svg") no-repeat; background-position: center; background-size: contain; }
main .geometry .angle_01 {width:135px; height: 113px;position: fixed;   margin: 0; padding: 0;   top:0; right:0; background: url("../media/images/Angle_RightTop.svg") no-repeat; background-position: center; background-size: contain; }
main .geometry .triangle_02 {width:135px; height: 113px;position: fixed;   margin: 0; padding: 0;   bottom:0; right:0; background: url("../media/images/Triangle_RightBottom.svg") no-repeat; background-position: center; background-size: contain; }
main .geometry .copyrights {max-width:320px; margin:0; padding:5px; position:fixed; left:40%; bottom:0; display:block;   font-family: 'Barlow Condensed', sans-serif; font-weight: 300; letter-spacing: 1px; font-size: 0.9em; text-decoration: none; color:rgba(24,24,24,1);}
main .section .iki {max-width:32px;margin:0; padding:0 0 0 20px; position:absolute; left:0; bottom:0; display:block;  }
main .main .axis { width: 345px; height: 545px; margin: 0; padding: 0;  z-index: 0 !important; position: absolute; right:5%; top:13.3%; }
main .main .axis svg {max-width: 100%;}
main .main .axis .career { padding: 0; width: 322px;margin: 0; position: relative;  display: inline-block; bottom:625px;   right: 3%;text-align: center;  -ms-transform: rotate(-90deg); /* IE 9 */-webkit-transform: rotate(-90deg); /* Safari prior 9.0 */   transform: rotate(-90deg); /* Standard syntax */}
main .main .axis .career a {font-family: 'Barlow Condensed', sans-serif; font-weight:400; text-transform: lowercase;line-height: 0;letter-spacing: 1px; font-size: 1.6em; text-decoration: none; color:rgba(192,24,24,1);}
main .main .axis .career a:hover { font-weight: 600; font-size: 1.8em;}
main .main .axis .video  {display: inline-block;  max-width: 224px;padding: 0; margin: 0; position: absolute;  top:45.9%; left:9%; text-align: left;}
main .main .axis .video a {font-family: 'Barlow Condensed', sans-serif; font-weight:400; text-transform: lowercase;line-height: 0.8em;letter-spacing: 1px; font-size: 1.6em; text-decoration: none; color:rgba(192,24,24,1);}
main .main .axis .video a:hover { font-weight: 600; font-size: 1.8em;}
main .main .axis .video a img {width: 16px;}
main .main .axis .sustainability {display: inline-block;max-width: 224px;padding: 0; margin: 0;position: absolute;top:46.2%; right:7%; text-align: right;}
main .main .axis .sustainability a {font-family: 'Barlow Condensed', sans-serif; font-weight:400; text-transform: lowercase;line-height: 0.8em;letter-spacing: 1px; font-size: 1.6em; text-decoration: none; color:rgba(192,24,24,1);}
main .main .axis .sustainability a:hover { font-weight: 600; font-size: 1.8em; line-height: 0.6em; }
main .main .axis .scrollicon {position: absolute; display: inline-block; bottom:0; margin: 0; left:0; right: 0;  text-align: center;  }
main .main .axis .scrolldown  {
   -webkit-animation-name: scrolldown; /* Safari 4.0 - 8.0 */
   -webkit-animation-duration: 1s; /* Safari 4.0 - 8.0 */
   animation-name: scrolldown;
   animation-duration:1s;
   animation: scrolldown 1s infinite;


}


/* Safari 4.0 - 8.0 */
@-webkit-keyframes scrolldown {
  10%   {height:100%;}
  20%   {height:90%;}
  30%   {height:80%;}
  40%   {height:70%;}
  50%   {height:60%;}
  60%   {height:50%;}
  70%   {height:40%;}
  80%   {height:30%;}
  90%   {height:20%;}
  100%  {height:10%;}
}

/* Standard syntax */
@keyframes scrolldown {
  10%   {height:100%;}
  20%   {height:90%;}
  30%   {height:80%;}
  40%   {height:70%;}
  50%   {height:60%;}
  60%   {height:50%;}
  70%   {height:40%;}
  80%   {height:30%;}
  90%   {height:20%;}
  100%  {height:10%;}
}
main .main .axis .scrollicon a .chevron {position: absolute;margin: 0;  top:-150px;left: 259px;width: 28px;  height: 8px;  opacity: 0;  transform: scale3d(0.5, 0.5, 0.5);  animation: move 3s ease-out infinite;}
main .main .axis .scrollicon a .chevron:first-child {  animation: move 3s ease-out 1s infinite;}
main .main .axis .scrollicon a .chevron:nth-child(2) {  animation: move 3s ease-out 2s infinite;}
main .main .axis .scrollicon a .chevron:before, .chevron:after {  content: ' ';  position: absolute;  top: 0;  height: 100%;  width: 51%;  background: rgba(192,24,24,1);}
main .main .axis .scrollicon a .chevron:before {  left: 0;  transform: skew(0deg, 30deg);}
main .main .axis .scrollicon a .chevron:after {  right: 0;  width: 50%;  transform: skew(0deg, -30deg);}
main .section .back-to-the-future {margin:0; padding: 0; width: 32px; height:32px; position: absolute; z-index: 1;bottom:0%; right: 10%;}
main .section .back-to-the-future .futureback {position: absolute;margin: 0;  top:0;left: 0;width: 28px;  height: 8px;  opacity: 0;  transform: scale3d(0.5, 0.5, 0.5);  animation: move 3s ease-out infinite;}
main .section .back-to-the-future a .futureback:first-child {  animation: move 3s ease-out 1s infinite;}
main .section .back-to-the-future a .futureback:nth-child(2) {  animation: move 3s ease-out 2s infinite;}
main .section .back-to-the-future a .futureback:before, .futureback:after {  content: ' ';  position: absolute;  top: 0;  height: 100%;  width: 51%;  background: rgba(255,255,255,1);}
main .section .back-to-the-future a .futureback:before {  left: 0;  transform: skew(0deg, -30deg);}
main .section .back-to-the-future a .futureback:after {  right: 0;  width: 50%;  transform: skew(0deg, 30deg);}

@keyframes move {
  25% {opacity: 1;  }
  33% {opacity: 1;transform: translateY(-30px);  }
  67% {opacity: 1;transform: translateY(-40px);  }
  100% {   opacity: 0;transform: translateY(-55px) scale3d(0.5, 0.5, 0.5);  }
}

@keyframes pulse {
  to {opacity: 1;  }
}


main .geometry .tribune {width: 800px; height: 300px; margin: 0; padding: 0; display: block; position: fixed; bottom:0; left:10%; background: url("../media/images/Euler-Turbine-Equation_800x300px.svg") no-repeat; background-position: center; background-size: contain; }
main .main .PentageniServicesBackground {background: url("../media/images/backgrounds/Worker_Light.jpg") no-repeat;  background-size: cover;  background-position: center;}
main .main .PentageniDivisionsBackground {background: url("../media/images/backgrounds/Screws.jpg") no-repeat;  background-size: cover;  background-position: center;}
main .main .PentageniInvestmentBackground {background: url("../media/images/backgrounds/Renewable.jpg") no-repeat;  background-size: cover;  background-position: center;}
main .main .PentageniContactBackground {background:#ccc;  background-size: cover;  background-position: center;}
main .main .section .PentageniServices {margin: 0; padding: 0; display:inline-block; left: 80px;top:0; right: 0;  min-width: 100%; min-height: 100%;position: absolute; overflow: hidden;}
main .main .section .PentageniServices .ListLayout {position: fixed;width: 12.5%;  display: inline-block; right:0; margin: 6% 0 0 0;}
main .main .section .PentageniServices .Page_Description { margin:0; padding: 10px; display: block;}
main .main .section .PentageniServices .Page_Description h1{font-family: 'Barlow Condensed', sans-serif; color:#fff; margin: 0; padding: 0; letter-spacing: 3px; font-weight: 600;}
main .main .section .PentageniDivisions {font-family: 'Barlow Condensed', sans-serif;background: rgba(0,0,0,0.4);margin: 0; padding: 0; display:inline-block; left: 80px;top:0; right: 0;  min-width: 100%; min-height: 100%;position: absolute; overflow: hidden;}
main .main .section .PentageniDivisions .DivisionsContent {margin: 10px; padding: 5px 45px 5px 5px ; display: inline-block; position: absolute; top:11%; left:3%; border-right: solid 2px rgba(255,255,255,0.2); width: 50%; min-height:480px;}
main .main .section .PentageniDivisions .DivisionsContent h3 {text-shadow:  0.55px 0.55px 4px #000; font-size: 3em; color:rgba(255,255,255,1); padding: 0 0 10px 0; margin: 0 0 10px 0; text-align: left; border-bottom: solid 2px rgba(255,255,255,0.2);}
main .main .section .PentageniDivisions .DivisionsContent p {text-shadow:  0.55px 0.55px 4px #000; font-weight: 400; margin: 5px auto 5px auto; padding:7px 10px 0 0; letter-spacing: 1px; font-size: 1.2em;color:#fff; text-align: justify;}

main .main .section .PentageniServices .Page_Description p {font-size: 100%; margin:10px; padding: 5px; display: block;font-family: 'Barlow Condensed', sans-serif; color:#fff; text-align: center;}
main .main .section .PentageniFacilities {font-family: 'Barlow Condensed', sans-serif;background: rgba(0,0,0,0.3);margin: 0; padding: 0; display:inline-block; left: 80px;top:0; right: 0;  min-width: 100%; min-height: 100%;position: absolute; overflow: hidden;}
main .main .section .PentageniFacilities .FacilitiesContent {margin: 10px; padding: 5px 45px 5px 5px ; display: inline-block; position: absolute; top:11%; left:3%; border-right: solid 2px rgba(255,255,255,0.2); width: 50%; min-height:480px;}
main .main .section .PentageniFacilities .FacilitiesContent h3 {text-shadow:  0.55px 0.55px 4px #000; font-size: 2.2em; color:rgba(255,255,255,1); padding: 0 0 10px 0; margin: 0 0 10px 0; text-align: left; border-bottom: solid 2px rgba(255,255,255,0.2);}
main .main .section .PentageniFacilities .FacilitiesContent p {text-shadow:  0.55px 0.55px 4px #000; font-weight: 400; margin: 5px auto 5px auto; padding:7px 10px 0 0; letter-spacing: 1px; font-size: 1.2em;color:#fff; text-align: justify;}
main .main .section .PentageniInvestment {font-family: 'Barlow Condensed', sans-serif;background: rgba(0,0,0,0.0);margin: 0; padding: 0; display:inline-block; left: 80px;top:0; right: 0;  min-width: 100%; min-height: 100%;position: absolute; overflow: hidden;}
main .main .section .PentageniInvestment .InvestmentContent {margin: 0; padding: 0 ; display: inline-block; position: absolute; top:25%; bottom:25%; left:6%;  width: 40%; min-height:480px;}
main .main .section .PentageniInvestment .InvestmentContent h3 {text-shadow:  0.55px 0.55px 4px #000; font-size: 2.2em; border-bottom: solid 1px rgba(255,255,255,0.2);color:rgba(255,255,255,1); padding: 0 0 10px 10px; margin: 40px 0 10px 0; text-align: left;}
main .main .section .PentageniInvestment .InvestmentContent p {background: rgba(0,0,0,0.050);text-shadow:  0.55px 0.55px 4px #000; font-weight: 400; margin: 10px auto; padding:0 10px 0 10px; border-radius: 2px;letter-spacing: 1px; font-size: 1.2em;color:#fff; text-align: justify;}
main .main .section .PentageniInvestment .InvestmentContent_r {position: absolute;display: inline-block; top:35%; width:40%;right: 8%;}
main .main .section .PentageniInvestment .InvestmentContent_r ul {margin: 0; padding:0; text-align:center;}
main .main .section .PentageniInvestment .InvestmentContent_r ul li {color:#fff; text-shadow:  0.55px 0.55px 4px #000;text-align: center;display: inline-block; padding:5px;margin:5px; background:; width: 150px; height: 100px;}
main .main .section .PentageniInvestment .InvestmentContent_r ul li span {font-size: 1em; color:#fff;text-shadow:  0.55px 0.55px 4px #000; }
main .main .section .PentageniInvestment .InvestmentContent_r ul li a span {font-size: 0.8em; margin: 0; padding: 0;}
main .main .section .PentageniInvestment .InvestmentContent_r ul li a { text-decoration: none;font-size: 2.4em; color:#fff; text-shadow:  0.55px 0.55px 4px #000; font-weight: 400;}
main .main .section .PentageniContact {font-family: 'Barlow Condensed', sans-serif;background: rgba(0,0,0,0.0);margin: 0; padding: 0; display:inline-block; left: 80px;top:0; right: 0;  min-width: 100%; min-height: 100%;position: absolute; overflow: hidden;}
main .main .section .PentageniContact .ContactContent {margin: 10px; padding: 5px 0 5px 5px ; display: inline-block; position: absolute; top:5%; left:3%; border-right: solid 2px rgba(255,255,255,0.2); width: 60%; min-height:480px;}
main .main .section .PentageniContact .ContactContent h3 {text-shadow:  0.55px 0.55px 4px #000; font-size: 3em; color:rgba(255,255,255,1); padding: 0 0 10px 0; margin: 0 0 10px 0; text-align: left; border-bottom: solid 2px rgba(255,255,255,0.2);}
main .main .section .PentageniContact .ContactContent p {text-shadow:  0.55px 0.55px 4px #000; font-weight: 400; margin: 10px auto; padding:7px 10px 0 0; letter-spacing: 1px; font-size: 1.2em;color:#fff; text-align: justify;}
main .main .section .PentageniContact .ContactContent p img {margin: 0; padding: 0; max-width: 100%;}
.no-js #loader { display: none;  }
.js #loader { display: block; position: absolute; left: 100px; top: 0; }
.se-pre-con {
	position: fixed;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
	z-index: 9999;
	background: url(../media/icons/penta-loader.gif) center no-repeat #fff;
}
main .main .section .PentageniContact .FooterBloack{position: absolute;z-index: 1; bottom:0;background: rgba(192,24,24,1);margin: 0; padding: 0; display: block; height:80px; width: 100%;}
.PentageniGrid-gallery ul {position: absolute !important; right:10%;  top:12%;display: inline-block !important;	width: 30%;	list-style: none;	margin: 0;	padding: 0;}
.PentageniGrid-gallery figure {	margin: 0;}
.PentageniGrid-gallery figure img {	display: block;	width: 100%;}
.PentageniGrid-gallery figcaption h3 {	margin: 0; font-size: 1.2em;	 padding: 0 0 0.5em; color:#fff; letter-spacing: 2px; }
.PentageniGrid-gallery li h3{	margin: 3px; font-size: 1.2em;	 padding: 0 0 0.5em; color:#fff; letter-spacing: 2px; }
.PentageniGrid-gallery figcaption p {	font-size: 1.2em;color: rgba(255,255,255,0.7); font-weight: 200;text-align: justify;margin: 0 25px 0 25px; padding: 5px; letter-spacing: 1px;}
.PentageniGrid-wrap {	max-width: 100%;	margin: 0 auto;	padding: 0;}
.PentageniGrid {margin: 0;}
.PentageniGrid li { width:100%;float: none !important;border: solid 1.5px rgba(192,24,24,1); border-left: solid 1.5px rgba(192,24,24,1); background: rgba(255,255,255,0.022);margin:5px 0 5px 0; 	cursor: pointer;}
.PentageniGrid figure {		-webkit-transition: opacity 0.2s;	transition: opacity 0.2s;}
.PentageniGrid li:hover figure {	 background: rgba(255,255,255,0.1)}
.PentageniGrid figcaption { padding: 15px;}
.GridDivisions {top:140px !important;}
.GridDivisions li { background: rgba(255,255,255,0.3) !important;}
.GridDivisions li figure figcaption h3 {color:rgba(255,255,255,1);}
.GridDivisions li:hover figure {	 background: rgba(24,24,24,0.8) !important;}

.GridContact {top:240px !important; right: 3% !important;}
.GridContact li { width:80%;float: none !important;border: solid 1.5px rgba(192,24,24,1); border-left: solid 1.5px rgba(192,24,24,1); background: rgba(255,255,255,0.88);margin:5px 0 5px 0; 	cursor: pointer;}
.GridContact li figure figcaption h3 {color:rgba(24,24,24,0.8);}
.slideshow a {color:rgba(192,24,24,0.8); font-weight: 400;}
.GridContact li:hover figure {	 background: rgba(24,24,24,0.2) !important;}

.capitalize_content {text-transform: capitalize;}
.slideshow {	position: absolute;	background: rgba(0,0,0,0.6);	width: 100%;	height: 100%;	top: 0;	left: 0;	z-index: 99999;	opacity: 0;	visibility: hidden;
	overflow: hidden;
	-webkit-perspective: 1000px;
	perspective: 1000px;
	-webkit-transition: opacity 0.5s, visibility 0s 0.5s;
	transition: opacity 0.5s, visibility 0s 0.5s;
}
.slideshow-open .slideshow {	opacity: 1;	visibility: visible;	-webkit-transition: opacity 0.5s;	transition: opacity 0.5s;}
.slideshow ul {	width: 100%;	height: 100%;
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
	-webkit-transform: translate3d(0,0,150px);
	transform: translate3d(0,0,150px);
	-webkit-transition: -webkit-transform 0.5s;
	transition: transform 0.5s;
}
.slideshow ul.animatable li {
	-webkit-transition: -webkit-transform 0.5s;
	transition: transform 0.5s;
}
.slideshow-open .slideshow ul {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}
.slideshow li {	width: 60%;	min-height: 560px;	position: fixed;	top: 0%;	left: 33%; right:33%;	margin: -2% -20% 0 -10%;	visibility: hidden;}
.slideshow li.show {	visibility: visible;}
.slideshow li:after {	content: '';	position: fixed;	width: 100%;	height: 100%;	top: 0;	left: 0;
	background: rgba(0,0,0,0.0);
	-webkit-transition: opacity 0.3s;
	transition: opacity 0.3s;
  display: hidden;
}
.slideshow li.current:after {	visibility: hidden;	opacity: 0;
	-webkit-transition: opacity 0.3s, visibility 0s 0.3s;
	transition: opacity 0.3s, visibility 0s 0.3s;
}
.slideshow figure {	width: 100%;	height: 100%;	background: #000;	border: 50px solid #000;	overflow: hidden;}
.slideshow figcaption {	padding-bottom: 20px;}
.slideshow figcaption h3 {color:#fff;	font-weight: 300;	font-size: 200%;}
.slideshow figcaption h4 {color:rgba(255,255,255,0.9); font-weight: 400; font-size: 150%;  margin:15px 0 15px 0; letter-spacing: 1px;text-align: left; padding:0 2em 0 2em; }
.slideshow figcaption p {text-align: justify;margin:15px 0 15px 0; padding:0 2em 0 2em; letter-spacing: 0.5px; font-size: 1.2em;}
.slideshow nav span {	position: fixed;	z-index: 1000;	color: #fff;	text-align: center;	padding: 3%;	cursor: pointer;	font-size: 1.6em;}
 nav span.nav-prev,.slideshow nav span.nav-next {	bottom: 10%;	-webkit-transform: translateY(-50%);	transform: translateY(-50%);}
 nav span.nav-next {	right: 20%; top:57%;}
 nav span.nav-prev {	left: 12%; top:57%;}

 nav span.nav-close {	top: 10%;	right: 21%;	padding: 0.5em 1em;	color: #fff;}
.icon:before,.icon:after {
  	font-family: 'fontawesome';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
span.nav-prev:before {	content: "\e601";}
span.nav-next:before  {	content: "\e600";}
span.nav-close:before {	content: "\e602";}
.info-keys {	position: fixed;	bottom: 0;	right: 5%;	width: 60px;	font-size: 8px;	padding-top: 20px;	text-transform: uppercase;	color: #fff;	letter-spacing: 1px;text-align: center;}
.info-keys:before,.info-keys:after {	position: absolute;	top: 0;	width: 16px;	height: 16px;	border: 1px solid #fff;	text-align: center;	line-height: 14px;	font-size: 12px;}
.info-keys:before {	left: 10px;	content: "\e603";}
.info-keys:after {	right: 10px;	content: "\e604";}


@media screen and (max-width: 35em) {	.grid li {		width: 50%;	}}

@media screen and (max-width: 24em) {	.grid li {		width: 100%;	}}
.scroll_true {overflow-x: hidden!important;overflow-y: scroll !important;}
main .section .SocialMediaFoot {margin: 0;  padding: 0;position: absolute; z-index: 9999 !important; left: 18%; bottom: -3px;}
main .section .SocialMediaFoot ul {margin:0; padding: 0;}
main .section .SocialMediaFoot ul li {list-style: none; margin:0 5px 0 5px;   display: inline-block; width: 26px; height: 26px; text-align: center;}
main .section .SocialMediaFoot ul li a{padding: 0; margin: 0; color:rgba(192,24,24,1); text-decoration: none;}
main .section .SocialMediaFoot ul li a img{margin: 0; padding: 0;max-width: 100%;}
main .left {margin: 0; padding: 0; padding: 5px; position: fixed; left: 6%; bottom: 0;max-width: 160px;background:rgba(192,24,24,1);}
main .left p {margin: 0; text-align: center;padding: 0; font-family: 'Barlow Condensed', sans-serif; font-weight: 400; letter-spacing: 3px; font-size:0.9em; text-decoration: none; color:rgba(255,255,255,1);}
main .left p a{ text-decoration: none; color:rgba(255,255,255,1);}
main .right {margin: 0; padding: 0; padding: 5px; position: fixed; right: 10%; bottom: 0; max-width:320px;}
main .right p {margin: 0; text-align: center;padding: 0; font-family: 'Barlow Condensed', sans-serif; font-weight: 400; letter-spacing: 3px; font-size:0.9em; text-decoration: none; color:rgba(255,255,255,1);}
main .right nav {margin:0; padding: 0; display: block;}
main .right ul {display:block; padding: 0;margin:0; list-style-type: none;   margin-block-start: 0; margin-block-end: 0; margin-inline-start: 0px; margin-inline-end: 0px; padding-inline-start: 0;}
main .right ul li {margin: 0 5px 0 5px; display:inline-block; padding: 0; list-style: none;}
main .right ul li a {font-family: 'Barlow Condensed', sans-serif; font-weight: 300; letter-spacing: 1px; font-size: 0.9em; text-decoration: none; color:rgba(24,24,24,1);}
main .right ul li a:hover {text-decoration: none; color:rgba(24,24,24,0.9);}
main  .dialog, .dialog__overlay {	width: 100%;	height: 100%;	top: 0;	left: 0;  z-index: 100;}
main  .dialog {	position: fixed;	display: -webkit-flex;	display: flex;	-webkit-align-items: center;	align-items: center;	-webkit-justify-content: center;	justify-content: center;	pointer-events: none;}
main  .dialog__overlay {	position: absolute;	z-index: 200;	background: rgba(55, 58, 71, 0.9);	opacity: 0;	-webkit-transition: opacity 0.3s;	transition: opacity 0.3s;	-webkit-backface-visibility: hidden;}
main  .dialog--open .dialog__overlay {	opacity: 1;	pointer-events: auto;}
main  .dialog__content {  top:0;  left: 0;  right: 0;  bottom:0;	max-width: 100%;	min-width: 100%;	background: #ebebeb;	padding: 0; 	position: fixed;	z-index: 300 !important;	opacity: 0;}
main  .dialog--open .dialog__content {	pointer-events: auto;}
main .main .section .PageTitle-Services  {margin: 0; padding: 0; position: absolute; bottom:2%; left: 6%;z-index: 90;   display: block; }
main .main .section .PageTitle-Services  h1 {text-shadow: -1.55px -1.55px 6px #000; margin: 0; padding:0;font-family: 'Barlow Condensed', sans-serif; font-weight: 600;  font-size:6.4em; color:#fff; text-align: left; letter-spacing: 3px;}
main .main .section .PageTitle-Divisions {margin: 0; padding: 0; position: absolute; bottom:2%; left: 6%;z-index: 90;   display: block; }
main .main .section .PageTitle-Divisions h1 {text-shadow: 1.55px 1.55px 6px #000; margin: 0; padding:0;font-family: 'Barlow Condensed', sans-serif; font-weight: 600;  font-size:6.4em; color:#fff; text-align: left; letter-spacing: 3px;}
main .main .section .PageTitle-Facilities  {margin: 0; padding: 0; position: absolute; bottom:2%; left: 6%;z-index: 90;   display: block; }
main .main .section .PageTitle-Facilities h1 {text-shadow:  0.55px 0.55px 4px #000; margin: 0; padding:0;font-family: 'Barlow Condensed', sans-serif; font-weight: 600;  font-size:6.4em; color:#fff; text-align: left; letter-spacing: 3px;}
main .main .section .PageTitle-Investment  {margin: 0; padding: 0; position: absolute; bottom:2%; left: 6%;z-index: 90;   display: block; }
main .main .section .PageTitle-Investment h1 {text-shadow: -1.55px -1.55px 6px #000; margin: 0; padding:0;font-family: 'Barlow Condensed', sans-serif; font-weight: 600;  font-size:6.4em; color:#fff; text-align: left; letter-spacing: 3px;}

.dialog.dialog--open .dialog__content, .dialog.dialog--close .dialog__content {
	-webkit-animation-duration: 0.3s;
	animation-duration: 0.3s;
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}

.dialog.dialog--open .dialog__content {
	-webkit-animation-name: anim-open;
	animation-name: anim-open;
}

.dialog.dialog--close .dialog__content {
	-webkit-animation-name: anim-close;
	animation-name: anim-close;
}

@-webkit-keyframes anim-open {
	0% { opacity: 0; -webkit-transform: scale3d(1.1, 1.1, 1); }
	100% { opacity: 1; -webkit-transform: scale3d(1, 1, 1); }
}

@keyframes anim-open {
	0% { opacity: 0; -webkit-transform: scale3d(1.1, 1.1, 1); transform: scale3d(1.1, 1.1, 1); }
	100% { opacity: 1; -webkit-transform: scale3d(1, 1, 1); transform: scale3d(1, 1, 1); }
}

@-webkit-keyframes anim-close {
	0% { opacity: 1; }
	100% { opacity: 0; -webkit-transform: scale3d(0.9, 0.9, 1); }
}

@keyframes anim-close {
	0% { opacity: 1; }
	100% { opacity: 0; -webkit-transform: scale3d(0.9, 0.9, 1); transform: scale3d(0.9, 0.9, 1); }
}
.PentageniGlobal {max-width: 80%; height: auto; margin: 0 auto; display: block;}
main  .dialog__content .PentageniContent {width: 100%; height: 100vh;font-family: 'Barlow Condensed', sans-serif; margin: 0 auto; padding: 0 ; overflow: scroll !important;}
#fade {  padding: 0;  display: none;  position: fixed;  top: 0%;  left: 0%;  width: 100%;  height: 100%;  background-color: black;  z-index: 1001;  -moz-opacity: 0.8;  opacity: .80;  filter: alpha(opacity=80);}
#light {  display: none;  position: absolute;  top: 45%;  left: 45%;  max-width: 800px;  max-height: 600px;  margin-left: -300px;  margin-top: -180px;  border: 2px solid #FFF;  background: #FFF;  z-index: 1002;  overflow: visible;}
#boxclose {  float: right;  cursor: pointer;  color: #fff;  border: 1px solid #AEAEAE;  border-radius: 3px;  background: #222222;  font-size: 31px;  font-weight: bold;  display: inline-block;  line-height: 0px;  padding: 11px 3px;  position: absolute;  right: 2px;  top: 2px;  z-index: 1002;  opacity: 0.9;}
.boxclose:before {  content: "Ã—";}
#fade:hover ~ #boxclose {  display:none;}
.test:hover ~ .test2 {  display: none;}
main  .dialog__content .PentageniContent h2{color:rgba(192,24,24,1); margin: 3% 0 0 0; padding: 0% 0 0 0; letter-spacing: 2px; text-align: center; text-transform: uppercase;}
main  .dialog__content .PentageniContent p {margin: 5px 15% 5px 15%; padding: 10px; font-size:1.2em; text-align: justify; }
main  .dialog__content .PentageniContent h3 {text-transform: capitalize;margin: 10px 0 10px; padding: 0; letter-spacing: 1px;text-align: left; font-size:1.3em; color:rgba(192,24,24,1);}
main  .dialog__content .PentageniContent ul {margin: 0; padding: 0; }
main  .dialog__content .PentageniContent ul li {margin: 5px; padding: 5px; font-size: 1.2em;display: block !important;list-style: none !important; text-align: left;}
main  .dialog__content .PentageniContent .cover-content {display: block; max-width: 90%; margin: 0 auto;}
.text-block h3 {text-transform: capitalize;margin: 10px 0 10px; padding: 0; letter-spacing: 1px;text-align: left; font-size:1.3em; color:rgba(192,24,24,1);}
.text-block p {font-size: 1.2em; margin: 0; padding: 0; min-width: 100px; min-height: 100px; background:; line-height: normal;}
.text-block p  span {font-size:1.3em; text-transform: capitalize;}
.text-block {display: inline-block; margin: 10px;  }
.Content_Wrapper {width: 80%; min-height: 100%;margin: 1em auto 1em auto; padding: 0 0 10em 0; display: block;}
.Content_Wrapper h3, h4 {text-align: center !important;}
.Content_Wrapper p {margin: 0 auto !important; padding:1em !important; max-width: 50% !important;}
.Content_Wrapper p img {margin: 0 auto; width: 100%;}
.Content_Wrapper input {display: none;}
.Content_Wrapper label {display: flex;width: 100%;height: 50px;cursor: pointer;border: 2px solid rgba(192,24,24,1);user-select: none;}
.Content_Wrapper label div:first-child {width: 100%;line-height: 45px; font-weight: 600; letter-spacing: 2px; color:rgba(192,24,24,1);margin: 0 1em 0 1em;font-size:1.4em;}
.Content_Wrapper .cross{margin-right:15px;margin-top:3px;}
.Content_Wrapper .cross:before,.cross:after {content: '';border-top: 1px solid rgba(192,24,24,1);width: 15px;display: block;margin-top: 18px;transition: 0.3s;}
.Content_Wrapper .cross:after {transform: rotate(90deg);margin-top: -2px;}
.Content_Wrapper .content_w {box-sizing: border-box;font-size: 0.9em;margin: 10px 10px;max-height: 0;overflow: hidden;transition: max-height, .5s;}
.Content_Wrapper .content_w div {margin:0 0 5px 0; }
.Content_Wrapper .content_w div a {color:rgba(192,24,24,1);}
.Content_Wrapper input:checked ~ .content_w {max-height: 2000vh;transition: max-height, 4s;}
.Content_Wrapper input:checked ~ label .cross:before {transform: rotate(180deg);}
.Content_Wrapper input:checked ~ label .cross:after {transform: rotate(0deg);}
.Content_Wrapper .questions{margin-top:10px;max-height: 0;overflow: hidden;transition: max-height, .5s;}
.Content_Wrapper .questions label{border:none;box-shadow: none;margin:0;}
.Content_Wrapper input:checked ~ .questions {max-height: 100%;margin-bottom: 10px;border-bottom:2px solid rgba(192,24,24,1);transition: 1s;}

.action {border:solid 0.4px rgba(192,24,24,1); background: none; color:rgba(192,24,24,1); font-size: 2em;position: fixed;top:0%; right: 10%;}
.section{
  text-align:center;
  overflow: hidden;
}

#home_01{
  position: absolute;
  right: 0;
  bottom: 0;
  top:0;
  right:0;
  width: 100%;
  height: 100%;
  background-size: 100% 100%;
  background-color: white; /* in case the video doesn't fit the whole page*/
  background-image: /* our video */;
  background-position: center center;
  background-size: contain;
  object-fit: cover; /*cover video background */
  z-index:0;
}

#home_02{
  position: absolute;
  right: 0;
  bottom: 0;
  top:0;
  right:0;
  width: 100%;
  height: 100%;
  background-size: 100% 100%;
  background-color: white; /* in case the video doesn't fit the whole page*/
  background-image: /* our video */;
  background-position: center center;
  background-size: contain;
  object-fit: cover; /*cover video background */
  z-index:0;
}

#home_03{
  position: absolute;
  right: 0;
  bottom: 0;
  top:0;
  right:0;
  width: 100%;
  height: 100%;
  background-size: 100% 100%;
  background-color: white; /* in case the video doesn't fit the whole page*/
  background-image: /* our video */;
  background-position: center center;
  background-size: contain;
  object-fit: cover; /*cover video background */
  z-index:0;
}


/* Layer with position absolute in order to have it over the video
* --------------------------------------- */
#home .layer{
  position: absolute;
  z-index: 4;
  width: 100%;
  left: 0;
  top: 43%;

  /*
  * Preventing flicker on some browsers
  * See http://stackoverflow.com/a/36671466/1081396  or issue #183
  */
  -webkit-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}

/*solves problem with overflowing video in Mac with Chrome */
#home{
  overflow: hidden;
}
#company .layer{
  position: absolute;
  z-index: 4;
  width: 100%;
  left: 0;
  top: 43%;

  /*
  * Preventing flicker on some browsers
  * See http://stackoverflow.com/a/36671466/1081396  or issue #183
  */
  -webkit-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}

/*solves problem with overflowing video in Mac with Chrome */
#company{
  overflow: hidden;
}
#services .layer{
  position: absolute;
  z-index: 4;
  width: 100%;
  left: 0;
  top: 43%;

  /*
  * Preventing flicker on some browsers
  * See http://stackoverflow.com/a/36671466/1081396  or issue #183
  */
  -webkit-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}

/*solves problem with overflowing video in Mac with Chrome */
#services{
  overflow: hidden;
}

/* Menu */
.dropbtn {

}

.dropdown {
  position: relative;
  display: inline-block;
}
.dropdown-content {
  margin:0 auto 0 -20px;
  padding: 10px ;
  background: #fff;
  border-bottom:solid 1px #ccc;
   display: none;
  position: absolute;
   min-width: 160px;
   z-index: 1;
}
.contact_drop {margin-left: -67px !important; min-width: 140px;}
.dropdown-content a {
  text-transform: lowercase;
  margin:0;
  padding:5px;
  text-align: left;
  font-size: 1.2em !important;
  letter-spacing: 0 !important;
   text-decoration: none;
  display: block;
}
.dropdown:hover .dropdown-content {display: block;}
.dropdown:hover .dropbtn {pointer-events:visible;}
.heritage {background:url('assets/media/images/content/heritage.png') no-repeat; background-size:cover; background-position:center;}
@media screen and (min-width: 1920px){
main .main .section header { top:41.5%;}
main .main .section header .Pentageni_01 h1.Pentageni_Main-Logo {top:1px; max-width:360px;}
main .main .axis {width: 545px; height: 645px; margin: 0; padding: 0; display: block; position: absolute; right:5%; top:11.6%;}
main .main .section header .Pentageni_01 .Pentageni_MainMenu {left:535px;}
main .main .section header .Pentageni_01 .Pentageni_MainMenu nav {margin:10px auto;}
main .main .section header .Pentageni_01 .Pentageni_MainMenu ul li a {letter-spacing:4px; font-weight: 200;font-size: 1.4em;}
main .main .axis .career {right:2%;}
main .main .axis .video  {}
main .main .axis .sustainability {}
  .slideshow li {		margin: 2% -20% 0 -10%;}
  .slideshow nav span.nav-prev,.slideshow nav span.nav-next {	bottom: 10%;	-webkit-transform: translateY(-50%);	transform: translateY(-50%);}
  .slideshow nav span.nav-next {	right: 21%; top:56%;}
  .slideshow nav span.nav-prev {	left: 12%; top:56%;}
  .slideshow nav span.nav-close {	top: 18%;	right: 22%;	padding: 0.5em 1em;	color: #c01818;}

}

@media screen and (max-width: 1280px){
main .main .section header .Pentageni_01 .Pentageni_MainMenu {left:370px;}
main .main .section header .Pentageni_01 .Pentageni_MainMenu nav {margin:10px auto;}
main .main .section header .Pentageni_01 .Pentageni_MainMenu ul li a {letter-spacing:0px; font-weight: 200;font-size: 1.4em;}
main .main .axis {width: 345px; height: 545px; margin: 0; padding: 0; display: block; position: absolute; right:5%; top:14%;}
}

@media screen and (max-height: 950px){
main .main .axis {width: 345px; height: 345px; margin: 0; padding: 0; display: block; position: absolute; right:5%; top:17.3%;}
}
@media screen and (max-height: 900px){
main .main .section header .Pentageni_01 .Pentageni_MainMenu nav {margin:9px auto;}
main .main .section header .Pentageni_01 .Pentageni_MainMenu ul li a {letter-spacing:2.8px; font-weight: 200;font-size: 1.4em;}
main .main .axis {width: 345px; height: 445px; margin: 0; padding: 0; display: block; position: absolute; right:5%; top:6.9%;}
main .main .section header .Pentageni_01 .Pentageni_MainMenu {left:450px;}
main .main .axis .career {bottom:560px; right:9px;}
main .main .axis .video  {top:66.5%; left:0;}
main .main .axis .sustainability {top:68%; right:-2%;}
main .main .axis .sustainability a {font-size: 1.2em; }
main .main .axis .sustainability a:hover {font-size: 1.21em; }
main .main .axis .scrollicon a .chevron {   top:160px; left:158.7px;}


}
@media screen and (max-height: 800px){
main .main .section header .Pentageni_01 .Pentageni_MainMenu nav {margin:12px auto;}
main .main .axis {width: 345px; height: 345px; margin: 0; padding: 0; display: block; position: absolute; right:5%; top:24.3%;}
main .main .section header .Pentageni_01 .Pentageni_MainMenu ul li a {letter-spacing:1px; font-weight: 200;font-size: 1.2em;}
}
@media screen and (max-height: 768px){
  main .main .section header .Pentageni_01 h1.Pentageni_Main-Logo {top:20px; max-width:230px;}
  main .main .section header .Pentageni_01 .Pentageni_MainMenu {left:310px;}
  main .main .section header .Pentageni_01 .Pentageni_MainMenu nav {margin:10px auto;}
  main .main .section header .Pentageni_01 .Pentageni_MainMenu ul li a {letter-spacing:2.5px; font-weight: 200;font-size: 1.4em;}
  main .main .axis {width: 245px; height: 345px; margin: 0; padding: 0; display: block; position: absolute; right:5%; top:3.5%;}
  main .main .axis .career {bottom:486px; right:48px;}
  main .main .axis .video  {top:86.5%; left:0;}
  main .main .axis .video a {font-size: 1.1em; }
  main .main .axis .video a:hover {font-size: 1.2em; }
  main .main .axis .video a img {width: 20px; padding: 0 2px 0 0}
  main .main .axis .video a:hover img {width: 22px;}
  main .main .axis .sustainability {top:88%; right:-4%;}
  main .main .axis .sustainability a {font-size: 1em; }
  main .main .axis .sustainability a:hover {font-size: 1.01em; }
  main .main .axis .scrollicon a .chevron {   top:220px; left:108.7px;}
 }
@media screen and (max-height: 720px){
main .main .section header .Pentageni_01 h1.Pentageni_Main-Logo {top:8px; max-width:300px;}
main .main .section header .Pentageni_01 .Pentageni_MainMenu {left:390px;}
main .main .section header .Pentageni_01 .Pentageni_MainMenu nav {margin:12px auto;}
main .main .section header .Pentageni_01 .Pentageni_MainMenu ul li a {letter-spacing:2.5px; font-weight: 200;font-size: 1.2em;}
main .main .axis {width: 345px; height: 445px; margin: 0; padding: 0; display: block; position: absolute; right:5%; top:-0.5%;}
}
@media screen and (min-width: 55em) {.clear {display: none;}.alert {display:none;}.company_link {display: none;} .MobilePadding_Bottom{display: none;}
 }
@media screen and (max-width: 53em) {
 .alert {font-family: 'Barlow Condensed', sans-serif;overflow:hidden !important;background:rgba(255,255,255,0.1); display:block; z-index:100 !important;position:absolute; padding:0; top:0; left:0; right:0; bottom:0;   width:100%;  height: 100vh;max-width:100%; max-height: 100vh; }
 .alert h1 {margin:20% auto; padding:0px; font-size:2em; letter-spacing:1px; color:rgba(192,24,24,1);}
 .alert p{margin:0 auto; padding:5px;  font-size:1.4em;display:block; text-align:center;}
 .action {top:1.8%; position: fixed; right: 0.1%; z-index: 99999 !important; background: rgba(192,24,24,1); color:rgba(255,255,255,1); font-size: 1.4em;}
 .MobilePadding_Bottom {padding:0 0 10em;}
 .Content_Wrapper label {max-width: 100%; border-top: 2px solid rgba(192,24,24,1); border-bottom: 2px solid rgba(192,24,24,1); user-select: none; border-right: none; border-left:none;}
 .Content_Wrapper label div:first-child {max-width: 100%; margin: 0 auto; font-size: 1.2em;}


 .company_link {bottom:0; right: 0;position: absolute; z-index: 0; background:rgba(192,24,24,1);margin: 0 auto; max-width: 140px; text-align: center;padding: 5px 6px 5px 10px; font-family: 'Barlow Condensed', sans-serif; font-weight: 200; letter-spacing: 2px; font-size:0.9em; text-decoration: none; color:rgba(255,255,255,1);}
 .company_link a{ text-decoration: none; color:rgba(255,255,255,1);}
 .dropdown1 {
   position: relative;
   display: inline-block;
 }
 .dropdown1-content {
   top:-220px;
   right: 0;
   margin:0 auto 0 -20px;
   padding: 10px ;
   background: #fff;
   border-bottom:solid 1px #ccc;
    display: none;
   position: absolute;
    min-width: 160px;
    z-index: 1;
 }
 .contact1_drop {margin-left: -67px !important; min-width: 140px;}
 .dropdown1-content a {
   color:rgba(192,24,24,1);
   text-transform: lowercase;
   margin:0;
   padding:5px;
   text-align: left;
   font-size: 1.2em !important;
   letter-spacing: 0 !important;
    text-decoration: none;
   display: block;
 }
 .dropdown1:hover .dropdown1-content {display: block;}
 .dropdown1:hover .dropbtn1 {pointer-events:visible;}
 .Content_Wrapper {width: 100%; min-height: 100%;margin: 1em auto 1em auto; padding: 0 0 15em 0; display: block;}
 .Content_Wrapper h3, h4 {text-align: center !important;}
 .Content_Wrapper p {margin: 0 auto !important; padding:1em !important; max-width: 100% !important;}
 .Content_Wrapper p img {margin: 0 auto; width: 100%;}
 main  .dialog__content {  top:0;  left: 0;  right: 0;  bottom:0;	max-width: 100%;	min-width: 100%; height: 100%;	background: #ebebeb;	padding: 4em 0 14em 0 ; 	position: fixed;	z-index: 300 !important;	opacity: 0;}
main  .dialog__content .PentageniContent h2{color:rgba(192,24,24,1); margin: 3% 0 0 0; padding: 0% 0 0 0; letter-spacing: 2px; text-align: center; text-transform: uppercase;}
 main  .dialog__content .PentageniContent p {margin: 5px ; padding: 10px; font-size:1em; text-align: justify; }
 main  .dialog__content .PentageniContent h3 {text-transform: capitalize;margin: 10px 0 10px; padding: 0; letter-spacing: 1px;text-align: left; font-size:1.3em; color:rgba(192,24,24,1);}
 main  .dialog__content .PentageniContent ul {margin: 0; padding: 0; }
 main  .dialog__content .PentageniContent ul li {margin: 5px; padding: 5px; font-size: 1.2em;display: block !important;list-style: none !important; text-align: left;}
 main  .dialog__content .PentageniContent .cover-content {display: block; max-width: 90%; margin: 0 auto;}
 header{display: none;}
main .Pentageni_Mobile-Logo {margin: 0; padding: 0; display: block; position: fixed; z-index: 9; top:1%; left:0%; right:0;  max-width: 100%; text-align: left;}
main .Pentageni_Mobile-Logo img {display: block; margin: 0 auto;  padding: 0;max-width: 160px; height: auto;}
main .main .axis {max-width: 300px; max-height: 400px; margin: 0 auto; left:0; top:15%; right: 0;   position: absolute;}
main .main .axis svg {margin: 0; max-height: 400px;}
main .geometry .triangle_01{left:-4px; top:-1px;max-width:90px; max-height: 68px;}
main .geometry .angle_01 {right:-4px; top:-1px;max-width:95px; max-height: 73px;}
main .geometry .triangle_02 {display:none;}
main .geometry #menuToggle{  display: none;  position: fixed;  bottom:3.8%;  right:6%;  z-index: 1000;  -webkit-user-select: none;  user-select: none;  color:#c01818;}
main .geometry #menuToggle a{  text-decoration: none;  color: #c01818;  transition: color 0.3s ease;}
main .geometry #menuToggle a:hover{  color: #181818;}
main .geometry #menuToggle input{  display: block;  width: 40px;  height: 32px;  position: absolute;  top: -7px;  left: -5px; cursor: pointer;  opacity: 0; /* hide this */  z-index: 2; /* and place it over the hamburger */  -webkit-touch-callout: none;}
main .geometry #menuToggle span{  display: block;  width: 33px;  height: 4px;  margin-bottom: 5px;  position: relative; background: #c01818;  border-radius: 3px;z-index: 1; transform-origin: 4px 0px;transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),opacity 0.55s ease;}
main .geometry #menuToggle span:first-child{  transform-origin: 0% 0%;}
main .geometry #menuToggle span:nth-last-child(2){  transform-origin: 0% 100%;}
main .geometry #menuToggle input:checked ~ span{  opacity: 1;  transform: rotate(45deg) translate(-2px, -1px);  background: #232323;}
main .geometry #menuToggle input:checked ~ span:nth-last-child(3){  opacity: 0;  transform: rotate(0deg) scale(0.2, 0.2);}
main .geometry #menuToggle input:checked ~ span:nth-last-child(2){  transform: rotate(-45deg) translate(0, -1px);}
#menu{  box-shadow: -1.51px -1.51px 4px rgba(0,0,0,0.1); position: absolute;  width: 100px;   margin:-370px 0 0 -120px;  padding:30px 70px 100px 40px;  background: #ededed;  list-style-type: none;  -webkit-font-smoothing: antialiased;  /* to stop flickering of text in safari */  transform-origin: 0% 0%;  transform: translate(100%, 0); transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);}
#menu li {margin: 0 5px 0 5px; display:inline-block; padding: 10px 0 10px 0; list-style: none;}
#menu li a {font-family: 'Barlow Condensed', sans-serif; font-weight: 400; letter-spacing: 2.1px; font-size: 1.2em; text-decoration: none; color:rgba(192,24,24,1);}
#menuToggle input:checked ~ ul{  transform: none;}
main .left, .right {display: none;}
main .SocialMediaFoot {display: none;}
main .section .back-to-the-future {margin:0; padding: 0; width: 22px; height:22px; position: absolute; z-index: 0;bottom:-10px; right: 2%;}

main .WeThinkGlobal {  text-align: center; max-width: 50%; bottom:0; left:0;  padding: 0; margin: 0; position: fixed; z-index: 100; display: block;}
main .WeThinkGlobal p {background:rgba(192,24,24,1);margin: 0 auto; max-width: 140px; text-align: center;padding: 5px; font-family: 'Barlow Condensed', sans-serif; font-weight: 200; letter-spacing: 2px; font-size:0.9em; text-decoration: none; color:rgba(255,255,255,1);}
main .WeThinkGlobal p a{ text-decoration: none; color:rgba(255,255,255,1);}
main .geometry .copyrights { display: none;}
main .main .section .PentageniServices {top:0; left: 0; bottom: 0; right: 0;}
.clear {width: 100%; min-height: 80px; margin: 0 auto;}
.grid__item { display: block !important;   margin:0 0 2px 0 !important; min-width: 100vw !important; padding: 10px;max-height: 50px !important; border:none; }
main .main .section .Pentageni_LogoFrame {display: none;}
main .main .axis .career {top:-98%; right:7%;}
main .main .axis .career a{font-size:1em;}
main .main .axis .video {top:44%; left:4%;}
main .main .axis .video a{font-size:1em;}
main .main .axis .sustainability {top:44.9%; right:4%;}
main .main .axis .sustainability a{font-size:1em;}
main .main .axis .scrollicon a .chevron {   top:-30px; left:135.7px;}

main .main .section .PageTitle-Services   {z-index: 1;bottom:1%; right: 0%;max-width: 100%; text-align: right;}
main .main .section .PageTitle-Services   h1 {text-shadow: .55px .55px 3px #000; padding:0 50px 0 0; font-size:1.2em; text-align: right; letter-spacing: 4px;}
main .main .section .PageTitle-Divisions  {z-index: 1;bottom:1%; right: 0%;max-width: 100%; text-align: right;}
main .main .section .PageTitle-Divisions  h1 {text-shadow: .55px .55px 3px #000; padding:0 50px 0 0; font-size:1.2em; text-align: right; letter-spacing: 4px;}
main .main .section .PageTitle-Facilities {z-index: 1;bottom:1%; right: 0%;max-width: 100%; text-align: right;}
main .main .section .PageTitle-Facilities h1 {text-shadow: .55px .55px 3px #000; padding:0 50px 0 0; font-size:1.2em; text-align: right; letter-spacing: 4px;}
main .main .section .PageTitle-Investment {z-index: 1;bottom:1%; right: 0%;max-width: 100%; text-align: right;}
main .main .section .PageTitle-Investment h1 {text-shadow: .55px .55px 3px #000; padding:0 50px 0 0; font-size:1.2em; text-align: right; letter-spacing: 4px;}
main .main .section .PentageniDivisions {left:0;}
main .main .section .PentageniDivisions .DivisionsContent {margin: 10px; padding: 20px 45px 5px 5px ; display: inline-block; position: absolute; top:8%; left:3%; border-right: none; width: 50%; min-height:480px;}
main .main .section .PentageniDivisions .DivisionsContent h3 { font-size: 1em; color:rgba(255,255,255,1); padding: 0 0 10px 0; margin: 0 0 10px 0; text-align: left; border-bottom: solid 2px rgba(255,255,255,0.2);}
main .main .section .PentageniDivisions .DivisionsContent p { margin: 5px auto; padding:0; letter-spacing:normal; font-size: 0.8em;color:#fff; text-align: justify;}
main .main .section .PentageniFacilities { left: 0;}
main .main .section .PentageniFacilities .FacilitiesContent {margin: 10px; padding: 5px 45px 5px 5px ; display: inline-block; position: absolute; top:8%; left:3%; border-right: none; width: 50%; min-height:480px;}
main .main .section .PentageniFacilities .FacilitiesContent h3 { font-size: 0.9em; color:rgba(255,255,255,1); padding: 0 0 10px 0; margin: 0 0 10px 0; text-align: left; border-bottom: solid 2px rgba(255,255,255,0.2);}
main .main .section .PentageniFacilities .FacilitiesContent p { margin: 3px auto; padding:0 0 5px 0; letter-spacing:0px; line-height: normal;font-size: 0.75em;color:#fff; text-align: justify; border-bottom: dashed 0.5px rgba(255,255,255,0.3);}
main .main .section .PentageniInvestment { left: 0;}
main .main .section .PentageniInvestment .InvestmentContent {top:12%; left:3%;  width: 60%;}
main .main .section .PentageniInvestment .InvestmentContent h3 {font-size: 1em;padding:0 0 10px 0; margin: 10px 0 5px 0; text-align: left;}
main .main .section .PentageniInvestment .InvestmentContent p {background: rgba(0,0,0,0);margin: 0 auto; padding:0 ;letter-spacing:normal; font-size:1em;color:#fff; text-align: justify;}
main .main .section .PentageniInvestment .InvestmentContent_r {position: absolute;display: inline-block; top:8%; width:30%;right:8%;}
main .main .section .PentageniInvestment .InvestmentContent_r ul {margin: 0; padding:0; text-align:center;}
main .main .section .PentageniInvestment .InvestmentContent_r ul li {color:#fff; text-shadow:  0.55px 0.55px 4px #000;text-align: center;display: inline-block; padding:5px;margin:0 5px 0 5px; background:; width: 120px; height: 70px;}
main .main .section .PentageniInvestment .InvestmentContent_r ul li span {font-size: 0.8em; color:#fff;text-shadow:  0.55px 0.55px 4px #000; }
main .main .section .PentageniInvestment .InvestmentContent_r ul li a span {font-size: 0.8em; margin: 0; padding: 0;}
main .main .section .PentageniInvestment .InvestmentContent_r ul li a { text-decoration: none;font-size: 1.4em; color:#fff; text-shadow:  0.55px 0.55px 4px #000; font-weight: 400;}
main .main .section .PentageniContact {left:0;}
main .main .section .PentageniContact .ContactContent {margin: 20px auto ; padding: 50px 0px 5px 0px ; display: inline-block; position: absolute; top:8%; right:0%; left:0; border-right: none; width: 100%;}
main .main .section .PentageniContact .ContactContent h3 { font-size: 1.3em; color:rgba(255,255,255,1); width: 100%;padding: 0 15px 5px 15px; margin: 0 0 10px 0; text-align: left; border-bottom: solid 2px rgba(255,255,255,0.2);}
main .main .section .PentageniContact .ContactContent p { margin: 5px auto; padding: 0 15px 10px 15px; letter-spacing:normal; font-size: 1em;color:#fff; text-align: justify;}
.PentageniGrid-gallery ul {z-index: 1000;position: absolute !important; right:5%;  top:8%;}
.Grid_Top {margin-top:50px !important;}
.PentageniGrid-gallery figure {	margin: 0;}
.PentageniGrid-gallery figure img {	display: block;	width: 100%;}
.PentageniGrid-gallery li h3{	margin: 1px; font-size: 1em;	 padding:0px 8px 0 0; text-align: center; color:#fff; letter-spacing: 0px; }
.PentageniGrid-gallery figcaption p {	font-size: 1.2em;color: rgba(255,255,255,0.7); font-weight: 200;text-align: justify;margin: 0 25px 0 25px; padding: 5px; letter-spacing: 1px;}
.PentageniGrid-wrap {	max-width: 100%;	margin: 0 auto;	padding: 0;}
.PentageniGrid {margin: 0;}
.PentageniGrid li { width:100%;float: none !important;border: solid 1.5px rgba(192,24,24,1); border-left: solid 1.5px rgba(192,24,24,1); background: rgba(255,255,255,0.022);margin:5px 0 5px 0; 	cursor: pointer;}
.PentageniGrid figure {		-webkit-transition: opacity 0.2s;	transition: opacity 0.2s;}
.PentageniGrid li:hover figure {background: rgba(255,255,255,0.1)}
.PentageniGrid figcaption { padding: 15px;}

.GridDivisions {display: block;margin:0px auto !important; padding: 0; top: 20%!important;min-width: 100%; position: absolute !important; right:0%; left:2%;text-align: center;}
.GridDivisions figcaption {padding: 0;}
.GridDivisions ul {margin: 0;}
.GridDivisions li {float: none;max-width: 55px; max-height: 55px; margin:30px; border:none; display: block !important;}
.GridDivisions li h3 {font-size: 1em;}
.GridDivisions li figure { background: #fff;width: 55px; height: 55px; border:solid 3px rgba(192,24,24,1);  }
.GridDivisions li figure figcaption img {opacity: 0.9;margin: 0; padding: 0;width: 100%;}
.GridDivisions li figcaption img:hover {opacity: 1;}
.GridDivisions li figure .overlay_divisions {width: 110px; height: 110px;margin: 0; padding: 0; display: block; z-index: 9; position: absolute; background: url('../media/icons/play_division.svg') no-repeat; background-size: contain;}
.GridContact {position: absolute !important;top:60% !important; right: 0% !important; left:10%;width: 100vw !important; margin:0;}
.GridContact li { width:80%;float: left !important;border: solid 1.5px rgba(192,24,24,1); border-left: solid 1.5px rgba(192,24,24,1); background: rgba(255,255,255,0.88);margin:5px 0 5px 0; 	cursor: pointer;}
.GridContact li figure figcaption h3 {color:rgba(24,24,24,0.8);}
.GridContact li:hover figure {	 background: rgba(24,24,24,0.2) !important;}
.slideshow li {	width: 100%; min-height: 100%; margin: 0; padding: 0 0 10em 0; top:-8%; left: 5%;}
.slideshow figure {	border:none; padding: 1.2em 0 10em 0;}
.slideshow figcaption {	padding-bottom: 20px;}
.slideshow figcaption h3 {margin: 50px 0 0 0;padding: 0; text-align: center;}
.slideshow figcaption h4 {margin:10px;padding:0; text-align: center; font-size: 1em;}
.slideshow figcaption p {text-align: justify;margin:15px 0 15px 0; padding:0 1em 0 1em; letter-spacing: 0.5px; font-size: 0.9em;}
.slideshow nav span.nav-close {	top: 92.9%;	right: -20px;		color:rgba(192,24,24,1);}
.slideshow nav span.nav-next {display: none;}
.slideshow nav span.nav-prev {display: none;}


/* Common styles of menus */

.dl-menuwrapper {
	width: 100%;
	max-width: 300px;
	float: left;
	position: relative;
	z-index: 10000 !important;
	-webkit-perspective: 1000px;
	perspective: 1000px;
	-webkit-perspective-origin: 50% 200%;
	perspective-origin: 50% 200%;
}

.dl-menuwrapper:first-child {
	margin-right: 100px;
}

.dl-menuwrapper button {


	background: #ccc;
	border: none;
	width: 48px;
	height: 45px;
	text-indent: -900em;
	overflow: hidden;
	position: relative;
	cursor: pointer;
	outline: none;
}

.dl-menuwrapper button:hover,
.dl-menuwrapper button.dl-active,
.dl-menuwrapper ul {
	background: #aaa;
}

.dl-menuwrapper button:after {
	content: '';
	position: absolute;
	width: 68%;
	height: 5px;
	background: #fff;
	top: 10px;
	left: 16%;
	box-shadow:
		0 10px 0 #fff,
		0 20px 0 #fff;
}

.dl-menuwrapper ul {
	z-index: 10000 !important;

	padding: 0;
	list-style: none;
	-webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
}

.dl-menuwrapper li {
	position: relative;
}

.dl-menuwrapper li a {
	display: block;
	position: relative;
	padding: 15px 20px;
	font-size: 16px;
	line-height: 20px;
	font-weight: 300;
	color: #fff;
	outline: none;
}

.no-touch .dl-menuwrapper li a:hover {
	background: rgba(255,248,213,0.1);
}

.dl-menuwrapper li.dl-back &gt; a {
	padding-left: 30px;
	background: rgba(0,0,0,0.1);
}

.dl-menuwrapper li.dl-back:after,
.dl-menuwrapper li &gt; a:not(:only-child):after {
	position: absolute;
	top: 0;
	line-height: 50px;
	font-family: 'icomoon';
	speak: none;
	-webkit-font-smoothing: antialiased;
	content: "\e000";
}

.dl-menuwrapper li.dl-back:after {
	left: 10px;
	color: rgba(212,204,198,0.3);
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg);
}

.dl-menuwrapper li &gt; a:after {
	right: 10px;
	color: rgba(0,0,0,0.15);
}

.dl-menuwrapper .dl-menu {
	margin: 5px 0 0 0;
	position: absolute;
	width: 100%;
	opacity: 0;
	pointer-events: none;
	-webkit-transform: translateY(10px);
	transform: translateY(10px);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.dl-menuwrapper .dl-menu.dl-menu-toggle {
	transition: all 0.3s ease;
}

.dl-menuwrapper .dl-menu.dl-menuopen {
	opacity: 1;
	pointer-events: auto;
	-webkit-transform: translateY(0px);
	transform: translateY(0px);
}

/* Hide the inner submenus */
.dl-menuwrapper li .dl-submenu {
	display: none;
}

/*
When a submenu is openend, we will hide all li siblings.
For that we give a class to the parent menu called "dl-subview".
We also hide the submenu link.
The opened submenu will get the class "dl-subviewopen".
All this is done for any sub-level being entered.
*/
.dl-menu.dl-subview li,
.dl-menu.dl-subview li.dl-subviewopen &gt; a,
.dl-menu.dl-subview li.dl-subview &gt; a {
	display: none;
}

.dl-menu.dl-subview li.dl-subview,
.dl-menu.dl-subview li.dl-subview .dl-submenu,
.dl-menu.dl-subview li.dl-subviewopen,
.dl-menu.dl-subview li.dl-subviewopen &gt; .dl-submenu,
.dl-menu.dl-subview li.dl-subviewopen &gt; .dl-submenu &gt; li {
	display: block;
}

/* Dynamically added submenu outside of the menu context */
.dl-menuwrapper &gt; .dl-submenu {
	position: absolute;
	width: 100%;
	top: 50px;
	left: 0;
	margin: 0;
}

/* Animation classes for moving out and in */

.dl-menu.dl-animate-out-1 {
	-webkit-animation: MenuAnimOut1 0.4s;
	animation: MenuAnimOut1 0.4s;
}

.dl-menu.dl-animate-out-2 {
	-webkit-animation: MenuAnimOut2 0.3s ease-in-out;
	animation: MenuAnimOut2 0.3s ease-in-out;
}

.dl-menu.dl-animate-out-3 {
	-webkit-animation: MenuAnimOut3 0.4s ease;
	animation: MenuAnimOut3 0.4s ease;
}

.dl-menu.dl-animate-out-4 {
	-webkit-animation: MenuAnimOut4 0.4s ease;
	animation: MenuAnimOut4 0.4s ease;
}

.dl-menu.dl-animate-out-5 {
	-webkit-animation: MenuAnimOut5 0.4s ease;
	animation: MenuAnimOut5 0.4s ease;
}

@-webkit-keyframes MenuAnimOut1 {
	0% { }
	50% {
		-webkit-transform: translateZ(-250px) rotateY(30deg);
	}
	75% {
		-webkit-transform: translateZ(-372.5px) rotateY(15deg);
		opacity: .5;
	}
	100% {
		-webkit-transform: translateZ(-500px) rotateY(0deg);
		opacity: 0;
	}
}

@-webkit-keyframes MenuAnimOut2 {
	0% { }
	100% {
		-webkit-transform: translateX(-100%);
		opacity: 0;
	}
}

@-webkit-keyframes MenuAnimOut3 {
	0% { }
	100% {
		-webkit-transform: translateZ(300px);
		opacity: 0;
	}
}

@-webkit-keyframes MenuAnimOut4 {
	0% { }
	100% {
		-webkit-transform: translateZ(-300px);
		opacity: 0;
	}
}

@-webkit-keyframes MenuAnimOut5 {
	0% { }
	100% {
		-webkit-transform: translateY(40%);
		opacity: 0;
	}
}

@keyframes MenuAnimOut1 {
	0% { }
	50% {
		-webkit-transform: translateZ(-250px) rotateY(30deg);
		transform: translateZ(-250px) rotateY(30deg);
	}
	75% {
		-webkit-transform: translateZ(-372.5px) rotateY(15deg);
		transform: translateZ(-372.5px) rotateY(15deg);
		opacity: .5;
	}
	100% {
		-webkit-transform: translateZ(-500px) rotateY(0deg);
		transform: translateZ(-500px) rotateY(0deg);
		opacity: 0;
	}
}

@keyframes MenuAnimOut2 {
	0% { }
	100% {
		-webkit-transform: translateX(-100%);
		transform: translateX(-100%);
		opacity: 0;
	}
}

@keyframes MenuAnimOut3 {
	0% { }
	100% {
		-webkit-transform: translateZ(300px);
		transform: translateZ(300px);
		opacity: 0;
	}
}

@keyframes MenuAnimOut4 {
	0% { }
	100% {
		-webkit-transform: translateZ(-300px);
		transform: translateZ(-300px);
		opacity: 0;
	}
}

@keyframes MenuAnimOut5 {
	0% { }
	100% {
		-webkit-transform: translateY(40%);
		transform: translateY(40%);
		opacity: 0;
	}
}

.dl-menu.dl-animate-in-1 {
	-webkit-animation: MenuAnimIn1 0.3s;
	animation: MenuAnimIn1 0.3s;
}

.dl-menu.dl-animate-in-2 {
	-webkit-animation: MenuAnimIn2 0.3s ease-in-out;
	animation: MenuAnimIn2 0.3s ease-in-out;
}

.dl-menu.dl-animate-in-3 {
	-webkit-animation: MenuAnimIn3 0.4s ease;
	animation: MenuAnimIn3 0.4s ease;
}

.dl-menu.dl-animate-in-4 {
	-webkit-animation: MenuAnimIn4 0.4s ease;
	animation: MenuAnimIn4 0.4s ease;
}

.dl-menu.dl-animate-in-5 {
	-webkit-animation: MenuAnimIn5 0.4s ease;
	animation: MenuAnimIn5 0.4s ease;
}

@-webkit-keyframes MenuAnimIn1 {
	0% {
		-webkit-transform: translateZ(-500px) rotateY(0deg);
		opacity: 0;
	}
	20% {
		-webkit-transform: translateZ(-250px) rotateY(30deg);
		opacity: 0.5;
	}
	100% {
		-webkit-transform: translateZ(0px) rotateY(0deg);
		opacity: 1;
	}
}

@-webkit-keyframes MenuAnimIn2 {
	0% {
		-webkit-transform: translateX(-100%);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateX(0px);
		opacity: 1;
	}
}

@-webkit-keyframes MenuAnimIn3 {
	0% {
		-webkit-transform: translateZ(300px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0px);
		opacity: 1;
	}
}

@-webkit-keyframes MenuAnimIn4 {
	0% {
		-webkit-transform: translateZ(-300px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0px);
		opacity: 1;
	}
}

@-webkit-keyframes MenuAnimIn5 {
	0% {
		-webkit-transform: translateY(40%);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateY(0);
		opacity: 1;
	}
}

@keyframes MenuAnimIn1 {
	0% {
		-webkit-transform: translateZ(-500px) rotateY(0deg);
		transform: translateZ(-500px) rotateY(0deg);
		opacity: 0;
	}
	20% {
		-webkit-transform: translateZ(-250px) rotateY(30deg);
		transform: translateZ(-250px) rotateY(30deg);
		opacity: 0.5;
	}
	100% {
		-webkit-transform: translateZ(0px) rotateY(0deg);
		transform: translateZ(0px) rotateY(0deg);
		opacity: 1;
	}
}

@keyframes MenuAnimIn2 {
	0% {
		-webkit-transform: translateX(-100%);
		transform: translateX(-100%);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateX(0px);
		transform: translateX(0px);
		opacity: 1;
	}
}

@keyframes MenuAnimIn3 {
	0% {
		-webkit-transform: translateZ(300px);
		transform: translateZ(300px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0px);
		transform: translateZ(0px);
		opacity: 1;
	}
}

@keyframes MenuAnimIn4 {
	0% {
		-webkit-transform: translateZ(-300px);
		transform: translateZ(-300px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0px);
		transform: translateZ(0px);
		opacity: 1;
	}
}

@keyframes MenuAnimIn5 {
	0% {
		-webkit-transform: translateY(40%);
		transform: translateY(40%);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
		opacity: 1;
	}
}

.dl-menuwrapper &gt; .dl-submenu.dl-animate-in-1 {
	-webkit-animation: SubMenuAnimIn1 0.4s ease;
	animation: SubMenuAnimIn1 0.4s ease;
}

.dl-menuwrapper &gt; .dl-submenu.dl-animate-in-2 {
	-webkit-animation: SubMenuAnimIn2 0.3s ease-in-out;
	animation: SubMenuAnimIn2 0.3s ease-in-out;
}

.dl-menuwrapper &gt; .dl-submenu.dl-animate-in-3 {
	-webkit-animation: SubMenuAnimIn3 0.4s ease;
	animation: SubMenuAnimIn3 0.4s ease;
}

.dl-menuwrapper &gt; .dl-submenu.dl-animate-in-4 {
	-webkit-animation: SubMenuAnimIn4 0.4s ease;
	animation: SubMenuAnimIn4 0.4s ease;
}

.dl-menuwrapper &gt; .dl-submenu.dl-animate-in-5 {
	-webkit-animation: SubMenuAnimIn5 0.4s ease;
	animation: SubMenuAnimIn5 0.4s ease;
}

@-webkit-keyframes SubMenuAnimIn1 {
	0% {
		-webkit-transform: translateX(50%);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateX(0px);
		opacity: 1;
	}
}

@-webkit-keyframes SubMenuAnimIn2 {
	0% {
		-webkit-transform: translateX(100%);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateX(0px);
		opacity: 1;
	}
}

@-webkit-keyframes SubMenuAnimIn3 {
	0% {
		-webkit-transform: translateZ(-300px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0px);
		opacity: 1;
	}
}

@-webkit-keyframes SubMenuAnimIn4 {
	0% {
		-webkit-transform: translateZ(300px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0px);
		opacity: 1;
	}
}

@-webkit-keyframes SubMenuAnimIn5 {
	0% {
		-webkit-transform: translateZ(-200px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0);
		opacity: 1;
	}
}

@keyframes SubMenuAnimIn1 {
	0% {
		-webkit-transform: translateX(50%);
		transform: translateX(50%);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateX(0px);
		transform: translateX(0px);
		opacity: 1;
	}
}

@keyframes SubMenuAnimIn2 {
	0% {
		-webkit-transform: translateX(100%);
		transform: translateX(100%);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateX(0px);
		transform: translateX(0px);
		opacity: 1;
	}
}

@keyframes SubMenuAnimIn3 {
	0% {
		-webkit-transform: translateZ(-300px);
		transform: translateZ(-300px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0px);
		transform: translateZ(0px);
		opacity: 1;
	}
}

@keyframes SubMenuAnimIn4 {
	0% {
		-webkit-transform: translateZ(300px);
		transform: translateZ(300px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0px);
		transform: translateZ(0px);
		opacity: 1;
	}
}

@keyframes SubMenuAnimIn5 {
	0% {
		-webkit-transform: translateZ(-200px);
		transform: translateZ(-200px);
		opacity: 0;
	}
	100% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
		opacity: 1;
	}
}

.dl-menuwrapper &gt; .dl-submenu.dl-animate-out-1 {
	-webkit-animation: SubMenuAnimOut1 0.4s ease;
	animation: SubMenuAnimOut1 0.4s ease;
}

.dl-menuwrapper &gt; .dl-submenu.dl-animate-out-2 {
	-webkit-animation: SubMenuAnimOut2 0.3s ease-in-out;
	animation: SubMenuAnimOut2 0.3s ease-in-out;
}

.dl-menuwrapper &gt; .dl-submenu.dl-animate-out-3 {
	-webkit-animation: SubMenuAnimOut3 0.4s ease;
	animation: SubMenuAnimOut3 0.4s ease;
}

.dl-menuwrapper &gt; .dl-submenu.dl-animate-out-4 {
	-webkit-animation: SubMenuAnimOut4 0.4s ease;
	animation: SubMenuAnimOut4 0.4s ease;
}

.dl-menuwrapper &gt; .dl-submenu.dl-animate-out-5 {
	-webkit-animation: SubMenuAnimOut5 0.4s ease;
	animation: SubMenuAnimOut5 0.4s ease;
}

@-webkit-keyframes SubMenuAnimOut1 {
	0% {
		-webkit-transform: translateX(0%);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateX(50%);
		opacity: 0;
	}
}

@-webkit-keyframes SubMenuAnimOut2 {
	0% {
		-webkit-transform: translateX(0%);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateX(100%);
		opacity: 0;
	}
}

@-webkit-keyframes SubMenuAnimOut3 {
	0% {
		-webkit-transform: translateZ(0px);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateZ(-300px);
		opacity: 0;
	}
}

@-webkit-keyframes SubMenuAnimOut4 {
	0% {
		-webkit-transform: translateZ(0px);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateZ(300px);
		opacity: 0;
	}
}

@-webkit-keyframes SubMenuAnimOut5 {
	0% {
		-webkit-transform: translateZ(0);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateZ(-200px);
		opacity: 0;
	}
}

@keyframes SubMenuAnimOut1 {
	0% {
		-webkit-transform: translateX(0%);
		transform: translateX(0%);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateX(50%);
		transform: translateX(50%);
		opacity: 0;
	}
}

@keyframes SubMenuAnimOut2 {
	0% {
		-webkit-transform: translateX(0%);
		transform: translateX(0%);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateX(100%);
		transform: translateX(100%);
		opacity: 0;
	}
}

@keyframes SubMenuAnimOut3 {
	0% {
		-webkit-transform: translateZ(0px);
		transform: translateZ(0px);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateZ(-300px);
		transform: translateZ(-300px);
		opacity: 0;
	}
}

@keyframes SubMenuAnimOut4 {
	0% {
		-webkit-transform: translateZ(0px);
		transform: translateZ(0px);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateZ(300px);
		transform: translateZ(300px);
		opacity: 0;
	}
}

@keyframes SubMenuAnimOut5 {
	0% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
		opacity: 1;
	}
	100% {
		-webkit-transform: translateZ(-200px);
		transform: translateZ(-200px);
		opacity: 0;
	}
}

/* No JS Fallback */
.no-js .dl-menuwrapper .dl-menu {
	position: relative;
	opacity: 1;
	-webkit-transform: none;
	transform: none;
}

.no-js .dl-menuwrapper li .dl-submenu {
	display: block;
}

.no-js .dl-menuwrapper li.dl-back {
	display: none;
}

.no-js .dl-menuwrapper li &gt; a:not(:only-child) {
	background: rgba(0,0,0,0.1);
}

.no-js .dl-menuwrapper li &gt; a:not(:only-child):after {
	content: '';
}



/* Demo 2 */
.demo-2 .dl-menuwrapper button {
	background: #e86814;
}

.demo-2 .dl-menuwrapper button:hover,
.demo-2 .dl-menuwrapper button.dl-active,
.demo-2 .dl-menuwrapper ul {
	background: #D35400;
}

  }
</pre></body></html>