@media (max-width:768px) {
    .wrap, .inner-box, .btn-inner{
        width: auto !important;
    }
    .ban-txt-box{
        margin-left: 0 !important;
        width: 100% !important;
    }
    .ban-txt h1, .page-header h2{
        font-size: 32px !important;
    }
    ul.inner li{
        width: 100% !important;
        padding-bottom: 40px !important;
    }
    ul.vector-gallery li, ul.embroidery-gallery li{
        width: 100% !important;
    }
    .Accordion_item .title_tab .title{
        font-size: 16px !important;
        line-height: 28px !important;
    }
    .contactSec h2{
        width: auto !important;
        font-size: 32px !important;
    }
    .contactInfo{
        padding-top: 40px;
    }
}

/*.same-billing{display:none;}*/
.main-menu li a {text-transform: uppercase !important;}
/*.home-service-box img { filter: sepia(70%);}*/
/*.embroidry-slider .slide-item {
  border: 1px solid #ccc;
  padding: 28px;
}
.embroidry-slider .slick-slide {
  margin: 0 5px;
}*/
/* the parent */
.embroidry-slider .slick-list {
  margin: 0 -5px;
}
ul.vector-gallery {display: block;}
ul.vector-gallery li{display:inline-block;width: 24.7%;}
ul.vector-gallery li img{width:100%;height: 550px;}
ul.embroidery-gallery {display: block;}
ul.embroidery-gallery li{display:inline-block;width: 24.7%;}
ul.embroidery-gallery li img{width:100%;height: 280px;}
.fancy {
  line-height: 0.5;
  text-align: center;
}
figure{
    margin:0;
}
.fancy span {
  display: inline-block;
  position: relative;  
}
.fancy span:before,
.fancy span:after {
  content: "";
  position: absolute;
  height: 7px;
  border-bottom: 2px solid #d51c22;
  border-top: 2px solid #d51c22;
  top: 35%;
  width: 100px;
}
.fancy span:before {
  right: 100%;
  margin-right: 15px;
}
.fancy span:after {
  left: 100%;
  margin-left: 15px;
}

h2.fancy {
    color: #123366 !important;
}


.contactSec {
  padding: 120px 0;
}
.contactInfo a {
  font-family: Montserrat;
  font-size: 21px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 2.14;
  letter-spacing: normal;
  color: black;
}

.contactInfo a:hover {
  color: #0ce783;
}
ul.cSoci>li {
  display: inline-block;
  margin-right: 34px;
}

ul.cSoci>li.last {
  margin-right: 0;
}
ul.cSoci>li img{height:53px;width:53px;}

ul.cSoci {
  margin-top: 20px;
}
.contactSec h2 {
  width: 455px;
  font-family: Montserrat;
  font-size: 41px;
  font-weight: bold;
  line-height: normal;
  color: #3b3b3b;
  text-transform: uppercase;
  margin-bottom: 50px;
}
.fld {
  
  height: 60px;
  /* border: solid 1px #979797; */
  
  margin-bottom: 32px;
}

.fld input, .fld.fld-textarea textarea {
  width: 100%;
  height: 100%;
  padding: 0 30px;
  resize: none;
}
.fld.fld-textarea {
  width: 100%;
  height: 186px;
  /* border: solid 1px #979797; */
}


