@charset "UTF-8";
/* CSS Document */

@font-face {
    font-family: "bradley";
    src:  url('fonts/bradley_hand_itc_tt_bold.ttf') format('truetype'), /* Super Modern Browsers */
		  url('fonts/bradley_hand_itc_tt_bold.woff') format('woff'),
}
@font-face {
  font-family: "Bradley Hand";
  src: url('fonts/bradley_hand_itc_tt_bold.ttf') format('truetype'), /* Super Modern Browsers */
		  url('fonts/bradley_hand_itc_tt_bold.woff') format('woff'),
}
body {
  font-family: 'Poppins', sans-serif;
  color: #fff;
  font-size: calc(14px + (16 - 14) * ((100vw - 300px) / (1920 - 300)))
}
* {
  padding: 0px;
  margin: 0px;
}
.show{ display: table; display: block;}
.hide{ display: none;}
/*.hide.show{ display: table;}*/
.fade{ background:  rgb(0, 0, 0, .6);}
.desktop{ display: block !important}
.mobile{ display: none!important}
.one-word{ white-space: nowrap}
/*#slide-logo1,*/ #slide-logo2, #slide-logo3{ display: none}
#slide-logo1{ display: none;}
#slide-logo1.show{ display: table; width: 100%}
#slide-logo1 .col-2{     margin-left: 0;
    margin-right: 0;
    padding: 1rem;
    align-items: center;
    justify-content: center;
    display: flex;}
section .wow {
  visibility: hidden !important;
}
section .wow.fadeInUp, section .wow.fadeIn, section .wow.fadeInLeft, section .wow.fadeInRight, section .wow.multiply, section .wow.flash {
  visibility: visible !important;
}
#OmnicomGroup .wow, #OmnicomProduction .wow, #Designory .wow, .founder .wow {visibility: visible!important;}
.none {
  display: none;
}
.block {
  display: block;
}
.mobile-video {
  display: none;
}
.desktop-video {
  display: block;
}
h1, h2, h3, h4, h5, h6, strong, b {
  font-weight: 700;
}
.no-pad {
  padding-left: 0px !important;
  padding-right: 0px !important;
}
.no-mar {
  margin: 0px !important
}
/*=====================================================================
==================== Home page slider CSS ============================
=====================================================================*/
.video-content {
  z-index: 99;
  width: fit-content;
	height: fit-content;
  text-align: left;
  color: #090909;
  position: absolute;
  top: 50%;
  bottom: 0px;
  transform: translate(0%, -50%)
}
.video-content h1 {
  font-size: 56px;
  font-weight: 700;
  margin-bottom: 35px;
  color: #ffffff;
  /*text-shadow: 1px 0px 6px #000;*/
}
span.br {display: block; width: 100%;}
.video-content .head_h1 {
  font-size: 56px;
  font-weight: 700;
  margin-bottom: 35px;
  color: #ffffff;
  /*text-shadow: 1px 0px 6px #000;*/
}
.btn-primary {
  border: 1px solid #007970;
  border-radius: 8px;
  color: #ffffff;
  padding: 7px 40px;
	padding: 0;
  background: none;
  font-size: 24px;
 position: relative;
	width: 186px; height: 54px; line-height: 48px;
}
.btn-primary:hover {
  background: #000000;
  color: #ffffff;
  border: 1px solid #ffffff;
  -moz-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  transition: all .3s ease-in;
}
section {
  position: relative;
}
.slider-progress {
  width: 100%;
  height: 54px;
/*  background: #eee;*/
	position: absolute; top: 0; left: 0;
}
.slider-progress .progress {
  width: 0%;
  height: 52px;
  background: #bad33c;
}
.text{ z-index: 111; position: relative;}
/*=====================================================================
========================== Menu CSS ===================================
=====================================================================*/
.menu-open { /*overflow: hidden;*/}
.menu-open .knowledge-bank ul.stick{ z-index: 9}
.topbar {
  position: fixed;
  width: 100%;
  z-index: 9;
  padding-top: 30px;
  -moz-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  transition: all .3s ease-in;
}
.fixedmenu {
  background: #ffffff;
  padding-top: 0;
  padding-bottom: 8px;
  /*box-shadow: 0px 2px 9px #999;*/
  -moz-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  transition: all .3s ease-in;
}
.fixedmenu #nav-icon {
  margin-top: 15px;
}
.menu-open .fixedmenu {
  background: none;
  box-shadow: 0px 0px 0px #999;
}
nav {
  width: 100%;
  height: 80px;
  position: fixed;
  top: 0;
  z-index: 888;
}
@keyframes fadeInNav {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 0;
    top: -25px;
  }
  100% {
    opacity: 1;
    top: 0;
  }
}
.navWrapper {
  margin: auto;
}
#logo, #logo-w {
  color: #292929;
  font-size: 30px;
  font-weight: normal;
  text-decoration: none;
  margin-top: 10px;
  z-index: 9;
  position: relative;
}
.right {
  float: right;
  padding: 0;
  margin: 0;
}
#nav-icon {
  width: 55px;
  height: 45px;
  position: relative;
  z-index: 2;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
  margin-top: 10px;
}
#nav-icon span {
  display: block;
  position: absolute;
  height: 6px;
  width: 100%;
  background: #292929;
  border-radius: 9px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}
#nav-icon span:nth-child(1) {
  top: 0px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}
#nav-icon span:nth-child(2) {
  top: 18px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}
#nav-icon span:nth-child(3) {
  top: 36px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}
#nav-icon span:nth-child(4) {
  top: 54px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}
#nav-icon.open span:nth-child(1) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  top: 0px;
  left: 8px;
  background: #007970;
}
#nav-icon.open span:nth-child(2) {
  width: 0%;
  opacity: 0;
  background: #007970;
}
#nav-icon.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  top: 39px;
  left: 8px;
  background: #007970;
}
.overlay {
  width: 100%;
  height: 100%;
  /*background-color: rgba(171, 195, 52, 0.9);*/
  background-color: rgba(0, 0, 0, 1);
  position: fixed;
  top: 0;
  left: 0;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  opacity: 0;
  z-index: 1;
  visibility: hidden;
  display: flex;
  align-items: center;
}
.overlay.open {
  opacity: 1;
  visibility: visible;
}
.overlay a {
  color: white;
  font-size: 70px;
  font-weight: bold;
  text-decoration: none;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0px;
  opacity: 0;
  transition: transform 0.2s ease;
  overflow: hidden;
  line-height: 1.2;
}
@keyframes fadeInCopyright {
  0% {
    opacity: 0;
  }
  80% {
    opacity: 0;
    transform: translateY(-10px);
  }
  100% {
    opacity: 1;
  }
}
.overlay a.open:hover, .overlay a.active {
  color: #007970;
  -moz-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  transition: all .3s ease-in;
}
.overlay a.open:nth-child(1) {
  opacity: 1;
  animation: .8s fadeInLinks1 ease;
}
@keyframes fadeInLinks1 {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 0;
    transform: translateY(-10px);
  }
  100% {
    opacity: 1;
  }
}
.overlay a.open:nth-child(2) {
  opacity: 1;
  animation: 1s fadeInLinks2 ease;
}
@keyframes fadeInLinks2 {
  0% {
    opacity: 0;
  }
  60% {
    opacity: 0;
    transform: translateY(-10px);
  }
  100% {
    opacity: 1;
  }
}
.overlay a.open:nth-child(3) {
  opacity: 1;
  animation: 1.2s fadeInLinks3 ease;
}
@keyframes fadeInLinks3 {
  0% {
    opacity: 0;
  }
  70% {
    opacity: 0;
    transform: translateY(-10px);
  }
  100% {
    opacity: 1;
  }
}
/* Link Css */
.overlay a.open:nth-child(4) {
  opacity: 1;
  animation: 1.4s fadeInLinks4 ease;
}
@keyframes fadeInLinks4 {
  0% {
    opacity: 0;
  }
  70% {
    opacity: 0;
    transform: translateY(-10px);
  }
  100% {
    opacity: 1;
  }
}
/* Link Css */
.overlay a.open:nth-child(5) {
  opacity: 1;
  animation: 1.4s fadeInLinks5 ease;
}
@keyframes fadeInLinks5 {
  0% {
    opacity: 0;
  }
  70% {
    opacity: 0;
    transform: translateY(-10px);
  }
  100% {
    opacity: 1;
  }
}
.overlay a.open:nth-child(6) {
  opacity: 1;
  animation: 1.4s fadeInLinks6 ease;
}
@keyframes fadeInLinks6 {
  0% {
    opacity: 0;
  }
  70% {
    opacity: 0;
    transform: translateY(-10px);
  }
  100% {
    opacity: 1;
  }
}


