@charset "UTF-8";
/*****************************************************************************
    General Styles
******************************************************************************/
h1,
h2,
h3,
h4 {
  font-family: "Montserrat", "sans-serif";
}

body {
  font-family: "Roboto", "sans-serif";
  font-size: 16px;
}

figcaption {
  color: gray;
  font-style: italic;
}

img {
  border-radius: 4px !important;
}

.container {
  width: 100% !important;
  padding-right: 0px !important;
  padding-left: 0px !important;
}

.row {
  margin-right: 0px !important;
  margin-left: 0px !important;
}

.subheading-std {
  font-family: "Montserrat", sans-serif;
  font-size: 18px;
  color: #7a7a7d;
}



h1.workwithus {
  font-size: 70px;
  font-weight: 900;
}

.white {
  background-color: white;
  text-align: center;
  color: #1e1d28;
}

.nonwhite {
  background-color: #f2f2f2;
  text-align: center;
  color: #1e1d28;
  padding-top: 12px;
}

.dark {
  background-color: #1e1d28;
}

.contactUS {
  text-align: center;
  color: white;
}

span {
  color: #144677;
}

span:hover {
  color: #37b1f6;
}

.square-awards-image {
  width: 100%;
}

#footer img {
  width: 250px;
  height: auto !important;
}

/*********************************************************General Styles End**/
/*****************************************************************************
    Page Header Styles
******************************************************************************/
.header-image,
.media-pages {
  color: white;
  text-align: center;
  background:rgba(49, 48, 48, 0.5) !important;
      
  height: 733px !important;
  padding-top: 10px;
  background-size: cover;
  background-position: center;
  position: relative;
}

.media-pages {
  background-color: #144678;
}

@media (max-width: 581px) {
  .header-image {
    height: 910px !important;
  }
}
.lifestyle-banner {
  color: white;
  text-align: center;
  height: 928px !important;
  padding-top: 140px;
  background-size: cover;
  background-color: #144678;
}

.careersCross {
  color: white;
  text-align: center;
  padding-top: 140px;
  background-size: cover;
  margin-bottom: 25px;
  height: 190px !important;
}

/****************************************************Page Header Styles End**/
/*****************************************************************************
    Navbar Styles
******************************************************************************/
.navbar1 {
  /* overflow: hidden; */
  background-color: transparent;
  font-family: "Montserrat", sans-serif;
  position: fixed;
  width: 100%;
  z-index: 2 !important;
}

.navbar1.scrolled {
  background-color: #1c1c1c !important;
  transition: background-color 200ms linear;
}

.navbar-inverse { background-color: transparent;
  border-color: transparent !important;
}

.nav li {
  padding-top: 6px !important;
}

.nav li a {
  font-weight: bold;
}

.navbar-inverse .navbar-nav > li > a {
  color: white;
  font-size: 14px;
}

.menulinks {
  padding-top: 33px !important;
}

.activeMenu {
  text-decoration: underline;
  text-decoration: white !important;
}

.activesubMenu {
  color: white !important;
  background-color: #1e1e1e;
}

.fa-angle-double-down {
  text-decoration: none !important;
  position: absolute;
  top: 160px;
}

/* Create three equal columns that floats next to each other */
.column {
  float: left;
  width: 33.33%;
  padding: 10px;
  background-color: white;
  height: 250px;
}

.column a {
  float: none;
  color: black;
  padding: 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

.CUClass {
  color: white !important;
  border: 1px solid white;
  border-radius: 30px;
  padding: 3px !important;
  width: 110px;
  margin-top: 31px;
  white-space: nowrap;
}

.CUClass:hover {
  color: black !important;
  background-color: white;
  text-decoration: none;
  border: 1px solid #144677 !important;
}

.CUClass2 {
  border: 1px solid white;
  border-radius: 30px;
  padding: 7px 21px !important;
  width: 110px;
  margin-top: 31px;
  background-color: white;
  color: #144677;
}

.CUClass2:hover {
  color: white;
  background-color: #144677;
  text-decoration: none;
  border: 1px solid #144677;
}

/* navigation mobile */
.mobile-container1 {
  max-width: 480px;
  margin: auto;
  background-color: #555;
  height: 500px;
  color: white;
  border-radius: 10px;
}

.topnav1 {
  overflow: hidden;
  background-color: #333;
  position: fixed;
  z-index: 2;
  width: 100%;
}

.topnav1 #myLinks1 {
  display: none;
}

.topnav1 a {
  color: white;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
  display: block;
}

.topnav1 a.icon {
  background: #333333;
  display: block;
  position: absolute;
  right: 0;
  top: 0;
}

.active1 {
  background-color: #4caf50;
  color: white;
}

.fa-bars {
  font-size: 45px !important;
  color: white;
  padding-top: 13px;
}

.dropdownbtn {
  border-radius: 0px !important;
  text-align: left;
  width: 100%;
  background-color: #333333;
  border-color: #333333;
  font-size: larger;
  padding: 14px 16px !important;
}

.caret1 {
  color: white;
  margin-left: 7px !important;
}

#media-centre .navbar1,
#legal .navbar1,
#industries .navbar1,
#error .navbar1,
#automotive_factory .navbar1,
#alternate-layout .navbar1,
#case-studies .navbar1,
#webinars .navbar1 {
  background-color: #1c1c1c !important;
}

/**********************************************************Navbar Styles End**/
/*****************************************************************************
    Industries We Serve Banner Styles
******************************************************************************/
.industry-card {
  width: 25%;
  height: 370px;
  float: left;
  text-align: center;
  overflow: hidden;
  position: relative;
}

.industry-image {
  width: 100%;
  height: 100%;
  background-color: #144678;
  /* fallback color */
  background-position: center;
  background-size: cover;
}

.industry-card .industry-image,
.industry-card .industry-image {
  transform: scale(1);
  transition: all 0.5s ease;
}

.industry-card:hover .industry-image,
.industry-card:focus .industry-image {
  transform: scale(1.2);
  transition: all 0.5s ease;
}

.industry-card p {
  color: #ffffff;
  position: absolute;
  left: 0;
  right: 0;
  margin-top: 35%;
  margin-bottom: 35%;
  font-family: "montserrat", "sans-serif";
  font-size: 20px;
  font-weight: 600;
}

.industry-image::before {
  content: "";
  display: block;
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #00000057;
  transition: all 0.5s ease;
  z-index: -1;
}

.industry-card:hover .industry-image:before,
.industry-card:focus .industry-image:before {
  background-color: #000000ae;
  transition: all 0.5s ease;
}

.industries-container h2 {
  color: #ffffff;
  text-align: center;
  margin-bottom: 0;
  padding: 20px !important;
  position: absolute;
  top: 38%;
  left: 15%;
  width: 70%;
  z-index: 1;
  font-weight: 900;
}

.industries-container {
  position: relative;
  background-color: #ffffff;
  padding: 50px 0;
}

.industries-container span {
  display: none;
}

@media (max-width: 1200px) {
  .industries-container h2 {
    top: 41%;
  }

  .industry-card p {
    margin-top: 64%;
    margin-bottom: 64%;
  }
}
@media (max-width: 900px) {
  .industry-card {
    width: 50%;
    height: 200px !important;
  }

  .industries-container h2 {
    position: relative;
    background-color: unset;
    color: unset;
    text-transform: unset;
  }

  .industries-container span {
    display: inline-block;
  }

  .industries-container {
    padding-top: 50px;
  }

  .industry-card p {
    margin-top: 25% !important;
    margin-bottom: 25% !important;
  }
}
@media (max-width: 500px) {
  .industry-card p {
    font-size: 16px;
  }
}
/**************************************Industries We Serve Banner Styles End**/
/*****************************************************************************
    Industries We Serve Carousel Styles
******************************************************************************/
#industries-glider .industry-card.industry-carousel {
  width: 100%;
}
#industries-glider .industry-card.industry-carousel p {
  transform: scale(1);
  transition: all 0.5s ease;
}
#industries-glider .industry-card.industry-carousel:hover p {
  transform: scale(0.8);
  transition: all 0.5s ease;
}
#industries-glider #industries-glider {
  max-height: 600px;
  overflow: hidden;
}
#industries-glider .glider-prev,
#industries-glider .glider-next {
  top: 50%;
  transform: translateY(-50%);
}
#industries-glider .glider-prev:hover,
#industries-glider .glider-next:hover,
#industries-glider .glider-prev:focus,
#industries-glider .glider-next:focus {
  color: #144678;
}
#industries-glider .glider-dot:hover,
#industries-glider .glider-dot:focus,
#industries-glider .glider-dot.active {
  background: #144678;
}
#industries-glider .glider-next {
  right: -4%;
  left: auto;
}
#industries-glider .glider-prev {
  left: -5%;
  right: auto;
}
#industries-glider .glider-contain {
  width: 90%;
  max-width: 1400px;
  margin: 0 auto;
}
#industries-glider .glider-slide {
  min-height: 150px;
}
#industries-glider .card {
  color: #ffffff;
  margin: 10px;
  width: 430px;
  float: left;
}
@media (max-width: 1200px) {
  #industries-glider .industry-card.industry-carousel p {
    margin-top: 20%;
    margin-bottom: 20%;
  }
}
@media (max-width: 900px) {
  #industries-glider .industry-card.industry-carousel {
    height: 370px !important;
  }
}
@media (max-width: 800px) {
  #industries-glider .card {
    width: 98%;
  }
}
#industries-glider .industry-card.industry-carousel span {
  color: #ffffff;
  opacity: 0;
  transform: scale(1);
  color: #ffffff;
  position: absolute;
  left: 0;
  right: 0;
  margin-top: 35%;
  margin-bottom: 35%;
  font-family: "montserrat", "sans-serif";
  font-size: 20px;
  font-weight: 600;
  transition: all 0.5s ease;
}
#industries-glider .industry-card.industry-carousel:hover span {
  opacity: 1;
  transform: scale(0.6);
  transition: all 0.5s ease;
}
#industries-glider .industry-card.industry-carousel {
  border-radius: 4px;
}