.fld.fld-textarea textarea {
  padding-top: 30px;
}
.fld-btn input {
  width: 206px;
  height: 50px;
  background-color: #c60622;
  font-family: Montserrat;
  font-size: 14px;
  line-height: normal;
  color: #fff;
  font-weight: 800;
}
.fld-btn input:hover{background:#000;color:#fff;}






/* Pricing Page */
.banner-sec {
  background-color: #fff;
}
.banner-pic .row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.banner-pic .cover {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.banner-pic .hover-effect-bann {
  height: 860px;
  background-size: cover !important;
}



.banner-pic .hover-effect-bann .row {
  position: absolute;
  top: -190px;
  left: 104vh;
  width: 960px;
  -webkit-transform: rotateX(70deg) rotateZ(25deg) scale(1.2);
  transform: rotateX(70deg) rotateZ(25deg) scale(1.2);
  -webkit-box-pack: end;
  -webkit-justify-content: flex-end;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.banner-sec .ban-txt h1{ margin-bottom: 12px; }

.banner-pic .hover-effect-bann.web-hov-change .row {
  -webkit-transform: rotateX(40deg) rotateZ(15deg) scale(1.0);
  transform: rotateX(40deg) rotateZ(15deg) scale(1.0);
}

.banner-pic .hover-effect-bann.web-hov-change .row .column {
  max-width: 32%;
}

.banner-pic .hover-effect-bann .column {
  width: 50%;
  max-width: 22%;
  padding: 10px;
  -webkit-box-flex: 1;
  -webkit-flex: 1 1 50%;
  -ms-flex: 1 1 50%;
  flex: 1 1 50%;
}

.banner-pic .hover-effect-bann .shadow {
  display: block;
  -webkit-transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
  opacity: .9;
  background-color: rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.1);
  -webkit-animation: 1.5s cubic-bezier(0.165, 0.84, 0.44, 1) shadow 2;
  animation: 1.5s cubic-bezier(0.165, 0.84, 0.44, 1) shadow 2;
}

.banner-pic .hover-effect-bann .ItemCard__thumb img {
  position: relative;
  z-index: 1;
  -webkit-transition: -webkit-transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: -webkit-transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1), -webkit-transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
  -webkit-transform: translate3d(0, 0, 20px);
  transform: translate3d(0, 0, 20px);
  -webkit-animation: 1.5s cubic-bezier(0.165, 0.84, 0.44, 1) levitate 2;
  animation: 1.5s cubic-bezier(0.165, 0.84, 0.44, 1) levitate 2;
}

.banner-pic .hover-effect-bann .column:hover .ItemCard__dest {
  z-index: 10;
}

.banner-pic .hover-effect-bann .column:hover .ItemCard__dest,
.banner-pic .hover-effect-bann .column:hover .ItemCard__thumb img {
  -webkit-transform: translate3d(0, 0, 45px) rotateX(-12deg) rotateY(20deg);
  transform: translate3d(0, 0, 45px) rotateX(-12deg) rotateY(20deg);
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
}

.banner-pic .hover-effect-bann.web-hov-change .column:hover .ItemCard__dest,
.banner-pic .hover-effect-bann.web-hov-change .column:hover .ItemCard__thumb img {
  -webkit-transform: translate3d(0, 0, 50px) rotateX(0deg);
  transform: translate3d(0, 0, 50px) rotateX(0);
}

.banner-pic .hover-effect-bann .column:hover .ItemCard__thumb .shadow {
  opacity: .6;
  background-color: rgba(0, 0, 0, 0.1);
  box-shadow: 0 0 10px 6px rgba(0, 0, 0, 0.1);
}

.banner-pic .section--list .row {
  max-width: 1200px;
  margin-right: auto;
  margin-left: auto;
  padding: 160px 0;
}

.banner-pic .section--list .column {
  padding: 20px;
}

.banner-pic .hero {
  position: absolute;
  top: 0;
  right: 0;
  width: 100vw;
  padding: 160px 40px 0 40px;
  font-family: 'Roboto', sans-serif;
  color: #fff;
}

.banner-pic .ItemCard {
  position: relative;
  max-width: 510px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.banner-pic .ItemCard__thumb {
  position: relative;
  padding: 0;
}

.banner-pic .ItemCard__thumb img {
  display: block;
  cursor: pointer;
}

.banner-pic .ItemCard__summary {
  width: 100%;
  padding: 20px;
  background-color: #fff;
}

.banner-pic .ItemCard__title {
  margin: 6px 0;
  font-size: 1.2em;
}

.banner-pic .ItemCard__meta {
  font-size: .8em;
  color: #aaa;
}

.banner-pic .ItemCard__meta.category {
  font-weight: 800;
  text-transform: uppercase;
  color: #ec3e3a;
}

.banner-sec+section+section {
  margin-top: 0px;
  border: 0px;
}
.banner-sec {
  height: 454px;
  position: relative;
  overflow: hidden;
  z-index: 1;
}
.banner-sec.sm-bann a.pack-ordernow {
  padding: 15px 75px;
  margin: 0px;
  overflow: hidden;
  z-index: 2;
}
/* .banner-pic .hover-effect-bann,
  .banner-sec {
      height: 70vh;
  } */
  .ban-txt-box {
    position: absolute;
    top: 0;
    left: 0;
    width: 25%;
    height: 100%;
    /* display: flex; */
    align-items: center;
    z-index: 0;
    /* float: right; */
    margin-left: 16%;
}

.ban-txt h1 {
    font-size: 55px;
    color: #123366;
    font-weight: bold;
    text-transform: capitalize;
    line-height: 1.25em;
    margin-bottom: 14px;
    margin-top: 30px;
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: bounceInLeft;
    animation-name: bounceInLeft;
}

.ban-txt h4 {
    font-size: 25px;
    color: #2a2a2a;
    font-weight: 600;
    text-transform: capitalize;
    line-height: .95em;
    font-family: 'Titillium Web', sans-serif;
    margin-bottom: 25px;
    -webkit-animation-duration: 1.2s;
    animation-duration: 1.2s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: bounceInLeft;
    animation-name: bounceInLeft;
}

.ban-txt h4 span {
    font-weight: bold;
    color: #76c137;
    font-size: 35px;
}

.ban-txt li {
    font-size: 16px;
    color: #2a2a2a;
    font-weight: 400;
    text-transform: capitalize;
    line-height: .95em;
    margin-top: 12px;
    position: relative;
    padding-left: 23px;
}

.ban-txt li:before {
    width: 12px;
    height: 12px;
    background: #d51c22;
    display: block;
    content: "";
    border-radius: 15px;
    position: absolute;
    left: 1px;
    top: 3px;
}

.ban-txt li {
    -webkit-animation-duration: 1.3s;
    animation-duration: 1.3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: bounceInLeft;
    animation-name: bounceInLeft;
}

.ban-txt li+li {
    -webkit-animation-duration: 1.4s;
    animation-duration: 1.4s;
}

.ban-txt li+li+li {
    -webkit-animation-duration: 1.5s;
    animation-duration: 1.5s;
}

.ban-txt li+li+li+li {
    -webkit-animation-duration: 1.6s;
    animation-duration: 1.6s;
}

.ban-txt li+li+li+li+li {
    -webkit-animation-duration: 1.7s;
    animation-duration: 1.7s;
}
.banner-pic .hover-effect-bann .row, .banner-pic .hover-effect-bann .column, .banner-pic .hover-effect-bann .ItemCard, .banner-pic .hover-effect-bann .ItemCard__thumb {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}
.banner-pic .hover-effect-bann .column:hover .ItemCard__dest, .banner-pic .hover-effect-bann .column:hover .ItemCard__thumb img {
  -webkit-transform: translate3d(0, 0, 45px) rotateX(-12deg) rotateY(20deg);
  transform: translate3d(0, 0, 45px) rotateX(-12deg) rotateY(20deg);
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
}
.banner-pic .hover-effect-bann .row,
.banner-pic .hover-effect-bann .column,
.banner-pic .hover-effect-bann .ItemCard,
.banner-pic .hover-effect-bann .ItemCard__thumb {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}
@-webkit-keyframes levitate {
  0% {
      -webkit-transform: translate3d(0, 0, 20px);
      transform: translate3d(0, 0, 20px);
  }

  50% {
      -webkit-transform: translate3d(0, 0, 1px);
      transform: translate3d(0, 0, 1px);
  }

  100% {
      -webkit-transform: translate3d(0, 0, 20px);
      transform: translate3d(0, 0, 20px);
  }
}

@keyframes levitate {
  0% {
      -webkit-transform: translate3d(0, 0, 20px);
      transform: translate3d(0, 0, 20px);
  }

  50% {
      -webkit-transform: translate3d(0, 0, 1px);
      transform: translate3d(0, 0, 1px);
  }

  100% {
      -webkit-transform: translate3d(0, 0, 20px);
      transform: translate3d(0, 0, 20px);
  }
}

@-webkit-keyframes shadow {
  0% {
      opacity: .9;
      background-color: rgba(0, 0, 0, 0.1);
      box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.1);
  }

  50% {
      opacity: 1;
      background-color: rgba(0, 0, 0, 0.18);
      box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.18);
  }

  100% {
      opacity: .9;
      background-color: rgba(0, 0, 0, 0.1);
      box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.1);
  }
}

