/* ===================================================
   Archit. Layout Stylesheet

   TOC:
     01. Variants Styles
     02. Revolution Slider
     03. Progress Bar Styles
     04. footer Style
     05. princing Style
     06. Accordion Styles
     07. page error Styles
     08. Icon-box Styles
     09. Team Styles
     10. Tabs Styles
     11. Counter Styles
     12. login Styles
     13. Blog Styles
     14. Widget Styles
     15. Portfolio Styles

====================================================== */
/* ====================================================
    01. Variants Styles
==================================================== */
@import url("https://fonts.googleapis.com/css?family=Roboto:300,400");
@import url("https://fonts.googleapis.com/css?family=Raleway+Sans:100,100i,300,300i,400,400i,600,600i,700,700i");
/* ---- Color ---- */
/* ====================================================
    02. Revolution Slider
==================================================== */
div.tparrows {
  background: transparent;
  border-radius: 100%;
  border: 1px solid #677180;
  width: 50px;
  height: 50px;
}

div.tparrows:before {
  font: normal normal normal 14px/1 'ionicons'; }

div.tparrows.tp-leftarrow:before {
  content: '\f208';
  margin-top: 32%;
  color: #677180;
  font-size: 20px; }

div.tparrows.tp-rightarrow:before {
  content: '\f217';
  margin-top: 32%;
  color: #677180;
  font-size: 20px; }

div.tparrows:hover {
  border: 1px solid #EAEDF6;
  background: transparent; }