.video-wrapper {
  max-height: 100vh;
  height: 100vh;
  overflow: hidden;
  text-align: center;
  position: relative;
  /*	background:#c6d675 url("../img/video-bg.png") no-repeat center;*/
}
.video-wrapper .overlay1 {
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgb(11, 86, 225, .7);
}
.video-wrapper .overlay2 {
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgb(146, 38, 144, .7);
}
.video-wrapper .overlay3 {
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgb(101, 43, 145, .7);
}
.video-wrapper .overlay4 {
  position: absolute;
  width: 100%;
  height: 100%;
  background: rgb(238, 90, 42, .8);
}
.headmar1 img, .chartIcon {
  width: 54px;
  position: absolute;
  opacity: 1 !important;
}
.aboutslide .slick-slide img, .aboutslide, .showdata {
  visibility: visible !important;
}
#myVideo, .video-wrapper video {
  right: 0;
  top: 0;
  object-fit: cover;
  width: 100%;
  height: 100%;
}
/*=====================================================================
======================= Home page  CSS ================================
=====================================================================*/
.multiply-section {
  background: url("../img/multiply-bg.png") no-repeat;
  background-size: cover;
  background-attachment: fixed;
  width: 100%;
  padding: 50px 0;
  overflow: hidden;
  font-size: 24px;
  color: #007970;
}
.multiply-section h2, .multiply-section h1 {
  color: #ffffff;
  font-size: 60px;
}
.multiply {
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
  transition: all .5s;
  -webkit-animation-duration: 1s;
  animation-duration: 2s;
  -webkit-animation-delay: .1s;
  animation-delay: .1s;
  -webkit-animation-name: rotateIn;
  animation-name: rotateIn;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.multiply-section .container img {
  position: inherit;
  width: auto;
  opacity: 0;
  -moz-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  transition: all .3s ease-in;
}
.multiply-section .plusIcon {
  position: relative;
  width: 120px;
  height: 120px;
  margin-bottom: 20px;
}
.multiply-section .plusIcon .vert {
  width: 22px;
  height: 120px;
  position: absolute;
  background: #007970;
  top: 0;
  left: 50%;
  transform: translate(-50%, 0%);
  -moz-transition: all .5s ease-in;
  -webkit-transition: all .5s ease-in;
  -o-transition: all .5s ease-in;
  /*	opacity: 0;*/
}
.multiply-section .plusIcon .hor {
  width: 120px;
  height: 22px;
  position: absolute;
  background: #007970;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -moz-transition: all .5s ease-in;
  -webkit-transition: all .5s ease-in;
  -o-transition: all .5s ease-in;
  transition: all .5s ease-in;
  /*	opacity: 0;*/
}
.multiply-section .plusIcon.open .vert {
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  top: 10px;
  left: 50%;
  opacity: 1;
}
.multiply-section .plusIcon.open .hor {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  left: 10px;
  opacity: 1;
}
.chart {
  position: absolute;
  top: 160%;
  right: 0%;
  z-index: 9;
  display: flex;
  justify-content: flex-end;
  align-items: flex-end
}
.chart .p1, .chart .p2, .chart .p3, .chart .p4, .chart .p5, .chart .p6, .chart .p7, .chart .p8{ position: absolute; top: 0; right: 0;} 
.openplus {
  -moz-opacity: 1;
  -khtml-opacity: 1;
  opacity: 1;
  transition: all .5s;
  -webkit-animation-duration: 1s;
  animation-duration: 2s;
  -webkit-animation-delay: .1s;
  animation-delay: .1s;
  -webkit-animation-name: rotateIn;
  animation-name: rotateIn;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.chart img {
  float: left;
  width: 60%;
}
.chart img.bar-plus {
  position: absolute;
  right: 22%;
  bottom: -1%;
  width: 48%;
}
#p1, #p2, #p3, #p4, #p5, #p6, #p7, #p8{ position: absolute; top:0; right:0; width:65%; opacity: .4;}
#p8{ opacity: .9;}
#multiply .inner{ position: relative; top: 200px;}
.parallaxBar2{ width: 70%; position: absolute; top: 0; right: 0; }
.parallaxBar2 img{ width: 50%; /*position: absolute; top: 0; right: 0;*/}
.diff-cap {
  color: #090909;
  padding:20px 0;
  background: url("../img/diff-cap-bg.jpg") no-repeat center;
  background-size: cover;
}
.diff-cap .plusIcon2 {
  position: relative;
  width: 120px;
  height: 120px;
  margin-bottom: 20px;
  margin: 0 auto;
}
.diff-cap .plusIcon2 .vert {
  width: 22px;
  height: 120px;
  position: absolute;
  background: #050505;
  top: 0;
  left: 50%;
  transform: translate(-50%, 0%);
  -moz-transition: all .5s ease-in;
  -webkit-transition: all .5s ease-in;
  -o-transition: all .5s ease-in;
  /*	opacity: 0;*/
}
.diff-cap .plusIcon2 .hor {
  width: 120px;
  height: 22px;
  position: absolute;
  background: #050505;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -moz-transition: all .5s ease-in;
  -webkit-transition: all .5s ease-in;
  -o-transition: all .5s ease-in;
  transition: all .5s ease-in;
  /*	opacity: 0;*/
}
.diff-cap h3,.diff-cap h2 {
  font-size: 60px;
  margin-top: 20px;
}
.capabilities .row {
  display: flex;
  width: 100%;
}
.capabilities .col {
  flex: 1;
  align-items: center;
  justify-content: center;
  display: flex;
	cursor: pointer;
}
.capabilities .col img{ max-width: 100%;}
@media screen and (min-width: 1610px) {
  #multiply .inner { top: 100px;}
  .capabilities .col img {
    width: auto;
  }
}
.capabilities .col img {
  width: 100%;
}
.capabilities {
  width: 100%;
}
.capabilities .col {
  border: 1px solid #ffffff;
  text-align: center;
}
.capabilities .vernacular {
  background: #e91c23;
}
.capabilities .video {
  background: #ee5a2a;
}
.capabilities .ecom {
  background: #f7941d;
}
.capabilities .creative {
  background: #28a79e;
}
.capabilities .pro {
  background: #007970;
}
.capabilities .social-media {
  background: #0b56e1;
}
.capabilities .media-planning {
  background: #922590;
}
.capabilities .UGC {
  background: #652b91;
}
.capabilities .automation {
  background: #2b73bf;
}
.vision {
  background: url("../img/vision-bg-top.png") no-repeat left top;
  font-size: 36px;
  font-weight: 600;
  color: #090909;
  text-align: center;
  padding: 150px 0;
  background-position: 0px -150px;
  background-size: 25%;
}
.vision h4,.vision h2 {
  font-size: 70px;
}
.vision a {
  text-decoration: none;
  -moz-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  transition: all .3s ease-in;
}
.vision .red {
  color: #e91c23;
}
.vision .saffron {
  color: #ee5a2a
}
.vision .orange {
  color: #f7941d;
}
.vision .light-green {
  color: #28a79e;
}
.vision .green {
  color: #007970;
}
.vision .blue {
  color: #0b56e1;
}
.vision .sky-blue {
  color: #2b73bf;
}
.vision .purple {
  color: #922590;
}
.vision .violet {
  color: #652b91;
}
.vision a:hover {
  color: #090909;
  text-decoration: underline;
}
footer {
  font-size: 16px;
  background: #000000;
  padding: 20px 0 20px 0;
  display: flex;
}
footer p {
	margin: 0;
	line-height: 1.3;
}
footer p br{ display: none;}
footer .container {
  display: flex;
  width: 100%;
}
/*footer .footer-plogo*/

footer .col-6 {
  display: flex;
  justify-content: end;
  align-items: center;
}
footer .col-6 img {
  max-width: 52px;
  height: 52px;
}
footer .footer-logo{ display: none;}
footer a {
  margin-right: 10px;
}
footer .footer-flex{ justify-content: left; align-items: center}
.scroll-top-arrow {
  bottom: 20px;
  right: 20px;
  cursor: pointer;
  position: fixed;
  transition: all .5s ease 0s;
  animation: mymove 2s infinite;
  border-radius: 10%;
  z-index: 9;
  box-shadow: 0 0px 0px 0 #aac234;
}
.scroll-top-arrow div {
  font-size: 25px;
  line-height: 28px;
  color: #ffffff;
  background: #007970;
  height: 30px;
  width: 30px;
  padding: 0;
  text-align: center;
  border-radius: 50%;
}
/*=====================================================================
==================== Knowledge Bank Page CSS =========================
=====================================================================*/
.green-bg{ background:url("../img/headers/green_header.jpg") no-repeat center; background-size: cover;/*rgba(186, 211, 60, .6)*/ }
.blue-bg{ background:url("../img/headers/blue_header.jpg") no-repeat center; background-size: cover;/*rgba(186, 211, 60, .6)*/ }
.purple-bg{ background:url("../img/headers/purple_header.jpg") no-repeat center; background-size: cover;/*rgba(186, 211, 60, .6)*/ }
.pnik-bg{ background:url("../img/headers/pink_header.jpg") no-repeat center; background-size: cover;/*rgba(186, 211, 60, .6)*/ }
.green-bg .knowledge-bank, .blue-bg .knowledge-bank, .purple-bg .knowledge-bank , .pink-bg .knowledge-bank{ border: 0;}
.knowledge-bank {
  padding-top: 180px;
  color: #ffffff;
  padding-bottom: 80px;
  /*border-bottom: 10px solid #0b56e1;*/
}
.knowledge-bank .news-col { /*justify-content: center;*/ align-items: center;
  display: flex;
}
.knowledge-bank h1 {
  font-size: 50px;
  line-height: 1.2;
}
.knowledge-bank ul {
  padding: 0px;
  margin: 0px;
 margin-left: 31px;
}
.knowledge-bank ul li {
  clear: both;
  position: relative;
  list-style-type: none;
}
.knowledge-bank ul li a {
  color: #ffffff;
  font-size: 36px;
  font-weight: 600;
  text-decoration: none;
  line-height: 1.2
}
.knowledge-bank ul li a.active, .knowledge-bank ul li a:hover {
  color: #ffffff;
}
.knowledge-bank ul li a::after {
  content: "";
  position: absolute;
  width: 11px;
  height: 11px;
  background: #ffffff;
  border: 1px solid #b3b3b3;
  border-radius: 100%;
  left: 0px;
  top: 50%;
  transform: translate(-20px, -50%)
}
.knowledge-bank ul li a.active::after {
  background: #007970;
  border: 1px solid #007970;
}
.knowledge-bank ul.stick{
	position: fixed;
    top: 5px;
    background: #fff;
    padding: 20px 20px 20px 30px;
    border-radius: 10px 0 0 10px;
    z-index: 900;
    margin: 0 auto;
    text-align: center;
	left: inherit;
	transform: translate( -30%, 0);
/*	right: inherit;*/
	width: fit-content;
	-moz-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  transition: all .3s ease-in;
}
.knowledge-bank ul.stick li{position: relative;
    list-style-type: none;
    text-align: left;
    display: inline-block;
    margin: 0 15px;}
.knowledge-bank ul.stick li a::after{ transform: translate(-15px, -50%)}
.knowledge-bank ul.stick li a{ font-size: 14px; color: #000000;}
.news-room {
  margin: 55px 0 0px 0;
}
.news-room img {
  max-width: 100%;
}
.articles {
  padding: 100px 0;
/*  border-top: 10px solid #922590;*/
/*  border-bottom: 10px solid #007970;*/
}
#OmnicomProduction .articles {
  padding: 60px 0;
/*
  border-top: 10px solid #922590;
  border-bottom: 10px solid #007970;
*/
}
.articles .articles-col-left {
  justify-content: right;
  align-items: center;
  display: flex;
  color: #000000;
}
.articles .articles-col-left img {
  max-width: 80%
}
.articles .articles-col-right {
  justify-content: left;
  align-items: center;
  display: flex;
  color: #000000;
}
.articles .articles-col-right p a {
  display: block;
  color: #7f7f7f;
  margin-top: 20px;
  text-decoration: none;
  width: fit-content;
	-moz-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  transition: all .3s ease-in;
}
.articles .articles-col-right p a:hover{ text-decoration: underline; color: #000000;}
.case-studies {
  padding: 0px 0 105px 0;
}
.case-studies ul{ margin-bottom: 105px;}

.case-studies .case-studies-plusIcon {
  position: absolute;
    width: 120px;
    height: 120px;
    margin-bottom: 20px;
    top: 56%;
    left: 50%;
    z-index: 11;
    transform: translate(-50%, -50%);
}
.case-studies .case-studies-plusIcon .vert {
  width: 22px;
  height: 120px;
  position: absolute;
  background: #ffffff;
  top: 0;
  left: 50%;
  transform: translate(-50%, 0%);
  -moz-transition: all .5s ease-in;
  -webkit-transition: all .5s ease-in;
  -o-transition: all .5s ease-in;
  /*	opacity: 0;*/
}
.case-studies .case-studies-plusIcon .hor {
  width: 120px;
  height: 22px;
  position: absolute;
  background: #ffffff;
  top: 55%;
  left: 50%;
  transform: translate(-50%, -50%);
  -moz-transition: all .5s ease-in;
  -webkit-transition: all .5s ease-in;
  -o-transition: all .5s ease-in;
  transition: all .5s ease-in;
  /*	opacity: 0;*/
}

.case-studies img {
  max-width: 100%;
}
.case-studies .case-studies-col {
  position: relative;
  cursor: pointer;
  display: flex;
}
.case-studies .case-studies-col .display-content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #007970;
  font-size: 40px;
  line-height: 1.2;
  font-weight: 700;
  color: #fff;;
  opacity: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  -moz-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  transition: all .3s ease-in;
}
.case-studies .case-studies-col .display-content img {
  max-width: 40%;
}
.case-studies .case-studies-col .display-content .inner {
  margin: 0 auto;
}
.case-studies .case-studies-col .display-content p {
  margin-top: 20px;
}
.case-studies .case-studies-col .display-content a {
  margin-top: 20px;
  display: block;
  color: #fff;
  border: 2px solid #fff;
  border-radius: 8px;
  padding: 7px 15px;
  background: none;
  font-size: 24px;
  font-weight: 400;
  text-decoration: none;
  width: fit-content;
}
.case-studies .case-studies-col:hover .display-content {
  opacity: 1;
}
.media-coverages {
  background: #121212;
  padding: 100px 0;
  line-height: 1.3;
}
.mediaslide {
    padding: 60px 0 35px 0;
    width: 100%;
}
.media-coverages h3, .media-coverages .am_head {
  color: #cbc8c8;
  font-size: 36px;
  font-weight: 600;
}
.media-coverages h3 span, .media-coverages .am_head span {
  color: #007970;
  font-size: 24px;
  font-weight: 400;
  display: block;
  margin-top: 20px;
  margin-bottom: 70px;
}
.media-coverages h4 ,.media-coverages p.med_p{
  font-size: 45px;
  color: #007970;
  font-weight: 600;
  position: relative;
}
.media-coverages h4 span,.media-coverages p.med_p span {
  font-size: 24px;
  display: block;
  color: #ffffff;
  font-weight: 300;
  margin-top: 20px;
}
.media-coverages h4::before ,.media-coverages p.med_p::before{
  content: "";
  position: absolute;
  width: 200px;
  height: 153px;
  background: url("../img/open-q.png") no-repeat left top;
  background-size: 100%;
  left: -12%;
  top: -24%;
}
.media-coverages h4::after ,.media-coverages p.med_p::after{
  content: "";
  position: absolute;
  width: 200px;
  height: 153px;
  background: url("../img/close-q.png") no-repeat left top;
  background-size: 100%;
  right: 12%;
  bottom: -12%;
}
/*=====================================================================
======================= About Us Page CSS =============================
=====================================================================*/
.agencies {
  font-size: 36px;
  color: #000000;
  padding: 70px 0;
}
.agencies-logo {
  margin-top: 100px;
}
.agencies-logo div {
  display: flex;
  justify-content: left;
  align-items: center;
}
.agencies-logo .col-3, .agencies-logo .col-4, .agencies-logo .col-5{cursor: pointer;}
.agencies-logo img {
  max-width: 75%;
  width: 100%;
	cursor: pointer;
-moz-transition: all .5s ease-in-out;
  -webkit-transition: all .5s ease-in-out;
  -o-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
}
.agencies-logo img:hover{transform: scale(1);}
.team, .clients {
  background: #000;
  padding: 100px 0;
}
.clients { padding-bottom: 75px;}
.team h3,.team h2, .clients h2, .brand_abt {
  font-size: 55px;
  color: #ffffff;
}
.team h3,.team h2{ padding-left: 30px;}
.clients p {
  font-size: 36px;
  color: #fff;
  margin: 30px 0 70px 0;
}
.team .d-table{ width: 100%;}
.clients p span {
  color: #7f7f7f;
  display: block;
  font-size: 24px;
  margin-top: 15px;
}
.clients p span a{color: #7f7f7f; text-decoration: none}
.clients p span a:hover{ color: #fff;}
.team p span.number, .clients p span.number {
  font-size: 86px;
  font-weight: 700;
  color: #007970;
  line-height: 1;
  display: block;
}
.team{ width: 100%; border-bottom: 1px solid #222; padding-bottom: 20px}
.team p{ font-size: 24px; padding-left: 30px;}
.clients-logo div {
  vertical-align: text-top;
  margin: 0 0;
  max-width: max-content;
  float: left;
 margin-right:52px;
/*	overflow: hidden;*/
}
.clients-logo .row{
width: 100%;
    max-width: inherit;     justify-content: center;
	}
.clients-logo .col-2{ margin-bottom: 25px;}
.clients-logo div img {
  max-width: 100%;
  margin: 0 auto;
	max-height: 70px;
-moz-transition: all .5s ease-in-out;
  -webkit-transition: all .5s ease-in-out;
  -o-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
}
.clients-logo div img:hover{transform: scale(1);}
.clients-logo div a {
  margin: 0 auto;
  text-align: center;
	width: 100%;
}
.t-first{ margin-top: 35px;}
.team .team-col{ font-size: 24px; color: #ffffff; line-height: 1.3; margin-bottom: 30px; text-align: center; padding:0 15px; overflow: hidden; cursor: pointer;}
.team .team-col p{ padding-left: 0; min-height: 72px; text-align: left;}
.team .team-col img{ max-width: 100%; margin-bottom: 15px; cursor: pointer;
-moz-transition: all .5s ease-in-out;
  -webkit-transition: all .5s ease-in-out;
  -o-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
}
.team .team-col img:hover{transform: scale(1.05);}
.team .team-col span{ display: block; color: #007970  ;}
.culture {
  background: url("../img/culture-bg.jpg") no-repeat;
  background-size: cover;
  height: 100vh;
  display: flex;
  background-attachment: fixed;
}

.culture .culture-content {
  background: #007970;
  font-size: 40px;
  font-weight: 600;
  color: #000000;
  line-height: 1.2;
  padding:50px 30px;
  width: fit-content;
  margin: 83px 0 0 0;
/*  height: 40vh;*/
  display: flex;
  justify-content: left;
  align-items: center
}
.team-leaders{ margin-top: 100px; padding-left: 30px;}
.team-leaders h5{ font-size: 55px; margin-bottom: 30px;}
.team-leaders ul{ padding: 0;}
.team-leaders li{ font-size: 20px; list-style-type: none;}
.award{background: url("../img/awards.jpg") no-repeat; background-attachment: fixed; background-size: cover;}

/*=====================================================================
======================= Padigree page CSS =============================
=====================================================================*/
.group-story{ color: #000; font-size: 24px; padding: 80px 0;}
.group-story .col{ display: flex; justify-content: center; align-items: center;}
.group-story .col-4{ justify-content: right;}
#OmnicomGroup .group-story, #Designory .group-story{ flex-direction: row-reverse;}
#OmnicomProduction .group-story .col-4{ justify-content: left;}
/*#Designory .container{ border-bottom: 10px solid #ee5a2a;}*/
.group-story .col-4 img{ max-width: 90%;}
.founder{ padding: 100px 0; color: #000000; font-size: 34px;font-family: "Bradley Hand", "sans-serif";}
.founder .col{ justify-content: center;
    align-items: baseline;
    display: flex;
    flex-direction: column;}
.founder .col img{ max-width: 90%;}
.founder .col span{ font-family: 'Poppins', sans-serif; display: block; font-weight: 700; font-size: 24px;}
.award .container{ position: relative;}
.number-award{ position: absolute; top: 80px; left: 360px; font-size: 18px;}
.number-award span{ display: block; margin-bottom: 0px; font-size: 40px; font-weight: 700;}
/*=====================================================================
======================= Contact Page  CSS =============================
=====================================================================*/
.contact{ text-align: center; padding-top: 0px; padding-bottom: 0px; color: #000000;}
.contact h1{ font-size: 100px; padding-bottom: 50px; margin-bottom: 50px; border-bottom: 1px solid #7e7e7e}
.contact .contact-form{ width: 80%; margin-left: 10%; margin-bottom: 110px;}
.contact .contact-form fieldset{ margin-top: 40px;}
.contact .contact-form fieldset label{ display: block; text-align: left; margin-bottom: 8px;  font-size: 18px;}
.contact .contact-form fieldset input{ width: 100%; border: 0px; border-bottom: 1px solid #7e7e7e; padding: 5px; padding-left: 0; color: #b7b7b7;}
.contact .contact-form fieldset input:active, .contact .contact-form fieldset input:focus{ outline: none;}
.contact .contact-form fieldset input.submit{ width: auto; padding: 5px 25px; border: 1px solid #888; color: #000; border-radius: 3px; background: #fff;}
.fit-content{ width: fit-content}
.select-hidden {
  display: none;
  visibility: hidden;
  padding-right: 10px;
}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #b7b7b7;
}
::-moz-placeholder { /* Firefox 19+ */
 color: #b7b7b7;
}
:-ms-input-placeholder { /* IE 10+ */
  color: #b7b7b7;
}
:-moz-placeholder { /* Firefox 18- */
  color: #b7b7b7;
}
.select {
  cursor: pointer;
  display: inline-block;
  position: relative;
	width: 100%;
    text-align: left;
	border-bottom: 1px solid #7e7e7e; padding: 5px; padding-left: 0; margin-top: 20px; font-size: 18px; color: #b7b7b7;
}
.select-styled {
  position: absolute; 
  top: -20px;
  right: 0;
  bottom: 0;
  left: 0;
  -moz-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  transition: all .3s ease-in;
}
 
.select-styled:after {
      top: 9px;
background-color: #f5f5f5;
    }
 
.select-styled:after {
    content:"";
    border: 7px solid transparent;
    background:url("../img/drop-down.png") no-repeat;;
    position: absolute;
    top: 0px;
    right: 0px;
    background-position: right top;
    width: 30px;
    height: 20px;
  }
.select-options {
  display: none; 
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  z-index: 999;
  margin: 0;
  padding: 0;
  list-style: none;
background-color: #f5f5f5;
  
}
.select-options li {
    margin: 0;
    padding: 12px 0;
    text-indent: 15px;
	-moz-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  transition: all .3s ease-in;
background-color: #f5f5f5;  
  }
.select-options li:hover, 
    .select-options li.is-selected {
background-color: #C8C8C8;
    }
.contact-header .row {
  display: flex;
  width: 80%;
  flex-direction: row-reverse;
}
.contact-header .row .col {
  flex: 1;
  align-items: center;
  justify-content: center;
  display: flex;
  cursor: pointer;
  flex-direction: column;
}
.contact-header .address{ font-size: 20px; color: #000; height: 50%; padding: 3rem 0; margin: 2rem 0rem; text-align: center}
.contact-header .address.ncr{ border-right: 1px solid #ddd;}
.contact-header .address h3,	.contact-header .address h2{ font-size: 36px; font-weight: 700;}
.contact-header img, .contact-header iframe{ max-width: 100%; width: 100%}

.contact-page #nav-icon span{ background: #ffffff;}
.contact-page.menu-open #nav-icon span{ background: #007970 !important;}
.contact-page .fixedmenu #nav-icon span{ background: #000000; }
.blog-headers h1 { font-size: calc(25px + (50 - 25)*((100vw - 300px) /(2500 - 300))); text-align: center; padding: 0 0 40px;}

/*=====================================================================
======================= Page Responsive CSS ===========================
=====================================================================*/
@media screen and (max-width: 1399px) {
  .media-coverages h4,.media-coverages p.med_p {
    font-size: 50px;
    width: fit-content;
    margin: 0 auto;
  }
  .media-coverages h4::before, .media-coverages h4::after,.media-coverages p.med_p::before {
    width: 160px;
    height: 122px;
  }
  .media-coverages h4::before ,.media-coverages p.med_p::before{
    left: -6%;
    top: -15%;
  }
  .media-coverages h4::after,.media-coverages p.med_p::after {
    right: 0%;
    bottom: 10%;
  }
	.agencies p br{ display: none}
	.team .team-col p{ font-size: 20px;}
	.knowledge-bank ul.stick{ right: 5%;}
}
@media screen and (max-width: 1200px) {
  #multiply .inner { top: 220px;}
  
  .video-content h1,.video-content .head_h1 {
    font-size: 46px;
  }
  .knowledge-bank {
    padding-top: 150px;
    padding-bottom: 50px;
  }
  .knowledge-bank h1 {
    font-size: 40px;
  }
  .knowledge-bank ul li a {
    font-size: 29px;
  }
  .articles {
    padding: 50px 0;
  }
  .case-studies {
    margin: 0px 0 55px 0;
  }
	.case-studies ul{ margin-bottom: 55px;}
  .media-coverages .container {
    flex-direction: column;
    text-align: center;
  }
	.mediaslide {padding: 0px 0 0px 0;}
  .media-coverages h3 span, .media-coverages .am_head span {
    margin-top: 20px;
    margin-bottom: 40px;
  }
  .media-coverages h4,.media-coverages p.med_p {
    margin: 60px auto 0 auto;
  }
  .media-coverages .col-4, .media-coverages .col-8 {
    width: 100%;
    flex-direction: row;
    float: none !important;
  }
	.team h3, .team h2, .team p, .team-leaders{ padding-left: 0;}
	.team p{ font-size: 20px;}
	.team p br{ display: none;}
	.team-leaders li{ font-size: 18px;}
	.case-studies .case-studies-col .display-content{ font-size: 30px;}
	.group-story{ font-size: 20px; padding: 50px 0;}
	.founder{ padding: 50px 0; font-size: 25px;}
	.founder .col p br{ display: none;}
	.founder .col span{ font-size: 18px}
	.knowledge-bank ul.stick {
    right: 5%;
	transform: translate( -25%, 0);
    padding-left: 0;
    padding-right: 0;
}
}
@media screen and (max-width: 1023px) {
	#multiply .inner { top: 220px;}
	.chart { top: 78%; right: 0;}
  .chart img {
    float: left;
    width: 50%;
  }
  .chart img.bar-plus {
    right: 15%;
    bottom: -2%;
    width: 40%;
  }
  .knowledge-bank h1 {
    font-size: 30px;
  }

  .knowledge-bank ul li a {
    font-size: 22px;
  }
  .articles .articles-col-right p br {
    display: none;
  }
  .case-studies .case-studies-col .display-content {
    font-size: 20px;
    line-height: 1.2;
  }
  .case-studies .case-studies-col .display-content p, .case-studies .case-studies-col .display-content a {
    margin-top: 15px;
    margin-bottom: 0;
  }
	.case-studies .case-studies-col .display-content a{ font-size: 15px;}
	.agencies{ padding: 40px 0; font-size: 28px;}
	.team, .clients{ padding: 50px 0;}
	.clients { padding-bottom: 25px;}
	.team-leaders{ margin-top: 30px;}
	.team-leaders h5{ margin-bottom: 15px;}
	.clients p{ font-size: 24px;}
	.clients p br{ display: none;}
	.clients p span{ font-size: 20px;}
	.team p span.number, .clients p span.number{ font-size: 55px;}
	.team-leaders h5, .team h3, .team h2, .clients h2,.brand_abt{ font-size: 30px;}
	.culture .culture-content{ font-size: 30px;}
	.number-award{ left: 300px;}
	.knowledge-bank ul.stick {right: 1%;}
}
@media screen and (max-width: 991px) {
	#multiply .inner { top: 240px; right: -10%;}
	.chart { top: 81%; }
	.chart img { width: 45%;}
	.team .team-col p{ font-size: 15px; margin-bottom: 0;}
	.knowledge-bank { padding-top: 100px; padding-bottom: 30px;}
	.news-room {margin: 25px 0 0px 0;}
	#NewsRoom .container ul{margin-bottom: 25px; margin-top: 25px;}
	.knowledge-bank ul.stick{
		position: fixed;
		top: 60px;
		right: 0;
		z-index: 1;
		background: #fff;
		padding: 20px  20px  20px  30px;
		box-shadow: -2px 0px 6px -5px #000000;
		border-radius: 0;
		transform: translate( 0%, 0);
		width: 100%;
	}
	.knowledge-bank ul.stick li{ display: inline-block; margin: 0 10px;}
	.knowledge-bank ul.stick li a{ font-size: 14px;}
	.contact .address h3{ font-size: 35px;}
	.contact .address{ font-size: 16px; padding: 1rem;}
}
@media screen and (max-width: 768px) {
  .mobile-video {
    display: block;
  }
  .desktop-video {
    display: none;
  }
  .knowledge-bank h1 .br{display:none;}
}
@media screen and (max-width: 767px) {
	#multiply .inner { top: 370px; right: 10%;}
	#p1, #p2, #p3, #p4, #p5, #p6, #p7, #p8{ width:100%;}
  .desktop{ display: none !important}
  .mobile{ display: block!important}
  #myVideo {
    width: auto;
  }
  #logo, #logo-w {
    max-width: 50%
  }
  #logo img, #logo-w img {
    width: 100%;
  }
  .topbar {
    padding-top: 15px;
  }
  .fixedmenu #nav-icon {
    margin-top: 18px;
  }
  .topbar.fixedmenu {
    padding-top: 0px;
  }
  #nav-icon {
    width: 35px;
    height: 30px;
  }
  #nav-icon span:nth-child(1), #nav-icon span:nth-child(2), #nav-icon span:nth-child(3) {
    height: 4px;
  }
  #nav-icon span:nth-child(2) {
    top: 11px;
  }
  #nav-icon span:nth-child(3) {
    top: 22px;
  }
  #nav-icon.open span:nth-child(3) {
    top: 24px;
  }
  .overlay a {
    font-size: 30px;
  }
	.diff-cap{ padding: 15px 0 10px 0;}
  .capabilities .col, .capabilities .left-col, .capabilities .right-col {
    width: 100%;
    flex: auto;
  }
  .video-content {
    top: 63%;
	left: 10%;
  }
  .video-content h1,.video-content .head_h1 {
    font-size: 36px;
    margin-bottom: 20px
  }
	.slider-progress{ height: 44px;}
	.slider-progress .progress{ height: 42px;}
	.video-content .btn-primary{ width: 125px; height: 44px; line-height: 40px;}
  .video-content .btn-primary {
    font-size: 18px;
  }
  .multiply-section {
    padding-bottom: 250px
  }
  .multiply-section .container img {
    width: 20%
  }
  .multiply-section .plusIcon {
    width: 70px;
    height: 70px;
  }
  .multiply-section .plusIcon .vert {
    width: 17px;
    height: 70px;
  }
  .multiply-section .plusIcon .hor {
    width: 70px;
    height: 17px;
  }
  .chart {
    justify-content: center;
		 bottom: -30%;
  }
  .chart img.bar-plus {
    right: inherit;
    bottom: -2%;
    width: 40%;
    left: 20%;
  }
  .vision {
    padding: 40px 20px;
  }
  footer {
    padding: 30px 0;
  }
  footer p br{ display: block;}
  footer .container {
    width: 100%;
    display: block;
    font-size: 10px;
  }
  footer .col-6 {
    width: 100%;
    align-items: center;
	justify-content: center;
  }
  footer .col-6 p {
    text-align: left;
    clear: both;
    font-size: 16px;
    margin: 0;
  }
  footer .col-6.footer-flex {
    display: flex;
    margin-bottom: 20px;justify-content: center;
	  
  }
	footer .col-6 .footer-logo{ display: none;}
	footer .col-6 p br{ display: none;}
  footer .col-6 .footer-logo img {
    max-width: 50px;
    float: left;
    margin-bottom: 0px;
  }
  .vision h4,.vision h2, .diff-cap h3,.diff-cap h2, .multiply-section h2, .multiply-section h1 {
    font-size: 30px;
  }
  .vision, .multiply-section p {
    font-size: 20px;
  }
  .articles .container, .knowledge-bank .container {
    flex-direction: column;
  }
	#articles .container{
		display: block !important;
	}
  .articles .articles-col-left, .articles .articles-col-right, .knowledge-bank .news-col {
    width: 100%;
    justify-content: left;
  }
  .articles .articles-col-left {
    margin-bottom: 30px;
  }
  .articles .articles-col-right p a{ margin-left: 25px; margin-right: 25px;}
  .articles .articles-col-left, .articles .articles-col-right {
    justify-content: center;
    text-align: center;
    font-size: 18px;
  }
	.knowledge-bank{ display: block !important;}
  .knowledge-bank ul {
    padding-left: 30px;
    margin-top: 30px;
    margin-left: 0;
  }
  .case-studies .case-studies-col {
    width: 100%;
  }
  .case-studies .case-studies-plusIcon{ display: none;}
  .media-coverages h3,  .media-coverages .am_head {
    font-size: 25px;
  }
  .media-coverages h4,.media-coverages p.med_p {
    font-size: 30px;
  }
  .media-coverages h3 span,  .media-coverages .am_head span, .media-coverages h4 span,.media-coverages p.med_p span {
    font-size: 18px;
  }
  .media-coverages h4 br,.media-coverages p.med_p br {
    display: none;
  }
  .media-coverages h4,.media-coverages p.med_p {
    font-size: 30px;
    width: fit-content;
  }
  .media-coverages h4::before, .media-coverages h4::after, .media-coverages p.med_p::before, .media-coverages p.med_p::after {
    width: 100px;
    height: 76px;
  }
  .media-coverages h4::before, .media-coverages p.med_p::before {
    left: 0%;
    top: -15%;
  }
  .media-coverages h4::after, .media-coverages p.med_p::after {
    right: 0%;
    bottom: 10%;
  }
  .media-coverages .col-4 img, .media-coverages .col-8 img {
    max-width: 100%;
  }
  .team-leaders .col-3, .team .team-col{ width:50%}
	.clients-logo div{ width: 50%}
	.agencies-logo, .agencies-logo div{ display: block !important;}
	.agencies-logo{ margin-top: 40px; margin-bottom: 20px}
	.agencies-logo .col-4, .agencies-logo .col-5, .agencies-logo .col-3{ width: 100%; text-align: center; margin-top: 35px}
	.agencies-logo .col-4 img, .agencies-logo .col-5 img, .agencies-logo .col-3 img{width: 50%; max-width: 100%}
	.clients-logo .col-2{ display: inline-block; float: none; margin: 10px 4%; width: 50%; max-width: 40%;}
	.group-story{ display: block !important}
	.group-story .col{ width: 100%; text-align: center; justify-content: center; align-content: center;}
	.group-story .col-4 img{ margin-bottom: 25px;}
	#OmnicomProduction .group-story .col-4{ justify-content: center;}
	.group-story .col p{ text-align: left;}
	.founder .container{ display: block !important;}
	.founder .container .col img{ max-width: 90%; width: auto; margin-bottom: 20px;}
	.founder .container .col{ width: 100%; justify-content: center; align-content: center; text-align: center;}
	.founder .container .col p{ width: 100%;}
	.number-award{ position: static; margin-top: 20px}
	.container{    padding-right: var(--bs-gutter-x,.75rem) !important;
    padding-left: var(--bs-gutter-x,.75rem) !important;}
	.contact-header .row .col{flex-direction: column; width: 100%; display: block; flex: auto;}
	.contact{ padding-top: 10px;}
	.contact h1 { font-size: 60px; padding-bottom: 30px;}
	.contact .address{ margin: 0;}
	.contact .contact-form fieldset{margin-top: 20px;}
	.contact h1{ margin-bottom: 30px;}
	.contact .contact-form{ margin-bottom: 30px;}
	.full-width{ width: 100%; display: block;}
	.contact-header .address{ margin:  0rem 1rem 0rem; font-size: 15px; padding: 1.5rem 0 1.5rem 0;}
	.contact-header .address h3,	.contact-header .address h2{ font-size: 30px;}
	.contact-header .address.ncr{ border: 0px; border-bottom: 1px solid #ddd;}
	.video-content {margin-right: 10%; width: 80vw;}
	.video-content h1 br,.video-content .head_h1 .br{ display: none;}
	.news-room img{ width: 100%;}
}
@media screen and (max-width: 640px) {
	footer .container, .container{ width: 90%; padding-left: 5%; padding-right: 5%;}
	.diff-cap .plusIcon2{ width: 60px; height: 60px;}
	.diff-cap .plusIcon2 .vert{ height: 60px; width: 10px}
	.diff-cap .plusIcon2 .hor{ width: 60px; height: 10px;}
	.team .team-col{ padding: 0 5px}
	.contact .contact-form { width: 90%; margin-left: 5%;}
	
/*
  .chart img {
    width: 12%;
  }
*/
	.chart img {
    float: left;
    width: 55%;
}
  .chart img.bar-plus {
    right: inherit;
    bottom: -2%;
    width: 44%;
    left: 15%;
  }
  .knowledge-bank h1 br {
    display: none;
  }
  footer .col-6 p {
    font-size: 12px;
  }
	.knowledge-bank ul.stick{ padding-left: 10px; padding-right: 10px; text-align: left;}
	.knowledge-bank ul.stick li{ width: 40%; margin-left: 5%;}
	#multiply .inner { top: 310px; right: 5%;}
	#p1, #p2, #p3, #p4, #p5, #p6, #p7, #p8 {width: 110%;}
	
}
@media screen and (max-width: 420px) {
.chart img {
    float: left;
    width: 85%;
}
.video-content h1,.video-content .head_h1  { font-size: 28px;}
  .chart img.bar-plus {
    right: inherit;
    bottom: -2%;
    width: 75%;
    left: -5%;
  }
.case-studies .case-studies-col .display-content{ font-size: 15px;}
.case-studies .case-studies-col .display-content a{ font-size: 13px;}
.team .team-col p{ min-height: 78px; margin: 0}
	.knowledge-bank ul.stick li{ width: auto; margin-right: 0;}
	#multiply .inner { top: 320px; right: -5%;}
	#p1, #p2, #p3, #p4, #p5, #p6, #p7, #p8 {width: 130%;}
}


::marker { max-height: 3px;}
.single_page_post .container{ position: relative; overflow: hidden;}
.post_page_sidebar {position: relative; height: 3px; background: #ddd;}
.single_page_post .container ul.prog{ padding: 0; margin-left: -15px; margin-right: -15px; max-height: 3px; overflow: hidden;}
.single_page_post .container ul.prog li.post_page_sidebar{position: relative; height: 3px; background: #ddd;}
.post_progress {position: absolute; height: 3px; background: red; bottom:0px;}
#NewsRoom .container ul{ margin-top: 55px; margin-bottom: 55px;}
#NewsRoom .nomar-top .post_progress{background: #0b56e1;}
#NewsRoom .post_progress{background: #922590;}
#CaseStudies .post_progress{background: #007970;}

#OmnicomGroup .post_progress{background: #922590;}
#Designory .post_progress{background: #ee5a2a;}
#OmnicomGroup ul.prog{ margin-bottom: 0; padding: 40px; overflow: hidden;}

/*#OmnicomGroup .no-mar, #Designory .no-mar, #OmnicomProduction .no-mar{ margin: 0 !important}*/
/*#OmnicomGroup ul.no-pad-top{ padding: 0 !important;}*/
#OmnicomProduction .post_progress{background: #007970;}
.nomar-top{ margin-top: 0px !important;}
.single_page_post {width: 100%;}
.modal-content{ background: rgba(255,255,255,0.5)}
.modal-body{padding: 1px;}
.modal-dialog iframe{ max-width: 100%; width: 100%; height: 420px;}
.modal-dialog{ margin: 0 auto; top: 50%; transform:translate(0%, -50%) !important; position: relative;}
.modal-dialog .close{    position: absolute;
    right: -15px;
    top: -15px;
    color: #fff;
    background:  rgb(0, 0, 0, .9);
    height: 30px;
    width: 30px;
    text-align: center;
    border-radius: 100%;
    line-height: 30px;
    text-decoration: none;
    box-shadow: -1px 1px 10px #fff;}

@media (min-width: 576px){
	.modal-dialog { max-width: 550px; margin: 0 auto;}
}
@media (min-width: 768px){
	.modal-dialog { max-width: 800px; margin: 0 auto;}
}
@media screen and (max-width: 991px) {
	#NewsRoom .container ul{margin-bottom: 25px; margin-top: 25px;}
	.team, .clients, .articles { padding: 20px 0;}
	.clients { padding-bottom: 0;}
	.case-studies, .case-studies ul {margin-bottom: 25px;}
	.case-studies{ padding-bottom: 0;}
	.founder, #OmnicomProduction .articles, .group-story{ padding: 25px 0}
	#OmnicomGroup ul.prog{padding: 40px 40px 3px 40px;}
	.award{ background-position: center;}
	.media-coverages{ padding: 10vh 30px; border-bottom: 1px solid #222;}
	.modal-dialog .close{right: 5px; top: -15px;}
}
.video-thumbnail {
  position: relative;
  display: inline-block;
  cursor: pointer;
}
.video-thumbnail:before {
    position:absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    content: "\f144";
    font-family: FontAwesome;
    font-size: 50px;
    color: #fff;
    opacity: .8;
    text-shadow: 0px 0px 30px rgba(0, 0, 0, 0.5);
  }
.video-thumbnail:hover:before {
    color: #eee;
  }

.slider-progress1, .slider-progress2, .slider-progress3, .slider-progress4, .slider-progress5 {
  /*border: 1px solid #ecfd9b;
 
  height: 20px;
  width: 200px;*/
	width: 100%;
	position: absolute; height: 100%; border-radius: 8px;
}
.slider-progress1 .in {
    animation: fill 2.5s linear 1;
    height: 100%;
       background-color: #000000;
     background-color: #007970;
	 border-radius: 8px;
  }
.slider-progress2 .in {
    animation: fill 3.5s linear 1;
    height: 100%;
      background-color: #000000;
     background-color: #007970;
	 border-radius: 8px;
  }
.slider-progress3 .in{
    animation: fill 9.5s linear 1;
    height: 100%;
      background-color: #000000;
     background-color: #007970;
	 border-radius: 8px;
  }
.slider-progress4 .in {
    animation: fill 9.5s linear 1;
    height: 100% !important;
    background-color: #000000;
     background-color: #007970;
	 border-radius: 8px;
  }
.slider-progress5 .in {
    animation: fill 9.5s linear 1;
    height: 100% !important;
      background-color: #000000;
     background-color: #007970;
	 border-radius: 8px;
  }

@keyframes fill {
  0% {
    width: 0%;
  }
  100% {
    width: 100%;
  }
}
/* ----------- iPhone 4 and 4S ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2) {
	  *{ background-attachment: inherit;}
}

/* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
	   *{ background-attachment: inherit;}
}

/* Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {
	   *{ background-attachment: inherit !important;}

}

/* ----------- iPhone 5 and 5S ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2) {
	 *{ background-attachment: inherit !important;}
}

/* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
	   *{ background-attachment: inherit !important;}
}

/* Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {
	 *{ background-attachment: inherit !important;}
}

/* ----------- iPhone 6 ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2) { 
	 *{ background-attachment: inherit !important;}
}

/* Portrait */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) { 
	 *{ background-attachment: inherit !important;}
}

/* Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) { 
	 *{ background-attachment: inherit !important;}
}

/* ----------- iPhone 6+ ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3) { 
	 *{ background-attachment: inherit !important;}
}

/* Portrait */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: portrait) { 
	 *{ background-attachment: inherit !important;}
}

/* Landscape */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) { 
	 *{ background-attachment: inherit !important;}
}


/* FORM VALIDATION */
.contact .contact-form input.error {
  border-color: #fa0000 !important;
}
.contact .contact-form fieldset label.error {
  color: #fa0000;
  font-size: 12px;
  padding-top: 5px;
}
.form-message {
  display: none;
  color: #9bb616;
}

 #logo img, #logo-w img { max-height: 60px;}

.blog_full{color: #000000; text-align: left;    margin: 129px 0 0;}
.blog_full img{ max-width: 100%;}
.blog_text h2{font-size: 27px; color: #000;text-align: left; margin: 15px 0 6px;}
.blog_text p{color: #555454; text-align: left; font-size: 18px;}
.blog_inner {display: flex ; gap: 30px; justify-content: space-between;margin: 50px 0 0px; }
.left_blog{width: 25%; float: left;  overflow-y: auto; position: relative;   }
.blog_content{ background: #000000; padding: 30px 33px 38px;}
.featured-blog-inner img{min-height: 190px; object-fit: cover;}
.blog_content h4{font-size: 22px; margin: 27px 0 14px;color: #007970;}
.blog_content p{font-size: 17px;margin-bottom: 11px;}
.blog_content a{text-decoration: none; color: #ffffff;font-weight: 400; transition: all .5s;}
.blog_content a:hover{ color: #739a00;}
.right_blog{width: 74%;float: right;    margin: 0 0 35px; }
.blog_bg{background-color: #f7f7f7; padding: 26px 32px 16px;}
.right_blog p{font-size: 17px;margin-bottom: 11px;}
.right_blog h3{font-size: 20px; margin: 27px 0 22px;}
.right_blog ul{padding: 13px 0 1px;}
.right_blog ul li{font-size: 17px;margin-bottom: 8px; list-style: disc;margin-left: 27px;}
.entry-header-inner {background: #f7f7f7;padding: 21px 18px 23px;}
h2.entry-title {font-size: 20px; }
.meta-text {padding: 0 0 7px;}
.post_dates {color: #999;}
.post_auths {color: #739a00;}
.cta_1{width: 100%; text-align: left;    margin: 24px 0 0;}
.cta_1 a{background: #007970; display: inline-block; text-decoration: none; color: #000; font-size: 16px;    border-radius: 18px; padding: 7px 40px 7px; transition: all .5s;}
.cta_1 a:hover{background: #000000;color: #007970; } 
input.search-submit {background: #fff url(https://magnongroup.com/img/search-icon.png) no-repeat center;font-size: 0;height: 34px;width: 42px;background-size: 50% !important;border: 0;position: absolute;right: 2px;top: 1px;padding: 0;border-radius: 15px;}
/* search bar start */
.search-form{position: relative; width: 100%; display: block;margin: 0 auto  16px }
input#search-form-1{margin: 0 auto;width: 100%;height: 43px;padding: 0 10px;font-size: 1rem;border: 0px solid #D0CFCE;outline: none;border-radius: 10px;box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;color: #000;
&:focus{
border: 1px solid #000;transition: 0.35s ease;color: #000; 
 &::-webkit-input-placeholder{transition: opacity 0.45s ease;opacity: 0;}
 &::-moz-placeholder {transition: opacity 0.45s ease;opacity: 0;}
 &:-ms-placeholder {transition: opacity 0.45s ease;opacity: 0;} 
 }}
.search-form label {width: 100%;}
.screen-reader-text {clip: rect(1px, 1px, 1px, 1px);word-wrap: normal !important;border: 0;-webkit-clip-path: inset(50%);clip-path: inset(50%);height: 1px;margin: -1px;overflow: hidden;padding: 0;position: absolute;width: 1px;}
input#search-form-1 {margin: 0 auto;width: 100%;height: 36px;padding: 0 10px;font-size: 1rem;border: 0px solid #D0CFCE;outline: none;border-radius: 5px;box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;color: #000;}
.search-icon{position: relative;float: right;width: 50px;height: 50px;top: -52px;right: 4px;background-color: #fff;}
.contact .contact-form fieldset input.submit{width: auto;border: 0 solid #007970;border-radius: 3px;background: #007970;display: inline-block;text-decoration: none;color: #ffffff;font-size: 16px;/* border-radius: 18px; */padding: 7px 40px 7px;transition: all .5s;}
.contact .contact-form fieldset input.submit:hover {background: #000000;color: #007970; } 

@media only screen and (max-width: 992px) {
.blog_inner {gap: 15px; }
.blog_text h2{font-size: 28px;}
.blog_full .container{ max-width: 100%;}
.blog_content{padding: 30px 16px 38px;}
.right_blog{padding: 26px 14px 16px;}
}
@media only screen and (max-width: 767px) {
.blog_inner {flex-direction: column; }
.left_blog {width: 100%;}
.right_blog {height: auto; width: 100%;}
.right_blog p,.right_blog ul li {font-size: 15px;}
footer .col-6 p {font-size: 16px;text-align: center;}
.clients p{ margin: 30px 0 28px 0;}
}