/************************************Industries We Serve Carousel Styles End**/
/*****************************************************************************
    Industries We Serve Carousel Styles
******************************************************************************/
#industries-glider .industry-card.industry-carousel {
  width: 100%;
}
#industries-glider .industry-card.industry-carousel p {
  transform: scale(1);
  transition: all 0.5s ease;
}
#industries-glider .industry-card.industry-carousel:hover p {
  transform: scale(0.8);
  transition: all 0.5s ease;
}
#industries-glider #industries-glider {
  max-height: 600px;
  overflow: hidden;
}
#industries-glider .glider-prev,
#industries-glider .glider-next {
  top: 50%;
  transform: translateY(-50%);
}
#industries-glider .glider-prev:hover,
#industries-glider .glider-next:hover,
#industries-glider .glider-prev:focus,
#industries-glider .glider-next:focus {
  color: #144678;
}
#industries-glider .glider-dot:hover,
#industries-glider .glider-dot:focus,
#industries-glider .glider-dot.active {
  background: #144678;
}
#industries-glider .glider-next {
  right: -4%;
  left: auto;
}
#industries-glider .glider-prev {
  left: -5%;
  right: auto;
}
#industries-glider .glider-contain {
  width: 90%;
  max-width: 1400px;
  margin: 0 auto;
}
#industries-glider .glider-slide {
  min-height: 150px;
}
#industries-glider .card {
  color: #ffffff;
  margin: 10px;
  width: 430px;
  float: left;
}
@media (max-width: 1200px) {
  #industries-glider .industry-card.industry-carousel p {
    margin-top: 20%;
    margin-bottom: 20%;
  }
}
@media (max-width: 900px) {
  #industries-glider .industry-card.industry-carousel {
    height: 370px !important;
  }
}
@media (max-width: 800px) {
  #industries-glider .card {
    width: 98%;
  }
}
#industries-glider .industry-card.industry-carousel span {
  color: #ffffff;
  opacity: 0;
  transform: scale(1);
  color: #ffffff;
  position: absolute;
  left: 0;
  right: 0;
  margin-top: 35%;
  margin-bottom: 35%;
  font-family: "montserrat", "sans-serif";
  font-size: 20px;
  font-weight: 600;
  transition: all 0.5s ease;
}
#industries-glider .industry-card.industry-carousel:hover span {
  opacity: 1;
  transform: scale(0.6);
  transition: all 0.5s ease;
}
#industries-glider .industry-card.industry-carousel {
  border-radius: 4px;
}

/************************************Industries We Serve Carousel Styles End**/
/*****************************************************************************
    Industries Page Styles
******************************************************************************/
#industries .industry-page-contents h2 {
  color: #ffffff;
  text-align: left;
  padding-left: 20px;
  margin-top: 70px;
}
#industries .industry-page-contents p {
  text-align: left;
  padding-left: 20px;
  padding-top: 20px;
}
#industries .dark-overlay {
  height: 100%;
  width: 100%;
  overflow: hidden;
  background-color: #000000ae;
}
#industries .header-image {
  height: 550px !important;
}
#industries .industry-page-contents {
  margin-top: 50px;
}

/*************************************************Industries Page Styles End**/
/*****************************************************************************
    Media Centre Styles
******************************************************************************/
#media .col-lg-8 {
  text-align: justify;
}
#media p:not(.foot p) {
  margin: 0px 0 25px;
}

#media .product-desc {
  padding: 0 15px;
}

#media-centre h3 a {
  color: #1e1d28;
}

#media-centre .filterDiv,
#webinars .filterDiv {
  min-height: 475px;
  width: 100%;
  display: inline-block;
  margin: 5px;
  display: none;
  padding: 3px;
  background-color: #f7f7f7;
  color: #1c1c1c !important;
  margin-bottom: 14px;
}

#media-centre .product-desc.center.media-article-card,
#webinars .product-desc.center.media-article-card {
  padding: 4px;
}

#media-centre .show,
#webinars .show {
  display: block;
}

#media-centre .hide,
#webinars .hide {
  display: none !important;
}

#media-centre .btn.active,
#webinars .btn.active {
  font-weight: bold;
  -webkit-box-shadow: inset 0 0px 0px rgba(0, 0, 0, 0.125);
  box-shadow: inset 0 0px 0px rgba(0, 0, 0, 0.125);
}

#media-centre .btn,
#webinars .btnstyle {
  color: #1c1c1c;
}

#media-centre .btn:hover,
#webinars .btn:hover {
  font-weight: bold;
}

#media-centre .clear,
#webinars .clear {
  color: red !important;
  font-size: smaller;
  text-decoration: none;
  display: none;
  float: right;
}

#media-centre .clearS,
#webinars .clearS {
  color: red !important;
  font-size: smaller;
  text-decoration: none;
  display: block;
  float: right;
}

#media-centre .clearS:hover,
#webinars .clearS:hover {
  color: #37b1f6 !important;
  font-size: smaller;
  text-decoration: none;
  display: block;
  float: right;
  cursor: pointer;
}

#media-centre .clear:hover,
#webinars .clear:hover {
  text-decoration: none;
  color: red;
}

#media-centre .clear:active,
#webinars .clear:active {
  text-decoration: none;
  color: red;
}

#media-centre .product-image,
#webinars .product-image {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
}

#media-centre .product-image > a,
.product-image .slide a,
.product-image img,
#webinars .product-image > a {
  display: block;
  width: auto;
}

#media-centre .product-desc > a,
#webinars .product-desc > a {
  color: #144677;
}

#media-centre .product-desc > a:hover,
#webinars .prodcut-desc > a:hover {
  color: #37b1f6;
}

#media-centre span:not(.icon-bar):not(.caret),
#webinars span:not(.icon-bar):not(.caret) {
  position: absolute;
  left: auto;
  right: 0;
  font-size: 11px;
  width: 22px;
  height: 22px;
  line-height: 22px;
  text-align: center;
  color: #777;
  background-color: #eee;
  border-radius: 50%;
}

#media-centre .media-date,
#webinars .media-date {
  font-size: smaller;
  padding-top: 4px;
  padding-bottom: 6px;
}

#media-centre .wrap-content,
#webinars .wrap-content {
  bottom: 10px !important;
  position: relative;
  padding-left: 10px;
  padding-right: 10px;
}

#media-centre .wrap-content a,
#webinars .wrap-content a {
  color: #337ab7 !important;
}

#media-centre .wrap-content a:hover,
#webinars .wrap-content a:hover {
  color: #144677 !important;
}

#media-centre .product-title h3,
#webinars .product-title h3 {
  font-size: 22px;
}

#media-centre .abs-test,
#webinars .abs-test {
  position: absolute;
  bottom: 0;
  left: 0;
  transform: translate(30px, -10px);
  margin-right: 40px;
  margin-left: -10px;
}

#media-centre .product-image img,
#webinars .product-image img {
  margin: auto;
  width: 100%;
  height: auto;
}

@media (max-width: 1487px) {
  #media-centre .col-lg-1,
#webinars .col-lg-1 {
    display: none !important;
  }

  #media-centre .col-lg-8,
#webinars .col-lg-8 {
    width: 83.3333% !important;
  }

  #media-centre .col-lg-10,
#webinars .col-lg-10 {
    width: 100%;
  }
}
@media (max-width: 1199px) {
  .media-filter {
    margin-top: 55px;
  }

  #media-centre span:not(.icon-bar),
#webinars span:not(.icon-bar) {
    position: relative;
    margin-right: 5px;
    font-size: unset;
    width: unset;
    height: unset;
    line-height: unset;
    background-color: unset;
    float: left;
  }

  #media-centre .col-lg-8,
#webinars .col-lg-8 {
    width: 100% !important;
  }

  #media-centre a.btn,
#webinars a.btn {
    float: left;
    background-color: #eee !important;
    margin-right: 5px;
    margin-bottom: 5px;
    border-radius: 35px;
  }

  #media-centre .col-lg-2,
#webinars .col-lg-2 {
    min-height: 115px;
  }

  #media-centre .col-lg-4.filterhere,
#webinars .col-lg-4.filterhere {
    width: 33%;
    float: left;
  }
}
@media (max-width: 955px) {
  #media-centre .col-lg-4.filterhere,
#webinars .col-lg-4.filterhere {
    width: 50%;
  }
}
@media (max-width: 856px) {
  #media-centre .col-lg-2,
#webinars .col-lg-2 {
    min-height: 150px;
  }
}
@media (max-width: 662px) {
  #media-centre .col-lg-2,
#webinars .col-lg-2 {
    min-height: 190px;
  }

  #media-centre .col-lg-4.filterhere,
#webinars .col-lg-4.filterhere {
    width: 100%;
  }

  #media-centre .filterDiv,
#webinars .filterDiv {
    min-height: 520px;
  }
}
@media (max-width: 543px) {
  #media-centre .col-lg-2,
#webinars .col-lg-2 {
    min-height: 230px;
  }

  #media-centre .filterDiv,
#webinars .filterDiv {
    min-height: 475px;
  }
}
/****************************************************Media Centre Styles End**/
/*****************************************************************************
    Featured Container Styles
******************************************************************************/
.featured-container {
  padding: 50px;
  color: #ffffff;
}

.featured-container p.media-card-content {
  text-align: left !important;
}

.featured-container h2 {
  color: #ffffff;
  text-align: center;
}

.featured-container img {
  width: 100%;
  height: auto;
}

.featured-container .custom-filter {
  display: none;
}

.featured-container a {
  text-decoration: none;
  color: #ffffff;
}

.featured-container a:hover {
  text-decoration: none;
  color: #00aad4;
}

.featured-container .hr {
  padding-right: 10px;
  padding-left: 10px;
}

@media screen and (min-width: 768px) {
  .featured-container .carousel-control .glyphicon-chevron-right,
.featured-container .carousel-control .icon-next {
    margin-right: 40px;
  }

  .featured-container .carousel-control .glyphicon-chevron-left,
.featured-container .carousel-control .icon-prev {
    margin-left: 40px;
  }
}
.featured-container .carousel-control.right {
  right: 0;
  left: auto;
  background-image: unset;
  margin-right: -200px;
}

.featured-container .carousel-control.left {
  background-repeat: repeat-x;
  margin-left: -200px;
}

.featured-container a.left.carousel-control,
.featured-container a.right.carousel-control {
  margin-top: 11%;
}

.featured-container .col-lg-6.filterhere {
  height: 400px;
}

.featured-container .abs-test {
  position: absolute;
  bottom: 0;
}

.featured-container img {
  border-radius: 4px;
}

.featured-container .hr hr {
  border-top: 2px solid #00aad4;
}

.featured-container .row .col-md-4 img {
  width: 100%;
}

@media (min-width: 740px) and (max-width: 991px) {
  .featured-container .col-lg-6.filterhere {
    height: 75%;
  }
}
@media (max-width: 740px) {
  .featured-container .col-lg-6.filterhere {
    height: 65%;
  }
}
@media (max-width: 400px) {
  .row.dark.featured-container.lg-hide {
    padding: 50px 0;
  }
}
.row.dark.featured-container.md-hide {
  overflow: hidden;
}