@keyframes shadow {
  0% {
      opacity: .9;
      background-color: rgba(0, 0, 0, 0.1);
      box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.1);
  }

  50% {
      opacity: 1;
      background-color: rgba(0, 0, 0, 0.18);
      box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.18);
  }

  100% {
      opacity: .9;
      background-color: rgba(0, 0, 0, 0.1);
      box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.1);
  }
}




/* @media (min-width:1520px) {

  .banner-pic .hover-effect-bann{ background-position: center !important; }

} */


section.pricing-sec-2 { background: rgb(248, 248, 251); padding: 90px 0px 0px; }
.anchor-banner {width: 200px;height: 60px;text-align: center;display: flex;align-items: center;justify-content: center;font-size: 12px;background: linear-gradient(0deg, rgb(255, 177, 56) 0%, rgb(255, 206, 118) 100%);color: rgb(0, 0, 0);font-weight: 600;border-radius: 2px;margin-bottom: 28px;text-transform: uppercase;}

.para-sec-2 h4 {font-size: 42px;color: rgb(38, 39, 45);font-weight: 500;margin: 0px;font-weight: 700;padding-bottom: 12px;}
.para-sec-2 h5 {font-size: 19px;color: rgb(38, 39, 45);font-weight: 500;margin: 0px;padding-bottom: 34px;line-height: 28px;}
.para-sec-2 h1 {font-size: 18px;color: rgb(0, 0, 0);font-weight: 700;padding-bottom: 21px;}
.para-sec-2 h1 a {font-size: 18px;color: rgb(0, 0, 0);font-weight: 700;margin-left: 28px;line-height: 0px;}
.para-sec-2 a { display: inline-block; line-height: 59px; background: linear-gradient(0deg, rgb(255, 203, 97) 54%, rgb(255, 222, 133) 100%); margin-right: 10px; text-transform: capitalize; }
a.anchor-banner.ANCHOR-BTN-TWO { background: rgb(85, 89, 115); color: rgb(255, 255, 255); text-transform: capitalize; }
.inner-box { width: 445px; padding-top: 19px; height: auto; text-align: center; background-image: -webkit-linear-gradient(90deg, rgb(255, 227, 144) 0%, rgb(255, 201, 92) 100%); border-radius: 10px; }
.inner-box h4 { font-size: 54px; color: rgb(0, 0, 0); text-transform: uppercase; font-family: Gilroy, sans-serif; font-weight: 900; }
.inner-box h5 { font-size: 24px; color: rgb(0, 0, 0); font-weight: 600; text-transform: uppercase; padding-bottom: 18px; margin-bottom: 22px; position: relative; }
.inner-box p { font-size: 18px; color: rgb(0, 0, 0); font-weight: 500; }
.inner-box h5::before { position: absolute; content: ""; width: 358px; height: 1px; background: rgb(255, 220, 147); bottom: 0px; }
.inner-pricing h6 { font-size: 56px; color: rgb(0, 0, 0); font-weight: 800; display: inline-block; font-family: Gilroy, sans-serif; position: relative; text-align: unset; margin: 0px 41px 0px 0px; }
.inner-pricing h2 { display: inline-block; }
.inner-pricing h2 { font-size: 21px; color: rgb(0, 0, 0); font-weight: 800; position: relative; text-align: initial; font-family: Gilroy, sans-serif; }
.inner-pricing h2 span { display: block; }
.inner-pricing h2::before { position: absolute; content: ""; background: url("/assets/images/pricing-detail/5.png") no-repeat; width: 131px; height: 39px; top: 2px; right: -35px; }
.btn-inner { width: 447px; height: 107px; background: rgb(85, 89, 115); border: 1px solid transparent; border-radius: 10px; }
.inner-pricing { padding-bottom: 22px; }
a.btn-order { font-size: 36px; color: rgb(255, 255, 255); font-weight: 800; text-transform: uppercase; line-height: 104px; font-family: Gilroy, sans-serif; }
.inner-pricing { }
ul.inner li { display: inline-block; text-align: center; vertical-align: top; position: relative; width: 19%; transition: all 0.4s ease-in-out 0s; }