div.tparrows:hover.tp-rightarrow:before,
div.tparrows:hover.tp-leftarrow:before {
  color: #EAEDF6; }

/* Revslider arrow */
/* Revslider bullet */
.tp-bullet {
  width: 14px;
  height: 14px;
  background: rgba(255, 255, 255, 0.15%);
  border-radius: 50%;
  border: 1px solid transparent; 
}

.tp-bullet.selected,
.tp-bullet:hover {
  background: #4cc0ef !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important; }

/* ====================================================
    03. Progress Bar Styles
==================================================== */
.progress-title {
  font-family: "Poppins", sans-serif;
  font-size: 18px;
  font-weight: 400;
  color: #000 !important;
  margin: 0 0 14px 0;
  line-height: 6px;
  letter-spacing: 1px; }

.progress {
  height: 8px;
  background: rgba(103, 113, 128, 0.5);
  border-radius: 25px;
  -webkit-box-shadow: none;
  box-shadow: none;
  margin-bottom: 40px;
  overflow: visible; }

.progress-bar {
  height: 8px;
  border-radius: 25px;
}

.progress .progress-bar {
  -webkit-box-shadow: none;
  box-shadow: none;
  position: relative;
  -webkit-animation: animate-positive 2s;
  animation: animate-positive 2s;
  background-color: #EAEDF6; }

.progress .progress-bar:after {
  content: "";
  display: block;
  border: 6px solid transparent;
  border-radius: 100%;
  position: absolute;
  top: -2px;
  right: -4px; }

.progress .progress-value {
  font-family: "Poppins", sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #000 !important;
  position: absolute;
  top: -29px;
  right: 0; }

.progress.default .progress-bar {
  background: #1C2025; }

.progress.default .progress-bar:after {
  border-color: #1C2025; }

.progress.color .progress-bar {
  background:  #007bff  ;
  background: linear-gradient(45deg, #4cc0ef 1%, #4f9dde  100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgb(212,6,42)', endColorstr='rgb(242,68,10)',GradientType=1 ); }

.progress.color .progress-bar:after {
  border-color:  #007bff  ; }

/* ====================================================
    04. footer v.1 Style
==================================================== */
.footer-rights {
  text-align: center; }

.footer-rights * {
  font-size: 12px !important;
  font-weight: 300;
  letter-spacing: 6px !important;
  text-align: center;
  text-transform: uppercase; }

.footer-rights h6 {
  margin-bottom: 0;
  padding-bottom: 4px; }

.footer-social {
  display: table;
  width: 100%;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  text-align: center;
  padding-top: 15px;
  padding-bottom: 30px;
  padding-right: 20px;
  margin-bottom: 0; }

.footer-social__item {
  position: relative;
  display: table-cell;
  margin-right: 0;
  list-style-type: none; }

.footer-social__item::after {
  content: "-";
  position: absolute;
  top: -3px;
  right: 0;
  font-size: 16px;
  font-weight: 300; }

.footer-social__item:last-child::after {
  content: ""; }

.footer-social__link {
  font-size: 12px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 4px;
  text-align: center;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  color: #EAEDF6; }

.footer-social__link:hover {
  color: #4cc0ef !important;
  text-transform: uppercase; }

a.footer-social__link .icon {
  display: none; }



.footer-social__item-mtb {
  position: relative;
  display: table-cell;
  margin-right: 0;
  list-style-type: none; }

.footer-social__item-mtb::after {
  content: "-";
  position: absolute;
  top: -3px;
  right: 0;
  font-size: 16px;
  font-weight: 300; }

.footer-social__item-mtb:last-child::after {
  content: ""; }

.footer-social__link-mtb {
  font-size: 12px;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 4px;
  text-align: center;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  color: #EAEDF6; }

.footer-social__link-mtb:hover {
  color: #4cc0ef !important;
  text-transform: uppercase; }

a.footer-social__link-mtb .icon {
  display: none; }
@media only screen and (min-width: 320px) and (max-width: 991px) {
  .footer-social__item-mtb {
    position: relative;
    display: block;
    margin-right: 0;
    list-style-type: none;
    text-align: center;
  }
}

/* ====================================================
    05. princing v.1 Style
==================================================== */
.item-pricing__1,
.item-pricing__2,
.item-pricing__3,
.item-pricing__4 {
  background: rgba(255, 255, 255, 0.5);
  border: 1px solid rgba(28, 32, 37, 0.08);
  padding: 60px 40px 40px 40px;
  overflow: hidden;
  text-align: center;
  border-radius: 6px;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out; }

.item-pricing__1,
.item-pricing__4 {
  margin-top: 30px;
  margin-bottom: 30px;
  padding-bottom: 60px; }

.item-pricing__2 {
  margin-left: 30px;
  margin-right: 30px; }

.item-pricing__3 {
  border: 1px solid rgba(212, 6, 42, 0.28);
  -webkit-box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
  padding: 100px 60px 100px 60px;
  margin-bottom: 30px; }

.item-pricing__1:hover,
.item-pricing__4:hover {
  -webkit-box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15); }

.item-pricing__1 hr {
  border-top: 1px solid  #007bff  ;
  margin: 5px auto 5px auto; }

.item-pricing__1 .item-pricing__title,
.item-pricing__2 .item-pricing__title,
.item-pricing__3 .item-pricing__title,
.item-pricing__4 .item-pricing__title {
  color: #30353E;
  padding: 18px 10px 10px 10px;
  margin-bottom: 0;
  background: transparent;
  border: 1px solid #1C2025;
  border-radius: 6px; }

.item-pricing__3 .item-pricing__title {
  border: none;
  font-size: 24px;
  padding: 18px 10px 0 10px;
  margin-bottom: 0; }

.item-pricing__1.active .item-pricing__title,
.item-pricing__2.active .item-pricing__title,
.item-pricing__4.active .item-pricing__title {
  border: 1px solid  #007bff  ;
  background:  #007bff  ;
  background: linear-gradient(45deg, #4cc0ef 1%, #4f9dde  100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=' #007bff  ', endColorstr='#4f9dde ',GradientType=1 );
  color: #ffffff; }

.item-pricing__1 .item-pricing__price,
.item-pricing__2 .item-pricing__price,
.item-pricing__3 .item-pricing__price,
.item-pricing__4 .item-pricing__price {
  position: relative;
  font-size: 80px;
  font-weight: 600;
  line-height: 1;
  vertical-align: top;
  display: inline-block;
  margin-top: 50px;
  margin-bottom: 50px; }

.item-pricing__1 .item-pricing__price__cent,
.item-pricing__2 .item-pricing__price__cent,
.item-pricing__3 .item-pricing__price__cent,
.item-pricing__4 .item-pricing__price__cent {
  font-size: 36px;
  font-weight: 300; }

.item-pricing__1 .item-pricing__price .item-pricing__price__symbol,
.item-pricing__2 .item-pricing__price .item-pricing__price__symbol,
.item-pricing__3 .item-pricing__price .item-pricing__price__symbol,
.item-pricing__4 .item-pricing__price .item-pricing__price__symbol {
  position: absolute;
  font-size: 18px !important;
  left: -15px;
  top: 24px;
  font-weight: 300; }

.item-pricing__1 .item-pricing__price .item-pricing__price__title,
.item-pricing__2 .item-pricing__price .item-pricing__price__title,
.item-pricing__3 .item-pricing__price .item-pricing__price__title,
.item-pricing__4 .item-pricing__price .item-pricing__price__title {
  font-size: 22px !important;
  display: block;
  font-weight: 300;
  margin-top: 4px; }

.item-pricing__1 .item-pricing__description,
.item-pricing__4 .item-pricing__description {
  margin-top: 0;
  margin-bottom: 60px;
  padding: 0 10px;
  text-transform: capitalize; }

.item-pricing__4 .item-pricing__description {
  margin-bottom: 0; }

.item-pricing__4 .item-pricing__description {
  margin-top: 30px;
  padding-bottom: 0; }

.item-pricing__1 .item-pricing__description li,
.item-pricing__4 .item-pricing__description li {
  padding: 5px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08); }

.item-pricing__1 .item-pricing__description li:first-child {
  border-top: 1px solid rgba(0, 0, 0, 0.08); }

.item-pricing__1 .mdl-button,
.item-pricing__4 .mdl-button {
  margin-top: 8px; }

.item-pricing__1 .mdl-button,
.item-pricing__2 .mdl-button,
.item-pricing__4 .mdl-button {
  margin-left: 0;
  margin-bottom: 24px; }

.item-pricing__2 .item-pricing__description {
  margin-top: 0;
  margin-bottom: 0;
  padding: 0 10px;
  list-style-type: none;
  text-transform: capitalize; }

.item-pricing__2 .item-pricing__description li::before {
  content: "\f383";
  margin-right: 15px;
  color:  #007bff  ;
  font-family: "Ionicons"; }

.item-pricing__2.active {
  background: #4cc0ef !important;
  background: linear-gradient(45deg, #4cc0ef 1%, #4f9dde  100%) !important;
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr=' #007bff  ', endColorstr='#4f9dde ',GradientType=1 ) !important; }

.item-pricing__2.active * {
  color: #ffffff !important; }

.item-pricing__2.active .item-pricing__title {
  border: 1px solid #ffffff; }

.item-pricing__2.active .item-pricing__description li::before {
  color: #ffffff; }

/* ====================================================
    06. Accordion Styles
==================================================== */
/* Simple Accordion jQuery */
.jquery_accordion_wrapper {
  width: 100%; }

.jquery_accordion_item {
  display: block;
  border: 1px solid #677180;
  margin-bottom: 15px; }

.jquery_accordion_title {
  display: block;
  padding: 18px 30px 12px 30px;
  position: relative;
  text-transform: capitalize;
  font-size: 22px;
  font-weight: 400;
  font-family: "Poppins", sans-serif;
  color: #1C2025;
  cursor: pointer; }

.jquery_accordion_title:hover {
  background: #30353E;
  color: #ffffff;
  cursor: pointer; }

.jquery_accordion_title i {
  margin-right: 15px; }

.jquery_accordion_title:after {
  content: "";
  width: 0;
  height: 0;
  display: inline-block;
  position: absolute;
  right: 30px;
  top: 50%;
  border: 6px solid transparent;
  border-top-color: #1C2025;
  -webkit-transition: border 400ms, margin 400ms;
  transition: border 400ms, margin 400ms;
  margin-top: -3px;
  /* half of border value */ }

.jquery_accordion_item.active,
.jquery_accordion_item.in {
  -webkit-box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out; }

.jquery_accordion_item.active .jquery_accordion_title,
.jquery_accordion_item.in .jquery_accordion_title {
  background: #1C2025;
  border: 1px solid #1C2025;
  color: #ffffff; }

.jquery_accordion_item.active .jquery_accordion_title:after,
.jquery_accordion_item.in .jquery_accordion_title:after {
  border-color: transparent;
  border-bottom-color: #ffffff;
  margin-top: -9px;
  /* fixing arrow position */ }

.jquery_accordion_item.in .jquery_accordion_content {
  display: block; }

.jquery_accordion_content {
  padding: 30px 30px 0;
  display: none;
  color: #333; }

.jquery_accordion_content > *:first-child {
  margin-top: 0; }

.jquery_accordion_item.circle {
  border-radius: 30px;
  position: relative;
  margin-top: 90px;
  border-color: #EAEDF6; }

.jquery_accordion_item.circle .jquery_accordion_title {
  border: 1px solid #1C2025;
  border-radius: 40px;
  display: block;
  position: absolute;
  width: 100%;
  top: -75px; }

.jquery_accordion_item.circle .jquery_accordion_content {
  top: 70px; }

.jquery_accordion_item.circle.active,
.jquery_accordion_item.circle.in {
  border-color: #1C2025; }

/* ====================================================
    07. page error Styles
==================================================== */
.page-error h1 {
  font-size: 326px;
  line-height: 326px;
  -webkit-font-smoothing: antialiased; }

/* ====================================================
    08. Icon-box Styles
==================================================== */
/* ----- icon-box-single-v2 ----- */
.box-single {
  padding: 0 15px;
  margin-bottom: 30px; }

/* ----- icon-box-single ----- */
.icon-box-single {
  display: block;
  padding: 45px;
  margin-bottom: 30px;
  position: relative;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out; 
}

.icon-box-single:hover,
.icon-counter-single:hover,
.price-table.active {
  background:  #007bff  ;
  background: linear-gradient(45deg, #4cc0ef 1%, #4f9dde  100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgb(212,6,42)', endColorstr='rgb(242,68,10)',GradientType=1 );
  -webkit-box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
  color: #ffffff; }

.icon-box-single:hover .icon-box,
.icon-box-single:hover .icon-box-content .icon-box-title,
.icon-box-single:hover .icon-box-content p {
  color: #ffffff !important; }

.icon-box-single .icon-box,
.price-table i.zmdi {
  font-size: 48px;
  margin-bottom: 0;
  color: #30353E; }

.overlay-dark .icon-box-single .icon-box,
.overlay-dark .price-table i.zmdi {
  color: #EAEDF6; }

.bg-dark .icon-box-border {
  border: 1px solid rgba(255, 255, 255, 0.08); }

.icon-box-title {
  padding: 10px 0 0 0;
  margin: 30px 0 18px 0; }

.icon-box-single.icon-box-center {
  text-align: center; }

/* ----- icon-box-left ----- */
.icon-box-left {
  padding: 0 30px 30px 120px; }

.icon-box-left .icon-box {
  position: absolute;
  left: 0;
  top: 36%;
  width: 120px;
  text-align: center; }

.icon-box-left .icon-box-title {
  padding-left: 0 !important;
  line-height: 1.1; }

.icon-box-title strong {
  color:  #007bff  ;
  margin-right: 10px; }

.icon-box-single:hover .icon-box-title strong {
  color: #ffffff !important; }

.icon-box-border {
  border: 1px solid rgba(0, 0, 0, 0.08); }

/* ----- icon-box-column ----- */
.icon-box-column {
  padding-top: 100px !important;
  padding-bottom: 100px !important;
  margin-bottom: 0; }

.icon-box-column:hover a {
  color: #EAEDF6; }

.overlay-grey .icon-box-border,
.overlay-dark .icon-box-border,
.overlay-color .icon-box-border,
.overlay-dual-dark .icon-box-border {
  border: 1px solid rgba(255, 255, 255, 0.08) !important; }

.icon-box-border.icon-box-white {
  border: 1px solid rgba(255, 255, 255, 0.08) !important; }

.icon-box-white .icon-box *,
.icon-box-white .icon-box-content h6.icon-box-title,
.icon-box-white .icon-box-content p {
  color: #EAEDF6 !important; }

.icon-box-column hr.left {
  margin-bottom: 30px !important; }

.icon-box-column:hover hr {
  border-top: 1px solid #ffffff; }

.icon-box-column:hover .btn.btn-outline-dark {
  border-color: #EAEDF6; }

.icon-box-column:hover .btn.btn-outline-dark:hover {
  color: #1C2025 !important;
  background: #EAEDF6 !important;
  border-color: #EAEDF6 !important; }

/* ====================================================
    09. Team Styles
==================================================== */
.item-team {
  position: relative;
  margin-bottom: 30px; }

.item-team .image {
  position: relative; }

.item-team .image .title {
  position: absolute;
  color: #ffffff;
  bottom: 0;
  right: 0;
  left: 0;
  text-align: center;
  background: rgba(212, 6, 42, 0.92);
  background: linear-gradient(45deg, rgba(212, 6, 42, 0.92) 1%, rgba(242, 68, 10, 0.92) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgba(212,6,42,0.92)', endColorstr='rgba(242,68,10,0.92)',GradientType=1 );
  padding: 20px 20px 18px 20px; }

.item-team .title h6 {
  margin-bottom: 0;
  color: #EAEDF6;
  padding: 0; }

.item-team .title p {
  color: #ffffff;
  margin-bottom: 0;
  font-weight: 200;
  text-transform: capitalize; }

.item-team .content {
  padding: 20px;
  text-align: center; }

.item-team .content p {
  margin-bottom: 20px; }

.item-team .content hr {
  width: 100%;
  border-top: 1px solid #677180;
  margin-bottom: 20px;
  margin-top: 20px; }

.item-team:hover {
  transition: All 0.6s ease;
  -webkit-transition: All 0.6s ease;
  -moz-transition: All 0.6s ease;
  -o-transition: All 0.6s ease;
  -webkit-box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15) !important;
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15) !important; }

.item-team:hover .content {
  background: #1C2025;
  transition: All 0.6s ease;
  -webkit-transition: All 0.6s ease;
  -moz-transition: All 0.6s ease;
  -o-transition: All 0.6s ease; }

.item-team:hover .content .social-icon a,
.item-team:hover .content p {
  color: #ffffff !important; }

.item-team.dark {
  background: #1C2025;
  margin-bottom: 30px;
  color: #EAEDF6 !important; }

.item-team.dark .content .social-icon a {
  color: #EAEDF6 !important; }

.item-team.dark .content .social-icon a:hover {
  color: #4cc0ef !important; }

.item-team-1 .content {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 60px 30px 24px 30px;
  background: rgba(28, 32, 37, 0);
  background: -webkit-gradient(left top, left bottom, color-stop(15%, rgba(28, 32, 37, 0)), color-stop(60%, rgba(28, 32, 37, 0.53)), color-stop(100%, #1c2025));
  background: -webkit-gradient(linear, left top, left bottom, color-stop(15%, rgba(28, 32, 37, 0)), color-stop(60%, rgba(28, 32, 37, 0.53)), to(#1c2025));
  background: linear-gradient(to bottom, rgba(28, 32, 37, 0) 15%, rgba(28, 32, 37, 0.53) 60%, #1c2025 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1c2025', endColorstr='#1c2025', GradientType=0 ); }

.item-team-1 .image .content .title {
  position: relative;
  background: none;
  padding: 0; }

.item-team-1 .image .content .title h5 {
  margin-bottom: 18px; }

.item-team-1:hover .image .content {
  background: rgba(212, 6, 40, 0);
  background: -webkit-gradient(left top, left bottom, color-stop(15%, rgba(212, 6, 40, 0)), color-stop(60%, #007bff82  ), color-stop(100%,  #007bff  ));
  background: -webkit-gradient(linear, left top, left bottom, color-stop(15%, rgba(212, 6, 40, 0)), color-stop(60%, #007bff82  ), to( #007bff  ));
  background: linear-gradient(to bottom, rgba(212, 6, 40, 0) 15%, #007bff82   60%, #4cc0ef 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d40628', endColorstr=' #007bff  ', GradientType=0 ); }

.single-clients {
  width: 60%;
  margin: 0 auto;
  position: relative; }

/* ====================================================
    10. Tabs Styles
==================================================== */
/* ---- Tab Style 1 ---- */
.tabs-style-1 .nav-item {
  border-radius: 0; }

.tabs-style-1 .nav-item .nav-link,
.tabs-style-2 .nav-item .nav-link,
.tabs-style-3 .nav-item .nav-link {
  font-family: "Poppins", sans-serif;
  text-transform: capitalize !important;
  border: 1px solid #e0e0e0;
  border-radius: 0;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 1px;
  padding-left: 28px;
  padding-right: 28px;
  text-align: center; }

.tabs-style-1 .nav-item .nav-link.active {
  border-bottom: 1px solid #e0e0e0;
  color: #EAEDF6;
  background: #1C2025; }

.tabs-style-1 .nav-item .nav-link:hover {
  color: #EAEDF6;
  background: #677180; }

.tab-content .tab-pane {
  height: auto !important;
  padding: 60px 0; }

/* ---- Tab Style 2 ---- */
.tabs-style-2 .nav-item,
.tabs-style-3 .nav-item {
  position: relative; }

.tabs-style-2 .nav-item .nav-link,
.tabs-style-3 .nav-item .nav-link {
  border: none;
  border-bottom: 1px solid #e0e0e0;
  text-align: center;
  padding-top: 18px;
  padding-bottom: 8px;
  margin-left: 5px;
  margin-right: 5px; }

.tabs-style-2 .nav-item .nav-link span.icon,
.tabs-style-3 .nav-item .nav-link span.icon {
  display: block;
  font-size: 30px;
  margin-bottom: 10px; }

.tabs-style-2 .nav-item .nav-link:hover,
.tabs-style-3 .nav-item .nav-link:hover {
  color: #1C2025; }

.tabs-style-2 .nav-item .nav-link:hover span.icon,
.tabs-style-3 .nav-item .nav-link:hover span.icon {
  color:  #23add4  ; }

.tabs-style-2 .nav-item .nav-link.active,
.tabs-style-3 .nav-item .nav-link.active {
  background: transparent;
  border-bottom: 1px solid  #23add4 ; }

.tabs-style-2 .nav-item .nav-link.active span.icon,
.tabs-style-3 .nav-item .nav-link.active span.icon {
  color:  #23add4  ; }

.tabs-style-2 .nav-item .nav-link.active::after,
.tabs-style-3 .nav-item .nav-link.active::after {
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -10px;
  width: 0;
  height: 0;
  border: solid transparent;
  border-width: 10px;
  border-top-color:  #23add4  ;
  content: '';
  pointer-events: none; }

/* ---- Tab Style 3 ---- */
.tabs-style-3 .nav-item .nav-link {
  padding: 42px; }

.tabs-style-3 .nav-item .nav-link.active {
  border-bottom: 1px solid #F0F3FC;
  background: #F0F3FC; 
  border-top: 4px solid #2196ae;
}

.tabs-style-3 .nav-item .nav-link.active::after {
  border-top-color: #F0F3FC; }

/* ====================================================
    11. Counter Styles
==================================================== */
.icon-counter-single {
  text-align: center;
  background-color: #1C2025;
  border: 1px solid rgba(0, 0, 0, 0.08);
  padding: 60px 30px 60px;
  margin-top: 20px;
  margin-bottom: 20px;
  position: relative;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out; }

.icon-counter {
  color: #677180;
  font-size: 48px;
  margin-bottom: 30px; }

.icon-counter-content .counter {
  color: #EAEDF6;
  margin-bottom: 0;
  font-family: "Roboto", sans-serif; }

.icon-counter-single:hover * {
  color: #ffffff; }

/* ====================================================
    12. login Styles
==================================================== */
.login-register {
  padding: 30px;
  text-align: center; }

.login-register h2 {
  color: #1C2025 !important; }

.login-register p {
  color: #677180 !important; }

.login-register .terms,
.login-register .forget {
  color: #677180 !important;
  font-style: italic;
  font-size: 12px;
  display: block;
  text-align: right; }

.login-register .terms,
.login-register .form-check {
  text-align: left; }

.login-register .terms a {
  color: #1C2025 !important; }

.login-register a:hover {
  color: #4cc0ef !important; }

.login-register .btn, .login .btn:active {
  margin-left: 0; }

.login-register hr {
  width: 100%;
  border-top: 1px solid #677180;
  margin-bottom: 20px;
  margin-top: 20px; }

.login-register .social-icon a i {
  color: #1C2025 !important; }

.login-register .social-icon a:hover i {
  color: #4cc0ef !important; }

/* ====================================================
    13. Blog Styles
=======================================================*/
.item-blog {
  position: relative;
  margin-bottom: 30px; }

.item-blog .title {
  text-transform: capitalize !important;
  background: #1C2025;
  text-align: left;
  padding: 20px 30px 16px 30px;
  display: block;
  position: relative; }

.item-blog .title * {
  color: #EAEDF6 !important; }

.item-blog .title h6 {
  margin-bottom: 8px; }

.item-blog .content {
  position: relative;
  padding: 30px; }

.item-blog .date p {
  font-size: 12px;
  line-height: 10px;
  text-transform: capitalize !important;
  letter-spacing: normal;
  font-weight: 300;
  margin-bottom: 8px; }

.item-blog .date span::before {
  Content: "/";
  margin-left: 5px;
  margin-right: 5px; }

.item-blog a.more {
  background: rgba(28, 32, 37, 0.8);
  position: absolute;
  top: 0;
  right: 0;
  padding: 15px 15px 15px 15px;
  font-family: "Poppins", sans-serif;
  text-transform: lowercase;
  text-align: center;
  color: #ffffff;
  opacity: 0; }

.item-blog:hover a.more {
  color: #ffffff;
  opacity: 1; }

.item-blog:hover a.more:hover {
  background:  #007bff  ; }

.item-blog a:hover {
  color:  #007bff  ;
  text-decoration: none; }

.item-blog:hover,
.item-blog:hover .content a.more,
.item-blog:hover a {
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out; }

.item-blog:hover {
  -webkit-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out; }

.statistics {
  margin-bottom: 5px; }

.statistics a {
  margin-right: 30px;
  color: #1C2025; }

.statistics a:hover,
.statistics a:hover * {
  color: #4cc0ef !important; }

.statistics a:last-child {
  margin-right: 0; }

.statistics a i {
  margin-right: 15px;
  font-size: 16px; }

.comemnts_blog ul li {
  list-style: none;
  padding-top: 40px;
  padding-bottom: 10px;
  border-bottom: 1px solid #677180; }

.comemnts_blog ul li:last-child {
  border-bottom: none; }

.comemnts_blog ul li ul li {
  border-top: 1px dashed rgba(103, 113, 128, 0.92); }

.comemnts_blog .title span {
  font-family: "Roboto", sans-serif !important; }

.comemnts_blog .comment_content {
  padding-left: 90px; }

.comemnts_blog a.reply i {
  margin-right: 0.25rem; }

.comemnts_blog .comment_content h6 {
  margin-bottom: 0.25rem;
  text-transform: capitalize; }

.comemnts_blog .comment_content p.date {
  margin-bottom: 1rem;
  font-style: italic; }

.comemnts_blog ul ul {
  padding-left: 2.857rem; }

.comemnts_blog ul ul li {
  border-bottom: none;
  padding-bottom: 0; }

/* ====================================================
    14. Widget Styles
==================================================== */
.widget {
  margin-bottom: 80px; }

.widget-center {
  text-align: center; }

.widget-title {
  margin-bottom: 20px;
  padding-bottom: 5px;
  border-bottom: 1px solid  #007bff  ; }

.clearlist,
.clearlist li {
  list-style: none;
  padding: 0;
  margin: 0;
  background: none; }

.widget-menu li {
  padding: 2px 0; }

.widget ul.recent-posts li a,
.widget-menu li a {
  font-weight: 300;
  color: #1C2025;
  text-decoration: none;
  padding-bottom: 2px;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  -webkit-transition: all 0.17s cubic-bezier(0, 0, 0.58, 1);
  transition: all 0.17s cubic-bezier(0, 0, 0.58, 1); }

.widget ul.recent-posts li a:hover,
.widget-menu li a.active,
.widget-menu li a:hover {
  color: #30353E; }

.widget .tags a {
  display: inline-block;
  margin: 0 8px 13px 0;
  padding: 5px 15px;
  border: 1px solid #1C2025;
  color: #1C2025;
  font-size: 11px;
  font-weight: 400;
  text-transform: uppercase;
  text-decoration: none;
  letter-spacing: 1px;
  -webkit-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1);
  transition: all 0.27s cubic-bezier(0, 0, 0.58, 1); }

.widget .tags a:hover {
  text-decoration: none;
  border: 1px solid  #007bff  ;
  color: #4cc0ef !important; }

.widget ul li {
  list-style-type: none;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  position: relative; }

.widget ul li:last-child {
  border-bottom: none; }

.widget ul li span {
  position: absolute;
  top: 3px;
  right: 0; }

.widget ul.recent-posts li {
  padding: 0 0 0 15px;
  border-left: 6px solid rgba(103, 113, 128, 0.16);
  margin: 15px 0;
  border-bottom: none; }

.widget ul.recent-posts li span {
  position: relative;
  font-weight: 400;
  font-size: 11px;
  line-height: 1;
  color: #999;
  margin-top: 0;
  padding-bottom: 6px; }

.widget ul.recent-posts li,
.widget ul.recent-posts li a,
.widget ul.recent-posts li span {
  display: block; }

/* ====================================================
   15. Portfolio Styles
=======================================================*/
/* filter portfolio*/
#portfolio_filter {
  text-align: center; }

#portfolio_filter ul {
  list-style: none;
  margin-bottom: 0; }

#portfolio_filter ul li {
  font-family: "Poppins", sans-serif;
  font-size: 16px;
  line-height: 26px;
  font-weight: 600;
  text-transform: uppercase;
  color: #1C2025;
  margin-top: 0;
  margin-left: 15px;
  margin-right: 15px;
  padding-bottom: 0;
  margin-bottom: 34px;
  -webkit-transition: all 0.6s ease;
  transition: all 0.6s ease;
  display: inline-block;
  letter-spacing: 1px; }

#portfolio_filter ul li.active,
#portfolio_filter ul li:hover {
  cursor: pointer;
  color:  #007bff  ; }

/* items portfolio*/
.grid-item {
  margin-bottom: 30px; }

.grid-item .grid-item-content {
  margin: 0 15px;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out; }

.grid-item .grid-item-content:hover {
  background: #1C2025;
  -webkit-box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); }

.grid-item-img {
  position: relative; 
  padding-top: 7px;
  padding-bottom: 7px;
  border: 1px solid #d8d8d8;
}

.grid-item-img .overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  opacity: 0; 
  background-color: #2196ae;
}

.grid-item .grid-item-content:hover .overlay {
  opacity: 1; }

#portfolio_items .grid-item-detail {
  padding: 1.25rem;
  text-align: center; }

#portfolio_items .grid-item-detail span {
  font-family: "Poppins", sans-serif;
  font-size: 16px;
  font-weight: 600;
  text-transform: capitalize;
  color: #1C2025;
  display: block; }

#portfolio_items .grid-item-detail p {
  font-family: "Roboto", sans-serif;
  font-size: 13px;
  font-weight: 300;
  text-transform: capitalize;
  color: #677180;
  letter-spacing: normal;
  line-height: 1.25rem;
  margin-bottom: 0; }

#portfolio_items .grid-item:hover .grid-item-detail span {
  color: #EAEDF6;
  -webkit-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out; }

.grid-item-img a {
  font-size: 36px;
  border: 1px solid transparent;
  padding: 10px 16px;
  border-radius: 100%; }

.grid-item-img a:hover {
  border: 1px solid #ffffff; }

#portfolio_items .grid-item-detail a {
  display: inline-block;
  border: none;
  font-size: 24px;
  padding: 0 16px; }

.grid-item-img .grid-item-detail a:hover .icon {
  color: #1C2025 !important; }

/*# sourceMappingURL=main.css.map */




/********************************** External Css **********************************/

/*********************** Slider section Css **********************/
.carousel .carousel-item {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
}

.carousel .carousel-item:first-of-type {
    
}

.carousel .carousel-item:nth-of-type(2) {
    
}

.carousel .carousel-item:last-of-type {
    
}

.carousel-control-prev-icon, .carousel-control-next-icon {
    width: 50px;
    height: 50px;
}

/*************** 2nd slider css ******************/



/*************** Newsletter css *********************/
.subscribe-area {
/*background-image: linear-gradient(to top, #208a9f 0%, #0d6e8c 100%);*/
    background-image: linear-gradient(to top, #ff9c00 0%, #ff7600 100%);
}


.pt-60 {
    padding-top: 60px !important;
}
.pb-50 {
    padding-bottom: 50px !important;
}
.pt-70 {
    padding-top: 70px !important;
}
.pb-70 {
    padding-bottom: 70px !important;
}

.mb-15 {
    margin-bottom: 15px;
}

.subscribe-text span {
    font-size: 12px;
    font-weight: 700;
    color: #fff;
    letter-spacing: 5px;
}
.subscribe-text h2 {
    color: #fff;
    font-size: 36px;
    font-weight: 400;
    margin-bottom: 0;
    margin-top: 6px;
}
.subscribe-wrapper {
    overflow: visible;
    width: 230px;
    margin: auto;
}
.mb-15 {
    margin-bottom: 15px;
}
.subscribe-form {
}
.subscribe2-wrapper .subscribe-form input {
    background: none;
    border: 1px solid #fff;
    border-radius: 30px;
    color: #fff;
    display: inline-block;
    font-size: 15px;
    font-weight: 300;
    height: 57px;
    margin-right: 17px;
    padding-left: 35px;
    width: 70%;
    cursor: pointer;
}
 
.subscribe2-wrapper .subscribe-form button {
    background: #ffff;
    border: none;
    border-radius: 30px;
    color: #4b5d73;
    display: inline-block;
    font-size: 18px;
    font-weight: 400;
    line-height: 1;
    padding: 18px 46px;
    transition: all 0.3s ease 0s;
    cursor: pointer;
}
.subscribe2-wrapper .subscribe-form button i {
    font-size: 18px;
    padding-left: 5px;
}
h2.text-heading {
  color: #2196ae;
  font-family: 'Poppins', sans-serif;
}
/********************* Pricing Table Css ********************/
.bg-gradient {
/*background: ;*/
/*background: ; */
/*background: ;*/
} 
ul li {
  margin-bottom:0.8rem;
  
}
ul li.border-box {
  border-bottom: 1px solid #ededed;
}
h4.text-light {
  font-size: 30px;
  font-family: sans-serif;
}
.pricing-divider {
border-radius: 20px;
background: linear-gradient(to top, #2196ae, #0f778c);;
padding: 1em 0 4em;
position: relative;
}
.blue .pricing-divider{
background: #2D5772; 
}
.green .pricing-divider {
background: #1AA85C; 
}
.red b {
  color:#C64545
}
.blue b {
  color:#2D5772
}
.green b {
  color:#1AA85C
}
.pricing-divider-img {
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 100%;
  height: 80px;
}
.deco-layer {
  -webkit-transition: -webkit-transform 0.5s;
  transition: transform 0.5s;
}
.btn-custom  {
  background:#C64545; color:#fff; border-radius:20px
}

.img-float {
  width:50px; position:absolute;top:-3.5rem;right:1rem
}

.princing-item {
  transition: all 150ms ease-out;
  padding-top: 12px;
}
.princing-item:hover {
  transform: scale(1.05);  
}
.princing-item:hover .deco-layer--1 {
  -webkit-transform: translate3d(15px, 0, 0);
  transform: translate3d(15px, 0, 0);
}
.princing-item:hover .deco-layer--2 {
  -webkit-transform: translate3d(-15px, 0, 0);
  transform: translate3d(-15px, 0, 0);
}
.princing-item h5.text-sk {
  color: #28a2af;
}
/************************** white label slider/para/button css ***********************/
p.detail-text {
  color: #fff;
  text-align: justify;
}
h2.white-label {
  font-weight: bold;
  padding-bottom: 30px;
}
.white-label-top {
  margin-top: 70px;
}
p.white-label-para-top {
  font-weight: 400;
  font-size: 20px;
  color: #2196ae;
  font-family: 'Poppins', sans-serif;
}
strong.color-range {
  color: #ffb102 !important;
}
h4.subscribe-mtb {
  color: #c2fbfc;
  font-weight: bold;
}
/************************** white label middle services css ***********************/
.section-title {
  position: relative;
  font-family: 'Poppins', sans-serif;
}
.section-title p {
  font-size: 16px;
  margin-bottom: 5px;
  font-weight: 400;
}
.section-title h4 {
  font-size: 40px;
  font-weight: 600;
  text-transform: capitalize;
  position: relative;
  padding-bottom: 20px;
  display: inline-block;
  font-family: 'Poppins', sans-serif;
}
.section-title h4:before {
  position: absolute;
  content: "";
  width: 80px;
  height: 2px;
  background-color: #d8d8d8;
  bottom: 0;
  left: 50%;
  margin-left: -40px;
}
.section-title h4:after {
  position: absolute;
  content: "";
  width: 50px;
  height: 2px;
  background-color: #2196ae;
  left: 0;
  bottom: 0;
  left: 50%;
  margin-left: -25px;
}
.pt-100 {
  padding-top: 100px;
}
.pb-100 {
  padding-bottom: 100px;
}
.mb-100{
    margin-bottom:100px;
}
.services {
  background-color: #FBFBFB;
}
.single-service p {
  text-align: justify;
}
.single-service h4 {
  font-weight: bold;
  color: #2196ae;
  font-weight: 700;
}
.single-service {
  position: relative;
  min-height: 350px;
  text-align: center;
  margin-bottom: 50px;
  -webkit-transition: .3s;
  transition: .3s;
  padding: 30px 20px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.16)
}
.single-service:before {
  position: absolute;
  width: 0;
  height: 0;
  background-color: #2196ae;
  left: 0;
  top: 0;
  content: "";
  -webkit-transition: .3s;
  transition: .3s
}
.single-service:after {
  position: absolute;
  width: 0;
  height: 0;
  background-color: #2196ae;
  right: 0;
  bottom: 0;
  content: "";
  -webkit-transition: .3s;
  transition: .3s
}
.single-service:hover:after,
.single-service:hover:before {
  width: 50%;
  height: 2px;
  -webkit-transition: .3s;
  transition: .3s
}
.single-service:hover {
  box-shadow: 1px 3px 10px 0 rgba(0, 0, 0, 0.10)
}
.single-service i.fa {
  font-size: 20px;
  width: 60px;
  height: 60px;
  border: 1px solid #ddd;
  line-height: 60px;
  margin-bottom: 30px;
  border-radius: 50%;
  -webkit-transition: .3s;
  transition: .3s
}
.single-service:hover i.fa {
  background-color: #2196ae;
  color: #fff;
  border-color: #2196ae;
  border-radius: 0;
}
.single-service h4 {
  font-size: 20px;
  font-weight: 400;
  margin-bottom: 15px;
  text-transform: capitalize;
}
.single-service p {
  font-size: 15px;
  line-height: 1.8;
}












/************************** top bar header ***********************/

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .princing-item .red {
    max-width: 100%;
  }
  .icon-box-content a.box_btn2 {
  	display: none;
  }
}

/******************** display-4 css h4 ************************/
h3.display-heading {
  color: #ffffff !important;
  margin-top: 50px;
}
.footer-social-mtb p {
  margin-left: 50px;
  margin-top: 10px;
  text-align: center;
}
.footer-social-mtb p.privacy-social-link {
  margin-left: 20px;
  display: inline-block;
  text-align: center;
  font-weight: bold;
}
.footer-social-mtb p.privacy-social-link:hover {
  color: #2196ae;
  transition: all .5s ease-in-out;
}
@media only screen and (min-width: 320px) and (max-width: 768px) {
  .footer-social-mtb p {
    float: left;
    display: block;
    text-align: center;
    margin-left: 0;
  }
  .icon-box-content a.box_btn2 {
  	display: none;
  }
}




.heading-box h2{ width:100%; color: red; }
.text-box {
  position: absolute;
  top: 50%;
  left: 15%;
  right: 15%;
  color: #fff;
  text-align: center;
  transform: translateY(-50%);
}
h2.slider-heading-mtb {
  color: #2bd0f2 !important;
  font-weight: bold;
  font-size: 45px;
  letter-spacing: 1px;
  width: 100%;
}
p.top-para-mtb {
  color: #ffffff;
  font-size: 22px;
  letter-spacing: 1px;
  font-weight: lighter;
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
  h1.slider-heading-mtb {
  color: #25d4e8;
  font-weight: bold;
  font-size: 50px;
  letter-spacing: 1px;
}
p.top-para-mtb {
  color: #ffffff;
  font-size: 14px;
  letter-spacing: 1px;
  font-weight: lighter;
}
.icon-box-content a.box_btn2 {
  	display: none;
  }
}

@media only screen and (min-width: 560px) and (max-width: 768px) {
  h1.slider-heading-mtb {
  color: #25d4e8;
  font-weight: bold;
  font-size: 25px;
  letter-spacing: 0px;
}
p.top-para-mtb {
  color: #ffffff;
  font-size: 10px;
  letter-spacing: 1px;
  font-weight: lighter;
  line-height: 0.8rem;
}
.icon-box-content a.box_btn2 {
  	display: none;
  }
}

@media only screen and (min-width: 360px) and (max-width: 560px) {
  h1.slider-heading-mtb {
  color: #25d4e8;
  font-weight: ;
  font-size: 18px;
  letter-spacing: ;
  margin-top: 30px;
  line-height: 1.4rem;
}
p.top-para-mtb {
  color: #ffffff;
  font-size: 8px;
  letter-spacing: ;
  font-weight: lighter;
  line-height: 1rem;
}
.icon-box-content a.box_btn2 {
  	display: none;
  }
 h3.display-3-tech {
  color: #ffffff !important;
  font-size: ;
  margin-top: 15px;
}
}

@media only screen and (min-width: 375px) and (max-width: 414px) {
  h1.slider-heading-mtb {
    color: #25d4e8;
    font-size: 12px;
    margin-top: 40px;
    line-height: 1.4rem;
}
p.top-para-mtb {
  color: #ffffff;
  font-size: 8px;
  font-weight: lighter;
  line-height: 1rem;
}
.icon-box-content a.box_btn2 {
  	display: none !important;
  }
h3.display-3-tech {
  color: #ffffff !important;
  margin-top: 15px;
}

}

@media only screen and (min-width: 320px) and (max-width: 360px) {
  h1.slider-heading-mtb {
    color: #25d4e8;
    font-weight: ;
    font-size: 8px;
    letter-spacing: ;
    margin-top: 40px;
    line-height: 1.4rem;
}
p.top-para-mtb {
  color: #ffffff;
  font-size: 8px;
  letter-spacing: ;
  font-weight: lighter;
  line-height: 1rem;
}
.icon-box-content a.box_btn2 {
  	display: none !important;
  }
h3.display-3-tech {
  color: #ffffff !important;
  font-size: ;
  margin-top: 15px;
}
img.logo {
	width: 140px;
}
}



/******************* Graphic Design Services Css ********************/


/*

*/

h3.heading-hover-gt {
  color: #e8e8e8;
}
.text{
  color: rgba(31,181,172,.9);
  text-align: center;
}
p.heading-hover-gt {
  color: #e8e8e8;
}
p.heading-hover-gt:hover {
  color: #000;
  transition: all 0.5s ease-in-out;
}

.folded-corner:hover .text{
  visibility: visible;
  color: #000000;;
}
.Services-tab{
  margin-top:20px;
}

/*
  nav link items
*/
.folded-corner{
  padding: 25px 25px;
  position: relative;
  font-size: 90%;
  text-decoration: none;
  color: #999; 
  background: transparent;
  transition: all ease .5s;
  border: 1px solid rgba(31,181,172,.9);
}
.folded-corner:hover{
  background-color: rgba(31,181,172,.9);
}

/*
  paper fold corner
*/

.folded-corner:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  border-style: solid;
  border-width: 0 0px 0px 0;
  border-color: #ddd #000;
  transition: all ease .3s;
}

/*
  on li hover make paper fold larger
*/
.folded-corner:hover:before {
  background-color: #D00003;
  border-width: 0 50px 50px 0;
  border-color: #eee #000;
  
}

.service_tab_1{
  background-color: #000;
}
.service_tab_1:hover .fa-icon-image{
    color: #000;
    transform: rotate(360deg) scale(1.5);
}


.fa-icon-image{
  color: rgba(31,181,172,.9);
  display: inline-block;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    line-height: 1;
    font-size-adjust: none;
    font-stretch: normal;
    -moz-font-feature-settings: normal;
    -moz-font-language-override: normal;
    text-rendering: auto;
    transition: all .65s linear 0s;
    text-align: center;
    transition: all 1s cubic-bezier(.99,.82,.11,1.41);
}
/************************** Graphic Design Service Gallery Css *****************************/
.content-103{
  background: #f3f3f3;
  padding-bottom:30px;
  padding-top:30px;
}

.content-103 .sercies-title{
  text-align:center;
  padding: 50px 0;
}

.service-post {
  background: #ffffff;
  padding: 30px;
  text-align: center;
  cursor: pointer;
  position: relative;
  z-index: 12;
  margin-bottom: 30px;
  -moz-box-shadow: 0 5px 4px -4px rgba(0, 0, 0, 0.08);
  -webkit-box-shadow: 0 5px 4px -4px rgba(0, 0, 0, 0.08);
  box-shadow: 0 5px 4px -4px rgba(0, 0, 0, 0.08);
}
.content-103 .service-content {
  position: relative;
  z-index: 13;
}
.content-103 .service-icon {
  margin: 10px 0 20px 0;
  width: 50px;
  height: 50px;
  border-radius: 25px;
  text-align: center;
  border: 2px solid #00aaaf;
  margin-left: auto;
  margin-right: auto;
  line-height: 50px;
  -moz-transition: color, 250ms;
  -o-transition: color, 250ms;
  -webkit-transition: color, 250ms;
  transition: color, 250ms;
}
.content-103 .service-post:hover .service-icon {
  border-color: #fff;
}
.content-103 .service-icon i {
  font-size: 18px;
  color: #00aaaf;
}
.content-103 .service-post:hover .service-icon i {
  color: #fff;
}
.content-103 .service-title {
  font-size: 16px;
  font-weight: normal;
  margin-bottom: 15px;
  -moz-transition: color, 250ms;
  -o-transition: color, 250ms;
  -webkit-transition: color, 250ms;
  transition: color, 250ms;
}
.content-103 .service-post:hover .service-title {
  color: #fff;
}
.content-103 .service-description {
  -moz-transition: color, 250ms;
  -o-transition: color, 250ms;
  -webkit-transition: color, 250ms;
  transition: color, 250ms;
}
.content-103 .service-post:hover .service-description {
  color: #fff;
}


.content-103 .service-hover {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 11;
  width: 100%;
  height: 0px;
  background: #00aaaf;
  -moz-transition: width, 250ms;
  -o-transition: width, 250ms;
  -webkit-transition: width, 250ms;
  transition: width, 250ms;
}
/*hover-background-color effect*/
.content-103 .service-post:hover .service-hover {
  height: 100%;
}
p.service-description {
  text-align: justify;
}
/******************** header top button css ********************/
/**************** button one ***************/
.btn-primary.btn-top {
  background: #019ba0;
  padding: 0 5px 0 5px;
  border: none;
  height: 50px;
  margin-left: 5px;
  border: 1px solid #c1c1c1;
}
.btn-primary.btn-top p {
  color: #fff;
  float: left;
  line-height: 50px;
}
.btn-primary.btn-top img {
  float: right;
  margin-left: 6px;
  line-height: 50px;
  width: 30px;
  height: 30px;
  margin-top: 8px;
}
.btn-primary.btn-top:hover {
  border-radius: 12px;
  transition: all 0.5s ease-in-out;
}
/**************** button two ***************/
.btn-primary.btn-top2 {
  background: #35b2e0;
  padding: 0 5px 0 5px;
  border: none;
  height: 50px;
  margin-left: 5px;
  border: 1px solid #c1c1c1;  
}
.btn-primary.btn-top2 p {
  color: #fff;
  float: left;
  line-height: 50px;
}
.btn-primary.btn-top2 img {
  float: right;
  margin-left: 6px;
  line-height: 50px;
  width: 30px;
  height: 30px;
  margin-top: 8px;
}
.btn-primary.btn-top2:hover {
  border-radius: 12px;
  transition: all 0.5s ease-in-out;
}


/******************* blog section css two *******************/
.pb-100 {
  padding-bottom: 50px;
}
.pt-100 {
  padding-top: 50px;
}
.mb-100 {
  margin-bottom: 50px;
}
a {
  text-decoration: none;
  color: #333;
  -webkit-transition: .4s;
  transition: .4s;
}
.section-title {
  position: relative;
}
.section-title p {
  font-size: 16px;
  margin-bottom: 5px;
  font-weight: 400;
}
.section-title h4 {
  font-size: 40px;
  font-weight: 600;
  text-transform: capitalize;
  position: relative;
  padding-bottom: 20px;
  display: inline-block;
}
.section-title h4::before {
  position: absolute;
  content: "";
  width: 80px;
  height: 2px;
  background-color: #d8d8d8;
  bottom: 0;
  left: 50%;
  margin-left: -40px;
}
.section-title h4::after {
  position: absolute;
  content: "";
  width: 50px;
  height: 2px;
  background-color: #2196ae;
  left: 0;
  bottom: 0;
  left: 50%;
  margin-left: -25px;
}
.blog-img {
  position: relative;
}
.blog-img img {
  width: 100%;
}
.post-category a {
  display: inline-block;
  background-color: #2196ae;
  color: #fff;
  font-size: 15px;
  padding: 5px 20px;
}
.single-blog:hover img {
  opacity: .85;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)"
}
.post-category {
  position: absolute;
  left: 0;
  bottom: 0;
}
.blog-content {
  padding: 30px 20px;
}
.single-blog {
  border: 1px solid #bcbcbc;
}
.single-blog:hover {
  box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
  border: 1px solid #2196ae;
  transition: all 0.5s ease-in-out;
}
.blog-title h4 {
  font-size: 20px;
  font-weight: 500;
  margin-bottom: 5px;
}
.meta ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.meta {
  margin-bottom: 20px;
  opacity: .85;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";
}
.icon-box-content a.box_btn {
  display: inline-block;
  background-color: #ff9c00;
  padding: 20px 25px;
  color: #fff;
  text-transform: capitalize;
  margin-top: 10px;
  margin-bottom: 10px;
}
a.box_btn::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background-color: #000;
  left: -97%;
  top: 0;
  -webkit-transition: .5s;
  transition: .5s;
  z-index: -1;
}
a.box_btn {
  overflow: hidden;
  z-index: 2;
  -webkit-transition: .5s;
  transition: .5s;
  position: relative;
  text-decoration:none;
}
a.box_btn:hover::before {
  left: 0;
  z-index: -1;
}

.icon-box-content a.box_btn2 {
  display: inline-block;
  background-color: #000;
  padding: 25px 40px;
  color: #fff;
  text-transform: capitalize;
  margin-top: 20px;
  border-radius: 10px;
  font-size: 23px;
}
a.box_btn2::before {
  position: absolute;
  content: "";
  width: 100%;
  height: 100%;
  background-color: #0f89bc;
  left: -100%;
  top: 0;
  -webkit-transition: .5s;
  transition: .5s;
  z-index: -1;
  
}
a.box_btn2 {
  overflow: hidden;
  z-index: 2;
  -webkit-transition: .5s;
  transition: .5s;
  position: relative;
  text-decoration:none;
}
a.box_btn2:hover::before {
  left: 0;
  z-index: -1;
}


/************************** Portfolio 2nd section css **************************/
h1 span{
    color: #7f01c7;
}
.device {
  margin: 0;
  position: relative;
  display: inline-block;
  width: 45%;
}
.device.tablet .device-hardware {
  background-image: url(https://cdn.pbhs-sites.com/wp-content/plugins/pbhs-portfolio/_media/images/tablet-lg.webp);
  background-size: 100% auto;
  background-repeat: no-repeat;
  display: block;
  position: relative;
  padding-bottom: 91.3%;
}
.device.tablet .device-screen {
  top: 9.5%;
  bottom: 35.5%;
  left: 12.5%;
  right: 11.5%;
  border-radius: 1px;
  background-size: 122% auto;
  background-position-x: 50%;
  background-position-y: 0%;
  position: absolute;
  background-size: 100% auto;
  background-repeat: no-repeat;
  display: block;
  -webkit-transition: background-position .4s;
  -moz-transition: background-position .4s;
  -o-transition: background-position .4s;
  transition: background-position .4s;
  background-color: #565656;
  overflow: hidden;
}
.device.tablet .hover-trigger:hover .device-screen{
  background-position-y: 50%;
}
.device .hover-name {
  background-color: #7f01c7;
  color: #efefef;
  position: absolute;
  font-size: 13px;
  font-weight: 600;
  line-height: 100%;
  padding: 12px 6px;
  top: -50px;
  text-transform: uppercase;
  text-align: center;
  display: block;
  left: 0;
  right: 0;
  width: 100%;
  -webkit-transition: top .4s;
  -moz-transition: top .4s;
  -o-transition: top .4s;
  transition: top .4s;
  font-family: montserrat,Helvetica,Arial,sans-serif;
}
.device.tablet .hover-trigger:hover .hover-name{
  top:-1px;
}
.device .hover-icon {
  position: absolute;
  left: 50%;
  margin-left: -35px;
  top: 30%;
  color: rgba(255,255,255,.8);
  background-color: rgba(255,255,255,.3);
  width: 70px;
  text-align: center;
  line-height: 70px;
  font-size: 30px;
  height: 70px;
  border-radius: 100%;
  -webkit-transition: all .5s;
  -moz-transition: all .5s;
  -o-transition: all .5s;
  transition: all .5s;
  opacity: 0;
  -webkit-transform: scale(1.5);
  -moz-transform: scale(1.5);
  -o-transform: scale(1.5);
  -ms-transform: scale(1.5);
  transform: scale(1.5);
}
.device.tablet.device-list .hover-trigger:hover .hover-icon{
  opacity: 1;
  -webkit-transform: scale(1);
  -moz-transform:scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  transform: scale(1);
}
p.form-heading-mtb-20 {
  color: #000 !important;
  font-size: 17px;
  font-weight: 700;
  font-family: 'Poppins', sans-serif;
}
@media (max-width: 991px){
  .device {
    width: 45%;
  }
  .flex-order-tablet_0 {
    order: 0;
    -ms-flex-order: 0;
    -webkit-order:0;
    -moz-box-ordinal-group: 0;
    -ms-box-ordinal-group: 0;
    -webkit-box-ordinal-group: 0;
  }
}
@media (max-width: 767px){
   .device {
    width: 95%;
  }
}
/************************* Team section 2nd ***************************/
/* TITRE */
h1 {
  margin-top: 0;
  font-size: 3rem;
  display: inline-block;
}
h1 div {
  position: relative;
  float: left;
}
h1 div:first-child {
  color: #3498db;
  margin-right: 1rem;
}
/* PROFIL */
.blog .carousel-indicators {
  left: 0;
  top: auto;
  bottom: -80px;
  cursor: pointer;
}

/* The colour of the indicators */
.blog .carousel-indicators li {
    background: #a3a3a3;
    border-radius: 50%;
    width: 8px;
    height: 8px;
    margin-bottom:10px;
    
}

.blog .carousel-indicators .active {
background: #707070;
margin-bottom:10px;
}

.our-team-section {
  position: relative;
  padding-top: 40px;
  padding-bottom: 40px;
}
.our-team-section:before {
  position: absolute;
  top: -0;
  left: 0;
  content: " ";
  background: url(img/service-section-bottom.png);
  background-size: 100% 100px;
  width: 100%;
  height: 100px;
  float: left;
  z-index: 99;
}
.our-team {
  padding: 0 0 40px;
  background: #f9f9f9;
  text-align: center;
  overflow: hidden;
  position: relative;
  border-bottom: 5px solid #00325a;
}
.our-team:hover {
  border-bottom: 5px solid #2f2f2f;
}

.our-team .pic {
  display: inline-block;
  width: 130px;
  height: 130px;
  margin-bottom: 50px;
  z-index: 1;
  position: relative;
}
.our-team .pic:before {
  content: "";
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: #2196ae;
  position: absolute;
  bottom: 135%;
  right: 0;
  left: 0;
  opacity: 1;
  transform: scale(3);
  transition: all 0.3s linear 0s;
}
.our-team:hover .pic:before {
  height: 100%;
  background: #ff9c00;
}
.our-team .pic:after {
  content: "";
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: #ffffff00;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  transition: all 0.3s linear 0s;
}
.our-team:hover .pic:after {
  background: #2196ae;
}
.our-team .pic img {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  transform: scale(1);
  transition: all 0.9s ease 0s;
  box-shadow: 0 0 0 14px #f7f5ec;
  transform: scale(0.7);
  position: relative;
  z-index: 2;
}
.our-team:hover .pic img {
  box-shadow: 0 0 0 14px #f7f5ec;
  transform: scale(0.7);
}
.our-team .team-content {
  margin-bottom: 30px;
}
.our-team .title {
  font-size: 22px;
  font-weight: 500;
  color: #4e5052;
  letter-spacing: 1px;
  text-transform: capitalize;
  margin-bottom: 5px;
  font-family: 'Poppins', sans-serif;
}
.our-team .post {
  display: block;
  font-size: 15px;
  color: #4e5052;
  text-transform: capitalize;
}
.our-team .social {
  width: 100%;
  padding-top: 10px;
  margin: 0;
  background: #2f2f2f;
  position: absolute;
  bottom: -100px;
  left: 0;
  transition: all 0.5s ease 0s;
}
.our-team:hover .social {
  bottom: 0;
}
.our-team .social li {
  display: inline-block;
}
.our-team .social li a {
  display: block;
  padding-top: 6px;
  font-size: 15px;
  color: #fff;
  transition: all 0.3s ease 0s;
}
.our-team .social li a:hover {
  color: #2f2f2f;
  background: #f7f5ec;
}
@media only screen and (max-width: 990px) {
  .our-team {
    margin-bottom: 10px;
  }
}

/*********************** Team Button ***********************/
.btn-team {
  border: none;
  border-radius: 2px;
  padding: 3px 6px;
  /*background: ;*/
  text-align: center;
  transition: 0.5s;
  color: #fff !important;
  margin-right: 6px;
  cursor: pointer;
}
.btn-team:hover {
  background-color: #2196ae;
  color: #fff !important;
}
/******************** offer detail *****************************/
.offer-detail {
  background: #2196ae;
  color: #ffffff;
  vertical-align: middle;
  height: 40px;
  margin-top: 70px;
}
.offer-detail h6 {
  color: #ffffff;
  vertical-align: middle;
  line-height: 40px;
  margin-top: 3px;
}

@media only screen and (min-width: 320px) and (max-width: 991px) {
  .white-label-top {
    margin-top: 0px;
  }
}

/******************* White Label Badges Css **********************/
.image-box-badges img {
  margin: 7px;
}

/********************* Submit form css ******************/
.bg-dark-overlay-submit-form {
  background: #000000 !important;
  padding-top: 120px;
  padding-bottom: 20px;
  opacity: 1;
  background: url(../img/bg/web-development.jpg);
  background-position: center center no-repeat;
  background-size: cover;
}

button.btn-form-top {
  background: #2196ae;
  border: none;
  vertical-align: middle;
  margin-top: 17px;
  min-height: 15px;
  padding: 10px 15px;
  color: #ffffff;
}
button.btn-form-top a {
  color: #ffffff;
  letter-spacing: 1px;
}
button.btn-form-top:hover {
  background: none;
  border: 1px solid #ffffff;
}


/************************** Logo Pricing Css **************************/
.card-pricing.popular {
    z-index: 1;
    border: 2px solid #2196ae;
}
.card-pricing .list-unstyled li {
    padding: .5rem 0;
    color: #6c757d;
    font-family: 'Poppins', sans-serif;
}
ul.list-unstyled li {
  border-bottom: 1px solid #e7e7e7;
}
h1.font-weight-normal {
  color: #2196ae;
  font-weight: 600 !important;
  font-family: 'Poppins', sans-serif;

}
button p {
  font-size: 20px;
  font-weight: bold;
  color: #ffffff;
  font-family: 'Poppins', sans-serif;
}
button:hover p {
  color: #000000;
  font-family: 'Poppins', sans-serif;
}


/*****************************  Top Slider Hidden Css *****************************/
@media only screen and (max-width: 991px) {
  .carousel {
    display: none;
  }
  .image-box-badges img {
  display: none;
}
.mdl-tabs.mdl-js-tabs.mdl-js-ripple-effect {
  display: none;
}
.bg-img-10 {
  display: none;
}
}


h3.display-3-tech {
  color: #ffffff !important;
  margin-top: 15px;
}
/**************************** Bottom button hidden css ***************************/
.appointment-btn {
  display: none;
  padding-top: 0px;
  padding-bottom: 0px;
}

@media only screen and (max-width: 768px) {
  .appointment-btn {
    display: block;
  }
}

@media only screen and (max-width: 380px) {
  .offer-information-book {
    position: relative;
    width: 33% !important;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
  }
}



/* Fixed Button Css */
.top-button {
  width: 33%;
  max-width: 100%;
}
/*
@media only screen and (min-width: 445px) and (max-width: 480px) {
  .icon-box-content a {
  font-size: 12px;
}
}

@media only screen and (min-width: 400px) and (max-width: 444px) {
  .icon-box-content a {
  font-size: 10px;
}
}

@media only screen and (min-width: 380px) and (max-width: 399px) {
  .icon-box-content a {
  font-size: 9px;
}
}

@media only screen and (min-width: 360px) and (max-width: 379px) {
  .icon-box-content a {
  font-size: 8px;
}
}
*/

.appointment-btn-section {
  background: #000000;
}
button.btn .booking-item .btn, .btn:active {
    border-radius: 0 !important;
    border: 2px solid transparent !important;
    font-family: "Roboto", sans-serif !important;
    font-weight: 400 !important;
    text-transform: capitalize !important;
    /* padding: 6px 26px 4px 26px; */
    margin-bottom: 2px !important;
    margin-left: 0px !important;
    letter-spacing: 0px !important;
    line-height: 26px !important;
    -webkit-transition-duration: 0.4s !important;
    transition-duration: 0.4s !important;
    -webkit-transition-timing-function: ease-in-out !important;
    transition-timing-function: ease-in-out !important;
}
.booking-item {
  padding: 5px !important;
  background: #2196ae !important;
  margin-left: 0px !important;
  margin-top: 7px !important;
  margin-bottom: 7px !important;
  text-align: center !important;
  
}
.booking-item a {
  color: #ffffff !important;
}

@media only screen and (max-width: 440px) {
  .booking-item a {
    font-size: 12px;
  }
}
@media only screen and (min-width: 360px) and (max-width: 390px) {
  .booking-item a {
    font-size: 10px;
  }
}
@media only screen and (min-width: 320px) and (max-width: 359px) {
  .booking-item a {
    font-size: 9px;
  }
}

@media only screen and (max-width: 768px) {
  .section-padd70 {
    padding-top: 0px !important;
  }
}

/*
@media only screen and (max-width: 544px) {
  .icon-box-content a.box_btn {
    display: inline-block;
    background-color: #2196ae;
    padding: 20px 20px;
    color: #fff;
    text-transform: capitalize;
    margin-top: 10px;
    margin-bottom: 10px;
}
}

@media only screen and (min-width: 497px) and (max-width: 510px) {
  .icon-box-content a.box_btn {
    display: inline-block;
    background-color: #2196ae;
    padding: 20px 17px;
    color: #fff;
    text-transform: capitalize;
    margin-top: 10px;
    margin-bottom: 10px;
}
}



@media only screen and (min-width: 460px) and (max-width: 496px) {
  .icon-box-content a.box_btn {
    display: inline-block;
    background-color: #2196ae;
    padding: 20px 11px;
    color: #fff;
    text-transform: capitalize;
    margin-top: 10px;
    margin-bottom: 10px;
}
}
*/


/* ============== Digital Marketing Price Plan ============= */
section.priceplan-digital-marketing {
  padding-top: 50px;
  padding-bottom: 50px;
  background: #ffffff;
}
table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
  max-width: 100% !important;
}

td, th {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 14px;
}

tr:nth-child(even) {
  background-color: #dddddd;
}
tr.bg-table-dark {
  background: #000000;
  color: #ffffff;
}
tr.bg-lightgray {
  background: #2196ae;
  color: #ffffff;
}
/*tr > button {
  background: #2196ae;
  color: #ffffff;
  padding: 8px;
  border: none;
}*/
button.btn-import {
  background: #2196ae !important;
  height: 40px;
  padding: 2px 8px;
  border: none;
  border-radius: 4px;
  color: #ffffff;
}
button.btn-import a {
  color: #ffffff !important;
}


/* ============== EXTERNAL CSS AFTER REWAMP ============ */
h3.social-item-nav-heading {
  color: #ff9c00;
  font-size: 20px;
  font-family: 'Poppins', sans-serif;
  line-height: 10px !important;
  padding-left: 25px;
  padding-top: 23px;
  font-weight: 600;
}
.bottom-footer-one {
  /*background: #313131 !important;*/
  background-color: #008bae;
  background-image: url("../../img/bg/footer-bg.png");
  position: relative;
  overflow: hidden;
}
.footer-bottom-content {
    padding-bottom: 35px;
    padding-top: 50px;
}
.footer-bottom-social-item {
    padding-bottom: 35px;
    padding-top: 50px;
}
p.content-about-footer {
  text-align: justify;
  color: #f5f5f5;
  letter-spacing: 1px;
  margin-top: 17px;
  font-family: 'Poppins', sans-serif;
}
li.social-list-nav-item {
  list-style: none;
  transition: all 0.3s ease-in-out;
  margin-bottom: 0.5rem;
}
li.social-list-nav-item:hover {
  transform: translateX(6px);
}
li.social-list-nav-item:hover a {
  color: #ff9c00;
  transform: translateX(10px);
}
li.social-list-nav-item a {
  color: #fff;
  font-size: 13px;
  font-family: 'Poppins', sans-serif;
}
i.footer-icon-light {
  color: #ff9c00;
  padding-right: 8px;
}
i.follow-icon {
  color: #ff9c00;
}
p.follow-us-content {
  color: #ffffff;
  letter-spacing: 1px;
  margin: 0 0 10px;
  font-family: 'Poppins', sans-serif;
}
i.follower-icon {
  color: #fff;
  margin: 4px;
  font-size: 15px;
}
i.follower-icon:hover {
  color: #ff9c00;
}
/* ============= last footer bottom ============== */
.last-footer-bottom {
  background: #000000;
  padding-bottom: 10px;
}
.footer-social-mtb p {
  color: #c3c3c3 !important;
  margin-left: 0px !important;
}
.menu .nav-item .nav-link {
    display: block;
    padding: 17px 7px 0px 10px !important;
    font-family: "Poppins", sans-serif;
    font-size: 12px;
    font-weight: 500 !important;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: #FFFFFF;
    cursor: pointer;
}
.icon-box-content a.box_btn {
    padding: 20px 20px !important;
    font-family: 'Poppins', sans-serif;
}
.subscribe-padd40 {
  padding-top: 25px;
  padding-bottom: 20px;
}
.subscribe-form {
    margin-top: 14px !important;
}
.subscribe-form > .btn-primary {
  background: #000000 !important;
  font-family: 'Poppins', sans-serif !important;
}
.subscribe-text h2 {
    color: #fff;
    font-size: 30px !important;
    letter-spacing: 1px;
    margin-bottom: 0;
    margin-top: 6px;
    font-family: 'Poppins', sans-serif !important;
    font-weight: 600;
}

/* =========== About us page css ============= */
h6.padd10 {
  margin: 0 0 5px;
  font-family: 'Poppins', sans-serif !important;
  font-weight: 600;
}
.feature-about-focus {
  padding-top: 70px;
  padding-bottom: 50px;
  position: relative;
  overflow: hidden;
  z-index: 1;
}
.dot-1:before {
    content: '';
    position: absolute;
    top: 10%;
    left: 3%;
    width: 8px;
    height: 8px;
    border-radius: 100%;
    background: #ff9c00;
    animation: dot1move linear 25s infinite;
    z-index: 0;
    opacity: 0.7;
}
@keyframes dot1move {
    0% {
        left: 3%;
    }
    25% {
        left: 30%;
        top: 45%;
        width: 3px;
        height: 3px;
    }
    50% {
        left: 5%;
        top: 75%;
        width: 5px;
        height: 5px;
    }
    75% {
        left: 20%;
        top: 5%;
        width: 7px;
        height: 7px;
    }
    100% {
        left: 3%;
        opacity: 0;
    }
}
.dot-2:before {
    content: '';
    position: absolute;
    top: 5%;
    right: 3%;
    width: 8px;
    height: 8px;
    border-radius: 100%;
    background: #2196ae;
    animation: dot2move linear 15s infinite;
    z-index: 0;
    opacity: 0.7;
}
@keyframes dot2move {
    0% {
        right: 3%;
    }
    25% {
        right: 30%;
        top: 45%;
        width: 3px;
        height: 3px;
    }
    50% {
        right: 45%;
        top: 15%;
        width: 5px;
        height: 5px;
    }
    75% {
        right: 20%;
        top: 55%;
        width: 7px;
        height: 7px;
    }
    100% {
        right: 3%;
        opacity: 0;
    }
}
.dot-3:before {
    content: '';
    position: absolute;
    bottom: 5%;
    right: 5%;
    width: 8px;
    height: 8px;
    border-radius: 100%;
    background: #ff0000;
    animation: dot3move linear 20s infinite;
    z-index: 0;
    opacity: 0.7;
}
@keyframes dot3move {
    0% {
        right: 5%;
        bottom: 5%;
    }
    25% {
        right: 25%;
        bottom: 25%;
        width: 3px;
        height: 3px;
    }
    50% {
        right: 45%;
        bottom: 45%;
        width: 5px;
        height: 5px;
    }
    75% {
        right: 65%;
        bottom: 65%;
        width: 7px;
        height: 7px;
    }
    100% {
        right: 5%;
        opacity: 0;
    }
}
.dot-4:before {
    content: '';
    position: absolute;
    bottom: 15%;
    right: 25%;
    width: 8px;
    height: 8px;
    border-radius: 100%;
    background: #0030ff;
    animation: dot4move linear 20s infinite;
    z-index: 0;
    opacity: 0.8;
}
@keyframes dot4move {
    0% {
        right: 25%;
        bottom: 15%;
    }
    25% {
        right: 35%;
        bottom: 25%;
        width: 3px;
        height: 3px;
    }
    50% {
        right: 55%;
        bottom: 55%;
        width: 5px;
        height: 5px;
    }
    75% {
        right: 85%;
        bottom: 25%;
        width: 7px;
        height: 7px;
    }
    100% {
        right: 5%;
        opacity: 0;
    }
}
.dot-5:before {
    content: '';
    position: absolute;
    bottom: 5%;
    left: 25%;
    width: 8px;
    height: 8px;
    border-radius: 100%;
    background: #ff0261;
    animation: dot5move linear 20s infinite;
    z-index: 0;
    opacity: 0.8;
}
@keyframes dot5move {
    0% {
        bottom: 5%;
        left: 25%;
    }
    25% {
        bottom: 25%;
        left: 5%;
        width: 3px;
        height: 3px;
    }
    50% {
        bottom: 55%;
        left: 45%;
        width: 5px;
        height: 5px;
    }
    75% {
        bottom: 75%;
        left: 85%;
        width: 7px;
        height: 7px;
    }
    100% {
        left: 25%;
        opacity: 0;
    }
}
.dot-6:before {
    content: '';
    position: absolute;
    bottom: 5%;
    left: 5%;
    width: 8px;
    height: 8px;
    border-radius: 100%;
    background: #02ff32;
    animation: dot6move linear 10s infinite;
    z-index: 0;
    opacity: 0.8;
}
@keyframes dot6move {
    0% {
        bottom: 5%;
        left: 5%;
    }
    50% {
        bottom: 55%;
        left: 5%;
        width: 5px;
        height: 5px;
    }
    100% {
        left: 5%;
        bottom: 95%;
        opacity: 0;
    }
}
.dot-7:before {
    content: '';
    position: absolute;
    bottom: 5%;
    left: 5%;
    width: 8px;
    height: 8px;
    border-radius: 100%;
    background: #ffe402;
    animation: dot7move linear 7s infinite;
    z-index: 0;
    opacity: 0.8;
}
@keyframes dot7move {
    0% {
        bottom: 5%;
        left: 25%;
    }
    50% {
        bottom: 55%;
        left: 25%;
        width: 5px;
        height: 5px;
    }
    100% {
        left: 25%;
        bottom: 95%;
        opacity: 0;
    }
}
.dot-8:before {
    content: '';
    position: absolute;
    bottom: 5%;
    left: 5%;
    width: 8px;
    height: 8px;
    border-radius: 100%;
    background: #a902ff;
    animation: dot8move linear 15s infinite;
    z-index: 0;
    opacity: 0.8;
}
@keyframes dot8move {
    0% {
        bottom: 5%;
        left: 45%;
    }
    50% {
        bottom: 55%;
        left: 45%;
        width: 5px;
        height: 5px;
    }
    100% {
        left: 45%;
        bottom: 95%;
        opacity: 0;
    }
}
.dot-9:before {
    content: '';
    position: absolute;
    top: 5%;
    left: 75%;
    width: 8px;
    height: 8px;
    border-radius: 100%;
    background: #0a048a;
    animation: dot9move linear 15s infinite;
    z-index: 0;
    opacity: 0.8;
}
@keyframes dot9move {
    0% {
        top: 5%;
        left: 75%;
    }
    50% {
        top: 55%;
        left: 75%;
        width: 5px;
        height: 5px;
    }
    100% {
        left: 75%;
        top: 95%;
        opacity: 0;
    }
}
.dot-10:before {
    content: '';
    position: absolute;
    top: 5%;
    left: 75%;
    width: 8px;
    height: 8px;
    border-radius: 100%;
    background: #04eaff;
    animation: dot10move linear 20s infinite;
    z-index: 0;
    opacity: 0.8;
}
@keyframes dot10move {
    0% {
        top: 5%;
        left: 95%;
    }
    50% {
        top: 55%;
        left: 95%;
        width: 5px;
        height: 5px;
    }
    100% {
        left: 95%;
        top: 95%;
        opacity: 0;
    }
}







i.feature-icon-mtb {
    color: #ffffff;
    font-size: 35px;
    width: 80px;
    height: 80px;
    background: #2196ae;
    line-height: 80px;
    border-radius: 50%;
    margin-top: -100px;
    transition: all 0.4s ease;
    /*border: 1px #ffffff dashed;*/
}
.feature-box-about:hover > i.feature-icon-mtb {
    background: #ff9c00;
    color: #fff;
    border: 1px #fff dashed;
    transform: rotate(360deg);
    border-radius: 50% 0 50% 0;
}
h4.feature-main-title {
  font-size: 17px;
  font-family: 'Poppins', sans-serif;
  margin: 0 0 5px;
  font-weight: 600;
  line-height: 20px;
  margin-top: 6px;
  padding-top: 10px;
  padding-bottom: 10px;
}
p.feature-content {
  line-height: 18px;
  font-family: 'Poppins', sans-serif;
}
.feature-box-about {
  padding: 15px 10px;
  background: #ffffff;
  position: relative;
  border-radius: 5px;
  margin-bottom: 70px;
  -webkit-transition: .4s;
  transition: .4s;
  min-height: 170px;
  text-align: center;
}
.feature-box-about:hover {
  transform: translateY(-8px);
  box-shadow: 7px 5px 30px #d2d2d2;
}

.breadcrumb {
  margin-top: 0px !important;
}
.page-title .subtitle {
  margin-bottom: 0px !important;
  font-family: 'Poppins', sans-serif;
}
.page-title {
  padding-top: 130px !important;
  padding-bottom: 80px !important;
}
.team-section-state {
  padding-top: 70px;
  padding-bottom: 70px;
  /*background-image: linear-gradient(141deg, #9fb8ad 0%, #1fc8db 51%, #2196ae 75%);*/
  background-image: url("../../img/bg/slider-4.jpg");
  background-attachment: fixed;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  position: relative;
}
h3.team-title-top {
  font-size: 32px;
  color: #ffffff;
  font-family: 'Poppins', sans-serif;
  margin: 0 0 3px;
}
p.team-title-content {
    margin-bottom: 22px !important;
    color: #f7f7f7;
    width: 75%;
    max-width: 100%;
    font-family: 'Poppins', sans-serif;
    margin: auto;
    padding-bottom: 30px;
}
.blog .carousel-indicators .active {
    background: #ffffff !important;
    margin-bottom: 10px;
}
.blog .carousel-indicators li {
    background: #efb28f !important;
    border-radius: 50%;
    width: 8px;
    height: 8px;
    margin-bottom: 10px;
}

/* ============= main page css ============== */
.welcome-section-padd40 {
  padding-top: 50px;
  padding-bottom: 50px;
  background: #fff;
  position: relative;
  overflow: hidden;
}
.progress-shape-1 {
    content: '';
    position: absolute;
    right: -5%;
    top: 5%;
    width: 120px;
    z-index: 2;
    opacity: 0.4;
    animation: rotateshape linear 7s infinite;
}
@keyframes rotateshape {
    0% {
        transform: rotate(0deg);
    }
    50% {
        transform: rotate(180deg);
    }
    100% {
        transform: rotate(0deg);
    }
}
h4.welcome-title-main {
  font-size: 32px;
  font-family: 'Poppins', sans-serif;
  margin: 0px;
  padding-bottom: 7px;
}
p.welcome-content-main {
  margin-bottom: 25px !important;
  font-family: 'Poppins', sans-serif;
}
.welcome-box {
  margin-top: 15px;
  margin-bottom: 15px;
  box-shadow: 7px 5px 30px rgba(72, 73, 121, 0.15);
  padding: 15px;
  min-height: 360px;
  transition: all 0.3s ease-in-out;
  position: relative;
  overflow: hidden;
  z-index: 9;
}
.welcome-box:before {
    content: '';
    position: absolute;
    height: 150px;
    width: 80px;
    right: -35%;
    bottom: -26%;
    z-index: 10;
    background: #2196ae;
    transition: all 0.4s ease;
    transform: rotate(45deg);
}
.welcome-box:hover:before {
    right: -20%;
}
.welcome-box:after {
    content: '';
    position: absolute;
    height: 150px;
    width: 80px;
    left: -35%;
    top: -26%;
    z-index: 10;
    background: #ff9c00;
    transition: all 0.4s ease;
    transform: rotate(45deg);
}
.welcome-box:hover:after {
    left: -10%;
}
.welcome-box:hover {
    border-bottom: 4px solid #2196ae;
}
.welcome-box:hover {
  transform: translateY(-8px);
}
.welcome-box i {
    font-size: 35px;
    color: #ffffff;
    text-align: center !important;
    margin: auto !important;
    display: inherit;
    height: 80px;
    width: 80px;
    background: #2196ae;
    line-height: 80px;
    border-radius: 50%;
    border: 4px solid #e5e5e5;
    position: relative;
    z-index: 2;
    transition: all 0.3s ease;
}
.welcome-box:hover i {
    border: 2px dashed #ff9c00;
    border-radius: 0;
}
/*.moving-circle {*/
/*    content: "";*/
/*    position: absolute;*/
/*    top: 12px;*/
/*    left: 85px;*/
/*    width: 81px;*/
/*    height: 81px;*/
/*    border-radius: 100%;*/
/*    background: #ff9c00;*/
/*    z-index: 1;*/
/*}*/

/*.welcome-box i:before {*/
/*    content: "";*/
/*    position: absolute;*/
/*    top: 0;*/
/*    left: 0;*/
/*    width: 10px;*/
/*    height: 10px;*/
/*    border-radius: 100%;*/
/*    background: #ff9c00;*/
/*    z-index: 1;*/
/*}*/
h3.welcome-box-title {
  font-size: 22px;
  margin: 0 0 5px;
  text-align: center;
  font-weight: 500;
  font-family: 'Poppins', sans-serif;
}
span.title-highlight {
  color: #2196ae;
  font-weight: 600;
}
p.welcome-content {
  text-align: justify;
  font-family: 'Poppins', sans-serif;
}

/* =========== why choose us section ============ */
.why-choose-us {
  /*background-image: linear-gradient(141deg, #9fb8ad 0%, #1fc8db 51%, #2196ae 75%);*/
  background-image: url("../../img/bg/why-choose-us.jpg");
  background-attachment: fixed;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.progress {
    height: 8px;
    background: rgb(0 0 0) !important;
    border-radius: 25px;
    -webkit-box-shadow: none;
    box-shadow: none;
    margin-bottom: 55px;
    overflow: visible;
}
.progress.color .progress-bar {
    background: #007bff !important;
    background: linear-gradient(45deg, #047ab3 1%, #2196ae 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgb(212,6,42)', endColorstr='rgb(242,68,10)',GradientType=1 );
}
.overlay-dark * {
    color: #fff; 
}
h3.choose-us-title {
  font-size: 30px;
  color: #000 !important;
  font-family:'Poppins', sans-serif;
  font-weight: 600;
  margin-bottom: 40px;
}
h3.service-title-main {
  font-size: 30px;
  font-weight: 600;
  font-family:'Poppins', sans-serif;
  margin: 0 0 0px;
}
p.pop-txt {
  font-family:'Poppins', sans-serif;
}
/* =========== Service box css ============ */
.service-box-mtb {
  background-image: linear-gradient(#2196ae, #2196de);
  margin-top: 15px;
  margin-bottom: 15px;
  padding: 20px 30px;
  min-height: 280px;
  transition: all 0.3s ease-in-out;
  border: 1px solid #e5e5e5;
  border-radius: 3px;
  position: relative;
  overflow: hidden;
  z-index: 1;
}
.service-box-mtb:before {
    content: '';
    position: absolute;
    top: -50%;
    left: -80%;
    width: 30%;
    height: 200%;
    z-index: -1;
    background: #fff;
    transform: rotate(45deg);
    transition: all 0.6s ease;
    opacity: 0.1;
}
.service-box-mtb:hover:before {
    left: 150%;
}
.service-box-mtb:hover {
  box-shadow: 7px 5px 30px rgba(72, 73, 121, 0.15);
  transform: translateY(-7px); 
}
.service-box-mtb i {
    font-size: 30px;
    color: #ff9c00;
    background: #fff;
    width: 65px;
    height: 65px;
    line-height: 60px;
    border-radius: 100%;
    border: 3px solid #fff;
    transition: all 0.6s ease;
    margin-top: 10px;
}
.service-box-mtb:hover i {
    border: 3px dotted #fff;
    background: #ff9c00;
    border-radius: 0;
    color: #fff;
    line-height: 60px;
}
h5.service-box-heading {
  padding-top: 10px;
  margin: 0 0 0px;
  font-size: 22px;
  font-family: 'Poppins', sans-serif;
  color: #fff;
  letter-spacing: 0.5px;
}
p.service-box-content {
    font-size: 13px;
    font-family: 'Poppins', sans-serif;
    color: #fff;
    letter-spacing: 0.5px;
}
.bg-default {
  padding-top: 40px;
}
.section-title.center {
  margin: 0 auto 20px auto !important;
}
button.btn-blue {
    border: none;
    margin-bottom: 15px;
    position: relative;
}
button.btn-blue a {
  background: #fff;
  padding: 8px 15px;
  color: #000;
  overflow: hidden;
  border-radius: 4px;
  transition: all 0.4s ease;
}
button.btn-blue:hover a {
  background: #000000;
  padding: 8px 13px;
  color: #ffffff;
  border-radius: 4px;
}

/* ============= Digital Marketing Page Css New ============= */
.seo-keyword-point {
  padding-top: 60px;
  padding-bottom: 40px;
  position: relative;
  overflow: hidden;
}
h4.text-heading {
  font-size: 17px;
  font-family: sans-serif;
  margin: 0 0 5px;
  font-family: 'Poppins', sans-serif;
}
h6.digi-padd15 {
  font-size: 33px;
  line-height: 40px;
  margin: 0 0 15px;
  font-weight: 700;
  font-family: 'Poppins', sans-serif;
}
hr.left {
  margin: 0px 0 15px 0 !important;
}
hr.animate-border {
    position: relative;
    display: block;
    width: 100px;
    height: 3px;
    background: #2196ae;
    overflow: hidden;
    border: none !important;
}
.animate-border:after {
    position: absolute;
    content: "";
    width: 35px;
    height: 3px;
    left: 15px;
    bottom: 0;
    border-left: 10px solid #fff;
    border-right: 10px solid #fff;
    -webkit-animation: animborder 2s linear infinite; 
    -moz-animation: animborder 2s linear infinite; 
    animation: animborder 2s linear infinite;
}
@keyframes animborder {
    0% {
        left: 15px;
    }
    100% {
        left: 130px;
    }
}
h5.traffic-title {
  font-size: 23px;
  margin: 0 0 9px;
  font-family: 'Poppins', sans-serif;
}
h5.online-padd40 {
  font-size: 18px;
  font-family: 'Poppins', sans-serif;
  margin: 0 0 8px;
}
ul li.padd-8 {
  margin-bottom: 0.1rem;
  font-family: 'Poppins', sans-serif;
}


.section-space {
  padding-top: 60px !important;
  padding-bottom: 60px !important;
  position: relative;
}
/* ================ SEO Page Css ================ */
h2.text-heading {
  color: #2196ae;
  font-size: 40px;
  margin: 0 0 5px;
}
h5.marg-8 {
  font-size: 23px;
  line-height: 36px;
  font-family: 'Poppins', sans-serif;
  margin: 0 0 8px;
}
h3.growth-padd8 {
  font-size: 30px;
  line-height: 30px;
  margin: 0 0 10px !important;
  font-family: 'Poppins', sans-serif;
}
.icon-box-left-seo {
  margin-top: 15px;
  margin-bottom: 15px;
  background: #f7f7f7;
  padding: 20px;
  border-radius: 5px;
  border: 1px solid #e3e3e3;
  transition: all 0.3s ease-in-out;
  position: relative;
  overflow: hidden;
  z-index: 2;
  min-height: 250px;
}
.icon-box-left-seo:before {
    content: '';
    position: absolute;
    width: 30%;
    height: 200%;
    left: -55%;
    top: -42%;
    background-image: linear-gradient(#ffffff, #2196ae);
    opacity: 0.1;
    z-index: -1;
    transform: rotate(35deg);
    transition: all 0.5s ease;
}
.icon-box-left-seo:hover:before {
    left: 150%;
}
.icon-box-left-seo:hover {
  transform: translateY(-8px);
  background-image: linear-gradient(#2196ae, #118299);
  color: #ffffff;
}
.icon-box-left-seo:hover i.seo-icon-feature {
  color: #ffffff !important;
}
.icon-box-left-seo:hover h6.seo-title-feature {
  color: #ffffff !important;
  font-family: 'Poppins', sans-serif;
}
.icon-box-left-seo:hover p {
  color: #d7f8ff;
}
i.seo-icon-feature {
  font-size: 30px;
  color: #2196ae !important;
}
h6.seo-title-feature {
  margin: 10px 0 10px 0;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
}
h5.keyword-padd30 {
  font-size: 21px;
  margin: 0 0 15px;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
}
.list-style-3 li {
  font-family: 'Poppins', sans-serif;
  transition: all 0.4s ease;
}
.list-style-3 li:hover {
    transform: translateX(8px);
    color: #2196ae;
}



/* ============== SMM Page Css New ============== */
h2.smm-heading-top {
  font-size: 32px;
  margin: 0 0 5px;
}
h5.smm-chooseus-title {
  font-size: 18px;
  margin: 0 0 15px;
}
h3.get-smo-title {
  font-size: 30px;
  font-family: 'Poppins', sans-serif;
  margin-bottom: 10px;
  color: #2196ae !important;
}

/* ============== ppc page css new =============== */
h3.ppc-main-title {
  font-size: 30px;
  margin: 0 0 8px;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
}
h5.ppc-chooseus-title {
  font-size: 23px;
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
}

/* ============== content page css new ============== */
h3.content-main-title {
  font-size: 37px;
  margin: 0 0 8px;
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
}
h5.content-chooseus-title {
  font-size: 18px;
  margin: 0 0 10px;
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
}
/* ============== web development page css ============== */
h3.web-title {
  font-size: 38px;
  margin: 0 0 8px;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
}
h5.expert-title {
  font-size: 18px;
  margin-top: 15px;
  margin-bottom: 0px;
  font-family: 'Poppins', sans-serif;
  color: #000;
}
.service-post {
  box-shadow: 0 5px 20px -4px rgb(0 0 1 / 10%) !important;
  transition: all 0.3s ease-in-out;
}
.service-post:hover {
  background: #ff9c00;
  transform: translateY(-8px);
}
h5.web-chooseus-title {
  font-size: 20px;
  margin: 0 0 7px;
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
}
h2.tool-web-title {
  font-size: 35px;
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  text-transform: uppercase;
}

/* ================= ecommerce portal page css new ================= */
h3.top-title {
  font-size: 40px;
  margin: 0 0 8px;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
} 
h5.ecommerce-chooseus-title {
  font-size: 22px;
  margin: 0 0 8px;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
}
/* ============== web design page css new =============== */
p.web-design-subtitle {
  font-size: 17px;
  margin-bottom: 10px !important;
}
h3.webdesign-title-main {
  font-size: 36px;
  margin: 0 0 10px;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
}
h5.webdesign-chooseus-title {
  font-size: 19px;
  margin: 0 0 7px;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
}
.bg-padd40 {
  padding-bottom: 40px;
}
/* ============== graphic design page css new ================ */
h3.graphic-main-title {
  font-size: 36px;
  margin: 0 0 10px;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
}
h5.graphic-main-title {
    font-weight: 400;
    letter-spacing: 1.5px;
}
.graphic-service-box {
  min-height: 380px;
}
/* ============= logo design page css new ============== */
h3.logo-main-title {
  font-size: 38px;
  margin: 0 0 10px;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
}
h5.logo-chooseus-title {
  font-size: 21px;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
}

/*********************** Demo - 14 *******************/
.portfolio-spahe-padd40 {
  padding-top: 40px;
  padding-bottom: 40px;
}
.box14 {
  position:relative;
  margin-top: 20px;
  margin-bottom: 20px;
}
.box15,.box17,.box18 {
  box-shadow:0 0 5px #7e7d7d;
  text-align:center;
}
.box14:before {
  content:"";
  width:100%;
  height:100%;
  background: rgb(255 156 0 / 75%);
  position:absolute;
  top:0;
  left:0;
  opacity:0;
  transition:all .35s ease 0s;
}
.box14:hover:before {
  opacity:1;
}
.box14 img {
  width:100%;
  height:auto;
}
.box14 .box-content {
  width:90%;
  height:90%;
  position:absolute;
  top:5%;
  left:5%;
}
.box14 .box-content:after,.box14 .box-content:before {
  content:"";
  position:absolute;
  top:0;
  left:0;
  bottom:0;
  right:0;
  opacity:0;
  transition:all .7s ease 0s;
}
.box14 .box-content:before {
  border-bottom:1px solid rgba(255,255,255,.5);
  border-top:1px solid rgba(255,255,255,.5);
  transform:scale(0,1);
  transform-origin:0 0 0;
}
.box14 .box-content:after {
  border-left:1px solid rgba(255,255,255,.5);
  border-right:1px solid rgba(255,255,255,.5);
  transform:scale(1,0);
  transform-origin:100% 0 0;
}
.box14:hover .box-content:after,.box14:hover .box-content:before {
  opacity:1;
  transform:scale(1);
  transition-delay:.15s;
}
.box14 .title {
  font-size:21px;
  font-weight:700;
  color:#fff;
  margin:15px 0;
  opacity:0;
  transform:translate3d(0,-50px,0);
  transition:transform .5s ease 0s;
  text-align: center;
}
.box14:hover .title {
  opacity:1;
  transform:translate3d(0,0,0);
}
.box14 .post {
    font-size: 14px;
    color: #fff;
    padding: 10px;
    background: #2196ae;
    opacity: 0;
    border-radius: 0 19px;
    transform: translate3d(0,-50px,0) !important;
    transition: all .7s ease 0s;
    text-align: center;
    margin: auto !important;
    left: 33% !important;
    position: relative;
}
.box14 .icon,.box15 .icon {
  padding:0;
  list-style:none;
}
.box14:hover .post {
  opacity:1;
  transform:translate3d(0,0,0);
  transition-delay:.15s;
}
.box14 .icon {
    width: 100%;
    margin: 0;
    position: absolute;
    bottom: -10px;
    left: 38% !important;
    opacity: 0;
    z-index: 1;
    transition: all .7s ease 0s;
    display: inline-flex;
    text-align: center;
}
.box14:hover .icon {
  bottom:20px;
  opacity:1;
  transition-delay:.15s;
}
.box14 .icon li a {
  display:block;
  width:40px;
  height:40px;
  line-height:40px;
  border:1px solid #fff;
  border-radius:0 16px;
  font-size:14px;
  color:#fff;
  margin-right:5px;
  transition:all .4s ease 0s;
}
.box14 .icon li a:hover {
  background:#2196ae;
  border-color:#2196ae;
}
@media only screen and (max-width:990px) {
  .box14 {
    margin-bottom:30px;
  }
}

/*--------------------------------------------------------------------
Counter
-----------------------------------------------------------------------*/
.iq-counter-box { 
    padding: 50px 0;
}
.counter { position: relative; min-height: 60px; align-items: flex-start; }
.counter i { 
  font-size: 45px;
  line-height: 20px;
  display: inline-block;
  text-align: center;
  margin-bottom: 15px;
}
.counter-date { flex: 1; }
.counter span { 
  display: inline-block;
  width: 100%;
  font-size: 30px;
  margin: 0;
  line-height: 20px; 
  font-weight: 700;
  margin-top: 25px !important;
  margin-bottom: 25px !important;
}
.counter label { font-size: 14px; display: inline-block; width: 100%; position: relative; text-transform: uppercase; }

.main-bg {
  background: #2196ae;
}

/* ============== blog section css ============== */
.blog-news-section {
  background: #fff;
  padding-top: 50px;
  padding-bottom: 50px;
}
.blog-news-box {
  background: #ffffff;
    padding: 20px;
    transition: all 0.3s ease-in-out;
    min-height: 500px;
    border: 1px solid #e5e5e5;
    border-radius: 5px;
}
.blog-news-box:hover {
  box-shadow: 7px 5px 30px rgba(72, 73, 121, 0.15);
  transform: translateY(-8px);
}
.blog-box-title {
  font-size: 16px;
  margin: 0 0 7px;
  line-height: 25px;
}
h4.blog-box-title {
  margin-top: 12px;
  color: #2196ae;
}
p.content-box-ht {
  min-height: 170px;
}

/* ============== Ceo Page Css ============== */
h4.ceo-title {
  font-size: 30px;
  margin: 0 0 8px;
}
p.ceo-content {
  margin: 0 0 5px;
}
strong.highlight-ceo-title {
  font-size: 15px;
  color: #2196ae;
}

.login-register {
  margin-top: 80px !important;
}

/* ============== White Label Css ============== */
h4.white-label-title {
  font-size: 23px;
  margin: 0 0 18px;
  padding-bottom: 10px;
}
p.whitelabel-content {
  font-size: 14px;
}
strong.bottom-link-title {
  font-size: 30px;
  font-weight: lighter;
}

/* ============================
    Themes Css 
    =========================== */
    .theme-nav {
      max-width: 180px;
      position: relative;
      left: 0;
      margin-left: 0px;
    }
    .theme-box {
      border: 1px solid #e8e8e8;
      border-radius: 3px;
      background: #ffffff;
      box-shadow: 0 15px 75px #f3f3f3;
      margin-top: 20px;
      margin-bottom: 30px;
      transition: all 0.4s ease-in-out;
    }
    .theme-box:hover {
      transform: translateY(-5px);
      box-shadow: 0 20px 50px #f1f1f1;
    }
    .theme-box-detail {
      padding: 12px;
    }
    b.app-title {
      font-size: 15px;
      font-weight: 900;
    }
    b.app-title:hover {
      font-size: 15px;
      font-weight: 900;
      color: #2196ae;
      text-decoration: underline;
    }
    .theme-box-detail p {
      margin: 0 0 3px;
    }
    p.theme-price {
      font-size: 25px;
      font-weight: 900;
      color: #2196ae;
      margin-top: 20px;
    }
    .pricing-box i {
      height: 40px;
      width: 40px;
      font-size: 25px;
      line-height: 40px;
      color: #2196ae;
      border: 1px solid #2196ae;
      text-align: center;
      margin-top: 10px;
    }
    /* ==========================
        Theme Inner box css 
        ========================= */
        .detail-box-preview {
          padding: 12px;
          border-radius: 5px;
          border: 1px solid #e2e2e2;
        }
        .detail-button {
          width: 70%;
          margin: auto;
        }
        .detail-button button {
          background: #e0e0e0;
          margin-top: 20px;
          width: 100%;
          max-width: 100%;
          margin: auto;
          padding: 15px 25px;
          border-radius: 4px;
          margin-top: 20px;
          border: 1px solid #b3b3b3;
          cursor: pointer;
          text-align: center;
        }
        h3.Theme-inner-title {
          font-size: 30px;
          font-weight: 600;
        }
        b.feature-box-lc-title {
          font-size: 25px;
          font-weight: 600;
        }
        .box-feature {
          margin-top: 20px;
        }
        .theme-box-detail hr {
          width: 100%;
          margin: auto;
          margin-top: 40px;
          background: #c3c3c3;
          border: none !important;
        }
        .feature-list-item ul {
          margin-left: 0px !important;
          padding-left: 0px !important;
        }
        .feature-list-item li {
          list-style: none;
          margin-top: 12px;
          margin-left: 0px !important;
        }
        button.blue-btn-lc {
          width: 100%;
          background: #2196ae;
          border: none;
          padding: 20px 35px;
          border-radius: 6px;
          color: #ffffff;
          font-size: 20px;
          font-weight: 500;
          margin-bottom: 10px;
          cursor: pointer;
        }
        button.blue-btn-dc {
          width: 100%;
          background: #333333;
          border: none;
          padding: 25px 35px;
          border-radius: 6px;
          color: #ffffff;
          font-size: 20px;
          font-weight: 500;
          margin-bottom: 10px;
          cursor: pointer;
        }
        .feature-btn i {
          font-size: 22px;
          padding-right: 15px;
        }
        .total-price {
          padding: 10px;
        }
        .padd20 {
          padding: 10px;
        }
        .highlight-price {
          font-size: 20px;
          font-weight: bolder;
        }
        hr.padd20-line {
          margin-top: 10px !important;
        }
        .features-theme {
          margin-top: 30px;
        }
        h4.feature-title {
          font-size: 25px;
        }
        .features-theme > hr.padd20-line {
          width: 100% !important;
          border-top: none;
          background: #b3b3b3;
        }
        b.feature-box-rating-title {
          font-size: 16px;
          font-weight: 600;
        }
        b.rating-list {
          font-size: 14px !important;
        }
        .payment-process-box {
          border: 1px solid #c3c3c3;
          padding: 15px;
          background: #ffffff;
        }
        .payment-process-box p {
          margin: 0 0 5px;
        }
        .payment-bar {
          padding-top: 20px;
        }
        .payment-process-box > hr {
          width: 100%;
          margin: 10px auto 10px auto !important;
          border-top: 1px solid #dedede;
        }
        .payment-padd40 {
          padding: 15px 45px !important;
        }
        button.payment-btn {
          background: #2196ae;
          border: none;
          padding: 22px 30px;
          border-radius: 6px;
          color: #ffffff;
          margin-top: 15px;
          float: right;
        }
        button.payment-btn a {
          color: #ffffff;
        }
        .payment-summary {
          background: #ffffff;
          border-radius: 6px;
        }
        strong.gst-title-color {
          color: #2196ae;
          text-decoration: underline;
        }
        strong.gst-title-color:hover {
          color: #ffffff;
          text-decoration: underline;
        }
        h5.gts-no-title {
          font-size: 30px;
          font-family: sans-serif;
        }
        .iso-brand-mrt {
          margin-top: 30px !important;
          width: 250px !important;
          max-width: 100%;
        }
        
        
        
        
.buy-theme-section {
    background: #000 !important;
    min-height: 100px !important;
}
.buy-theme-btx {
    background: #000 !important;
    min-height: 120px;
}

.contact-medical {
    padding: 70px 0px;
    position: relative;
    overflow: hidden;
}
.traingle-1 {
    content: '';
    position: absolute;
    top: 1%;
    left: 2%;
    width: 130px;
    transition: all 0.4s ease;
    animation: circlemoveone linear 10s infinite;
    opacity: 0.3;
}
@keyframes circlemoveone {
    0% {
        left: 2%;
        top: 1%;
    }
    50% {
        left: 2%;
        top: 5%;
    }
    100% {
        left: 2%;
        top: 1%;
    }
}
.traingle-2 {
    content: '';
    position: absolute;
    bottom: 70%;
    right: 1%;
    width: 100px;
    transition: all 0.4s ease;
    animation: circlemovetwo linear 8s infinite;
    opacity: 0.3;
}
@keyframes circlemovetwo {
    0% {
        right: 1%;
        bottom: 70%;
    }
    50% {
        right: 1%;
        bottom: 75%;
    }
    100% {
        right: 1%;
        bottom: 70%;
    }
}
.traingle-3 {
    content: '';
    position: absolute;
    top: 40%;
    left: 0;
    width: 100px;
    transition: all 0.4s ease;
    animation: circlemovethree linear 10s infinite;
    opacity: 0.3;
}
@keyframes circlemovethree {
    0% {
        left: 0;
        top: 40%;
    }
    50% {
        left: 0;
        top: 45%;
    }
    100% {
        left: 0;
        top: 40%;
    }
}
.md-blue {
    background: #2196ae;
    padding: 12px 15px;
    margin-top: 30px;
}
.seo-form-img {
    border-right: 1px solid #fff;
}
.seo-form-img h4 {
    color: #fff;
    margin-top: 10px;
    font-size: 1.6rem;
    font-family: 'Poppins', sans-serif;
}
.seo-form-img2 {
    border: none;
}
.seo-form-img2 h4 {
    color: #fff;
    margin-top: 10px;
    font-size: 1.6rem;
}
.seo-form-ct h4 {
    font-size: 1rem;
    color: #fff;
    font-family: 'Poppins', sans-serif;
    letter-spacing: 0.5px;
}
#input_21_4 {
    background: #fff !important;
    border-radius: 5px;
}
.form-btn1 h5 {
    font-size: 1.3rem;
    color: #fff;
    margin-top: 30px;
    font-family: 'Poppins', sans-serif;
}
.frm-btn-medical {
    background: #000;
    padding: 1rem 1.3rem;
    border: none;
    border-radius: 4px;
    color: #fff;
    margin-top: 30px !important;
    cursor: pointer;
}
.frm-btn-medical a {
    color: #fff !important;
    font-size: 1.4rem;
}
p.text-70 {
    width: 75%;
    max-width: 100%;
    margin: auto;
}
.medical-title-service {
    margin-bottom: 50px !important;
}
.medical-service-box {
    margin-bottom: 25px;
    background: #f2f5fd !important;
    padding: 1rem 1.3rem;
    border-radius: 7px;
    min-height: 350px;
}
.medical-service-box h5 {
    font-size: 1.4rem;
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    margin: 0 0 10px !important;
}
.heading-btm-title h6 {
    margin-top: 12px;
    margin-bottom: 7px !important;
}
.heading-btm-title img {
    margin-top: 30px !important;
    margin-bottom: 30px !important;
}
img.sci-img {
    margin-top: 30px !important;
    margin-bottom: 30px !important;
}
.mt20 {
    margin-top: 30px;
}
.mt30 {
    margin-bottom: 20px;
}
h6.outrank-title {
    color: #fff;
    margin: 10px 0 10px !important;
    font-family: 'Poppins', sans-serif;
}
.bg-default-light {
    background: #f7f7f7;
    position: relative;
    overflow: hidden;
}

/* Service Style 6 Css */
.style-6 .single-service-anm {
  border: 1px solid #ddd;
  padding: 25px 40px;
  margin-bottom: 70px;
  box-shadow: 0 5px 30px -5px #ccc;
  position:relative;
  -webkit-transition:.3s;
  transition:.3s;
  /*text-align:center;*/
  border-bottom: 3px solid #0bbbc1;
  padding-bottom:30px
}
.style-6 .single-service-anm:hover {
    transform: translateY(-7px);
}
.style-6 .single-service-anm i.fa {
	color: #0bbbc1;
	font-size: 30px;
	margin: 14px 0px;
	border: 1px solid #0bbbc1;
	text-align: center;
	border-radius: 50%;
	position: relative;
	width: 60px;
	height: 60px;
	line-height: 60px;
	-webkit-transition:.5s;
	transition:.5s
}
.style-6 .single-service-anm:after{
	position: absolute;
	content: "";
	width: 0%;
	left: 0;
	top: 0;
	border-left: 3px solid #0bbbc1;
	height: 0%;
	z-index: 2;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	-webkit-transition:.5s;
	transition:.5s
}
.style-6 .single-service-anm:before{
	position: absolute;
	content: "";
	width: 0%;
	right: 0;
	bottom: 0;
	border-right: 3px solid #0bbbc1;
	height: 0%;
	z-index: 2;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	-webkit-transition:.5s;
	transition:.5s
}
.style-6 .single-service-anm:hover:before, .single-service-anm:hover:after{
	height:50%;
	width:50%;
}
.style-6 .single-service-anm:hover i.fa {
	background-color: #0bbbc1;
	border-color: #0bbbc1;
	color: #fff;
}
.style-6 .single-service-anm h3 {
	position: relative;
	font-weight: 400;
	margin-top: 0px;
	padding-top: 20px;
	font-size: 22px;
}
.style-6 .single-service p {
	font-weight: 300;
}
.style-6 .single-service-anm h3:before {
  position: absolute;
  content: "";
  width: 3px;
  height: 12px;
  background-color: #0bbbc1;
  top: -25px;
  left: 50%;
  margin-left: -1.5px;
}
.style-6 .single-service-anm h3:after {
  position: absolute;
  content: "";
  width: 30px;
  height: 3px;
  background-color: #0bbbc1;
  left: 50%;
  margin-left: -15px;
  top: -13px;
}

.style-6 .single-service-anm a.border-btn {
  background-color: #0bbbc1;
  position: absolute;
  left: 50%;
  margin-left: -70px;
  margin-top: 10px;
  z-index: 99;
}
span.blg-title {
    color: #2196ae;
}
button.btn-dglt {
    margin-top: 20px !important;
    margin-bottom: 50px !important;
    border: none;
}
a.dg-hlt {
    background: #2196ae;
    padding: .8rem 1.6rem;
    margin-bottom: 20px !important;
    color: #fff;
    font-family: 'Poppins', sans-serif;
    letter-spacing: 0.5px;
}
button.btn-dglt2 {
    margin-top: 10px !important;
    margin-bottom: 50px !important;
    border: none;
}
button.btn-dglt2 i {
    margin-right: 20px;
    font-size: 15px;
}
/*a.dg-hlt2 {*/
/*    background: #2196ae;*/
/*    padding: .8rem 1.1rem;*/
/*    margin-top: 20px !important;*/
/*    margin-bottom: 20px !important;*/
/*    color: #fff;*/
/*    border-radius: 100%;*/
/*}*/


.service-area {
    position: relative;
    z-index: 1;
    overflow: hidden;
}
.shape-one {
    content: '';
    position: absolute;
    top: 25%;
    left: -3%;
    width: 90px;
    height: 90px;
    border-radius: 100%;
    background: #2196ae;
    opacity: 0.4;
    z-index: 2;
    animation: shapeone linear 8s infinite;
}
@keyframes shapeone {
    0% {
        top: 25%;
    }
    50% {
        top: 65%;
    }
    100% {
        top: 25%;
    }
}
.shape-two {
    content: '';
    position: absolute;
    top: 60%;
    left: -2%;
    width: 70px;
    height: 70px;
    border-radius: 100%;
    background: #ff9c00;
    opacity: 0.5;
    z-index: 2;
    animation: shapetwo linear 9s infinite;
}
@keyframes shapetwo {
    0% {
        top: 60%;
    }
    50% {
        top: 25%;
    }
    100% {
        top: 60%;
    }
}


.why-choose-us {
    overflow: hidden;
    position: relative;
}
.staff-image {
    max-width: 100%;
    width: 400px;
}
.section-space-pt-70 {
    padding-top: 70px;
}
.about-area {
    position: relative;
    overflow: hidden;
    z-index: 1;
}
.breadcrumb-about {
    position: relative;
    overflow: hidden;
}
.breadcrumb-shape-1 img {
    position: absolute;
    content: '';
    z-index: 2;
    top: 25%;
    left: 5%;
    width: 50px;
    opacity: 0.6;
    max-width: 100%;
    transform: trasnlateY(-5px) rotate(45deg);
    animation: aboutshape1 linear 5s infinite;
}
@keyframes aboutshape1 {
    0% {
        transform: scale(1.0);
    }
    50% {
        transform: scale(1.3);
    }
    100% {
        transform: scale(1.0);
    }
}
.breadcrumb-shape-2 img {
    position: absolute;
    content: '';
    z-index: 2;
    top: 65%;
    left: 25%;
    width: 70px;
    opacity: 0.3;
    max-width: 100%;
    transform: trasnlateY(-5px) rotate(45deg);
    animation: aboutshape2 linear 5s infinite;
}
@keyframes aboutshape2 {
    0% {
        transform: scale(1.0) rotate(0deg);
    }
    50% {
        transform: scale(1.5) rotate(45deg);
    }
    100% {
        transform: scale(1.0) rotate(0deg);
    }
}
.breadcrumb-shape-3 img {
    position: absolute;
    content: '';
    z-index: 2;
    top: 25%;
    right: -2%;
    width: 70px;
    opacity: 0.6;
    max-width: 100%;
    animation: aboutshape3 linear 5s infinite;
}
@keyframes aboutshape3 {
    0% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(20px);
    }
    100% {
        transform: translateY(0px);
    }
}
.breadcrumb-shape-4 img {
    position: absolute;
    content: '';
    z-index: 2;
    top: 75%;
    right: 25%;
    width: 70px;
    opacity: 0.6;
    max-width: 100%;
    animation: aboutshape4 linear 5s infinite;
}
@keyframes aboutshape4 {
    0% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-20px);
    }
    100% {
        transform: translateY(0px);
    }
}
.shape-about-1 {
    content: '';
    position: absolute;
    top: 5%;
    left: 0;
    z-index: 0;
    opacity: 0.5;
}
.shape-about-2 {
    content: '';
    position: absolute;
    bottom: 5%;
    right: 0;
    z-index: 0;
    opacity: 0.5;
}
.about-main-title-lg {
    font-size: 3rem;
    font-weight: 700;
    font-family: 'Poppins', sans-serif;
}
.smt-txt {
    font-family: 'Poppins', sans-serif;
    font-size: 14px;
}
.hi-title {
    color: #2196ae;
}
.lxi-text {
    font-family: 'Poppins', sans-serif;
    margin-bottom: 12px;
    line-height: 20px;
}
.img-mover-about img {
    animation: moveimage linear 5s infinite;
}
@keyframes moveimage {
    0% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-30px);
    }
    100% {
        transform: translateY(0px);
    }
}
.img-mover-about-n img {
    animation: squeimage linear 8s infinite;
}
@keyframes squeimage {
    0% {
        transform: translateY(0px);
    }
    10% {
        transform: translateY(-30px);
    }
    20% {
        transform: translateY(-26px);
    }
    30% {
        transform: translateY(-22px);
    }
    40% {
        transform: translateY(-27px);
    }
    50% {
        transform: translateY(-20px);
    }
    60% {
        transform: translateY(-24px);
    }
    70% {
        transform: translateY(-20px);
    }
    100% {
        transform: translateY(0px);
    }
}
.core-value-box {
    background: #fff;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    border: 2px solid #fff;
    padding: 12px;
    margin-bottom: 15px;
    transition: all 0.1s ease;
}
.core-value-box:hover {
    border: 2px dashed #2196ae;
}
.core-value-box > span > i {
    float: left;
    margin: 2px 8px 0px 3px;
    background: #ff9c00;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    line-height: 40px;
    text-align: center;
    transition: all 0.3s ease;
}
.core-value-box:hover i {
    transform: rotate(45deg);
}
.core-value-box > h6 {
    margin-bottom: 10px;
    font-size: 20px;
    font-family: 'Poppins', sans-serif;
    margin-top: 7px;
    font-weight: 700;
}
.progress-shape-2 {
    content: '';
    position: absolute;
    left: -7%;
    top: 15%;
    width: 160px;
    z-index: 2;
    opacity: 0.2;
    animation: rotateshapetwo linear 7s infinite;
}
@keyframes rotateshapetwo {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}
.progress-shape-4 {
    content: '';
    position: absolute;
    right: 0;
    top: 15%;
    width: 70px;
    z-index: 3;
    opacity: 0.3;
    animation: rotateshape-o linear 7s infinite;
}
@keyframes rotateshape-o {
    0% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-30px);
    }
    100% {
        transform: translateY(0px);
    }
}
h6.lxi-title {
    font-family: 'Poppins', sans-serif;
    font-size: 30px;
    line-height: 40px;
}
li.lxi-list {
    font-family: 'Poppins', sans-serif;
}
.medi-title {
    font-family: 'Poppins', sans-serif;
}
.medi-area {
    position: relative;
    overflow: hidden;
}
.digital-marketing-area {
    position: relative;
    overflow: hidden;
    padding: 50px 0px;
    background: #ffffff;
}
.spinner-1 {
    content: '';
    position: absolute;
    width: 90px;
    right: 3%;
    top: 7%;
    transition: all 0.4s ease;
    animation: spinner linear 6s infinite;
}
@keyframes spinner {
    0% {
        top: 7%;
    }
    50% {
        top: 20%;
    }
    100% {
        top: 7%;
    }
}
.spinner-2 {
    content: '';
    position: absolute;
    width: 140px;
    left: -3%;
    top: 7%;
    transition: all 0.4s ease;
    animation: spinnertwo linear 6s infinite;
    opacity: 0.3;
}
@keyframes spinnertwo {
    0% {
        top: 7%;
    }
    50% {
        top: 20%;
    }
    100% {
        top: 7%;
    }
}
.plus-spinner {
    content: '';
    position: absolute;
    width: 120px;
    right: 15%;
    bottom: 0;
    transition: all 0.4s ease;
    animation: spinnerplus linear 6s infinite;
    opacity: 0.6;
}
@keyframes spinnerplus {
    0% {
        bottom: 0;
    }
    50% {
        bottom: 6%;
    }
    100% {
        bottom: 0;
    }
}
.section-space-v {
    padding: 70px 0px;
}
.seo-area {
    padding-top: 60px;
    padding-bottom: 30px;
    position: relative;
    overflow: hidden;
    background: #ffffff;
}
.bg-skyblue {
    background: #edf4f9;
}
.shape-rectangle {
    content: '';
    position: absolute;
    width: 120px;
    right: 25%;
    bottom: -8%;
    transition: all 0.45s ease;
    animation: trainglemove linear 2s infinite;
}
@keyframes trainglemove {
    0% {
        bottom: -8%;
    }
    50% {
        bottom: -4%;
    }
    100% {
        bottom: -8%;
    }
}
.smm-area {
    position: relative;
    overflow: hidden;
    background: #ffffff;
}
.progress-n {
    content: '';
    position: absolute;
    width: 200px;
    left: 5%;
    top: 5%;
    transition: all 0.45s ease;
    animation: movebounce linear 6s infinite;
}
@keyframes movebounce {
    0% {
        left: 5%;
        transform: scale(1.0);
    }
    50% {
        top: 25%;
        transform: scale(1.2);
    }
    100% {
        top: 5%;
        transform: scale(1.0);
    }
    
}
.progress-m {
    content: '';
    position: absolute;
    width: 70px;
    right: -2%;
    bottom: 5%;
    transition: all 0.45s ease;
    animation: moveshape linear 6s infinite;
    opacity: 0.5;
}
@keyframes moveshape {
    0% {
        right: -2%;
        transform: scale(1.0);
    }
    50% {
        bottom: 15%;
    }
    100% {
        bottom: 5%;
        transform: scale(1.0);
    }
    
}
.pay-per-click-area {
    position: relative;
    overflow: hidden;
    background: #ffffff;
}
.spare-1 {
    content: "";
    position: absolute;
    left: 1%;
    top: 15%;
    width: 100px;
    transition: all 0.4s ease;
    animation: spareone linear 6s infinite;
}
@keyframes spareone {
    0% {
        top: 15%;
    }
    50% {
        top: 20%;
    }
    100% {
        top: 15%;
    }
}
.ppc-move-area {
    position: relative;
    overflow: hidden;
    background: #f9f9f9;
    padding-top: 50px;
}
.crumb-shape-1 {
    content: "";
    position: absolute;
    width: 70px;
    top: 5%;
    left: 2%;
    animation: shapeonemove linear 5s infinite;
    z-index: 1;
    opacity: 0.6;
}
@keyframes shapeonemove {
    0% {
        top: 5%;
    }
    50% {
        top: 10%;
    }
    100% {
        top: 5%;
    }
}
.crumb-shape-2 {
    content: "";
    position: absolute;
    width: 70px;
    top: 15%;
    right: 2%;
    animation: shapetwomove linear 5s infinite;
    z-index: 1;
    opacity: 0.6;
}
@keyframes shapetwomove {
    0% {
        top: 15%;
    }
    50% {
        top: 20%;
    }
    100% {
        top: 15%;
    }
}
.crumb-shape-3 {
    content: "";
    position: absolute;
    width: 70px;
    bottom: -10%;
    left: 35%;
    animation: shapethreemove linear 5s infinite;
    z-index: 1;
    opacity: 0.4;
}
@keyframes shapethreemove {
    0% {
        bottom: -10%;
    }
    50% {
        bottom: 6%;
    }
    100% {
        bottom: -10%;
    }
}
.content-writing-area {
    position: relative;
    overflow: hidden;
    background: #ffffff;
    padding: 60px 0px;
}
.web-development-area {
    position: relative;
    overflow: hidden;
    background: #ffffff;
    padding: 50px 0px;
}
.our-expertise-area {
    position: relative;
    overflow: hidden;
}
.move-logo {
    content: "";
    position: absolute;
    top: 5%;
    left: -6%;
    animation: wavyshape linear 6s infinite;
}
@keyframes wavyshape {
    0% {
        transform: scale(0.7);
    }
    50% {
        transform: scale(0.5);
    }
    100% {
        transform: scale(0.7);
    }
}
.zig-area {
    position: relative;
    overflow: hidden;
}
.zigzag-1 {
    content: "";
    position: absolute;
    top: 2%;
    left: -1%;
    width: 130px;
    transition: all 0.4s ease;
    animation: zigzagone linear 5s infinite;
}
@keyframes zigzagone {
    0% {
        transform: scale(0.7);
    }
    50% {
        transform: scale(0.5);
    }
    100% {
        transform: scale(0.7);
    }
}
.zigzag-2 {
    content: "";
    position: absolute;
    bottom: 2%;
    right: 1%;
    width: 130px;
    transition: all 0.4s ease;
    animation: zigzagtwo linear 7s infinite;
}
@keyframes zigzagtwo {
    0% {
        transform: scale(0.7);
    }
    50% {
        transform: scale(0.5);
    }
    100% {
        transform: scale(0.7);
    }
}
.ecommerce-portal-area {
    position: relative;
    overflow: hidden;
    padding: 50px 0px;
    background: #ffffff;
}
.ecommerce-shape1 {
    content: "";
    position: absolute;
    top: 5%;
    left: -1%;
    width: 140px;
    opacity: 0.6;
    transition: all 0.5s ease;
    animation: ecommerceshapeone linear 6s infinite;
}
@keyframes ecommerceshapeone {
    0% {
        top: 5%;
    }
    50% {
        top: 10%;
    }
    100% {
        top: 5%;
    }
}
.ecommerce-shape2 {
    content: "";
    position: absolute;
    bottom: 5%;
    right: 0;
    width: 70px;
    opacity: 0.8;
    transition: all 0.5s ease;
    animation: ecommerceshapetwo linear 5s infinite;
}
@keyframes ecommerceshapetwo {
    0% {
        bottom: 5%;
    }
    50% {
        bottom: 10%;
    }
    100% {
        bottom: 5%;
    }
}
.website-design-area {
    position: relative;
    overflow: hidden;
    background: #ffffff;
    padding: 60px 0px;
}
.web-design-item-area {
    position: relative;
    overflow: hidden;
}
.item-shape {
    content: "";
    position: absolute;
    bottom: 2%;
    right: -2%;
    width: 60px;
    animation: itemshape1 linear 5s infinite;
}
@keyframes itemshape1 {
    0% {
        bottom: 2%;
    }
    50% {
        bottom: 10%;
    }
    100% {
        bottom: 2%;
    }
}
.slider-bg {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    z-index: 1;
    opacity: 0.7;
}
.wavy-slider-shape {
    content: "";
    position: absolute;
    width: 120%;
    bottom: 0;
    left: -10%;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    z-index: 1;
    opacity: 0.8;
    animation: wavyshapetwo linear 6s infinite;
}
@keyframes wavyshapetwo {
    0% {
        left: -10%;
    }
    50% {
        left: 0;
    }
    100% {
        left: -10%;
    }
}
.graphic-design-area {
    background: #ffffff;
    position: relative;
    overflow: hidden;
    padding: 50px 0px;
}
.brand-service-area {
    position: relative;
    overflow: hidden;
}
.logo-design-area {
    position: relative;
    overflow: hidden;
}
.pricing-area {
    position: relative;
    overflow: hidden;
}
h5.pr-title {
    font-weight: 600;
    font-family: 'Poppins', sans-serif;
}
ul.pr-list-nav {
    padding-left: 5px !important;
}
li.pr-list-item {
    font-family: 'Poppins', sans-serif;
    list-style: none;
    color: #2196ae;
    font-size: 13px;
}
h6.se-title {
    font-size: 18px;
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
    margin-bottom: 0;
}
.audit-form-se {
    background: #2196ae;
    padding: 35px 8px;
    border-radius: 7px;
}
input.lgt-feild {
    background: #fff !important;
}
input.fl-wdt {
    width: 100% !important;
    background: #ff9c00;
}
.form-se-title {
    color: #fff;
    font-size: 24px;
    font-family: 'Poppins', sans-serif;
    font-weight: 600;
}
.mb-50 {
    margin-bottom: 50px;
}
textarea.lgt-feild {
    background: #fff !important;
}
.client-area {
    position: relative;
    overflow: hidden;
}
.blurshape-1 {
    content: "";
    position: absolute;
    left: -5%;
    top: -10%;
    width: 250px;
    opacity: 0.3;
    animation: blurshapeone 5s infinite;
}
@keyframes blurshapeone {
    0% {
        transform: scale(1.0);
    }
    50% {
        transform: scale(1.2);
    }
    100% {
        transform: scale(1.0);
    }
}
.blurshape-2 {
    content: "";
    position: absolute;
    bottom: -10%;
    right: -5%;
    width: 200px;
    opacity: 0.3;
    animation: blurshapetwo 5s infinite;
}
@keyframes blurshapetwo {
    0% {
        transform: scale(1.0);
    }
    50% {
        transform: scale(1.2);
    }
    100% {
        transform: scale(1.0);
    }
}

.bubbles img {
	content: "";
	position: absolute;
	bottom: -10%;
	left: 10%;
	width: 50px;
	animation: bubblemove 12s infinite;
}
@keyframes bubblemove {
	0% {
		bottom: -10%;
		opacity: 0.7;
	}
	100% {
		bottom: 110%;
		opacity: 0;
	}
}
.bubbles img:nth-child(2) {
	content: "";
	position: absolute;
	bottom: -3%;
	left: 20%;
	width: 70px;
	animation: bubblemove2 8s infinite;
}
@keyframes bubblemove2 {
	0% {
		bottom: -3%;
		opacity: 0.7;
	}
	100% {
		bottom: 110%;
		opacity: 0;
	}
}
.bubbles img:nth-child(3) {
	content: "";
	position: absolute;
	bottom: -25%;
	left: 40%;
	width: 100px;
	animation: bubblemove3 8s infinite;
}
@keyframes bubblemove3 {
	0% {
		bottom: -25%;
		opacity: 0.7;
	}
	100% {
		bottom: 110%;
		opacity: 0;
	}
}
.bubbles img:nth-child(4) {
	content: "";
	position: absolute;
	bottom: -10%;
	left: 60%;
	width: 130px;
	animation: bubblemove4 7s infinite;
}
@keyframes bubblemove4 {
	0% {
		bottom: -10%;
		opacity: 0.7;
	}
	100% {
		bottom: 110%;
		opacity: 0;
	}
}
.bubbles img:nth-child(5) {
	content: "";
	position: absolute;
	bottom: -20%;
	left: 80%;
	width: 40px;
	animation: bubblemove5 10s infinite;
}
@keyframes bubblemove5 {
	0% {
		bottom: -20%;
		opacity: 0.7;
	}
	100% {
		bottom: 110%;
		opacity: 0;
	}
}
.bubbles img:nth-child(6) {
	content: "";
	position: absolute;
	bottom: -15%;
	left: 90%;
	width: 60px;
	animation: bubblemove6 15s infinite;
}
@keyframes bubblemove6 {
	0% {
		bottom: -15%;
		opacity: 0.7;
	}
	100% {
		bottom: 110%;
		opacity: 0;
	}
}
.bubbles img:nth-child(7) {
	content: "";
	position: absolute;
	bottom: -5%;
	left: 100%;
	width: 20px;
	animation: bubblemove7 15s infinite;
}
@keyframes bubblemove7 {
	0% {
		bottom: -5%;
		opacity: 0.7;
	}
	100% {
		bottom: 110%;
		opacity: 0;
	}
}

h6.bg-highlight {
    font-size: 2rem;
    color: #ff9c00;
    background: #000;
    width: 50%;
    max-width: 100%;
    padding: 15px;
    border-radius: 0px 30px 0 0;
    margin-bottom: 15px;
    transition: all 0.4s ease-in-out;
}
h6.bg-highlight:hover {
    background: #2196ae;
    border-radius: 0px 30px 0 30px;
}
.mb-row-50 {
    padding-bottom: 60px;
}

.light-bg-area {
    background: #f5f5f5;
}

.pricing-box {
    background: #fff;
    padding: 10px;
    position: relative;
    overflow: hidden;
    transition: all 0.2s ease-in-out;
    z-index: 1;
    margin-bottom: 40px;
}
.pricing-box:hover {
    transform: translateY(-6px);
    -webkit-box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.15);
}
.pricing-box img {
    position: relative;
    overflow: hidden;
    z-index: -1;
}
.pricing-box img:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 100px;
    height: 100px;
    background: #2196ae;
    z-index: -2;
}
.pricing-box h3 {
    font-size: 15px;
    letter-spacing: 0.3px;
    font-family: 'Poppins', sans-serif;
    margin-bottom: 5px;
}
span.rs-tag {
    font-size: 20px;
    color: #000;
    font-weight: 400;
}
.pricing-box h4 {
    color: #2196ae;
    font-size: 3.5rem;
    font-weight: 600;
}
.btn-price {
    line-height: initial;
    border: none;
    background: transparent;
}
.pricing-box a {
    background: #2196ae;
    display: block;
    position: relative;
    padding: 8px 15px;
    font-size: 1rem;
    color: #fff;
    font-weight: 500;
    letter-spacing: 1px;
    margin-bottom: 10px;
    border-radius: 3px;
}
.pricing-bx-in {
    background: #fff;
    margin: 30px 5px;
}
.price-title {
    background: #2196ae;
    padding: 10px;
}
.price-mn {
    background: #e9e9e9;
    padding: 20px 0px;
}
.price-mn h3 {
    margin: 0;
}
.price-title h5 {
    margin-bottom: 5px;
    color: #fff;
    font-weight: 500;
    letter-spacing: 1px;
}
.table-price ul {
    padding-left: 0 !important;
}
.table-price ul li {
    list-style: none;
    border-bottom: 1px solid #e5e5e5;
    /*margin: 14px 0px !important;*/
    padding: 10px 15px;
}
.enquire-btn {
    padding-bottom: 30px;
}
.enquire-btn button {
    background: #2196ae;
}
.enquire-btn button a {
    color: #fff;
}

.g-link {
    color: #2196ae;
}
.g-link:hover {
    color: #000000;
    text-decoration: underline !important;
}

.form-box-stx {
    background: #e5e5e5;
    padding: 15px 20px;
    -webkit-box-shadow: 0 15px 30px rgba(0, 0, 0, 0.3);
    box-shadow: 0 15px 30px rgba(0, 0, 0, 0.3);
}

h5.pop-txt {
    font-family: "Poppins", sans-serif !important;
}
.pd-50 {
    margin-top: 50px;
}
strong.cl-blu {
    color: #000 !important;
}
.mrg-40 {
    margin-top: 40px !important;
}