.featured-content-card .col-lg-6 {
  width: 33.3% !important;
}

.featured-content-card .col-lg-6 {
  position: relative;
  min-height: 1px;
  padding-right: 0;
  padding-left: 0;
}

.featured-content-card .hr {
  padding-right: 0;
  padding-left: 0;
}

.featured-content-card .filterhere {
  background-color: #ffffff;
  color: #1e1d28;
}

.featured-content-card a {
  color: #1e1d28;
}

.featured-content-card h3 {
  color: #1e1d28;
}

.featured-content-card .product-image {
  height: 43.5%;
  overflow: hidden;
}

.featured-content-card img {
  border-radius: none;
}

.featured-content-card .col-lg-6 {
  border-radius: 5px;
}

.featured-content-card .media-card-content,
.featured-content-card .abs-test {
  padding: 0 15px;
}

.tagged-content {
  position: absolute;
  z-index: 1;
  padding: 5px 20px;
  border-radius: 20px;
  background-color: #00aad4;
  text-transform: uppercase;
  font-weight: 600;
  transform: translate(25%, -15px);
}

@media (max-width: 1390px) {
  .featured-content-card .product-image {
    height: 28.5%;
  }
}
.featured-container-3 {
  overflow: hidden;
  color: #000000;
}

.featured-container-3 p {
  text-align: left;
}

.featured-container-3 h2 {
  color: #000000;
  text-align: center;
  margin-top: 0;
}

.featured-container-3 h3 {
  text-align: left;
  color: #000000;
}

.featured-container-3 .featured-article img {
  width: 100%;
  height: auto;
  border-radius: 4px;
}

.featured-container-3 .standard-articles .media-image {
  width: 100px;
  height: 100px;
  border-radius: 4px;
  overflow: hidden;
  margin: 0;
  position: absolute;
}

.featured-container-3 .media-content {
  margin-left: 120px;
}

.featured-container-3 .some-card {
  width: 100%;
  display: inline-block;
}

.featured-container-3 .some-card:not(.no) {
  margin-bottom: 10px;
  padding-bottom: 10px;
  border-bottom: 1px dashed #999999;
}

.featured-container-3 .date {
  font-family: "Montserrat", "sans-serif";
}

.featured-container-3 hr {
  width: 40%;
  margin-left: auto;
  margin-right: auto;
}

.featured-container-3 .tagged-content-media {
  padding: 10px 20px;
  border-radius: 20px;
  background-color: #00aad4;
  width: 200px;
  text-align: center;
  margin: 5px;
  position: absolute;
  z-index: 1;
  margin-top: -20px;
}

.featured-container-3 {
  padding: 50px 0;
}

.featured-container-3 a {
  color: #ffffff;
}

.featured-container-3 .featured-article img {
  filter: grayscale(50%);
  transform: scale(1);
  transition: all 0.5s ease;
}

.featured-container-3 .featured-article img:hover {
  filter: grayscale(0%);
  transform: scale(1.1);
  transition: all 0.5s ease;
}

.featured-container-3 .featured-article .media-card {
  width: 100%;
  height: auto;
  overflow: hidden;
}

.featured-container-3 .featured-article .media-card:hover {
  border-radius: 4px;
}

.featured-container-3 a {
  color: #000000;
  text-decoration: none;
}

.featured-container-3 a:hover {
  color: #00aad4;
}

.featured-container-3 .date {
  margin: 15px 0;
  text-align: left;
}

.featured-container-3 .readmore {
  padding: 10px 20px;
  border: 1px solid #999999;
  border-radius: 20px;
  font-weight: 600;
  transition: all 0.5s ease;
}

.featured-container-3 .readmore:hover {
  background-color: #144678;
  color: #ffffff;
  border: 1px solid #144678;
  font-weight: 600;
  transition: all 0.5s ease;
}

.featured-container-3 a p {
  color: #000000;
}

.featured-container-3 .standard-articles {
  height: 575px;
  overflow-y: scroll;
}

.featured-container-3 ::-webkit-scrollbar {
  width: 10px;
}

.featured-container-3 ::-webkit-scrollbar-track {
  background-color: #f7f7f7;
  border-radius: 10px;
}

.featured-container-3 ::-webkit-scrollbar-thumb {
  background: #dddddd;
  border-radius: 10px;
}

.featured-container-3 ::-webkit-scrollbar-thumb:hover {
  background: #cccccc;
}

.featured-container-3 .tagged-new {
  background-color: #00aa00;
  width: 80px;
  text-align: center;
  border-radius: 20px;
  position: absolute;
  margin-top: 90px;
  margin-left: 10px;
  overflow: auto;
  color: #ffffff;
  text-transform: uppercase;
  z-index: 1;
}

.featured-container-3 .media-image img {
  height: 100%;
}

/**********************************************Featured Container Styles End**/
/*****************************************************************************
    Media Slider Styles
******************************************************************************/
[class^=swiper-button-] {
  transition: all 0.3s ease;
}

.swiper-slide {
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

*,
*:before,
*:after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.swiper-container {
  width: 80%;
  height: 100vh;
  float: left;
  transition: opacity 0.6s ease, transform 0.3s ease;
}
.swiper-container.nav-slider {
  width: 20%;
  padding-left: 5px;
}
.swiper-container.nav-slider .swiper-slide {
  cursor: pointer;
  opacity: 0.4;
  transition: opacity 0.3s ease;
}
.swiper-container.nav-slider .swiper-slide.swiper-slide-active {
  opacity: 1;
}
.swiper-container.nav-slider .swiper-slide .content {
  width: 100%;
}
.swiper-container.nav-slider .swiper-slide .content .title {
  font-size: 20px;
}
.swiper-container:hover .swiper-button-prev,
.swiper-container:hover .swiper-button-next {
  transform: translateX(0);
  opacity: 1;
  visibility: visible;
}
.swiper-container.loading {
  opacity: 0;
  visibility: hidden;
}

.swiper-slide {
  overflow: hidden;
}
.swiper-slide .slide-bgimg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center;
  background-size: cover;
}
.swiper-slide .entity-img {
  display: none;
}
.swiper-slide .content {
  position: absolute;
  top: 40%;
  left: 0;
  width: 50%;
  padding-left: 5%;
  color: #fff;
}
.swiper-slide .content .title {
  font-size: 2.6em;
  font-weight: bold;
  margin-bottom: 30px;
}
.swiper-slide .content .caption {
  display: block;
  font-size: 13px;
  line-height: 1.4;
  transform: translateX(50px);
  opacity: 0;
  transition: opacity 0.3s ease, transform 0.7s ease;
}
.swiper-slide .content .caption.show {
  transform: translateX(0);
  opacity: 1;
}

[class^=swiper-button-] {
  width: 44px;
  opacity: 0;
  visibility: hidden;
}

.swiper-button-prev {
  transform: translateX(50px);
}

.swiper-button-next {
  transform: translateX(-50px);
}

/****************************************************Media Slider Styles End**/
/*****************************************************************************
    Breadcrumbs Styles
******************************************************************************/
.breadcrumbs.row {
  background-color: #000000ae;
  color: #ffffff;
  padding: 10px;
  margin-top: -42px;
}

.breadcrumbs p {
  margin-bottom: 0 !important;
}

/*****************************************************Breadcrumbs Styles End**/
/*****************************************************************************
    Legal Styles
******************************************************************************/
#legal p {
  line-height: 1.8;
}
#legal .h2small {
  font-size: 40px;
}
#legal .red {
  color: red;
}

/***********************************************************Legal Styles End**/
/*****************************************************************************
    Webinars Styles
******************************************************************************/
.card.webinar-card {
  width: 600px;
  background-color: #ffffff;
}

.card a:hover {
  text-decoration: none;
}

.webinars a {
  white-space: unset !important;
}

.webinars button {
  width: unset;
  margin-top: 10px;
}

@media (min-width: 768px) and (max-width: 865px) {
  .card.webinar-card {
    width: 600px;
  }
}
@media (max-width: 767px) {
  .card.webinar-card {
    width: 100%;
  }
}
#webinars .filterDiv img {
  width: 100%;
  height: auto;
}
#webinars .filterDiv {
  min-height: 330px !important;
  background-color: #ffffff !important;
  text-align: center;
  padding-top: 15px !important;
}
#webinars body {
  background-color: #f7f7f7;
}

/********************************************************Webinars Styles End**/
/*****************************************************************************
    Media Pages BlockQuote Styles
******************************************************************************/
blockquote {
  font-weight: 100;
  font-size: 2rem;
  line-height: 1.4;
  position: relative;
  margin: 0;
  padding: 0.5rem;
}
blockquote em {
  font-family: "Roboto", sans-serif;
  font-weight: 500;
}
blockquote em:before {
  content: "- ";
}
blockquote em:after {
  content: " -";
}

blockquote:before,
blockquote:after {
  position: absolute;
  color: #00aad4;
  font-size: 8rem;
  width: 4rem;
  height: 4rem;
}

blockquote:before {
  content: "“";
  left: -5rem;
  top: -2rem;
}

blockquote:after {
  content: "”";
  right: -5rem;
  bottom: 1rem;
}

blockquote {
  font-family: "Montserrat", sans-serif;
  font-weight: 800;
  color: #3f3f5a;
  flex-direction: column;
  align-items: center;
  text-align: center;
  justify-content: center;
  border-left: unset;
}

.blockquote-wrapper {
  margin: 30px auto;
  width: 70%;
}

#media .col-lg-6.col-md-6 {
  padding-left: 0;
}

/******************************************Media Pages BlockQuote Styles End**/
/*****************************************************************************
    Automotive Factory Floor Styles
******************************************************************************/
.spacer {
  width: 100%;
  height: 100px;
}