section.sec-3 { background: transparent; text-align: center; padding: 61px 0px 50px; }
ul.inner li img { vertical-align: middle; min-height: 0px; }
ul.inner li h5 { font-size: 16px; color: rgb(51, 51, 51); line-height: 22px; margin: 0px; }
.mainnn { min-height: 102px; }
.overlap { position: absolute; width: 220px; height: 188px; border-radius: 5px; background-color: rgb(255, 255, 255); box-shadow: rgba(0, 0, 0, 0.1) 0px 6px 20px 0px; inset: 0px; margin: auto; opacity: 0; display: flex; text-align: center; align-items: center; justify-content: center; display: none; }
ul.inner li:hover .overlap { opacity: 1; transition: all 0.4s ease-in-out 0s; }
.BG { position: absolute; left: 848px; top: 1636px; z-index: 445; }
.overlap h6 { font-size: 20px; color: rgb(0, 0, 0); font-weight: 500; }
.overlap p { font-size: 13px; color: rgb(142, 142, 142); font-weight: 400; line-height: 19px; }
.Rounded_Rectangle_11 { border-radius: 15px; background-color: rgb(246, 245, 250); position: absolute; left: 390px; top: 2258px; width: 214px; height: 95px; z-index: 364; }
.overlap-sec-33 {border-radius: 15px;background-color: rgb(246, 245, 250);/* width: 110px; */height: 95px;padding-top: 7px;padding-left: 10px;position: absolute;top: 100px;left: 20px;z-index: -1;}
.overlap-sec-33 img{ display: inline-block; }
.inner-iverlap {display: inline-block;vertical-align: middle;padding-left: 7px;padding-top: 11px;padding-right: 15px;}
.inner-iverlap h5 { margin: 0px; font-size: 22px; color: rgb(39, 39, 39); font-weight: 600; }
.inner-iverlap h6 { margin: 0px; font-size: 12px; color: rgb(131, 131, 131); font-weight: 500; }
.image-sec-3 {position: relative;padding-left: 170px;z-index: 20;}
.overlap-sec-33 { }
.image-sec-3 img {/* width: 395px; */position: relative;}
.other-overlap {border-radius: 30px;background-color: rgb(255, 255, 255);width: 162px;text-align: center;height: 150px;box-shadow: rgba(0, 0, 0, 0.35) 0px 29px 51px 0px;display: flex;align-items: baseline;justify-content: center;padding-top: 7px;position: absolute;top: 10px;right: 30px;z-index: 8; display: none;}
.other-overlap h5 { font-size: 64.78px; color: rgb(123, 129, 163); margin: 0px; font-weight: 700; }
.other-overlap h6 { font-size: 17px; color: rgb(0, 0, 0); font-weight: 600; text-transform: uppercase; letter-spacing: 3px; margin: 0px; }

