/*==================Fonts=============*/
@font-face {
	font-family: 'harabarabold';
	src: url('../fonts/harabara_4-webfont.woff2') format('woff2'),
         url('../fonts/harabara_4-webfont.woff') format('woff');
	font-weight: bold;
	font-style: normal;
}

@font-face {
	font-family: 'HelveticaNeue';
	src: url('../fonts/HelveticaNeueLTCom-Lt_4.ttf');
}
@font-face {
	font-family: 'KozGoPro-Light';
	src: url('../fonts/KozGoPro-Light.otf');
}
@font-face {
	font-family: 'KozGoPro-Regular';
	src: url('../fonts/KozGoPro-Regular.otf');
}

:focus {
    outline: none;
}

/*===============End of Fonts=============*/
body{ margin:0; padding:0; font-family: 'Roboto Slab', serif; font-size:14px;overflow-x: hidden !important;}
#section0{/* background:url(../images/homeBg.jpg) no-repeat top right;  background-size: cover;*/ background:#c7c8ca; position:relative;}
.homepageBox{ width:566px; height:380px; background:#252525; color:#fff; font-size:14px; padding:30px 30px 30px 50px;right: 200px; top: 180px; position:absolute;}
.homepageBox h2{color:#00a2ea; font-size:35px; font-weight:400; margin:0; padding:0; font-family: 'Roboto Slab', serif;}
.homepageBox h4{color:#c7c7c7; font-size:16px; font-weight:400; margin:0; padding:0; font-family: 'Roboto Slab', serif; margin-bottom:10px;}
.homepageBox p{color:#c7c7c7; font-size:12px; font-weight:400; margin:0; padding:0;font-family: 'Muli', sans-serif; margin-top:15px; line-height:18px;}

.homepageBtmText{ width:500px; height:200px; bottom:10px; left:15px; position:absolute; color:#252525; text-transform:uppercase; font-family: 'Roboto Slab', serif;  font-size:35px; line-height:35px; }
.homepageBtmText .weare{ margin:0; padding:0; font-weight:300; display:block;}
.homepageBtmText .creative{ margin:0; padding:0;font-weight:100; display:block;}
.homepageBtmText .creative strong{ font-weight:400;}
.homepageBtmText .designStudio{ margin:0; padding:0; font-weight:100; display:block;}
.homepageBtmText .withFresh{ margin:0; padding:0;display:block;}
.homepageBtmText .withFresh .with{ font-weight:300;}
.homepageBtmText .withFresh .fresh{ font-weight:400;}
.homepageBtmText .withFresh .ideas{ font-weight:700;}
.mayabiousHomeFooter{ background:#252525; width:100%; padding:2px 10px;font-family: 'harabarabold'; font-size:16px; color:#c7c7c7; line-height:16px; margin-top:15px; text-transform:none; letter-spacing:2px;}

/*===========REDEFINING COMMUNICATION================*/
#section1{ background:url(../images/redefingBg.jpg) repeat-x #252525; position:relative;}
.redifingImg1{ width:332px; position:absolute; top:50px; left:150px; border:1px solid #fff; display:block;}
.redifingImg2{ width:283px; position:absolute; top:6em; left:37em; border:1px solid #fff; display:block;}
.redifingImg3{ width:393px; position:absolute; top:8em; left:60em; border:1px solid #fff; display:block;}
.redifingImg4{ width:369px; position:absolute; top:21em; left:31em; border:1px solid #fff; display:block;}
.redifingImg5{ width:282px; position:absolute; top:27em; left:59em; border:1px solid #fff; display:block;}
.redifingImg6{ width:187px; position:absolute; top:26.5em; left:81em; border:1px solid #fff; display:block;}

.refendingTxtCont{ width:305px; height:170px; border-right:2px dotted #fff;top:20.5em; left:5em; position:absolute;}
.refendingTxtCont .ampleNumber{ font-family: 'Roboto Slab', serif; font-size:13px; line-height:22px; color:#fff; font-weight:400; }
.refendingTxtCont .ampleNumber span{ color:#000;}
.redificationFooter{ width:500px; height:150px; bottom:0.5em; left:5em; position:absolute;}
.redificationFooter h3{color:#00a2ea; font-size:35px; font-weight:400; margin:0; padding:0; font-family: 'Roboto Slab', serif; line-height:35px;}
.redificationFooter h4{color:#fff; font-size:35px; font-weight:400; margin:0; padding:0; font-family: 'Roboto Slab', serif; line-height:35px;}

.redificationFooter .rediFooter{ background:#a7a9ac; width:100%; padding:2px 10px;font-family: 'harabarabold'; font-size:16px; color:#282828; line-height:16px; margin-top:15px; text-transform:none; letter-spacing:2px;}

/*===========3D Visualization================*/
#section2{ position:relative; background:#1baadd;}
#section2:after{ position:absolute; top:0; right:0; background:#fff; width:50%; height:100%; content:"";z-index:1; }
.visualizationLeftCont{width: 50%;cursor: pointer;position: absolute; left: 0; top: 0; height: 100%; display: flex; align-items: center;
    justify-content: flex-end;}
.visualizationRightCont{ width:50%; float:right; background:#fff; padding:1em; position:relative; z-index:99;}
.visualHeading{ width:890px; height:232px; padding:18px; float:right; background:#23b6ea;display: flex; margin-top:10em;}
.visualHeading .visualzeIcon{ width:198px; height:198px; display: flex;align-items: center;}
.visualHeading .visualzeIcon img { margin-left: 25px; height: 145px;}
.visualHeading h3{ font-family: 'Roboto Slab', serif; font-weight:300; margin:0; padding:0; color:#fff;margin-left: 20px;margin-top: 20px; font-size:63px;}
.visualHeading h3 span{ display:block; font-weight:100;}
.visualleftContent{ width:100%; max-width:653px; float:right; padding-right:30px; color:#fff;font-family: 'Muli', sans-serif; font-size:16px; margin-top:25px; line-height:20px;}
.visualleftContent p{ font-weight:300;}
.visualleftContent p strong{ font-weight:400;font-family: 'Roboto Slab', serif;}

.visualizationRightCont .visualImg1{ width:290px; float:left; overflow:hidden;}
.visualizationRightCont .visualImg2{ width:300px; float:left; margin-left:10px; overflow:hidden;}
.visualizationRightCont .visualImg3{ width:395px; float:left; margin-top:10px; overflow:hidden;}
.visualizationRightCont .visualImg4{ width:207px; float:left; margin-left:10px;margin-top:10px;  overflow:hidden;}

.visuleftTxtcont{ width:75%; float:right;}

/*===========Augmented Reality================*/
#virtualReality{ position:relative; background:#252525;}
#virtualReality:after{ position:absolute; top:0; right:0; background:#fff; width:50%; height:100%; content:"";z-index:1; }
.audioHeading{ width:890px; height:232px; padding:18px; float:right; background:#2b2929;display: flex; margin-top:10em;}
.audioHeading .visualzeIcon{  width:198px; height:198px; display: flex;align-items: center;}
.audioHeading .visualzeIcon img{margin-left: 25px; height: 145px;}
.audioHeading h3{ font-family: 'Roboto Slab', serif; font-weight:300; margin:0; padding:0; color:#fff;margin-left: 20px;margin-top: 20px; font-size:63px;}
.audioHeading h3 span{ display:block; font-weight:100;}
.virtualReality .virtualImgCont{ width:100%; overflow:hidden;}

/*===========Website and App================*/
#websiteContainer{ position:relative; background:#1baadd;}
#websiteContainer:after{ position:absolute; top:0; right:0; background:#fff; width:50%; height:100%; content:"";z-index:1; }
.websiteHeading{ width:890px; height:232px; padding:18px; float:right; background:#23b6ea;display: flex; margin-top:10em;}
.websiteHeading .visualzeIcon{ width:198px; height:198px; display: flex;align-items: center;}
.websiteHeading .visualzeIcon img{margin-left: 25px; height: 145px;}
.websiteHeading h3{ font-family: 'Roboto Slab', serif; font-weight:300; margin:0; padding:0; color:#fff;margin-left: 20px;margin-top: 20px;font-size:63px;}
.websiteHeading h3 span{ display:block; font-weight:100;}

.websiteImg .websiteTemplateLeftCont{ width:400px; border:1px solid #969696;}
.websiteImg .websiteTemplaterightCont{ width:250px; margin-left:15px;}
.websiteImg .websiteTemplaterightCont .websiteRightImg{ width:100%; text-align:center; border:1px solid #969696; overflow:hidden;}
.websiteImg .mobileAppCont{ width:50%; border:1px solid #969696; overflow:hidden;}

/*===========Audio Visual================*/
#Audiovisual{ position:relative; background:#252525;}
#Audiovisual:after{ position:absolute; top:0; right:0; background:#fff; width:50%; height:100%; content:"";z-index:1; }
.avHeading{ width:890px; height:232px; padding:18px; float:right; background:#2b2929;display: flex; margin-top:14em;}
.avHeading .visualzeIcon{ width:198px; height:198px; display: flex;align-items: center;}
.avHeading .visualzeIcon img{margin-left: 25px; height: 145px;}
.avHeading h3{ font-family: 'Roboto Slab', serif; font-weight:300; margin:0; padding:0; color:#fff;margin-left: 20px;margin-top: 20px;font-size:63px;}
.avHeading h3 span{ display:block; font-weight:100;}

.audioImg .avLeftCont{ width:400px;}
.audioImg .avrightCont{ width:240px; overflow:hidden;}
.audioImg .avLeftCont .avleftImgContent{ width:100%; overflow:hidden;}
.audioImg .avBtmImgCont{width:50%; overflow:hidden;}

/*===========Brochure================*/
#brochure{ position:relative; background:#1baadd;}
#brochure:after{ position:absolute; top:0; right:0; background:#fff; width:50%; height:100%; content:"";z-index:1; }
.brochureHeading{width:890px; height:232px; padding:18px;  float:right; background:#23b6ea;display: flex; margin-top:14em;}
.brochureHeading .visualzeIcon{ width:198px; height:198px; display: flex;align-items: center;}
.brochureHeading .visualzeIcon img{margin-left: 25px; height: 145px;}
.brochureHeading h3{ font-family: 'Roboto Slab', serif; font-weight:300; margin:0; padding:0; color:#fff;margin-left: 20px;margin-top: 20px;font-size:63px;}
.brochureHeading h3 span{ display:block; font-weight:100;}

.brochureImg .brochureleftImgContent{width:215px; overflow:hidden; border:1px solid #969696; padding:5px;}
.brochureImg .brochureRightImgContent{width:425px; overflow:hidden; border:1px solid #969696; padding:5px;}
.brochureImg .brochureBtmLeftImgContent{width:430px; overflow:hidden;}
.brochureImg .brochureBtmRightImgContent{width:200px; overflow:hidden; border:1px solid #969696; padding:5px;}


/*===========ISO================*/
#iso{ position:relative; background:#1baadd;}
#iso:after{ position:absolute; top:0; right:0; background:#fff; width:50%; height:100%; content:"";z-index:1; }

.isoHeading{width:890px; height:232px; padding:18px;  float:right; background:#23b6ea;display: flex; margin-top:14em;}
.isoHeading .visualzeIcon{ width:198px; height:198px; display: flex;align-items: center;}
.isoHeading .visualzeIcon img{margin-left: 25px; height: 145px;}
.isoHeading h3{ font-family: 'Roboto Slab', serif; font-weight:300; margin:0; padding:0; color:#fff;margin-left: 20px;margin-top: 20px;font-size:63px;}
.isoHeading h3 span{ display:block; font-weight:100;}

.isoImg .brochureleftImgContent{width:215px; overflow:hidden; border:1px solid #969696; padding:5px;}
.isoImg .brochureRightImgContent{width:425px; overflow:hidden; border:1px solid #969696; padding:5px;}
.isoImg .brochureBtmLeftImgContent{width:430px; overflow:hidden;}
.isoImg .brochureBtmRightImgContent{width:200px; overflow:hidden; border:1px solid #969696; padding:5px;}



/*===========Scale Model================*/
#scaleModel{ position:relative; background:#252525;}
#scaleModel:after{ position:absolute; top:0; right:0; background:#fff; width:50%; height:100%; content:"";z-index:1; }
.scaleHeading{width:890px; height:232px; padding:18px; float:right; background:#2b2929;display: flex; margin-top:14em;}
.scaleHeading .visualzeIcon{ width:198px; height:198px; display: flex;align-items: center;}
.scaleHeading .visualzeIcon img{margin-left: 25px; height: 145px;}
.scaleHeading h3{ font-family: 'Roboto Slab', serif; font-weight:300; margin:0; padding:0; color:#fff;margin-left: 20px;margin-top: 20px;font-size:63px;}
.scaleHeading h3 span{ display:block; font-weight:100;}

.scaleImg .scaleleftImgContent{ width:380px; overflow:hidden;}
.scaleImg .scalerightImgContent{ width:260px; overflow:hidden;}
.scaleImg .scaleBtmImgContent{ width:100%; overflow:hidden;}

/*===========AWARDS================*/
#awards{background-image: linear-gradient(to right, #dfe0e0 , #e3e4e4);}
.awardUtsab{ width:181px; position:absolute; top: -270px; left: 3em;display: block;}
.awardUtsab img{ display:block;}
.awardTxtContainer{width: 160px;position: absolute;left: 190px;bottom: 0;}
.awardTxtContainer .downArrow{ color:#120d0e; font-size:16px; display:block;}
.awardTxtContainer .downArrow:hover{color:#120d0e;}
.awardTxtContainer .awardTextContent{font-family: 'Muli', sans-serif; font-size:10px; line-height:15px; color:#252525;}

.awardtasi{ width:187px; position:absolute; top: -270px; left: 20em;display: block;}
.awardTxtContainer.tasiCont{left: 200px;}

.awardprestige{ width:184px; position:absolute; top: 26px; left: 20em;display: block;}
.awardTxtContainer.prestigeCont{left: 195px;}

.awardgovernnance{ width:206px; position:absolute; top: -270px; left: 0;display: block;}
.awardTxtContainer.governenceCont{left: 220px;}

.awardprsi{ width:166px; position:absolute; top: -280px; left:20em;display: block;}
.awardTxtContainer.prsiCont{left: 180px;}

.awardcli{ width:161px; position:absolute; top: 10px; left:20em;display: block;}
.awardTxtContainer.cliCont{left: 174px;}

.awardflim{ width:209px; position:absolute; top: 95px; left:0;display: block;}
.awardTxtContainer.flimCont{left: 220px; width:370px;}

.awardContainer{ width:600px; bottom:0.3em; left:1em;color: #252525;text-transform: uppercase;font-family: 'Roboto Slab', serif;font-size: 40px;line-height: 40px; font-weight:700;position: absolute;}
.awardContainer span{ display:block; font-weight:400;}
.awardFooter{ background:#252525; width:100%; padding:2px 10px;font-family: 'harabarabold'; font-size:18px; color:#c7c7c7; line-height:18px; margin-top:10px; text-transform:none; letter-spacing:2px;}

#fixImageSection{background-attachment: fixed;background-image: url(../images/b2.jpg);}

/*===========Footer================*/
#footerSliderSection{/*background:url(../images/Client.jpg) no-repeat bottom center; background-attachment:fixed;*/ background:#c7c8ca;}
.footerbottmContainer{ height:67px; width:100%; background:#1baadd; position:absolute; bottom:0;}
.footerSliderMainContainer{ width:100%; background:#252525; padding:230px 0 0; position:absolute; bottom:67px;}
.footerSliderMainContainer .container-fluid{ position:relative;}
.footerHeadingContainer{ width:770px; padding:36px 80px; background:#1baadd; text-align:center; color:#fff; border-radius:20px; position:absolute; left: 50%; top: -36%;transform: translate(-50%, -100%);}
.footerHeadingContainer h3{font-family: 'Roboto Slab', serif;font-size: 59px;line-height: 59px; margin:0; padding:0; font-weight:300; margin-bottom:10px;}
.footerHeadingContainer p{font-family: 'Roboto Slab', serif;font-size: 18px;line-height: 22px; margin:0; padding:0;font-weight:300}

.footerSliderContainer{ width:100%;height: 400px; position:relative;}
.footerSliderContainer ul{ list-style:none; margin:0; padding:0;}
.footerSliderContainer li{text-align:center;}
.footerSliderContainer li a{ display:block; text-decoration:none;}
.footerSliderContainer li .iconCont{  border-radius:50%; overflow:hidden; display:inline-block; text-align:center;}
/*.footerSliderContainer li .iconCont img{margin-top: 34px; margin-left:32px;}*/
.footerSliderContainer li .icontext{ width:100%; color:#1baadd;font-family: 'Roboto Slab', serif;font-size: 28px;line-height: 32px; font-weight:400; text-align:center; margin-top:20px;}
.footerSliderContainer li .icontext span{ display:block;}

/*=======================Down Arrow=====================*/
.scrollDown{ position:absolute; bottom:10px; left:50%; transform:translateX(-50%);width: 60px;
  height: 60px;}
.scrollDown {
	display: block;
	width: 24px;
	height: 50px;z-index: 99;
}
.m_scroll_arrows
{
  display: block;
  width: 5px;
  height: 5px;
  -ms-transform: rotate(45deg); /* IE 9 */
  -webkit-transform: rotate(45deg); /* Chrome, Safari, Opera */
  transform: rotate(45deg);
   
  border-right: 2px solid white;
  border-bottom: 2px solid white;
  margin: 0 0 3px 4px;
  
  width: 16px;
  height: 16px;
}


.unu
{
  margin-top: 1px;
}

.unu, .doi, .trei
{
    -webkit-animation: mouse-scroll 1s infinite;
    -moz-animation: mouse-scroll 1s infinite;
}

.unu
{
  -webkit-animation-delay: .1s;
  -moz-animation-delay: .1s;
  -webkit-animation-direction: alternate;
}

.doi
{
  -webkit-animation-delay: .2s;
  -moz-animation-delay: .2s;
  -webkit-animation-direction: alternate;
  margin-top: -6px;
}

.trei
{
  -webkit-animation-delay: .3s;
  -moz-animation-delay: .3s;
  -webkit-animation-direction: alternate;
  margin-top: -6px;
}




.mouse
{
height: 42px;
width: 24px;
  border-radius: 14px;
  transform: none;
  border: 2px solid #0285bf;
  top: 170px;
}

.wheel
{
  height: 5px;
  width: 2px;
  display: block;
  margin: 5px auto;
  background: white;
  position: relative;
  
  height: 4px;
  width: 4px;
  border: 2px solid #fff;
  -webkit-border-radius: 8px;
          border-radius: 8px;
  

}

.wheel
{
  -webkit-animation: mouse-wheel 0.6s linear infinite;
  -moz-animation: mouse-wheel 0.6s linear infinite;
}



@-webkit-keyframes mouse-wheel
{
   0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(6px);
    -ms-transform: translateY(6px);
    transform: translateY(6px);
  }
}

@-moz-keyframes mouse-wheel
{
  0% { top: 1px; }
  25% { top: 2px; }
  50% { top: 3px;}
  75% { top: 2px;}
  100% { top: 1px;}
}

@-webkit-keyframes mouse-scroll {

  0%   { opacity: 0;}
  50%  { opacity: .5;}
  100% { opacity: 1;}
}
@-moz-keyframes mouse-scroll {

  0%   { opacity: 0; }
  50%  { opacity: .5; }
  100% { opacity: 1; }
}
@-o-keyframes mouse-scroll {

  0%   { opacity: 0; }
  50%  { opacity: .5; }
  100% { opacity: 1; }
}
@keyframes mouse-scroll {

  0%   { opacity: 0; }
  50%  { opacity: .5; }
  100% { opacity: 1; }
}
/*===========================23-11-2018======================*/
.communicationRspnsv{ display:none;}
.awardResponsive{ display:none;}

.slick-prev, .slick-next{    font-size: 0;
    line-height: 0;
    position: absolute;
    top: 50%;
    display: block;
    width: 20px;
    height: 20px;
    padding: 0;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    cursor: pointer;
    color: transparent;
    border: none;
    outline: none;
    background: transparent;}
.slick-next {
    right: -25px;
}
.slick-prev {
    left: -25px;
}
/*========================HomePage Change======================*/
.homepagetopRightText {  width: 960px;top:85px;left: 85px;position: absolute;color: #252525; text-transform: uppercase;
    font-family: 'Roboto Slab', serif;font-size: 77px;line-height: 77px; text-align:left;}
.homepagetopRightText .weare{ font-weight:300;}
.homepagetopRightText .weare strong{ font-weight:400;}	
.homepagetopRightText .modernDesign{font-weight:100;}	
.homepagetopRightText .withFresh{font-weight:300;}
.homepagetopRightText .withFresh span{font-weight:400;}
.homepagetopRightText .withFresh strong{font-weight:700;}
.mayabioushomeFTxt {  background: #252525; padding: 15px 35px; font-family: 'harabarabold'; text-align:center;
    float: left; font-size:40px; color: #c7c7c7; line-height: 16px; margin-top: 33px; text-transform: none; letter-spacing:10px;}
.scndPgeBigScreen{ display:block;}
.scndPgesmlScreen{ display:none;}


.modal-dialog {
    max-width: 100% !important;
    margin: 0 auto;}
#mouseLeavepopup .modal-content{background-color: inherit !important;border: none !important;border-radius:none !important;}
#mouseLeavepopup .modal-body{flex: 0;padding: 0;}
#mouseLeavepopup.modal.show .modal-dialog{transform: translate(0,-94%);top: 100%;}
/*#mouseLeavepopup.modal{overflow-y: hidden !important;padding-left: 0 !important; top: inherit !important;}*/
.footerSliderMainContainer.popupslider{ position:relative;}
.footerbottmContainer.popupbottomslider{position:relative;bottom: 67px;}
#mouseLeavepopup .modal-header{position: relative;z-index: 9;border-bottom: none;}
#mouseLeavepopup .modal-header .close{color: #fff;}
/*====================26-11-18====================*/
/*.visuResponsive{ width:100%; display:none;}
.virtualResponsive{ width:100%; display:none;}
.webResponsive{ width:100%; display:none;}
.audioResponsive{ width:100%; display:none;}
.brochureResponsive{ width:100%; display:none;}
.scaleResponsive{ width:100%; display:none;}*/
/*====================slider Button Animation====================*/
.slick-slider svg {
  width: 20px; height: auto; cursor: pointer; overflow: visible;
}
.slick-slider svg polygon, .slick-slider svg path {
  transition: all 0.5s cubic-bezier(0.2, 1, 0.3, 1);fill: #fff;
}
.slick-slider svg:hover polygon, .slick-slider svg:hover path {
  transition: all 1s cubic-bezier(0.2, 1, 0.3, 1);
  fill: #1baadd;
}
.slick-prev:hover svg .arrow {
  animation: arrow-anim 2.5s cubic-bezier(0.2, 1, 0.3, 1) infinite;fill: #1baadd;
}
.slick-prev:hover svg .arrow-fixed {
  animation: arrow-fixed-anim 2.5s cubic-bezier(0.2, 1, 0.3, 1) infinite;fill: #1baadd;
}
.slick-next:hover svg .arrow {
  animation: arrow-anim 2.5s cubic-bezier(0.2, 1, 0.3, 1) infinite;fill: #1baadd;
}
.slick-next:hover svg .arrow-fixed {
  animation: arrow-fixed-anim 2.5s cubic-bezier(0.2, 1, 0.3, 1) infinite;fill: #1baadd;
}
.slick-prev:hover svg polygon, .slick-prev:hover svg path {fill: #1baadd;}
.slick-next:hover svg polygon, .slick-next:hover svg path {fill: #1baadd;}

@keyframes arrow-anim {
  0% {
    opacity: 1;
    transform: translateX(0);
  }
  5% {
    transform: translateX(-0.1rem);
  }
  100% {
    transform: translateX(1rem);
    opacity: 0;
  }
}
@keyframes arrow-fixed-anim {
  5% {
    opacity: 0;
  }
  20% {
    opacity: 0.4;
  }
  100% {
    opacity: 1;
  }
}

#section2 .fp-tableCell,#virtualReality .fp-tableCell,#websiteContainer .fp-tableCell,#Audiovisual .fp-tableCell,#brochure .fp-tableCell,#iso .fp-tableCell,#scaleModel .fp-tableCell {
     vertical-align: top;
}
/*====================30-11-2018=========================*/
.arrowRightContainer{ position:absolute; bottom:35px; right:30px; width:190px; text-align:center;z-index: 99;}
.arrowRightContainer ul {list-style:none;display: inline-block; margin:0; padding:0;}
.arrowRightContainer ul li{display: flex;justify-content: center;}
.arrowRightContainer ul li a{width: 30px;height: 20px;display: block;text-align: center;}
/* arrow common style */
.arrowRightContainer .arrow {
  display: inline-block;
  width: 15px; transition:0.4s ease all;
  height: 15px;
  border-top: 3px solid #00a2ea;
  border-right: 3px solid #00a2ea;
}

.arrowRightContainer .arrow-top {
  transform: rotate(-45deg);
}
.arrowRightContainer .arrow-bottom {
  transform: rotate(135deg);
}

.pageNameCont{ width:100%; color:#fff; padding:0; text-align:center; font-size:25px;line-height: 26px;}
/*==================Footer Update=======================*/
#footerSliderSection .fp-tableCell{vertical-align: top;}
.footerbottmBlackContainer{    height: 67px; width: 100%; background: #1baadd; position: absolute;bottom: 0;}
.footerSliderMainCont{width: 100%; padding: 60px 0 80px;}
.footerTitleContainer{ width: 770px;   padding: 36px 80px; background: #1baadd; text-align: center;color: #fff;border-radius: 20px;position: absolute; left: 50%;top: 15%;transform: translate(-50%, -100%); display:block;}
.footerTitleContainer h3{font-family: 'Roboto Slab', serif; font-size: 59px; line-height: 59px; margin: 0; padding: 0; font-weight: 300; margin-bottom: 10px; color:#fff; text-decoration:none;}
.footerTitleContainer p{font-family: 'Roboto Slab', serif; font-size: 18px; line-height: 22px;margin: 0; padding: 0;font-weight: 300; color:#fff; text-decoration:none;}
.footerTitleContainer:hover{ text-decoration:none;}
.footerSlidercontent {  width: 100%; position: absolute; bottom: 67px; background:#eaeaea;padding:250px 0 130px;}
.iconSlickCont{text-align: center; width: 100%; padding:0;height: 130px; margin: 0 auto;border-radius: 5px;    position: relative;}
.footerSlidercontent .slick-slide img{max-width: 250px; border-radius: 0; display: inline-block; position: absolute;
    bottom: 20px; left: 50%;transform: translateX(-50%);filter: grayscale(100%); transition: 0.5s ease all;}
    .footerSlidercontent .slick-slide img:hover{filter: grayscale(0);}
.footerSlidercontent .icontext{ color:#252525; text-align:center; width:100%; font-weight: 300; font-size: 13px;line-height: 15px; padding:10px 0;border-top: 1px solid #1baadd;border-bottom: 1px solid #1baadd;}
.footerSlidercontent .icontext h4{ font-size: 13px;line-height: 20px;color: #252525;font-weight: 700;margin: 0;    text-transform: uppercase;}
.footerSlidercontent .icontext h5{ font-size:12px; line-height:15px; color:#b3b3b3; font-weight:300;margin-top: 1px;margin-bottom: 3px;}
.footerSlidercontent .icontext p{  color:#252525; font-size:13px; font-weight:300; margin:0; padding:0; font-style:italic;}

.footerSlidercontent li{ cursor:pointer;  transition:0.4s ease all;    padding: 0 45px;  }
.footerSlidercontent li:hover{  transform: scale(1.03);}
.footerSlidercontent li a:hover{ text-decoration:none;}

.footerSlidercontent .slick-prev { left: 15px;top: 50%;}
.footerSlidercontent .slick-next { right: 15px;top: 50%;}
.footerSlidercontent .slick-slider svg polygon, .footerSlidercontent .slick-slider svg path {
  transition: all 0.5s cubic-bezier(0.2, 1, 0.3, 1);fill: #1baadd;
}
/*.footerSlidercontent .slick-slide{margin-right: 10px;margin-left: 10px;}*/
.footerSlidercontent .slick-slider{padding: 0 20px;}
.footerSlidercontent .slick-list{ overflow: inherit;}

/*==================arrow Animation=======================*/
.arrow-top {
  animation: arrowUp 1s ease-in-out infinite; position:relative;
}
@keyframes arrowUp {
  0%,
  100% {
    top: 0;
  }

  50% {
    top: 5px;
  }
}
.arrow-bottom{
  animation: arrowbottom 1s ease-in-out infinite; position:relative;
}
@keyframes arrowbottom {
  0%,
  100% {
    bottom: 0;
  }

  50% {
    bottom: 5px;
  }
}
/*==================01-12-2018=======================*/
.arrowRightContainer .homeArrow{ border-color:#fff !important;}
.clientLogoPop .modal-dialog{ max-width: 500px !important;}
.clientLogoPop .clientPopImgCont{width: 100%;background: #eaeaea;text-align: center;height: 180px;display: table;position: relative;top: -30px;}
.clientLogoPop .clientPopImgCont .middleImg{ display:table-cell; vertical-align:middle;}
.clientLogoPop .clientPopdesCont{ width:100%; margin-top:10px;margin-top: -15px;}
.clientPopdesCont h3{font-family: 'Roboto Slab', serif;font-size: 20px;line-height: 20px; color:#1baadd; text-transform:uppercase;}
.clientPopdesCont h4{font-size: 15px;line-height: 20px;color: #252525;font-weight: 300; margin:0 0 8px; padding:0;}
.clientPopdesCont p{ color:#898989; font-size:13px; font-weight:300; margin:0; padding:0;}

.clientLogoPop .close{font-size: 30px; top: -19px; position: relative; right: -13px;z-index: 9;}

.fp-responsive #section0,
.fp-responsive #section1,.fp-responsive #section2,.fp-responsive #virtualReality,.fp-responsive #websiteContainer,
.fp-responsive #Audiovisual,.fp-responsive #brochure,.fp-responsive #iso,.fp-responsive #scaleModel,.fp-responsive #awards {
    height: auto !important;
}

.desktopVersion{ width:100%;display:block;}
.mobileVersion{ display:none; width:100%;}
/*===============07-12-2018==================*/
.iconFadeInOut {
    -webkit-animation: iconAfadeinout 4s linear infinite;
    animation: iconAfadeinout 4s linear infinite;
}

@-webkit-keyframes iconAfadeinout {
  0% { opacity: 0; }
  50% { opacity: 1; }
  100% { opacity: 0; }
}
@keyframes iconAfadeinout {
  0% { opacity: 0; }
  50% { opacity: 1; }
  100% { opacity: 0; }
}


/*===============Popup==================*/
.modal-open .modal{top: inherit !important;overflow: hidden !important;padding-left: 0 !important;padding-right: 0 !important;height: 100%;}
/*===============Pre Loader==================*/
#preloader {
  position: fixed;
  top: 0;height: 100%;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #fff;
  /* change if the mask should have another color then white */
  z-index: 9999999;
  /* makes sure it stays on top */
}

#status {
  width: 300px;
  height: 300px;
  position: absolute;
  left: 50%;
  /* centers the loading animation horizontally one the screen */
  top: 50%;
  /* centers the loading animation vertically one the screen */
  /* path to your loading animation */
  background-repeat: no-repeat;transform: translate(-50%,-50%);
  background-position: center;
  /* is width and height divided by two */
}
#status svg{ width: 300px;}
/*===========================28-12-2018========================*/
#section1 .homeSecndPage{padding-right: 0;padding-left: 0; display:block;}
.homeSecndPage img{ width:100%;}

.footerLefttopText {  width: 1400px;top:85px;left: 85px;position: absolute;color: #252525;font-family: 'Roboto Slab', serif;font-size: 77px;line-height: 77px; text-align:left;font-weight:300;}
.footerLefttopText .weare{ font-weight:300;}
.footerLefttopText .weare strong{ font-weight:400;}	
.footerLefttopText .modernDesign{font-weight:100;}	
.footerLefttopText .withFresh{font-weight:300;}
.footerLefttopText .withFresh span{font-weight:400;}
.footerLefttopText .withFresh strong{font-weight:700;}

.footerLefttopText p{ margin:0; padding:0;}

/*===========================13-03-2019========================*/
.homepagetopmenuCont {  width:auto;top:85px;right: 85px;position: absolute;color: #252525; text-transform: uppercase;
    font-family: 'Roboto Slab', serif;font-size: 77px;line-height: 77px; text-align:right;}
.rightMenuCont{ width:30px; height:20px; position:relative;z-index: 99999;display: inline-block;}
.rightMenucontactCont{ width:100%;}

.contactIcon{ color:#252525;position: relative;z-index: 99;text-decoration:none; border-radius:20px 0 0 20px;display: flex; align-items: center;width: 40px; transition:0.5s ease all; overflow:hidden;padding-left: 5px; height:50px; line-height:50px;}
.contactIcon:hover{ color:#252525;text-decoration:none;background: linear-gradient(to right, #b9b9b9,#c7c8ca);padding: 0 30px;width: 280px;}

.contactNumberSlide { display: none;color: #252525; position: relative; font-size: 22px;transition:1s ease all;height: 50px;overflow: hidden;}
.contactIcon:hover .contactNumberSlide{ display:block;}

.contactIcon img{ display:inline-block; margin-right:6px;}
.contactIcon:hover img{ display:inline-block; margin-right:20px;}

/*===========================nav========================*/
.menu-container {
 z-index: 9999;position: fixed;display: flex;align-items: stretch;overflow: hidden;height: 100vh;width: 100%;pointer-events: none;top: 0;left: 0;}

.homePagemenu {
  display: flex;justify-content: center; align-items: center; position: absolute; height: 100vh; width: 100vw; z-index: 3; top: 0; left: 0;
  right: 0; bottom: 0; -webkit-transform: translateY(-100%);
          transform: translateY(-100%); transition: -webkit-transform 0.5s;transition: transform 0.5s;transition: transform 0.5s, webkit-transform 0.5s; transition-delay: 0.5s; visibility: hidden;}
.homePagemenu ul{ list-style:none; margin:0; padding:0;}
.homePagemenu ul li {color: white;font-size: 20px;font-weight: 300; text-align: center;}
.homePagemenu ul li.ma-label{ margin-bottom:10px;}
.homePagemenu ul li a {cursor: pointer; color: rgba(255,255,255,.7); display: inline-block;font-size: 18px;font-weight: 300;  padding: 8px 10px;}

.menu-sliders { flex: 1; display: flex; justify-content: center; align-items: center; transition: flex 0.45s;}
.menu-sliders:nth-child(2) {
  flex: 1 0 100%; background: transparent;
}
.menu-sliders:nth-child(odd) { background: rgba(2,23,37,.96);}

.plus-btn-pos { position: absolute; top: 20px; right: 20px; z-index: 5;}

/*.plus-btn { width: 40px;height: 40px;border-radius: 40px; background: #ececec; position: relative; box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12); cursor: pointer;}
.plus-btn div {
  position: absolute; top: 50%; left: 50%; width: 16px; height: 3px; background: #252525; transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
  transition-delay: 0.5s;
}
.plus-btn .r1 {
  -webkit-transform: translateX(-50%) translateY(-50%) rotate(-90deg);
          transform: translateX(-50%) translateY(-50%) rotate(-90deg);
}
.plus-btn .r2 {
  -webkit-transform: translateX(-50%) translateY(-50%) rotate(-180deg);
          transform: translateX(-50%) translateY(-50%) rotate(-180deg);
}
.plus-btn:hover { background: #1baadd;}
.plus-btn:hover div { background: white;}
.plus-btn:active { box-shadow: none;}*/


.menu-toggle {
  position: relative; cursor:pointer; display: block;width: 20px; height: 15px; background: transparent; border-top: 2px solid; border-bottom: 2px solid; color: #009edf; font-size: 0; transition: all 0.25s ease-in-out;}
.menu-toggle:before, .menu-toggle:after {
  content: ''; display: block; width: 100%; height: 2px; position: absolute; top: 50%; left: 50%; background: currentColor; -webkit-transform: translate(-50%, -50%);     transform: translate(-50%, -50%);
  transition: -webkit-transform 0.25s ease-in-out;
  transition: transform 0.25s ease-in-out;
  transition: transform 0.25s ease-in-out, -webkit-transform 0.25s ease-in-out;
}
.menu-toggle:hover { color: #009edf;}
.menu-toggle.is-active { border-color: transparent;}
.menu-toggle.is-active:before {
  -webkit-transform: translate(-50%, -50%) rotate(45deg);
          transform: translate(-50%, -50%) rotate(45deg);
}
.menu-toggle.is-active:after {
  -webkit-transform: translate(-50%, -50%) rotate(-45deg);
          transform: translate(-50%, -50%) rotate(-45deg);
}














body.menu-open .menu-sliders:nth-child(2) { flex: 0 0 0%;}
body.menu-open .homePagemenu {
  -webkit-transform: translateY(0%);
          transform: translateY(0%);
  visibility: visible;
  pointer-events: all;
}
body.menu-open .plus-btn .r1 {
  -webkit-transform: translateX(-50%) translateY(-50%) rotate(-45deg);
          transform: translateX(-50%) translateY(-50%) rotate(-45deg);
}
body.menu-open .plus-btn .r2 {
  -webkit-transform: translateX(-50%) translateY(-50%) rotate(-135deg);
          transform: translateX(-50%) translateY(-50%) rotate(-135deg);
}
.ma-social{display: inline-block; margin: 0 .4em;}
.ma-social a {width: 44px;height: 44px;	padding: 0;	background-image: url(../images/ma-socials.svg);background-repeat: no-repeat;
overflow: hidden;text-indent: 100%;white-space: nowrap}
.homePagemenu .ma-facebook a {background-position: 0 0}
.homePagemenu .ma-instagram a {	background-position: -44px 0}
.homePagemenu .ma-dribbble a {background-position: -88px 0}
.homePagemenu .ma-twitter a {background-position: -132px 0}
.homePagemenu .ma-linkedin a {background-position: -184px 0;}
.homePagemenu .ma-pinterest a {background-position: -230px 0}
.homePagemenu.is-visible {-webkit-transform: translateY(0);-ms-transform: translateY(0);transform: translateY(0)}

.footerbottmBlackContainer .siteMapCont{ list-style:none; margin:0; padding:14px 48px;width: auto;float: left;}
.footerbottmBlackContainer li{ display:inline-block;}
.footerbottmBlackContainer li a{ color:#fff; display:block;font-family: 'Roboto Slab', serif;font-weight: 700;text-transform: uppercase; transition:0.3s ease all;}
.footerbottmBlackContainer li a:hover{text-decoration:none;}

/*===========================Site Map========================*/



/*=======================ERROR 404 PAGE==================*/

.thankyou{ width:90%; margin:60px auto; text-align:center;}
.thankyou h2{ font-size: 90px;
  font-weight: 200;
  margin: 0px;
  color:#009edf;
  -webkit-background-clip: text;
  background-clip: text;
  text-transform: uppercase;}

  
.thankyou p {
  font-size: 16px;
  font-weight: 200;
  margin-top: 0px;
  margin-bottom: 25px;
} 

.thankyou a {
  color: #009edf;
  font-weight: 200;
  text-decoration: none;
  border-bottom: 1px dashed #009edf;
  border-radius: 2px; margin-top:25px;
}

.thankyou a:hover {
  color: #0372a0;
  font-weight: 200;
  text-decoration: none;
  border-bottom: 1px dashed #0372a0;
  border-radius: 2px;
}



.error{ width:90%; margin:30px auto; text-align:center;}
.error h2{ font-size: 186px;
  font-weight: 200;
  margin: 0px;
  color:#009edf;
  -webkit-background-clip: text;
  background-clip: text;
  text-transform: uppercase;}

.error h3{font-size: 33px;
  font-weight: 200;
  text-transform: uppercase;
  margin-top: 0px;
  margin-bottom: 20px;
  letter-spacing: 2px;}  
  
.error p {
  font-size: 16px;
  font-weight: 200;
  margin-top: 0px;
  margin-bottom: 25px;
} 

.error a {
  color: #009edf;
  font-weight: 200;
  text-decoration: none;
  border-bottom: 1px dashed #009edf;
  border-radius: 2px;
}

.error a:hover {
  color: #0372a0;
  font-weight: 200;
  text-decoration: none;
  border-bottom: 1px dashed #0372a0;
  border-radius: 2px;
}

.error-social{
        margin-top: 20px;
}
.error-social a {
  display: inline-block;
  height: 40px;
  line-height: 40px;
  width: 40px;
  font-size: 14px;
  color: #009edf;
  border: 1px solid #efefef;
  border-radius: 50%;
  margin: 3px;
  -webkit-transition: 0.2s all;
  transition: 0.2s all;
  padding-top: 8px;
    font-size: 20px;
}
.error-social>a:hover {
  color: #fff;
  background-color: #009edf;
  border-color: #009edf; border-radius: 50%;
} 



@media only screen and (max-width: 480px) {
  .error h2{ font-size:120px;}
  .error h3{ font-size:20px;}
}
/*================23-04-2019=================*/
.rightblogContainer{width: 40px;float: right;}
.rightblogContainer .blogSecIcon{display: block; position: relative; top: -39px; right: 40px; width: 70px; height: 50px;}


.rightblogContainer-5{width: 40px;float: right;}
.rightblogContainer-5 .blogSecIcon-5{
display: block;
position: relative;
top: 14px;
right: 150px;
width: 220px;
font-size: 14px;
color: #000;
}

.rightblogContainer-5 .blogSecIcon-5:hover{ color: #1baadd; text-decoration: none; }

.footerLink{width: auto;display: inline-block;margin: 0;padding: 0;position: relative;transform: translateX(-50%);left: 44%;margin-top: 15px;}
.footerLink li{ display:block; float:left; border-right:1px solid #fff;}
.footerLink li:last-child{border-right:0;}
.footerLink li a{color: #fff;display: block;font-family: 'Roboto Slab', serif;font-weight: 300;padding: 0 8px;text-transform: capitalize;font-size: 12px;}
.footerLink li a:hover{color: #252525;text-decoration: none;}


.mob-slider{ display: none; }
.desk-slide{}
.desk-slide a{ float: left; width: 12.5%; }
.desk-slide a:hover{ text-decoration: none; }
.desk-slide a img{ display: block; text-align: center; margin: 0 auto; }
.desk-slide .icontext{ margin-top: 10px; color:#1baadd; font-family: 'Roboto Slab', serif; text-align:center; font-size: 16px; line-height: 20px; font-weight: 400; }
.desk-slide .icontext span{ display: block; }
/*hand animation*/

.iconCont{ position:relative;}
.animation_icon{ position:absolute; bottom:10px; right:30px; color:#fff; font-size:18px;}

.handanimi {
    -webkit-animation: mover 1s infinite  alternate;
    animation: mover 1s infinite  alternate;
}
.handanimi {
    -webkit-animation: mover 1s infinite  alternate;
    animation: mover 1s infinite  alternate;
}
@-webkit-keyframes mover {
    0% { transform: translateY(0); }
    100% { transform: translateY(-10px); }
}
@keyframes mover {
    0% { transform: translateY(0); }
    100% { transform: translateY(-10px); }
}






/*=========================13-02-2019===================*/
.artLogoContainer{width: 112px;margin: 0 auto;overflow: hidden;padding: 10px 0 0; display:flex;}
.artLogoContainer img{ width:75px;}

.artArrowContainer{ width:100%; position:relative;display: flex;align-items: flex-end;justify-content: flex-end;font-size: 25px; color:#676767; cursor:pointer;}
.artArrowContainer:before{ width:1px; height:100%; position:absolute; background:#373435; left:3px; bottom:0; content:""; height:26px;}
/*.artArrowContainer:after{ width:25%; height:1px; position:absolute; background:#373435; left:20px; top:50%; content:"";}*/
.artArrowContainer i{ position:relative; z-index:-1;}
@media only screen and (max-width:767px) {
.artLogoContainer { width: 60px;padding: 7px 0 0;}
.artLogoContainer img{width: auto;height: 32px;}
.artArrowContainer{font-size: 16px;}
.artArrowContainer::before{ height:15px;}
.artLogoContainer .dropdown-content{top: 50px;}
.artLogoContainer .dropdown-content li a{font-size: 12px;}
}







.ma-header {

	background: #fff;

	border-bottom: 1px solid #ddd;

	height: 50px;

	width: 100%;

	z-index: 99;

	-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.3);

	box-shadow: 0 1px 2px rgba(0,0,0,.3);

	-moz-osx-font-smoothing: grayscale

}

@media only screen and (min-width:768px) {

.ma-header {

	height: 80px;

	/*background: 0 0;*/

	-webkit-box-shadow: none;

	box-shadow: none

}

}

@media only screen and (min-width:1170px) {

.ma-header {

	-webkit-transition: background-color .3s;

	-o-transition: background-color .3s;

	transition: background-color .3s;

	-webkit-transform: translate3d(0, 0, 0);

	-ms-transform: translate3d(0, 0, 0);

	transform: translate3d(0, 0, 0);

	-webkit-backface-visibility: hidden;

	backface-visibility: hidden

}

.ma-header.is-fixed {

	position: fixed;

	top: -80px;

	background-color: rgba(255,255,255,1);

	-webkit-transition: -webkit-transform .3s;

	-o-transition: transform .3s;

	transition: transform .3s;

	transition: transform .3s, -webkit-transform .3s

}

.ma-header.is-visible {

	-webkit-transform: translate3d(0, 100%, 0);

	-ms-transform: translate3d(0, 100%, 0);

	transform: translate3d(0, 100%, 0)

}

.ma-header.menu-is-open {

	background-color: #fff

}

}

.ma-header .ma-logo {

	display: block;

	height: 50px;

	padding: 4px 0;

	position: absolute;

	top: 50%;

	bottom: auto;

	-webkit-transform: translate(0, -50%);

	-ms-transform: translate(0, -50%);

	transform: translate(0, -50%);

	left: 20px;

	max-width: 270px

}

.ma-header .ma-logo a {

	text-decoration: none

}

.ma-header .ma-logo img {

	display: block;

	height: 90%;

	width: auto;

	margin: 0 auto

}

.ma-header .text {

	display: block;

	font-size: 15px;

	position: absolute;

	top: 48%;

	left: 50%;

	-webkit-transform: translate(-50%, -50%);

	-ms-transform: translate(-50%, -50%);

	transform: translate(-50%, -50%);

	color: #009edf;

	font-weight: 400

}

.ma-header .text:hover{ text-decoration:none;}

.ma-header .text img{ max-height: 65px;}

.ma-intro {

	position: relative;

	height: 50px;

	background: #fff;

	background-size: cover;

	z-index: 1;

	-moz-osx-font-smoothing: grayscale

}

@media only screen and (min-width:768px) {

.ma-header .ma-logo {

	height: 80px

}

.ma-header .ma-logo p, .ma-header .text {

	display: block

}

.ma-intro {

	position: relative;

	height: 110px

}

}

@media only screen and (max-width:767px) {

	.ma-header .text{  display: block; width: 60px;}

	.ma-header .text img{ width:100%;}

	.tenyearsContainer { width: 60px; height: 50px;}	

}





.ma-secondary-nav {

	position: absolute;

	top: 47%;

	bottom: auto;

	-webkit-transform: translateY(-50%);

	-ms-transform: translateY(-50%);

	transform: translateY(-50%);

	right: 60px

}

.ma-secondary-nav li {

	display: inline-block;

	padding: 0 7px 0 0;

	border-right: 1px solid #ccc

}

.ma-secondary-nav li:last-child {

	border-right: 0

}

.ma-secondary-nav a {

	display: block;

	color: #666;

	width: 30px;

	height: 30px;

	border-radius: 5px

}

/*.ma-secondary-nav a:hover {

	background: #d9f4ff

}*/

.ma-secondary-nav a img {

	width: 100%;

	height: 100%;filter: grayscale(100%);

	padding: 5px

}

@media only screen and (min-width:768px) {

.ma-secondary-nav a {

	width: 35px;

	height: 35px

}

}

.ma-primary-nav-trigger {

	position: absolute;

	right: 0;

	top: 0;

	height: 100%;

	width: 50px;

	background-color: #fff

}

.ma-primary-nav-trigger .ma-menu-text {

	color: #009edf;

	text-transform: uppercase;

	display: none

}

.ma-primary-nav-trigger .ma-menu-icon {

	display: inline-block;

	position: absolute;

	left: 50%;

	top: 50%;

	bottom: auto;

	right: auto;

	-webkit-transform: translateX(-50%) translateY(-50%);

	-ms-transform: translateX(-50%) translateY(-50%);

	transform: translateX(-50%) translateY(-50%);

	width: 18px;

	height: 2px;

	background-color: #009edf;

	-webkit-transition: background-color .3s;

	-o-transition: background-color .3s;

	transition: background-color .3s

}

.ma-primary-nav-trigger .ma-menu-icon::before, .ma-primary-nav-trigger .ma-menu-icon:after {

	content: '';

	width: 100%;

	height: 100%;

	position: absolute;

	background-color: #009edf;

	right: 0;

	-webkit-transition: -webkit-transform .3s, top .3s, background-color 0;

	-webkit-transition: top .3s, background-color 0, -webkit-transform .3s;

	-o-transition: transform .3s, top .3s, background-color 0;

	transition: transform .3s, top .3s, background-color 0;

	transition: transform .3s, top .3s, background-color 0, -webkit-transform .3s

}

.ma-primary-nav-trigger .ma-menu-icon::before {

	top: -5px

}

.ma-primary-nav-trigger .ma-menu-icon::after {

	top: 5px

}

.ma-primary-nav-trigger .ma-menu-icon.is-clicked {

	background-color: rgba(0,0,0,0)

}

.ma-primary-nav-trigger .ma-menu-icon.is-clicked::after, .ma-primary-nav-trigger .ma-menu-icon.is-clicked::before {

	background-color: #009edf

}

.ma-primary-nav-trigger .ma-menu-icon.is-clicked::before {

	top: 0;

	-webkit-transform: rotate(135deg);

	-ms-transform: rotate(135deg);

	transform: rotate(135deg)

}

.ma-primary-nav-trigger .ma-menu-icon.is-clicked::after {

	top: 0;

	-webkit-transform: rotate(225deg);

	-ms-transform: rotate(225deg);

	transform: rotate(225deg)

}

@media only screen and (min-width:768px) {

.ma-primary-nav-trigger {

	background-color: transparent;

	height: 30px;

	line-height: 30px;

	right: 0;

	top: 48%;

	bottom: auto;

	-webkit-transform: translateY(-50%);

	-ms-transform: translateY(-50%);

	transform: translateY(-50%)

}

.ma-primary-nav-trigger .ma-menu-text {

	display: inline-block;

	font-size: 14px

}

.ma-primary-nav-trigger .ma-menu-icon {

	left: auto;

	right: 1em;

	-webkit-transform: translateX(0) translateY(-50%);

	-ms-transform: translateX(0) translateY(-50%);

	transform: translateX(0) translateY(-50%)

}

}

.ma-primary-nav {

	position: fixed;

	left: 0;

	top: 0;

	height: 100%;

	width: 100%;

	background: rgba(2,23,37,.96);

	z-index: 90;

	padding: 50px 0;

	-webkit-backface-visibility: hidden;

	backface-visibility: hidden;

	overflow: auto;

	-webkit-overflow-scrolling: touch;

	-webkit-transform: translateY(-100%);

	-ms-transform: translateY(-100%);

	transform: translateY(-100%);

	-webkit-transition-property: -webkit-transform;

	-o-transition-property: transform;

	transition-property: transform;

	transition-property: transform, -webkit-transform;

	-webkit-transition-duration: .4s;

	-o-transition-duration: .4s;

	transition-duration: .4s

}

.ma-primary-nav li {

	font-size: 18px;

	-moz-osx-font-smoothing: grayscale;

	margin: .2em 0;

	text-transform: capitalize;

	list-style-type: none

}

.clientBox .pic .title, .contactBox .title, .maHeading, .main-timeline .title {

	text-transform: uppercase

}

.ma-primary-nav li a {

	color: rgba(255,255,255,.7);

	display: inline-block;

	padding: 5px 10px;

	border-radius: 0;

	-webkit-transition: all .3s ease-in-out;

	-o-transition: all .3s ease-in-out;

	transition: all .3s ease-in-out

}

.ma-primary-nav li a:hover {

	color: #fff

}

.ma-primary-nav .ma-label {

	color: #fff;

	text-transform: uppercase;

	font-size: 14px;

font-size:.875rem;

	margin: 1.4em 0 1em

}

.ma-primary-nav .ma-social {

	display: inline-block;

	margin: 0 .4em

}

.ma-primary-nav .ma-social a {

	width: 44px;

	height: 44px;

	padding: 0;

	background-image: url(../img/ma-socials.svg);

	background-repeat: no-repeat;

	overflow: hidden;

	text-indent: 100%;

	white-space: nowrap

}

.ma-primary-nav .ma-facebook a {

	background-position: 0 0

}

.ma-primary-nav .ma-instagram a {

	background-position: -44px 0

}

.ma-primary-nav .ma-dribbble a {

	background-position: -88px 0

}

.ma-primary-nav .ma-twitter a {

	background-position: -132px 0

}

.ma-primary-nav.is-visible {

	-webkit-transform: translateY(0);

	-ms-transform: translateY(0);

	transform: translateY(0)

}

@media only screen and (min-width:768px) {

.ma-primary-nav {

	padding: 110px 0 80px

}

}

@media only screen and (min-width:1170px) {

.ma-primary-nav li {

	font-size: 16px

}

.ma-primary-nav .ma-label {

	font-size: 16px;

	font-size: 1rem

}

}

.maFooter {

	background: #fff;

	padding: 20px 15px

}

.maFooter .maLogo img {

	height: 40px;

	opacity: .6;

	-webkit-transition: opacity .3s ease;

	-o-transition: opacity .3s ease;

	transition: opacity .3s ease

}

.maFooter .maLogo:hover img {

	height: 40px;

	opacity: 1

}



.slider {
  display: flex;
  gap: 1em;
  margin-top: 2%;
}
.slider .image {
  flex: 0 0 auto;
  width: 15%;
}
.slider .image img {
  width: 100%;
}

.slick-track {
  display: flex;
  gap: 1em;
}

#gallery .image {
  overflow: hidden;
  position: relative;
}
#gallery .image img {
  cursor: pointer;
  transform: scaleX(1.7);
  transition: 0.5s;
  animation: anim 40s linear infinite;
  filter: grayscale(100%);
}
#gallery .image img:hover {
  filter: grayscale(0);
}
@keyframes anim {
  0% {
    transform: scaleX(1.7);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: scaleX(1.7);
  }
}
#gallery .image .caption {
  font-family: 'Roboto Slab', serif;
  position: absolute;
  /* right: -180%; */
  right: 0;
  top: 4%;
  text-transform: capitalize;
  color: #15bbe4;
  font-size: 44px;
  text-align: right;
  font-weight: bold;
  transition: 0.5s ease;
  line-height: 1.1;
}
/* #gallery .image:hover .caption {
  right: 0;
} */
#gallery .image .right-arrow {
  position: absolute;
  /* left: -100%; */
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  background-color: rgba(21, 187, 228, 0.8745098039);
  height: 100px;
  width: 100px;
  border-radius: 50%;
  box-shadow: 2px 3px 12px rgba(0, 0, 0, 0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.7s;
  opacity: 1;
}
#gallery .image .right-arrow span {
  font-size: 30px;
  color: #ffffff;
  transition: 0.8s;
}
/* #gallery .image:hover .right-arrow {
  opacity: 1;
  left: 50%;
} */
/* #gallery .image:hover .right-arrow span {
  transform: rotate(360deg);
} */

.image_text {
  margin-top: 3%;
  margin-right: 3%;
}

.image_text h4{
  font-family: 'Roboto Slab', serif;
  font-size: 58px;
  text-transform: capitalize;
  font-weight: bold;
  color: #1baadd;
  line-height: 60px;
  text-align: right;
}
.image_text p{
  color: #fff;
  font-size: 24px;
  font-family: 'Muli', sans-serif;
  letter-spacing: 2.5px;
  margin-top: 6px;
  text-align: right;
}


.main-popup {
  position: fixed;
  left: 0;
  top: -1px;
  height: 100vh;
  width: 100%;
  overflow: hidden;
  display: none;
}
.main-popup .popupContainer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6em;
  justify-content: center;
  justify-content: space-between;
  background-color: #252525;
  color: white;
  position: absolute;
  left: 50%;
  top: 200%;
  transform: translate(-50%, -50%);
  height: 70vh;
  overflow-x: hidden;
  overflow-y: hidden;
  width: 50%;
  padding: 2%;
  transition: 0.5s ease;
}
.main-popup .popupContainer .back-button {
  font-size: 25px;
  position: absolute;
  left: 2%;
  top: 2%;
  font-family: "Roboto Slab";
  cursor: pointer;
}
.main-popup .popupContainer .popupContent {
  display: flex;
  align-items: start;
  justify-content: space-between;
  width: 100%;
}
.main-popup .popupContainer .popupContent .left-side-content {
  width: 50%;
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 2em;
  margin-top: 6%;
  overflow: hidden;
  position: relative;
}
.main-popup .popupContainer .popupContent .left-side-content .overlay {
  position: absolute;
  height: 100%;
  width: 100%;
  background-color: #252525;
  bottom: 0;
  left: 0;
  transition: 1s ease;
  transition-delay: 0.4s;
}
.main-popup .popupContainer .popupContent .left-side-content .title {
  font-family: "Roboto", sans-serif;
}
.main-popup .popupContainer .popupContent .left-side-content .title h1 {
  font-size: 80px;
  font-family: "Roboto Slab";
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: lighter;
  line-height: 1;
  margin-bottom: 15px;
}
.main-popup .popupContainer .popupContent .left-side-content .year {
  font-family: "Roboto", sans-serif;
}
.main-popup .popupContainer .popupContent .left-side-content .year h5 {
  font-size: 21px;
  font-weight: 400;
}
.main-popup .popupContainer .popupContent .left-side-content .year .heading {
  color: #15bbe4;
  margin-bottom: 10px;
}
.main-popup .popupContainer .popupContent .left-side-content .year .content {
  font-weight: 400;
}
.main-popup .popupContainer .popupContent .left-side-content .about {
  font-family: "Roboto", sans-serif;
}
.main-popup .popupContainer .popupContent .left-side-content .about h5 {
  font-size: 21px;
  font-weight: 400;
}
.main-popup .popupContainer .popupContent .left-side-content .about .heading {
  color: #15bbe4;
  margin-bottom: 10px;
}
.main-popup .popupContainer .popupContent .left-side-content .role {
  font-family: "Roboto", sans-serif;
}
.main-popup .popupContainer .popupContent .left-side-content .role h5 {
  font-size: 21px;
  font-weight: 400;
}
.main-popup .popupContainer .popupContent .left-side-content .role .heading {
  color: #15bbe4;
  margin-bottom: 10px;
}
.main-popup .popupContainer .popupContent .left-side-content .stack {
  font-family: "Roboto", sans-serif;
}
.main-popup .popupContainer .popupContent .left-side-content .stack h5 {
  font-size: 21px;
  font-weight: 400;
}
.main-popup .popupContainer .popupContent .left-side-content .stack .heading {
  color: #15bbe4;
  margin-bottom: 10px;
}
.main-popup .popupContainer .popupContent .left-side-content .recognization {
  font-family: "Roboto", sans-serif;
}
.main-popup .popupContainer .popupContent .left-side-content .recognization h5 {
  font-size: 21px;
  font-weight: 400;
}
.main-popup .popupContainer .popupContent .left-side-content .recognization .heading {
  color: #15bbe4;
  margin-bottom: 10px;
}
.main-popup .popupContainer .popupContent .left-side-content .visit_button {
  color: #15bbe4;
  font-size: 32px;
  text-transform: capitalize;
  text-decoration: none;
  margin-top: 25px;
  transition: 0.5s;
}
.main-popup .popupContainer .popupContent .left-side-content .visit_button:hover{
  color: #fff;
}

.main-popup .popupContainer .popupContent .right-side-image {
  margin-top: 6%;
  width: 40%;
  overflow: hidden;
  position: relative;
}
.main-popup .popupContainer .popupContent .right-side-image img {
  width: 100%;
  filter: grayscale(100);
  transition: 0.5s ease;
}
.main-popup .popupContainer .popupContent .right-side-image img:hover {
  filter: grayscale(0);
}
.main-popup .popupContainer .popupContent .right-side-image .overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: #252525;
  transition-delay: 0.5s;
  animation: image_overlay 0.5s linear;
  animation-fill-mode: forwards;
  animation-delay: 0.4s;
}
@keyframes image_overlay {
  0% {
    height: 100%;
    width: 100%;
  }
  100% {
    height: 0%;
  }
}
.main-popup .popupContainer .vertical-images {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3em;
  width: 75%;
  position: relative;
}
.main-popup .popupContainer .vertical-images .var-image {
  width: 100%;
}
.main-popup .popupContainer .vertical-images .var-image img {
  width: 100%;
  filter: grayscale(100);
  transition: 0.7s ease;
}
.main-popup .popupContainer .vertical-images .var-image img:hover {
  filter: grayscale(0);
}
.main-popup .popupContainer .vertical-images .bottom-overlay {
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #252525;
  transition: 1s ease;
  transition-delay: 0.6s;
}



/* 
   #gallery .owl-carousel .owl-item.active .image .right-arrow{
       right: 0
    }
    #gallery .owl-carousel .owl-item.active .image .right-arrow{
        left:50%;
        opacity: 1;
    } */






@media (max-width: 1600px) {
  #gallery .image .caption {
    font-size: 44px;
  }
  #gallery .image .right-arrow {
    height: 70px;
    width: 70px;
  }
  #gallery .image .right-arrow span {
    font-size: 20px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .title h1 {
    font-size: 40px;
  }
  .main-popup .popupContainer .back-button {
    font-size: 20px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .year h5 {
    font-size: 17px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .about h5 {
    font-size: 17px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .role h5 {
    font-size: 17px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .stack h5 {
    font-size: 17px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .recognization h5 {
    font-size: 17px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .visit_button {
    font-size: 32px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .year .heading {
    margin-bottom: 0px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .stack .heading {
    margin-bottom: 0px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .recognization .heading {
    margin-bottom: 0px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .role .heading {
    margin-bottom: 0px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .about .heading {
    margin-bottom: 0px;
  }
  .main-popup .popupContainer .popupContent .left-side-content {
    gap: 1em;
  }
}
@media (max-width: 810px) {
  .main-popup .popupContainer .popupContent .left-side-content .visit_button{
    font-size: 24px;
  }
  
  .slider {
    display: flex;
    flex-direction: column;
    padding: 0 3%;
    margin-top: 24vh;
  }
  .slider .image {
    flex: 0 0 auto;
    width: 100%;
  }
  #gallery .image .caption {
    font-size: 18px;
  }
  .main-popup .popupContainer .popupContent {
    flex-direction: column-reverse;
  }
  .main-popup .popupContainer .popupContent .right-side-image {
    width: 100%;
  }
  .main-popup .popupContainer .popupContent .left-side-content {
    width: 100%;
  }
  .main-popup .popupContainer .vertical-images {
    width: 85%;
    gap: 1em;
  }
  .main-popup .popupContainer {
    gap: 3em;
  }
  .main-popup .popupContainer .popupContent .left-side-content .title h1 {
    font-size: 30px;
  }
  .main-popup .popupContainer .popupContent .right-side-image {
    margin-top: 15%;
  }
}/*# sourceMappingURL=style.css.map */



@media (max-width: 600px){
  .image_text h4{
    font-size: 34px;
    line-height: 42px;
  }
  .image_text p{
    font-size: 18px;
  }
}


.owl-item:active .image .caption{
  right: 0;
}

/*_________________________SURAJIT's CSS CODE START____________________*/

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
} 
body {
  overflow-x: hidden;
  background-color: #252525;
}

.slider {
  display: flex;
  gap: 1em;
  margin-top: 2%;
}
.slider .image {
  flex: 0 0 auto;
  width: 15%;
}
.slider .image img {
  width: 100%;
}

.slick-track {
  display: flex;
  gap: 1em;
}

#gallery .image {
  overflow: hidden;
  position: relative;
}
#gallery .image img {
  cursor: pointer;
  transform: scaleX(1.5);
  transition: 0.5s;
  animation: anim 60s linear infinite;
  filter: grayscale(100%);
}
#gallery .image img:hover {
  filter: grayscale(0);
}
@keyframes anim {
  0% {
    transform: scaleX(1.5);
  }
  50% {
    transform: scaleX(1);
  }
  100% {
    transform: scaleX(1.5);
  }
}
#gallery .image .caption {
  font-family: 'Roboto Slab', serif;
  position: absolute;
  right: -180%;
  /* right: 0; */
  top: 4%;
  text-transform: capitalize;
  color: #15bbe4;
  font-size: 44px;
  text-align: right;
  font-weight: bold;
  /* background-color: #15bbe4;
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
  padding: 3% 5%; */
  transition: 0.5s ease;
}

#gallery .image .right-arrow {
  position: absolute;
  left: -100%;
  /* left: 50%; */
  top: 50%;
  transform: translate(-50%, -50%);
  background-color: rgba(21, 187, 228, 0.8745098039);
  height: 100px;
  width: 100px;
  border-radius: 50%;
  box-shadow: 2px 3px 12px rgba(0, 0, 0, 0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 0.7s;
  opacity: 1;
}
#gallery .image .right-arrow span {
  font-size: 30px;
  color: #ffffff;
  transition: 0.8s;
}
/* #gallery .image:hover .right-arrow {
  opacity: 1;
  left: 50%;
}
#gallery .image:hover .right-arrow span {
  transform: rotate(360deg);
} */

.image_text {
  margin-top: 3%;
  margin-right: 3%;
}

.image_text h4{
  font-family: 'Roboto Slab', serif;
  font-size: 58px;
  text-transform: capitalize;
  font-weight: bold;
  color: #1baadd;
  line-height: 60px;
  text-align: right;
}
.image_text p{
  color: #fff;
  font-size: 24px;
  font-family: 'Muli', sans-serif;
  letter-spacing: 2.5px;
  margin-top: 6px;
  text-align: right;
}


.main-popup {
  /* position: fixed;
  z-index: 1;
  left: 0;
  top: 0; */
  position: absolute;
  z-index: 1000;
  left: 0;
  top: -1px;
  height: 100vh;
  width: 100%;
  overflow: hidden;
  display: none;
}
.main-popup .popupContainer {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6em;
  justify-content: center;
  justify-content: space-between;
  background-color: #252525;
  color: white;
  position: absolute;
  left: 50%;
  top: 200%;
  transform: translate(-50%, -50%);
  height: 70vh;
  overflow-x: hidden;
  overflow-y: hidden;
  width: 50%;
  padding: 2%;
  transition: 0.5s ease;
}
.main-popup .popupContainer .back-button {
  font-size: 25px;
  position: absolute;
  left: 2%;
  top: 2%;
  font-family: "Roboto Slab";
  cursor: pointer;
}
.main-popup .popupContainer .popupContent {
  display: flex;
  align-items: start;
  justify-content: space-between;
  width: 100%;
}
.main-popup .popupContainer .popupContent .left-side-content {
  width: 50%;
  display: flex;
  flex-direction: column;
  align-items: start;
  gap: 2em;
  margin-top: 6%;
  overflow: hidden;
  position: relative;
}
.main-popup .popupContainer .popupContent .left-side-content .overlay {
  position: absolute;
  height: 100%;
  width: 100%;
  background-color: #252525;
  bottom: 0;
  left: 0;
  transition: 1s ease;
  transition-delay: 0.4s;
}
.main-popup .popupContainer .popupContent .left-side-content .title {
  font-family: "Roboto", sans-serif;
}
.main-popup .popupContainer .popupContent .left-side-content .title h1 {
  font-size: 80px;
  font-family: "Roboto Slab";
  text-transform: uppercase;
  letter-spacing: 1px;
  font-weight: bold;
  line-height: 1;
  margin-bottom: 15px;
}
.main-popup .popupContainer .popupContent .left-side-content .year {
  font-family: "Roboto", sans-serif;
}
.main-popup .popupContainer .popupContent .left-side-content .year h5 {
  font-size: 21px;
  font-weight: 400;
}
.main-popup .popupContainer .popupContent .left-side-content .year .heading {
  color: #15bbe4;
  margin-bottom: 10px;
}
.main-popup .popupContainer .popupContent .left-side-content .year .content {
  font-weight: 400;
}
.main-popup .popupContainer .popupContent .left-side-content .about {
  font-family: "Roboto", sans-serif;
}
.main-popup .popupContainer .popupContent .left-side-content .about h5 {
  font-size: 21px;
  font-weight: 400;
}
.main-popup .popupContainer .popupContent .left-side-content .about .heading {
  color: #15bbe4;
  margin-bottom: 10px;
}
.main-popup .popupContainer .popupContent .left-side-content .role {
  font-family: "Roboto", sans-serif;
}
.main-popup .popupContainer .popupContent .left-side-content .role h5 {
  font-size: 21px;
  font-weight: 400;
}
.main-popup .popupContainer .popupContent .left-side-content .role .heading {
  color: #15bbe4;
  margin-bottom: 10px;
}
.main-popup .popupContainer .popupContent .left-side-content .stack {
  font-family: "Roboto", sans-serif;
}
.main-popup .popupContainer .popupContent .left-side-content .stack h5 {
  font-size: 21px;
  font-weight: 400;
}
.main-popup .popupContainer .popupContent .left-side-content .stack .heading {
  color: #15bbe4;
  margin-bottom: 10px;
}
.main-popup .popupContainer .popupContent .left-side-content .recognization {
  font-family: "Roboto", sans-serif;
}
.main-popup .popupContainer .popupContent .left-side-content .recognization h5 {
  font-size: 21px;
  font-weight: 400;
}
.main-popup .popupContainer .popupContent .left-side-content .recognization .heading {
  color: #15bbe4;
  margin-bottom: 10px;
}
.main-popup .popupContainer .popupContent .left-side-content .visit_button {
  color: #15bbe4;
  font-size: 32px;
  text-transform: capitalize;
  text-decoration: none;
  margin-top: 25px;
  transition: 0.5s;
}
.main-popup .popupContainer .popupContent .left-side-content .visit_button:hover{
  color: #fff;
}

.main-popup .popupContainer .popupContent .right-side-image {
  margin-top: 6%;
  width: 40%;
  overflow: hidden;
  position: relative;
}
.main-popup .popupContainer .popupContent .right-side-image img {
  width: 100%;
  filter: grayscale(100);
  transition: 0.5s ease;
}
.main-popup .popupContainer .popupContent .right-side-image img:hover {
  filter: grayscale(0);
}
.main-popup .popupContainer .popupContent .right-side-image .overlay {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: #252525;
  transition-delay: 0.5s;
  animation: image_overlay 0.5s linear;
  animation-fill-mode: forwards;
  animation-delay: 0.4s;
}
@keyframes image_overlay {
  0% {
    height: 100%;
    width: 100%;
  }
  100% {
    height: 0%;
  }
}
.main-popup .popupContainer .vertical-images {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3em;
  width: 75%;
  position: relative;
}
.main-popup .popupContainer .vertical-images .var-image {
  width: 100%;
}
.main-popup .popupContainer .vertical-images .var-image img {
  width: 100%;
  filter: grayscale(100);
  transition: 0.7s ease;
}
.main-popup .popupContainer .vertical-images .var-image img:hover {
  filter: grayscale(0);
}
.main-popup .popupContainer .vertical-images .bottom-overlay {
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #252525;
  transition: 1s ease;
  transition-delay: 0.6s;
}






@media (max-width: 1600px) {
  #gallery .image .caption {
    font-size: 44px;
  }
  #gallery .image .right-arrow {
    height: 70px;
    width: 70px;
  }
  #gallery .image .right-arrow span {
    font-size: 20px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .title h1 {
    font-size: 40px;
  }
  .main-popup .popupContainer .back-button {
    font-size: 20px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .year h5 {
    font-size: 17px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .about h5 {
    font-size: 17px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .role h5 {
    font-size: 17px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .stack h5 {
    font-size: 17px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .recognization h5 {
    font-size: 17px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .visit_button {
    font-size: 32px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .year .heading {
    margin-bottom: 0px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .stack .heading {
    margin-bottom: 0px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .recognization .heading {
    margin-bottom: 0px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .role .heading {
    margin-bottom: 0px;
  }
  .main-popup .popupContainer .popupContent .left-side-content .about .heading {
    margin-bottom: 0px;
  }
  .main-popup .popupContainer .popupContent .left-side-content {
    gap: 1em;
  }
}
@media (max-width: 750px) {
  .slider {
    display: flex;
    flex-direction: column;
    padding: 0 3%;
  }
  .slider .image {
    flex: 0 0 auto;
    width: 100%;
  }
  #gallery .image .caption {
    font-size: 18px;
  }
  .main-popup .popupContainer .popupContent {
    flex-direction: column-reverse;
  }
  .main-popup .popupContainer .popupContent .right-side-image {
    width: 100%;
  }
  .main-popup .popupContainer .popupContent .left-side-content {
    width: 100%;
  }
  .main-popup .popupContainer .vertical-images {
    width: 85%;
    gap: 1em;
  }
  .main-popup .popupContainer {
    gap: 3em;
  }
  .main-popup .popupContainer .popupContent .left-side-content .title h1 {
    font-size: 30px;
  }
  .main-popup .popupContainer .popupContent .right-side-image {
    margin-top: 15%;
  }
}


/*_______________________SURAJIT CODE END_________________________*/


.main-div{
  display:none;
}
 @media(min-width:1025px){
  .main-div{
    display:none;
  }
 }
 @media(max-width:1024px){
  .main-div{
    display:block;
  }
}