#asrs_text_raw:hover,
#final_assembly_text_raw:hover,
#yard_text_raw:hover,
#wheel_tyre_text_raw:hover,
#paint_shop_text_raw:hover,
#transfer_systems_text_raw:hover,
#body_shop_text_raw:hover,
#press_shop_text_raw:hover,
#fluid_fill_text_raw:hover,
#vehicle_programming_text_raw:hover,
#wheel_headlight_alignment_text_raw:hover,
#roll_brake_text_raw:hover,
#water_testing_text_raw:hover,
#storage_text_raw:hover,
#vehicle_protection_text_raw:hover,
#rfid_text_raw:hover,
#vehicle_tracking_text_raw:hover,
#ecoat_dipping_text_raw:hover,
#robotic_painting_text_raw:hover,
#paint_shop_part_transfer_conveyors_text_raw:hover,
#paint_shop_rollerbeds_text_raw:hover,
#paint_shop_skids_text_raw:hover,
#overhead_conveyors_text_raw:hover,
#three_rail_conveyors_text_raw:hover,
#mono_rail_conveyors_text_raw:hover,
#rubber_conveyors_text_raw:hover,
#skid_conveyors_text_raw:hover,
#robotic_welding_text_raw:hover,
#body_shop_part_transfer_conveyors_text_raw:hover,
#body_shop_rollerbeds_text_raw:hover,
#body_shop_skids_text_raw:hover,
#scrap_conveyors_text_raw:hover,
#press_transfer_systems_text_raw:hover,
#washing_plant_text_raw:hover,
#oiling_facilities_text_raw:hover {
  fill: #ffcc00 !important;
}

/****************************************Automotive Factory Floor Styles End**/
/*****************************************************************************
    Related Posts Styles
******************************************************************************/
#related-posts img {
  width: 100%;
  height: auto;
}

#related-posts .hr {
  padding: unset !important;
}

#related-posts p.custom-filter.left {
  display: none;
}

#related-posts .filterDiv.hr {
  background-color: #f7f7f7;
  height: 400px;
}

#related-posts .read-more {
  text-align: center;
}

/***************************************************Related Posts Styles End**/
/*****************************************************************************
    Insights Styles
******************************************************************************/
#insights .feature-section-container {
  display: flex;
}
#insights .feature-section-item {
  width: 40%;
  min-height: 380px;
}
#insights .feature-section-item.featured {
  width: 100%;
  min-height: 480px;
}
#insights .feature-section-inner-item {
  width: 100%;
  height: 100%;
}
#insights .feature-section-item.feature-section-container {
  flex-direction: column;
}
#insights .feature-section-card {
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-position: center center;
  background-size: cover;
  flex-direction: column;
  color: #ffffff;
  position: relative;
}
#insights .feature-section-card h3 {
  color: #ffffff;
}
#insights #feature-section-card-gallery a:hover {
  text-decoration: none;
}
#insights #feature-section-card-gallery .menulinks.CUClass.services {
  width: unset;
}
#insights .feature-section-inner-item.mobi-reset {
  margin-right: 25px;
  width: 200%;
}
@media (max-width: 995px) {
  #insights .feature-section-container {
    flex-direction: column;
  }
  #insights .feature-section-item {
    width: 100% !important;
    height: 300px !important;
    margin-bottom: 10px;
  }
  #insights .feature-section-inner-item {
    height: 300px;
  }
  #insights .feature-section-item.featured {
    margin-left: unset !important;
  }
  #insights .feature-section-item.feature-section-container.rowise {
    flex-direction: column !important;
  }
  #insights .feature-section-inner-item.mobi-reset {
    width: 100% !important;
    margin-bottom: 10px;
  }
}
#insights .overlay {
  background-color: #00000021;
  height: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  opacity: 1;
  transition: all 0.5s ease;
  position: absolute;
  z-index: 0;
}
#insights .overlay:hover {
  opacity: 0;
  transition: all 0.5s ease;
}
#insights .feature-section-item.feature-section-container.rowise {
  flex-direction: row;
  width: 100%;
}
#insights .btn-ghost {
  border: 2px solid white;
  color: white;
  padding: 10px;
  border-radius: 0;
  background-color: transparent;
  transition: all 0.5s ease;
}
#insights .btn-ghost:hover {
  background-color: #ffffff;
  color: #000000;
  font-weight: 600;
  transition: all 0.5s ease;
}
#insights .card-content {
  z-index: 1;
}
#insights .feature-section-inner-item,
#insights .featured {
  border-radius: 4px;
  overflow: hidden;
}
#insights .feature-section-container.parent {
  margin-bottom: 25px;
}
#insights .scale {
  transform: scale(1);
  transition: all 0.5s ease;
}
#insights .scale:hover {
  transform: scale(1.03);
  transition: all 0.5s ease;
}
#insights .scale .card-content {
  transform: scale(1);
  transition: all 0.5s ease;
}
#insights .scale:hover .card-content {
  transform: scale(0.97);
  transition: all 0.5s ease;
}

/********************************************************Insights Styles End**/
/*****************************************************************************
    Button Styles
******************************************************************************/
.button-slide {
  border-radius: 4px;
  border: none;
  width: 200px;
  transition: all 0.5s ease;
  background-color: transparent;
}

.button-slide span {
  cursor: pointer;
  display: inline-block;
  position: relative;
  transition: 0.5s;
}

.button-slide span:after {
  content: "»";
  position: absolute;
  opacity: 0;
  top: 0;
  right: -20px;
  transition: 0.5s;
}

.button-slide:hover span {
  padding-right: 25px;
}

.button-slide:hover span:after {
  opacity: 1;
  right: 0;
}

/**********************************************************Button Styles End**/
/*****************************************************************************
    Case Study Styles
******************************************************************************/
.case-study a:hover {
  text-decoration: none !important;
  color: #000000;
}

.case-study a {
  color: #000000;
}

#case-studies .product-image img {
  width: 100%;
}
#case-studies .case-study img {
  width: 100%;
  height: auto;
}
#case-studies .case-study .card {
  min-height: 465px;
  background-color: #f7f7f7;
  margin-bottom: 15px;
}
#case-studies .card-content {
  padding: 0 15px;
}

/******************************************************Case Study Styles End**/
/*****************************************************************************
    Services Row Styles
******************************************************************************/
.col-md-4.card-link {
  min-height: 335px;
}

#software-development .col-md-4.card-link {
  min-height: 340px;
}

@media (max-width: 1685px) {
  .col-md-4.card-link {
    min-height: 350px;
  }

  #software-development .col-md-4.card-link {
    min-height: 405px;
  }
}
/*
@media (max-width: 991px) {
  .col-md-4.card-link {
    min-height: unset !important;
  }
}
*/
@media (max-width: 800px) {
  .col-md-4.card-link {
    width: 100% !important;
  }
}
/****************************************************Services Row Styles End**/
/*****************************************************************************
    Socail Media Share Styles
******************************************************************************/
.media-share {
  margin: 50px;
}

.media-share p {
  font-family: "Roboto", sans-serif;
  font-weight: 600;
  font-size: 18px;
}

.media-share-wrapper {
  margin: 50px 0;
  border-top: 2px solid #eee;
  border-bottom: 2px solid #eee;
}

#social-links ul {
  margin: 0;
  padding: 0;
  display: flex;
  position: absolute;
  top: 50%;
  right: -25%;
  transform: translate(-50%, -25%);
}

#social-links ul li {
  list-style: none;
  margin: 0 15px;
}

#social-links ul li a {
  position: relative;
  display: block;
  width: 60px;
  height: 60px;
  text-align: center;
  line-height: 63px;
  background: #eee;
  border-radius: 50%;
  font-size: 30px;
  color: #666;
  transition: 0.5s;
}

#social-links ul li a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: #144678;
  transition: 0.5s;
  transform: scale(0.9);
  z-index: -1;
}

#social-links ul li a:hover::before {
  transform: scale(1.1);
}

#social-links ul li a:hover {
  color: #144678;
}

@media (max-width: 768px) {
  .media-share p {
    margin: 0 0 50px;
    text-align: center;
  }

  #social-links ul {
    right: 10%;
  }
}
@media (max-width: 645px) {
  #social-links ul {
    right: -15%;
  }
}
/**********************************************Social Media Share Styles End**/
/*****************************************************************************
    Lifestyle Styles
******************************************************************************/
#lifestyle .portal:hover {
  background-color: #37b1f6;
}
#lifestyle .career-btn {
  padding: 15px;
}
#lifestyle .career-btn.cbr {
  text-align: right;
}
#lifestyle .career-btn.cbl {
  text-align: left;
}
@media (max-width: 1199px) {
  #lifestyle .career-btn.cbr,
#lifestyle .career-btn.cbl {
    text-align: center;
  }
}

/*******************************************************Lifestyle Styles End**/
/*****************************************************************************
    Awards Styles
******************************************************************************/
#awards {
  /* Modal Content (image) */
  /* Caption of Modal Image */
  /* Add Animation */
  /*Close Button*/
  /* 100% Image Width on Smaller Screens */
}
#awards .myImg {
  border-radius: 5px;
  cursor: pointer;
  transition: 0.3s;
}
#awards .myImg:hover {
  opacity: 0.7;
}
#awards .modal {
  display: none;
  position: fixed;
  z-index: 1;
  padding-top: 100px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: black;
  background-color: rgba(0, 0, 0, 0.9);
}
#awards .modal-content {
  margin: auto;
  display: block;
  width: 30%;
  max-width: 700px;
}
#awards #caption {
  margin: auto;
  display: block;
  width: 80%;
  max-width: 700px;
  text-align: center;
  color: #ccc;
  padding: 10px 0;
  height: 150px;
}
#awards .modal-content,
#awards #caption {
  -webkit-animation-name: zoom;
  -webkit-animation-duration: 0.6s;
  animation-name: zoom;
  animation-duration: 0.6s;
}
@-webkit-keyframes zoom {
  from {
    -webkit-transform: scale(0);
  }
  to {
    -webkit-transform: scale(1);
  }
}
@keyframes zoom {
  from {
    transform: scale(0);
  }
  to {
    transform: scale(1);
  }
}
#awards .close {
  position: absolute;
  top: 15px;
  right: 15px;
  color: #f1f1f1;
  font-size: 20px;
  font-weight: bold;
  transition: 0.3s;
  border-radius: 4px;
}
#awards .close:hover,
#awards .close:focus {
  color: #bbbbbb;
  text-decoration: none;
  cursor: pointer;
}
@media only screen and (max-width: 700px) {
  #awards .modal-content {
    width: 100%;
  }
}

#awards-banner h2 {
  text-align: center;
  /*color: #ffffff;*/
}

#awards-banner img {
  width: 100%;
  height: auto;
  opacity: 1;
  transition: 1s all ease;
}

#awards-banner img:hover {
  opacity: 0.6;
  transition: 1s all ease;
}

#awards-banner.container {
  /*background-color: #1e1d28;*/
  background-color: #f0efff;
  padding: 50px 0;
}