/* Inner Banners */
.page-header {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  padding: 140px 0 10px;
}

section.page-header {}

section.page-header {}
.page-header h2 {
  color: #fff;
  font-size: 80px;
  line-height: normal;
  font-weight: bold;
  text-transform: uppercase;
  padding-bottom: 15px;
}
.page-header ul>li {
  display: inline-block;
  vertical-align: middle;
  padding-right: 10px;
  position: relative;
}
.page-header ul>li.first::after {
  content: "/";
  color: #fff;
  font-size: 18px;
  position: absolute;
  right: 0;
  top: 2px;
}
.page-header ul>li a {
  color: #fff;
  font-size: 18px;
  line-height: normal;
  font-weight: 600;
}





.Accordions {
  display: block;
  max-width: 800px;
  margin: auto;
}
.Accordion_item {
  width: 100%;
  height: auto;
  margin: 5px 0;
}
.Accordion_item:first-child {
  margin-top: 50px;
}
.Accordion_item .title_tab {
  width: 100%;
  background-color: #123366;
  color: #fcfcfc;
  padding: 12px 30px;
  cursor: pointer;
  transition: background-color 0.3s ease-in;
  border-radius: 4px;
}
.Accordion_item .title_tab .title {
  font-size: 20px;
  letter-spacing: 1px;
  position: relative;
}
.Accordion_item .title_tab .title .icon {
  position: absolute;
  right: 1%;
  top: calc(50% - 8px);
  width: 16px;
  height: 16px;
  background-color: transparent;
  transform: rotate(-90deg);
  transition: transform 0.3s ease-in;
}
.Accordion_item .title_tab .title .icon:before, .Accordion_item .title_tab .title .icon:after {
  content: "";
  position: absolute;
  height: 100%;
  width: 2px;
  background-color: #fcfcfc;
}
.Accordion_item .title_tab .title .icon:before {
  top: 0;
  left: 2px;
  transform: rotate(-45deg);
}
.Accordion_item .title_tab .title .icon:after {
  top: 0;
  right: 2px;
  transform: rotate(45deg);
}
.inner_content {
  width: 100%;
  height: auto;
  display: none;
  overflow: hidden;
}
.inner_content p {
  width: 98%;
  margin: auto;
  padding: 18px 15px;
  font-size: 16px;
  line-height: 28px;
  letter-spacing: 1px;
  opacity: 0;
  transform: translate3d(0px, 60px, 0px);
  transition: transform 0.6s cubic-bezier(0, 0.99, 0.44, 1.01), opacity 0.8s 0.1s cubic-bezier(0, 0.99, 0.44, 1.01);
}
/* ================================= */
.Accordion_item .title_tab.active {
  background-color: #2056ab;
  transition: background-color 0.3s ease-in;
}
.Accordion_item .title_tab.active .title .icon {
  transform: rotate(0deg);
  transition: transform 0.3s ease-in;
}
.Accordion_item .title_tab:hover {
  background-color: #2056ab;
  transition: background-color 0.3s ease-in;
}
.Accordion_item .inner_content p.show {
  opacity: 1;
  transform: translate3d(0px, 0px, 0px);
  transition: opacity 0.8s cubic-bezier(0, 0.99, 0.44, 1.01), transform 0.6s 0.1s cubic-bezier(0, 0.99, 0.44, 1.01);
}
/* ================================= */



/*Steps*/
.process {background: #fafafa;padding: 75px 0 80px 0;position: relative;overflow: hidden;}
.process::before {content: '';position: absolute;right: 0;top: -200px;background: url(../images/elements/element-6.png) no-repeat;width: 547px;height: 599px;}
.process .headingstyle1 {text-align: center;margin-bottom: 70px;}
.process .headingstyle1 h5{ color: #000; }


.process .processBox {position: relative;text-align: center;margin-bottom: 20px;/* padding: 0 35px; */}
.processBox i {display: block;background: url(../images/sprite_11.png) no-repeat;background-position: -105px -191px;width: 70px;height: 70px;margin: auto;filter: hue-rotate(170deg);}
.processBox i.ic2 {background-position: -102px -284px;}
.processBox i.ic3 {background-position: -196px -284px;}
.processBox i.ic4 {background-position: -196px -189px;}
.processBox h6 {font-size: 17px;color: #000000;font-weight: 500;border-bottom: 1px solid #000000;letter-spacing: -1px;margin: 30px 0 25px 0;display: inline-block;}
.processBox h4 {font-size: 26px;color: #000000;font-weight: 600;margin-bottom: 15px;text-transform: capitalize;letter-spacing: -1px;}
.processBox p {font-size: 15px;color: #666666;margin: 0;line-height: 24px;}

.processBox.arrow::before {content: '';position: absolute;right: -100px;top: 15px;background: url(../images/elements/element-7.png) no-repeat;width: 180px;height: 36px;}
.arrow.reverse::before {transform: rotate(180deg);top: 30px;}

.process.repeat-01 {padding: 50px 0 100px 0;background: #ffffff;}
.process.repeat-01::before {display: none;}
.process.repeat-01 .processBox h4 {margin-top: 20px;}



/* Skill Bar */
.wrap p {
  position: absolute;
  font: .8em sans-serif;
  top: 50%;
  left: 20px;
  margin: 0 auto;
  color: #000;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  letter-spacing: 1px;
}

.wrap {
  position: relative;
  width: 600px;
  height: 30px;
  margin: 25px auto;
  padding: 0;
  background: #444;
  border-radius: 5px;
  -webkit-transition: .5s ease;
  -moz-transition: .5s ease;
  -o-transition: .5s ease;
  transition: .5s .15s ease;
}

.bar {
  height: 30px;
  border-radius: 5px;
  transition: .25s ease;
}

.wrap:hover .bar {
  background: rgb(115 133 161);
  cursor: pointer;
}

.wrap:hover {
  width: 600px;
  background: #555;
}

.vector {
  width: 98%;
  background: steelblue;
  -webkit-animation: vector 2.5s;
  -moz-animation: vector 2.5s;
  -o-animation: vector 2.5s;
  animation: vector 2.5s;
}

.digitizing {
  width: 98%;
  background: gold;
  -webkit-animation: digitizing 2s;
  -moz-animation: digitizing 2s;
  -o-animation: digitizing 2s;
  animation: digitizing 2s;
}

.left-chest {
  width: 88%;
  background: #F1C;
  -webkit-animation: left-chest 2.1s;
  -moz-animation: left-chest 2.1s;
  -o-animation: left-chest 2.1s;
  animation: left-chest 2.1s;
  
}

.jacketback{
  width: 90%;
  background: crimson;
  -webkit-animation: jacketback 1.8s;
  -moz-animation: jacketback 1.8s;
  -o-animation: jacketback 1.8s;
  animation: jacketback 1.8s;
}
.caps{
  width: 82%;
  background: limegreen;
  -webkit-animation: caps 2.9s;
  -moz-animation: caps 2.9s;
  -o-animation: caps 2.9s;
  animation: caps 2.9s;
}
.puff{
  width: 85%;
  background: #cd32ac;
  -webkit-animation: puff 2.9s;
  -moz-animation: puff 2.9s;
  -o-animation: puff 2.9s;
  animation: puff 2.9s;
}

.wrap span {
  display: block;
  float: right;
  padding-right: 15px;
  color: #222;
  line-height: 30px;
  -webkit-animation: span 2s 1.7s forwards;
  -moz-animation: span 2s 1.7s forwards;
  -o-animation: span 2s 1.7s forwards;
  animation: span 2s 1.7s forwards;
  opacity: 0;
}
@-webkit-keyframes vector {
  from { width:  0%; }
  to   { width: 98%; }
}
@-moz-keyframes vector {
  from { width:  0%; }
  to   { width: 98%; }
}
@-o-keyframes vector {
  from { width:  0%; } 
  to { width:   98%; }
}
@keyframes vector {
  from { width:  0%; } 
  to { width:   98%; }
}

/* css
--------- */
@-webkit-keyframes digitizing {
  from { width:  0%; }
  to   { width: 98%; }
}
@-moz-keyframes digitizing {
  from { width:  0%; }
  to   { width: 98%; }
}
@-o-keyframes digitizing {
  from { width:  0%; }
  to   { width: 98%; }
}
@keyframes digitizing {
  from { width:  0%; }
  to   { width: 98%; }
}

/* jquery
--------- */
@-webkit-keyframes left-chest {
  from { width:  0%; }
  to   { width: 88%; }
}
@-moz-keyframes left-chest {
  from { width:  0%; }
  to   { width: 88%; }
}
@-o-keyframes left-chest {
  from { width:  0%; }
  to   { width: 88%; }
}
@keyframes left-chest {
  from { width:  0%; }
  to   { width: 88%; }
}

/* js
--------- */
@-webkit-keyframes jacketback {
  from { width:  0%; }
  to   { width: 90%; }
}
@-moz-keyframes jacketback {
  from { width:  0%; }
  to   { width: 90%; }
}
@-o-keyframes jacketback {
  from { width:  0%; }
  to   { width: 90%; }
}
@keyframes jacketback {
  from { width:  0%; }
  to   { width: 90%; }
}

/* php
--------- */
@-webkit-keyframes caps{
  from { width:  0%; }
  to   { width: 82%; }
}
@-moz-keyframes caps{
  from { width:  0%; }
  to   { width: 82%; }
}
@-o-keyframes caps{
  from { width:  0%; }
  to   { width: 82%; }
}
@keyframes caps{
  from { width:  0%; }
  to   { width: 82%; }
}
@-webkit-keyframes puff{
  from { width:  0%; }
  to   { width: 85%; }
}
@-moz-keyframes puff{
  from { width:  0%; }
  to   { width: 85%; }
}
@-o-keyframes puff{
  from { width:  0%; }
  to   { width: 85%; }
}
@keyframes puff{
  from { width:  0%; }
  to   { width: 85%; }
}

@-webkit-keyframes span {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@-moz-keyframes span {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@-o-keyframes span {
  from { opacity: 0; }
  to   { opacity: 1; }
}
@keyframes span {
  from { opacity: 0; }
  to   { opacity: 1; }
}