/*Start Gallery*/
#gallery {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
}
#gallery > div {
  width: 18%;
  margin: 1%;
}
@media (max-width: 350px) {
  #gallery > div {
    width: 98%;
  }
}
@media (max-width: 1200px) {
  #gallery {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
  }
  #gallery > div {
    width: 23%;
    margin: 1%;
  }
}
@media (max-width: 1200px) and (max-width: 350px) {
  #gallery > div {
    width: 98%;
  }
}
@media (max-width: 800px) {
  #gallery {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
  }
  #gallery > div {
    width: 48%;
    margin: 1%;
  }
}
@media (max-width: 800px) and (max-width: 350px) {
  #gallery > div {
    width: 98%;
  }
}
#gallery > div:nth-child(6n+1) {
  grid-column: span 2;
  grid-row: span 2;
}
#gallery > div:nth-child(2) {
  grid-column: span 3;
  grid-row: span 3;
}
#gallery > div:nth-child(4) {
  grid-column: span 1;
  grid-row: span 2;
}
#gallery > div > a {
  opacity: 0;
  position: absolute;
  padding: 2rem;
  mix-blend-mode: difference;
  width: 100%;
  height: 100%;
  transition: all ease 1s;
}
#gallery > div > img {
  width: 100%;
  min-height: 100%;
  transition: all ease 1s;
}
#gallery > div:hover img {
  filter: blur(4px);
}
#gallery > div:hover a {
  opacity: 1;
}
#gallery > div {
  overflow: hidden;
  position: relative;
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.2), 0 3px 20px 0 rgba(0, 0, 0, 0.19);
}
#gallery div,
#gallery a {
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
}

[id^=lightbox-] {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  opacity: 0;
  transition: opacity 450ms ease-in-out;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
[id^=lightbox-]:target {
  opacity: 1;
  pointer-events: inherit;
  z-index: 2;
}
[id^=lightbox-]:target img {
  filter: blur(0);
}
[id^=lightbox-] .content {
  max-width: 90%;
  position: relative;
  color: #fff;
}
[id^=lightbox-] .content:hover > a.close {
  opacity: 1;
  transform: scale(1, 1);
}
[id^=lightbox-] .content:hover > .title {
  opacity: 1;
  transform: translateY(-3px);
}
[id^=lightbox-] .content:hover > .title::after {
  opacity: 1;
}
[id^=lightbox-] .content > * {
  transition: all 450ms ease-in-out;
}
[id^=lightbox-] .title {
  display: block;
  margin: 0;
  padding: 1em;
  position: absolute;
  bottom: 0;
  width: 100%;
  transform: translateY(50%);
  font-size: 1.5em;
  opacity: 0;
}
[id^=lightbox-] .title::after {
  content: " ";
  background-color: rgba(0, 0, 0, 0.4);
  bottom: 0;
  left: 0;
  height: 100%;
  width: 100%;
  position: absolute;
  transition: all 350ms ease-in-out 250ms;
  opacity: 0;
  transform-origin: bottom;
  mix-blend-mode: soft-light;
}
[id^=lightbox-] img {
  max-height: 90vh;
  max-width: 100%;
  margin: 0;
  padding: 0;
  filter: blur(50px);
}
[id^=lightbox-] a.close {
  width: 2em;
  height: 2em;
  position: absolute;
  right: 0;
  top: 0;
  background-color: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  transform: scale(0, 0);
  opacity: 0;
  transform-origin: right top;
  text-decoration: none;
  color: #fff;
}
[id^=lightbox-] a.close::after {
  content: "X";
}

/**********************************************************Awards Styles End**/
/*****************************************************************************
    Job Application Form Styles
******************************************************************************/
#job-application .nondark {
  color: #1e1d28 !important;
  background-color: white !important;
  text-align:justify !important;
}
#job-application .nondark select {
  width: 100%;
  border-radius: 4px;
  padding: 8px;
  border-color: #1c1c1c !important;
}
#job-application .nondark input {
  border-radius: 4px;
  border: 1px solid #1c1c1c !important;
}
#job-application .nondark textarea {
  width: 100%;
  border-color: #1c1c1c;
}
#job-application .btnstyle {
  color: #144677 !important;
  background-color: white !important;
}
#job-application .btnstyle:hover {
  color: white !important;
  background-color: #144677 !important;
}

/********************************************Job Application Form Styles End**/
/*****************************************************************************
    Career Styles
******************************************************************************/
#careers * {
  box-sizing: border-box;
}
#careers #myInput {
  background-image: url("/css/searchicon.png");
  background-position: 10px 10px;
  background-repeat: no-repeat;
  width: 30% !important;
  font-size: 16px;
  padding: 12px 20px 12px 40px;
  border: 1px solid #ddd;
  margin-bottom: 12px;
}
#careers #myInput2 {
  background-image: url("/css/searchicon.png");
  background-position: 10px 10px;
  background-repeat: no-repeat;
  width: 30% !important;
  font-size: 16px;
  padding: 12px 20px 12px 40px;
  border: 1px solid #ddd;
  margin-bottom: 12px;
}
#careers #myTable {
  border-collapse: collapse;
  width: 100%;
  border: 1px solid #ddd;
  font-size: 18px;
}
#careers #myTable th,
#careers #myTable td {
  text-align: left;
  padding: 4px;
}
#careers #myTable tr {
  border-bottom: 1px solid #ddd;
}
#careers #myTable tr.header,
#careers #myTable tr:hover {
  background-color: lightgray;
}
#careers .accordion {
  background-color: #f2f2f2;
  color: #1e1d28;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  text-align: left;
  outline: none;
  font-size: 15px;
  transition: 0.4s;
}
#careers .active,
#careers .accordion:hover {
  background-color: #ccc;
}
#careers .accordion:after {
  content: "+";
  color: #777;
  font-weight: bold;
  float: right;
  margin-left: 5px;
}
#careers .active:after {
  content: "−";
}
#careers .panel {
  padding: 0 18px;
  background-color: white;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}

/**********************************************************Career Styles End**/
/*****************************************************************************
    Automation Shopfloor IT Styles
******************************************************************************/
#timeline {
  display: flex;
  background-color: #031625;
}
#timeline:hover .tl-item {
  width: 23.3333%;
}
#timeline h4 {
  color: #ffffff;
}

.tl-item {
  transform: translate3d(0, 0, 0);
  position: relative;
  width: 25%;
  height: 350px;
  color: #fff;
  overflow: hidden;
  transition: width 0.5s ease;
}
.tl-item:before, .tl-item:after {
  transform: translate3d(0, 0, 0);
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.tl-item:after {
  background: rgba(3, 22, 37, 0.85);
  opacity: 1;
  transition: opacity 0.5s ease;
}
.tl-item:before {
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, black 75%);
  z-index: 1;
  opacity: 0;
  transform: translate3d(0, 0, 0) translateY(50%);
  transition: opacity 0.5s ease, transform 0.5s ease;
}
.tl-item:hover {
  width: 30% !important;
}
.tl-item:hover:after {
  opacity: 0;
}
.tl-item:hover:before {
  opacity: 1;
  transform: translate3d(0, 0, 0) translateY(0);
  transition: opacity 1s ease, transform 1s ease 0.25s;
}
.tl-item:hover .tl-content {
  opacity: 1;
  transform: translateY(0);
  transition: all 0.75s ease 0.5s;
}
.tl-item:hover .tl-bg {
  filter: grayscale(0);
}

.tl-content {
  transform: translate3d(0, 0, 0) translateY(25px);
  position: relative;
  z-index: 1;
  text-align: center;
  margin: 0 1.618em;
  top: 55%;
  opacity: 0;
}

.tl-title {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  z-index: 1;
  border-bottom: 1px solid #fff;
}

.tl-bg {
  transform: translate3d(0, 0, 0);
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-size: cover;
  background-position: center center;
  transition: filter 0.5s ease;
  filter: grayscale(100%);
}

.block-bg {
  background-color: #f2f2f2;
  padding: 20px;
}

.block-bg img {
  width: 75px !important;
  margin-bottom: 10px;
  height: auto;
}

.block-bg div {
  margin-bottom: 15px;
}

.block-bg {
  background-color: #f2f2f2;
  padding: 20px;
  height: 395px;
}

.block-bg div {
  margin-bottom: 15px;
  height: 140px;
}

#bespoke-software img, #accredited-partners img, #add-partners img {
  width: 100%;
  height: auto;
}

@media (max-width: 992px) {
  #bespoke-software img {
    width: 60% !important;
  }
}
@media (max-width: 1137px) {
  #timeline {
    flex-wrap: wrap;
  }
  #timeline:hover .tl-item {
    width: 50%;
  }

  .tl-item {
    width: 50%;
  }
  .tl-item:hover {
    width: 50% !important;
  }
}
@media (max-width: 653px) {
  #timeline {
    flex-wrap: wrap;
  }
  #timeline:hover .tl-item {
    width: 100%;
  }

  .tl-item {
    width: 100%;
  }
  .tl-item:hover {
    width: 100% !important;
  }
}
@media (max-width: 991px) {
  .block-bg {
    background-color: transparent;
  }
}
@media (max-width: 767px) {
  .col-xsm-6 {
    width: 50%;
    float: left;
  }
}
.block-bg h3 {
  width: 100%;
}

/*****************************************Automation Shopfloor IT Styles End**/
/*****************************************************************************
    Sort These Styles
******************************************************************************/
.collapse.in {
  display: block;
  background-color: #1c1c1c !important;
}

@media (min-width: 1685px) {
  .filler {
    padding: 20px 0;
  }
}
.solution img {
  width: 100%;
}

@media (min-width: 600px) and (max-width: 1199px) {
  .solution img {
    width: 60%;
  }
}
@media (min-width: 1199px) {
  .left h2 {
    text-align: left;
  }
}
@media (min-width: 1700px) {
  .solution .col-lg-6 {
    margin-top: 50px;
  }
}
.practices-flex img {
  width: 65px !important;
  height: 100%;
  margin: 10px;
}

.practices-flex {
  display: flex;
}

#gage .col-md-4 img {
  width: 100%;
  height: auto;
}

.card-link {
  margin-bottom: 30px;
}

.card-link a:hover {
  text-decoration: none;
}

.card-link a {
  color: #1e1d28;
}

.card-link a:hover {
  text-decoration: none;
}

.card-link a {
  color: #1e1d28;
}

a:hover {
  text-decoration: underline;
}

a {
  color: #00aad4;
  font-weight: 400;
}

.hr hr {
  margin-top: 0px;
  margin-bottom: 15px;
  border: 0;
  border-top: 2px solid #144677;
  width: 40%;
  margin-right: auto;
  margin-left: auto;
}

.hrs hr {
  margin-top: 0px;
  margin-bottom: 15px;
  border: 0;
  border-top: 2px solid #144677;
  width: 15%;
  margin-right: auto;
  margin-left: auto;
}

h2 {
  font-size: 48px;
  font-weight: 800;
}

h4 {
  color: #1e1d28;
  font-weight: 600 !important;
}

h3 {
  color: #1e1d28;
  font-weight: 600 !important;
}

input {
  background-color: transparent !important;
  border: none !important;
  border-bottom: 1px solid white !important;
  width: 100% !important;
  padding: 8px !important;
}

.msg {
  background-color: transparent;
  border: none;
  border-bottom: 1px solid white;
  width: 100% !important;
}

.submitbtn {
  width: 30% !important;
  background-color: #f2f2f2 !important;
  color: #1e1d28;
  border-radius: 50px;
  padding: 13px;
  border-bottom: none;
}

.frow {
  margin-top: 35px;
}

.submitrow {
  text-align: left;
}

.contactform {
  padding-top: 48px !important;
}

.partnerimg {
  padding: 10px;
  transition: transform 0.2s;
  height: 48px;
}

.partnerimg:hover {
  transform: scale(1.1);
}

.partners {
  padding-top: 35px;
  padding-bottom: 35px;
}

.whatwedo {
  padding-bottom: 35px;
}

.awarding {
  width: 50%;
  margin-bottom: 50px;
}

.footer {
  background-color: #1c1c1c;
  text-align: center;
  padding-top: 6px;
  /*28px */
  color: #626262;
  padding-bottom: 22px;
}

.footer a {
  color: #626262;
}

.footer h4 {
  color: white;
}

.foot {
  /* text-align: center; */
  background-color: #1e1e1e;
  padding: 22px;
  color: white;
}

.footright {
  text-align: right;
  color: white;
}

.footright a {
  color: white;
  padding: 4px;
}

.footright2 a {
  color: white;
  padding: 4px;
}

.footright a:hover {
  color: #37b1f6;
  padding: 4px;
}

.jobfas {
  /* color: #1c1c1c; */
  color: #0c4479;
  font-size: 50px !important;
  padding-bottom: 12px;
}

.fas {
  color: white;
  font-size: 30px !important;
  padding: 5px;
}

.fas:hover {
  font-size: 40px !important;
}

.fa-arrow {
  color: white;
  font-size: 30px !important;
  padding: 5px;
}

.fa-arrow:hover {
  font-size: 40px !important;
}

.smlcol {
  text-align: center;
}

.logo {
  margin: 5px;
  height: 60px;
}

.logo2:hover {
  border-top: none !important;
}


html {
  overflow-x: hidden;
}

.nopadding {
  padding-left: 0px !important;
  padding-right: 0px !important;
}

.paddingTB {
  padding-top: 20px;
}

.paddingB {
  padding-bottom: 40px;
}

.padding {
  padding-top: 14px;
}

.thick {
  font-weight: 600;
  font-size: medium;
}

.large {
  font-size: large;
}

.height {
  height: 60px;
  width: auto !important;
}

.smallh1 {
  font-size: 46px;
}

.portal {
  text-decoration: none;
  padding: 8px 10px !important;
  background-color: #144677;
  color: white;
  border: #144677;
}

.portal:hover {
  text-decoration: none;
  background-color: white;
  color: #144677;
  border: white !important;
}

.navbar-right .dropdown-menu {
  right: 0;
}

#benefits {
  text-align: left;
  padding-left: 105px;
}

.benefits {
  text-align: left;
  padding-left: 105px;
}

.serviceIcons {
  height: 65px;
  width: auto !important;
}

.services {
  padding: 7px 21px !important;
  color: white !important;
}

.services:hover {
  color: #144677 !important;
}

.product-subheading {
  font-size: 20px;
  padding-top: 12px;
}

.product-heading-link {
  color: #ffcc00 !important;
  padding: 5px;
  font-weight: bolder;
}

.subheading {
  font-size: 16px;
  margin-bottom: 25px;
}

.h3sub {
  font-size: 36px;
}

.dropdownCU {
  background-color: transparent;
  border-radius: 4px;
  width: 96%;
  color: #5c7470;
  margin-left: 17px;
}

.help-block {
  list-style-type: none !important;
  color: orange !important;
}

.grow {
  width: 26%;
}

.grow:hover {
  width: 30%;
}

#myVideo {
  position: fixed;
  right: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
  z-index: -1;
}

.widthimgs {
  width: 88%;
}

@media (max-width: 1199px) {
  .row .col-md-4 img {
    width: 88%;
  }

  .row .col-md-6 img {
    width: 65%;
  }

  .container.error {
    height: 1650px !important;
  }

  .hr {
    padding-left: 10px;
    padding-right: 10px;
  }
}
.media-pages {
  padding-left: 20px;
  padding-right: 20px;
}



p.service-heading {
  font-size: 70px;
}

@media (max-width: 767px) {
  h1.service-heading,
p.service-heading {
    font-size: 37px;
  }

  h2 {
    font-size: 30px;
  }

  .awarding.contact-banner {
    width: 100%;
  }
}
#media p:not(.foot p) {
  margin: 0px 0 25px;
}

#media .col-lg-8,
#media .col-lg-4 {
  text-align: justify;
}

.inline-img {
  width: 98%;
  height: auto;
  margin: 1%;
}

#media .col-lg-6 {
  padding: 0;
}

#media .col-lg-5 {
  text-align: justify;
}

.media-img {
  width: 100%;
}

.half-media-img {
  width: 50%;
}

.banner-expand {
  font-size: 78px;
}

.no-vacancy {
  border: 2px solid #ffffff;
  width: 15%;
  border-radius: 50px;
  margin: 0 auto;
}

.no-vacancy p {
  padding: 10px;
  margin: 0;
  color: #ffffff;
}

.no-vacancy.career-portal {
  padding: 8px 24px;
  color: #ffffff;
}

.no-vacancy.career-portal:hover {
  text-decoration: none;
  background-color: #144678;
  border-color: #144678;
}

.product-heading {
  width: 30%;
  padding: 0 30px;
  float: left;
  display: block;
}

.product-line {
  width: 35%;
  float: left;
  display: block;
  border-bottom: 1px solid #999999;
  transform: translateY(30px);
}

.product-heading h3 {
  color: #999999;
  font-family: roboto, sans-serif !important;
  font-weight: 500 !important;
  text-transform: uppercase;
}

.product-images .carousel-control.right {
  right: 0;
  left: auto;
  background-image: none;
  background-image: none;
  background-image: none;
  background-image: none;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff", endColorstr="#ffffff", GradientType=1);
  background-repeat: repeat-x;
}

.carousel-control.left {
  background-image: none;
  background-image: none;
  background-image: none;
  background-image: none;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff", endColorstr="#ffffff", GradientType=1);
  background-repeat: repeat-x;
}

.product-images {
  position: relative;
  height: auto;
  margin: auto;
  padding-top: 5%;
}

@media (max-width: 991px) {
  .product-images {
    padding-top: 5px !important;
    width: 370px;
  }
}
.product-description {
  padding-top: 18px;
  text-align: left;
}

.product-wrapped {
  max-width: 1200px;
  position: relative;
  margin: auto;
}

.row.product-heading-row {
  padding: 2%;
}

.fright {
  float: right;
}

@media (max-width: 991px) {
  .fright {
    float: none;
  }
}
@media (max-width: 565px) {
  .product-heading {
    font-size: 18px;
    padding: 0px;
  }
}
@media (max-width: 390px) {
  .product-images {
    width: 100%;
  }

  .paddingTB img {
    width: 100%;
  }
}
.square-awards-image {
  margin-bottom: 35px;
}

.row.contactUS.dark,
.row .nondark,
.row.white,
.row.nonwhite {
  padding: 50px 0;
}

.row:not(#media-centre .row) {
  padding: 25px 0;
}

.accordion .panel p {
  margin: 20px 0;
}

.career-title {
  width: 40%;
}

.career-department {
  width: 20%;
}

.career-location {
  width: 30%;
}

.career-link {
  width: 10%;
}

#career .col-lg-5 {
  text-align: left;
}

#career .col-lg-5 h3 {
  text-align: center;
}

.help-block.text-danger {
  color: #144678;
}

.row.frow.submitrow {
  text-align: center;
}

#sendMessageButton .smallbtn {
  width: 46% !important;
  margin-bottom: 15px !important;
}

.snazzy {
  width: 100%;
  height: 550px;
  border: none;
}

.s4-subheading {
  font-size: 22px;
}

.col-lg-8 .contactF {
  text-align: justify;
}

.form-pdf {
  color: #000000;
}

.form-pdf-input {
  height: 40px;
}

#dat-gath-cons {
  width: 4% !important;
}

.form-endnote {
  text-align: justify;
  font-size: 14px;
}

.form-endnote2 {
  text-align: justify;
  font-size: 10px;
  margin-left: 10px;
}

.g-recaptcha {
  margin-bottom: 40px;
}

.g-recaptcha-frame {
  width: 304px;
  height: 78px;
}

.g-recaptcha-response {
  width: 250px;
  height: 40px;
  border: 1px solid #c1c1c1;
  margin: 10px 25px;
  padding: 0px;
  resize: none;
  display: none;
}

.row.submitrow {
  text-align: center;
}

#sendMessageForm .submitbtn.btnstyle,
#sendMessageForm .smallbtn.btnstyle {
  border: 1px solid #144678 !important;
}

.application-form .row {
  padding-top: 10px;
  text-align: center;
}

#sendMessageForm .smallbtn.btnstyle {
  width: 46% !important;
  margin-bottom: 15px !important;
}

video {
  background-color: #144678;
}

@media (min-width: 1199px) {
  .left {
    text-align: left;
  }
}
.service-heading {

  text-align: center;
}

.indeva {
  color: #00529f !important;
  padding: 5px;
  font-weight: bolder;
}

.fright {
  float: right;
}

.center {
  text-align: center;
}

.myImg {
  width: 70%;
  max-width: 200px;
  padding: 5px;
}

.portal-logo {
  position: absolute;
  height: 250px;
  width: auto;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  margin-top: 200px;
}

.container.portal {
  padding: 0 !important;
  margin: 0 !important;
  height: 939px;
}

.mobi-auto,
.mobi-soft,
.mobi-auto-home,
.mobi-soft-home {
  width: 50%;
  height: 100%;
  float: left;
  margin: 0 !important;
  padding: 0 !important;
  background-repeat: no-repeat;
  background-position: center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.mobi-auto-home {
  background-image: url(/assets/img/banners/portal-automation-services.jpg);
}

.mobi-auto {
  background-image: url(/assets/img/general/careers/career-automation.jpg);
}

.mobi-soft-home {
  background-image: url(/assets/img/banners/portal-software-development-services.jpg);
}

.mobi-soft {
  background-image: url(/assets/img/general/careers/career-software.jpg);
}

.mobi-reset-padding-auto,
.mobi-reset-padding-soft {
  background-color: #0000007a;
  width: 100%;
  height: 100%;
  text-align: center;
  color: #ffffff;
  padding: 200px 150px 0 30px;
}

.mobi-reset-padding-auto {
  padding: 200px 150px 0 30px;
}

.mobi-reset-padding-soft {
  padding: 200px 30px 0 150px;
}

#footer.row.footer {
  padding-top: 6px !important;
}

#footer.row.footer {
  margin-top: -6px;
}

.nav-alt {
  background-color: #1c1c1c !important;
}

#myBtnContainer p {
  font-weight: bold;
}

#all a {
  display: none;
}

.read-more {
  font-family: montserrat;
  text-align: left;
}

#fitvid0 {
  width: 100%;
  height: 340px;
}

#expanding .col-md-10 {
  background-color: #144678;
  color: white;
  font-family: "Montserrat", "sans-serif";
}

#s4-expanding p {
  font-family: "Roboto", "sans-serif";
  font-size: 18px;
}

.dev-questionnaire {
  padding-top: 120px;
}

.dev-questionnaire iframe {
  margin: 0 auto;
  display: block;
}

#software-service .service-benefits img {
  width: 100%;
  margin: auto;
}

#software-service .flex {
  display: flex;
}

#software-service .service-benefits {
  display: flex;
}

#software-service .innerrow {
  padding: 25px 0;
  margin: 25px !important;
  text-align: center;
}

#software-service hr {
  margin-top: 0px;
  margin-bottom: 15px;
  border: 0;
  border-top: 2px solid #144677;
  width: 40%;
  margin-right: auto;
  margin-left: auto;
}

#software-service .innerrow img {
  width: 25%;
  height: auto;
  margin: 25px;
}

#software-service .success {
  border: 1px solid #eeeeee;
  margin: 0 50px;
}

#software-service .contact-separator img {
  width: 100%;
  position: absolute;
  transform: translateY(-50%);
}

#software-service .card {
  border: 1px solid #eeeeee;
  min-height: 280px;
  padding: 5px;
}

@media (max-width: 1200px) {
  #software-service .card {
    min-height: 322px;
  }

  #software-service .flex {
    display: block;
  }

  #software-service .service-benefits {
    display: block;
  }
}
@media (max-width: 992px) {
  #software-service .card {
    margin: 20px 0;
  }

  .mobile-hide {
    display: none;
  }
}
#software-service .innerrow .card.languages img {
  width: auto !important;
  height: 105px !important;
}

a.intl:hover {
  text-decoration: underline;
}

a.intl {
  color: #144678 !important;
}

.methodology-img-left {
  width: 40%;
  float: left;
}

.methodology-img-right {
  width: 40%;
  float: right;
}

.methodology-content-right {
  width: 60%;
  float: right;
}

.methodology-content-left {
  width: 60%;
  float: left;
}

.methodology-content {
  display: flex;
}

#methodologies-style-1 img {
  margin: auto;
}

#methodologies-style-1 .methodology-content-right,
#methodologies-style-1 .methodology-content-left {
  margin: auto;
}

.clearfix::after {
  content: "";
  clear: both;
  display: table;
}

.methodology-separator-right,
.methodology-separator-left {
  width: 40%;
  height: auto;
  display: inline-block;
}

.methodology-separator-left {
  transform: scaleY(-1);
}

.contact-details.dark {
  color: #ffffff;
  text-align: center;
  padding: 20px 0;
}

.open-chat a {
  background-color: #144678;
  margin-top: 20px;
  border: 1px solid #144678;
  border-radius: 20px;
}

.open-chat p {
  margin: 0 0 40px;
  font-family: "montserrat", "sans-serif";
  font-size: 24px;
  font-weight: 600;
}

.contact-details a {
  color: #ffffff;
}

.wwu-header {
  height: unset !important;
  background-color: #144678;
  text-align: right;
}

.wwu-intro h1 {
  padding-bottom: 100px;
}

.wwu-image {
  width: 100%;
  height: auto;
}

@media (max-width: 1200px) {
  .wwu-image {
    width: 60%;
    padding: 10px;
  }
}
@media (max-width: 768px) {
  .wwu-image {
    width: 50%;
    padding: 10px;
  }
}
@media (max-width: 991px) {
  .fright {
    float: none !important;
  }
}
.center {
  text-align: center;
}

.open-chat .row {
  padding: 30px 0;
}

.ntp {
  padding-top: 0px;
}

.navbar-fixed-bottom .navbar-collapse,
.navbar-fixed-top .navbar-collapse {
  max-height: 500px;
}

h1 {
  font-size: 50px;
  font-weight: 900;
}

.banner-container h3 {
  color: #ffffff;
}

.row.banner-container {
  position: absolute;
  bottom: 0;
  width: 100%;
  text-align: left;
  padding: 20px;
  background-color: #ffffff33;
}

@media (max-width: 768px) {
  .banner-container .col-xsm-6 {
    width: 50%;
    float: left;
  }
}
@media only screen and (min-width: 544px) and (max-width: 580px) {
  .banner-container .col-xsm-6 {
    width: 46%;
    float: left;
  }
}
.accent {
  color: #144678;
}

.callout {
  padding: 20px;
}

.mobi-reset-padding-soft p,
.mobi-reset-padding-auto p {
  margin: 0;
  font-size: 80px;
  font-weight: 900;
  font-family: "Montserrat", "sans-serif";
}

@media (max-width: 686px) {
  .mobi-reset-padding-soft,
.mobi-reset-padding-auto {
    padding: 70px 50px 0 50px !important;
  }
}
@media (min-width: 1199px) and (max-width: 1425px) {
  h1,
.mobi-reset-padding-soft p,
.mobi-reset-padding-auto p {
    font-size: 60px;
  }
}
@media (max-width: 1199px) {
  .portal-logo {
    display: none;
  }

  .mobi-auto-home,
.mobi-soft-home {
    width: 100% !important;
    height: 50%;
  }

  .mobi-auto,
.mobi-soft {
    width: 100% !important;
    height: 50% !important;
  }

  .mobi-reset-padding-soft,
.mobi-reset-padding-auto {
    padding: 70px 5px 0 0 !important;
  }

  /*
  .container {
    height: 650px !important;
  }
  */
  h1,
.mobi-reset-padding-soft p,
.mobi-reset-padding-auto p {
    font-size: 40px;
  }
}
@media (max-width: 500px) {
  .row.banner-container {
    display: none;
  }

  .industries-container h2 {
    width: 100%;
    left: 0;
  }

  .benefits {
    padding-left: 20px;
  }

  audio {
    width: 80%;
  }

  .media-pages {
    padding: 5px 0;
  }
}
.dark h1 {
  color: #ffffff;
}

.yaccent {
  color: #ffcc00 !important;
  font-weight: 600;
}

.banner-container a {
  color: #ffffff;
}

.banner-container a:hover {
  color: #00aad4;
}

.menulinks.CUClass.services {
  background-color: #144678;
  margin-top: 20px;
  border: 1px solid #144678;
  border-radius: 20px;
}

.menulinks.CUClass.services:hover {
  background-color: #ffffff;
}

.lg-hide {
  display: none;
}

@media (max-width: 1200px) {
  .md-hide {
    display: none;
  }

  .lg-hide {
    display: block;
  }
}
.callout h3,
.callout p {
  text-align: center;
}

.edi-processing {
  text-align: center;
}
.edi-processing img {
  width: 100%;
}
.edi-processing .translatey {
  transform: translateY(50%);
}

@media (max-width: 991px) {
  .translatey {
    transform: unset !important;
  }
}
#skills-required .col-lg-6 {
  height: 130px;
  text-align: center;
}

#media-centre .left p {
  text-align: left !important;
}

#media-centre .filterDiv {
  min-height: 475px;
  width: 100%;
  display: inline-block;
  margin: 5px;
  display: none;
  float: left;
  padding: 3px;
  background-color: #f7f7f7;
  color: #1c1c1c !important;
  margin-bottom: 14px;
}

#media-centre .product-desc.center.media-article-card {
  padding: 4px;
}

#media-centre .show {
  display: block;
}

#media-centre .hide {
  display: none !important;
}

#media-centre .btn.active {
  font-weight: bold;
  -webkit-box-shadow: inset 0 0px 0px rgba(0, 0, 0, 0.125);
  box-shadow: inset 0 0px 0px rgba(0, 0, 0, 0.125);
}

#media-centre .btn {
  color: #1c1c1c;
}

#media-centre .btn:hover {
  font-weight: bold;
}

#media-centre .clear {
  color: red !important;
  font-size: smaller;
  text-decoration: none;
  display: none;
  float: right;
}

#media-centre .clearS {
  color: red !important;
  font-size: smaller;
  text-decoration: none;
  display: block;
  float: right;
}

#media-centre .clearS:hover {
  color: #37b1f6 !important;
  font-size: smaller;
  text-decoration: none;
  display: block;
  float: right;
  cursor: pointer;
}

#media-centre .clear:hover {
  text-decoration: none;
  color: red;
}

#media-centre .clear:active {
  text-decoration: none;
  color: red;
}

#media-centre .product-image {
  position: relative;
  width: 100%;
  height: auto;
  overflow: hidden;
}

#media-centre .product-image > a,
.product-image .slide a,
.product-image img {
  display: block;
  width: auto;
}

#media-centre .product-desc > a {
  color: #144677;
}

#media-centre .product-desc > a:hover {
  color: #37b1f6;
}

#media-centre span:not(.icon-bar):not(.caret) {
  position: absolute;
  left: auto;
  right: 0;
  font-size: 11px;
  width: 22px;
  height: 22px;
  line-height: 22px;
  text-align: center;
  color: #777;
  background-color: #eee;
  border-radius: 50%;
}

#media-centre .media-date {
  font-size: smaller;
  padding-top: 4px;
  padding-bottom: 6px;
}

#media-centre .wrap-content {
  bottom: 10px !important;
  position: relative;
  padding-left: 10px;
  padding-right: 10px;
}

#media-centre .wrap-content a {
  color: #337ab7 !important;
}

#media-centre .wrap-content a:hover {
  color: #144677 !important;
}

#media-centre .product-title h3 {
  font-size: 22px;
}

#media-centre .abs-test {
  position: absolute;
  bottom: 0;
  left: 0;
  transform: translate(30px, -10px);
  margin-right: 40px;
  margin-left: -10px;
}

#media-centre .product-image img {
  margin: auto;
  width: 100%;
  height: auto;
}

@media (max-width: 1487px) {
  #media-centre .col-lg-1 {
    display: none !important;
  }

  #media-centre .col-lg-8 {
    width: 83.3333% !important;
  }

  #media-centre .col-lg-10 {
    width: 100%;
  }
}
@media (max-width: 1199px) {
  #media-centre br {
    display: none;
  }

  #media-centre span:not(.icon-bar):not(.caret) {
    position: relative;
    margin-right: 5px;
    font-size: unset;
    width: unset;
    height: unset;
    line-height: unset;
    background-color: unset;
    float: left;
  }

  #media-centre .col-lg-8 {
    width: 100% !important;
  }

  #media-centre a.btn {
    float: left;
    background-color: #eee !important;
    margin-right: 5px;
    margin-bottom: 5px;
    border-radius: 35px;
  }

  #media-centre .col-lg-2 {
    min-height: 115px;
  }

  #media-centre .col-lg-4.filterhere {
    width: 33%;
    float: left;
  }
}
@media (max-width: 955px) {
  #media-centre .col-lg-4.filterhere {
    width: 50%;
  }
}
@media (max-width: 856px) {
  #media-centre .col-lg-2 {
    min-height: 150px;
  }
}
@media (max-width: 662px) {
  #media-centre .col-lg-2 {
    min-height: 190px;
  }

  #media-centre .col-lg-4.filterhere {
    width: 100%;
  }

  #media-centre .filterDiv {
    min-height: 520px;
  }
}
@media (max-width: 543px) {
  #media-centre .col-lg-2 {
    min-height: 230px;
  }

  #media-centre .filterDiv {
    min-height: 475px;
  }
}
.container.error {
  height: 1000px;
}

.callout {
  margin-bottom: 50px;
}

.tabs {
  left: 50%;
  transform: translateX(-50%);
  position: relative;
  background: white;
  padding: 50px;
  padding-bottom: 80px;
  width: 70%;
  min-height: 630px;
  border-radius: 5px;
  min-width: 240px;
  margin-bottom: 50px;
  -webkit-box-shadow: 6px 4px 14px 0px rgba(0, 0, 0, 0.17);
  -moz-box-shadow: 6px 4px 14px 0px rgba(0, 0, 0, 0.17);
  box-shadow: 6px 4px 14px 0px rgba(0, 0, 0, 0.17);
  background-color: #fbf8ff;
}

.tabs input[name=tab-control] {
  display: none;
}

.tabs .content section h2,
.tabs ul li label {
  font-family: "Montserrat";
  font-weight: bold;
  font-size: 18px;
  color: #00aad4;
}

.tabs ul {
  list-style-type: none;
  padding-left: 0;
  display: flex;
  flex-direction: row;
  margin-bottom: 10px;
  justify-content: space-between;
  align-items: flex-end;
  flex-wrap: wrap;
}

.tabs ul li {
  box-sizing: border-box;
  flex: 1;
  width: 33%;
  padding: 0 10px;
  text-align: center;
}

.tabs ul li label {
  transition: all 0.3s ease-in-out;
  color: #00aad4;
  padding: 5px auto;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
  white-space: nowrap;
  -webkit-touch-callout: none;
}

.tabs ul li label br {
  display: none;
}

.tabs ul li label svg {
  fill: #144678;
  height: 1.2em;
  vertical-align: bottom;
  margin-right: 0.2em;
  transition: all 0.2s ease-in-out;
}

.tabs ul li label:hover,
.tabs ul li label:focus,
.tabs ul li label:active {
  outline: 0;
  color: #00aad4;
}

.tabs ul li label:hover svg,
.tabs ul li label:focus svg,
.tabs ul li label:active svg {
  fill: #00aad4;
}

.tabs .slider {
  position: relative;
  width: 33.3%;
  transition: all 0.33s cubic-bezier(0.38, 0.8, 0.32, 1.07);
}

.tabs .slider .indicator {
  position: relative;
  width: 50px;
  max-width: 100%;
  margin: 0 auto;
  height: 4px;
  background: #00aad4;
  border-radius: 1px;
}

.tabs .content {
  margin-top: 30px;
}

.tabs .content section {
  display: none;
  animation-name: content;
  animation-direction: normal;
  animation-duration: 0.3s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: 1;
  line-height: 1.4;
}

.tabs .content section h2 {
  color: #00aad4;
  display: none;
}

.tabs .content section h2::after {
  content: "";
  position: relative;
  display: block;
  width: 30px;
  height: 3px;
  background: #00aad4;
  margin-top: 5px;
  left: 1px;
}

.tabs input[name=tab-control]:nth-of-type(1):checked ~ ul > li:nth-child(1) > label {
  cursor: default;
  color: #00aad4;
}

.tabs input[name=tab-control]:nth-of-type(1):checked ~ ul > li:nth-child(1) > label svg {
  fill: #00aad4;
}

@media (max-width: 600px) {
  .tabs input[name=tab-control]:nth-of-type(1):checked ~ ul > li:nth-child(1) > label {
    background: rgba(0, 0, 0, 0.08);
  }
}
.tabs input[name=tab-control]:nth-of-type(1):checked ~ .slider {
  transform: translateX(0%);
}

.tabs input[name=tab-control]:nth-of-type(1):checked ~ .content > section:nth-child(1) {
  display: block;
}

.tabs input[name=tab-control]:nth-of-type(2):checked ~ ul > li:nth-child(2) > label {
  cursor: default;
  color: #00aad4;
}

.tabs input[name=tab-control]:nth-of-type(2):checked ~ ul > li:nth-child(2) > label svg {
  fill: #00aad4;
}

@media (max-width: 600px) {
  .tabs input[name=tab-control]:nth-of-type(2):checked ~ ul > li:nth-child(2) > label {
    background: rgba(0, 0, 0, 0.08);
  }
}
.tabs input[name=tab-control]:nth-of-type(2):checked ~ .slider {
  transform: translateX(100%);
}

.tabs input[name=tab-control]:nth-of-type(2):checked ~ .content > section:nth-child(2) {
  display: block;
}

.tabs input[name=tab-control]:nth-of-type(3):checked ~ ul > li:nth-child(3) > label {
  cursor: default;
  color: #00aad4;
}

.tabs input[name=tab-control]:nth-of-type(3):checked ~ ul > li:nth-child(3) > label svg {
  fill: #00aad4;
}

@media (max-width: 600px) {
  .tabs input[name=tab-control]:nth-of-type(3):checked ~ ul > li:nth-child(3) > label {
    background: rgba(0, 0, 0, 0.08);
  }
}
.tabs input[name=tab-control]:nth-of-type(3):checked ~ .slider {
  transform: translateX(200%);
}

.tabs input[name=tab-control]:nth-of-type(3):checked ~ .content > section:nth-child(3) {
  display: block;
}

.tabs input[name=tab-control]:nth-of-type(4):checked ~ ul > li:nth-child(4) > label {
  cursor: default;
  color: #00aad4;
}

.tabs input[name=tab-control]:nth-of-type(4):checked ~ ul > li:nth-child(4) > label svg {
  fill: #00aad4;
}

@media (max-width: 600px) {
  .tabs input[name=tab-control]:nth-of-type(4):checked ~ ul > li:nth-child(4) > label {
    background: rgba(0, 0, 0, 0.08);
  }
}
.tabs input[name=tab-control]:nth-of-type(4):checked ~ .slider {
  transform: translateX(300%);
}

.tabs input[name=tab-control]:nth-of-type(4):checked ~ .content > section:nth-child(4) {
  display: block;
}

@keyframes content {
  from {
    opacity: 0;
    transform: translateY(5%);
  }
  to {
    opacity: 1;
    transform: translateY(0%);
  }
}
@media (max-width: 1000px) {
  .tabs ul li label {
    white-space: initial;
  }

  .tabs ul li label br {
    display: initial;
  }

  .tabs ul li label svg {
    height: 1.5em;
  }
}
@media (max-width: 600px) {
  .tabs ul li label {
    padding: 5px;
    border-radius: 5px;
  }

  .tabs ul li label span {
    display: none;
  }

  .tabs .slider {
    display: none;
  }

  .tabs .content {
    margin-top: 20px;
  }

  .tabs .content section h2 {
    display: block;
  }
}
.tabs span:hover {
  color: #00aad4;
}

.tabs label {
  margin-top: 25px;
}

.pad-right {
  padding-right: 30px !important;
}

#index .fa-angle-double-down,
#career-portal .fa-angle-double-down {
  top: 294px;
  right: 131px;
}

@media (min-width: 1300px) {
  .control-video {
    width: 50%;
  }
}
@media (max-width: 645px) {
  #social-links ul {
    right: -15%;
  }
}
/*
  Social Media Share
*/
.media-share {
  margin: 50px;
}

.media-share p {
  font-family: "Roboto", sans-serif;
  font-weight: 600;
  font-size: 18px;
}

.media-share-wrapper {
  margin: 50px 0;
  border-top: 2px solid #eee;
  border-bottom: 2px solid #eee;
}

#social-links ul {
  margin: 0;
  padding: 0;
  display: flex;
  position: absolute;
  top: 50%;
  right: -25%;
  transform: translate(-50%, -25%);
}

#social-links ul li {
  list-style: none;
  margin: 0 15px;
}

#social-links ul li a {
  position: relative;
  display: block;
  width: 60px;
  height: 60px;
  text-align: center;
  line-height: 63px;
  background: #eee;
  border-radius: 50%;
  font-size: 30px;
  color: #666;
  transition: 0.5s;
}

#social-links ul li a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: #144678;
  transition: 0.5s;
  transform: scale(0.9);
  z-index: -1;
}

#social-links ul li a:hover::before {
  transform: scale(1.1);
}

#social-links ul li a:hover {
  color: #144678;
}

img.icon {
  width: 15% !important;
  height: auto;
}

@media (max-width: 1500px) {
  .col-md-4.card-link {
    width: 50%;
    float: left;
  }
}
/******************************************************Sort These Styles End**/