/**
* Padding
* ----------------------------------------------------------------------------
*/
.loop-padding(@prefix, @n, @i: 0, @step: 5) when (@i =< @n) {
  .@{prefix}-@{i} {
    padding: @i * 1px !important;
  }
  .loop-padding(@prefix, @n, (@i + @step), @step)
}

.loop-padding(pd, 100);
/**
* Padding Top
* ----------------------------------------------------------------------------
*/
.loop-padding-top(@prefix, @n, @i: 0, @step: 5) when (@i =< @n) {
  .@{prefix}-@{i} {
    padding-top: @i * 1px !important;
  }
  .loop-padding-top(@prefix, @n, (@i + @step), @step)
}

.loop-padding-top(pd-top, 100);
@media screen and (max-width: 991px) {
  .loop-padding-top(sm-pd-top, 100);
}

@media screen and (max-width: 767px) {
  .loop-padding-top(xs-pd-top, 100);
}

/**
* Padding Bottom
* ----------------------------------------------------------------------------
*/
.loop-padding-bottom(@prefix, @n, @i: 0, @step: 5) when (@i =< @n) {
  .@{prefix}-@{i} {
    padding-bottom: @i * 1px !important;
  }
  .loop-padding-bottom(@prefix, @n, (@i + @step), @step)
}

.loop-padding-bottom(pd-bottom, 100);
@media screen and (max-width: 991px) {
  .loop-padding-bottom(sm-pd-bottom, 100);
}

@media screen and (max-width: 767px) {
  .loop-padding-bottom(xs-pd-bottom, 100);
}

/**
* Margin Top
* ----------------------------------------------------------------------------
*/
.loop-margin-top(@prefix, @n, @i: 0, @step: 5) when (@i =< @n) {
  .@{prefix}-@{i} {
    margin-top: @i * 1px !important;
  }
  .loop-margin-top(@prefix, @n, (@i + @step), @step)
}

.loop-margin-top(mg-top, 100);
@media screen and (max-width: 991px) {
  .loop-margin-top(sm-mg-top, 100);
}

@media screen and (max-width: 1190px) {
  .loop-margin-top(md-mg-top, 100);
}

@media screen and (max-width: 767px) {
  .loop-margin-top(xs-mg-top, 100);
}

/**
* Margin Bottom
* ----------------------------------------------------------------------------
*/
.loop-margin-bottom(@prefix, @n, @i: 0, @step: 5) when (@i =< @n) {
  .@{prefix}-@{i} {
    margin-bottom: @i * 1px !important;
  }
  .loop-margin-bottom(@prefix, @n, (@i + @step), @step)
}

.loop-margin-bottom(mg-bottom, 100);
@media screen and (max-width: 991px) {
  .loop-margin-bottom(sm-mg-bottom, 100);
}

@media screen and (max-width: 767px) {
  .loop-margin-bottom(xs-mg-bottom, 100);
}

/**
* Custom Columns Mobile
* ----------------------------------------------------------------------------
*/
@media (max-width: 599px) {
  .col-mb-1, .col-mb-2, .col-mb-3, .col-mb-4, .col-mb-5, .col-mb-6, .col-mb-7, .col-mb-8, .col-mb-9, .col-mb-10, .col-mb-11, .col-mb-12 {
    float: left !important;
  }

  .col-mb-12 {
    width: 100% !important;
  }

  .col-mb-11 {
    width: 91.66666667% !important;
  }

  .col-mb-10 {
    width: 83.33333333% !important;
  }

  .col-mb-9 {
    width: 75% !important;
  }

  .col-mb-8 {
    width: 66.66666667% !important;
  }

  .col-mb-7 {
    width: 58.33333333% !important;
  }

  .col-mb-6 {
    width: 50% !important;
  }

  .col-mb-5 {
    width: 41.66666667% !important;
  }

  .col-mb-4 {
    width: 33.33333333% !important;
  }

  .col-mb-3 {
    width: 25% !important;
  }

  .col-mb-2 {
    width: 16.66666667% !important;
  }

  .col-mb-1 {
    width: 8.33333333% !important;
  }

  .col-mb-pull-12 {
    right: 100% !important;
  }

  .col-mb-pull-11 {
    right: 91.66666667% !important;
  }

  .col-mb-pull-10 {
    right: 83.33333333% !important;
  }

  .col-mb-pull-9 {
    right: 75% !important;
  }

  .col-mb-pull-8 {
    right: 66.66666667% !important;
  }

  .col-mb-pull-7 {
    right: 58.33333333% !important;
  }

  .col-mb-pull-6 {
    right: 50% !important;
  }

  .col-mb-pull-5 {
    right: 41.66666667% !important;
  }

  .col-mb-pull-4 {
    right: 33.33333333% !important;
  }

  .col-mb-pull-3 {
    right: 25% !important;
  }

  .col-mb-pull-2 {
    right: 16.66666667% !important;
  }

  .col-mb-pull-1 {
    right: 8.33333333% !important;
  }

  .col-mb-pull-0 {
    right: auto !important;
  }

  .col-mb-push-12 {
    left: 100% !important;
  }

  .col-mb-push-11 {
    left: 91.66666667% !important;
  }

  .col-mb-push-10 {
    left: 83.33333333% !important;
  }

  .col-mb-push-9 {
    left: 75% !important;
  }

  .col-mb-push-8 {
    left: 66.66666667% !important;
  }

  .col-mb-push-7 {
    left: 58.33333333% !important;
  }

  .col-mb-push-6 {
    left: 50% !important;
  }

  .col-mb-push-5 {
    left: 41.66666667% !important;
  }

  .col-mb-push-4 {
    left: 33.33333333% !important;
  }

  .col-mb-push-3 {
    left: 25% !important;
  }

  .col-mb-push-2 {
    left: 16.66666667% !important;
  }

  .col-mb-push-1 {
    left: 8.33333333% !important;
  }

  .col-mb-push-0 {
    left: auto !important;
  }

  .col-mb-offset-12 {
    margin-left: 100% !important;
  }

  .col-mb-offset-11 {
    margin-left: 91.66666667% !important;
  }

  .col-mb-offset-10 {
    margin-left: 83.33333333% !important;
  }

  .col-mb-offset-9 {
    margin-left: 75% !important;
  }

  .col-mb-offset-8 {
    margin-left: 66.66666667% !important;
  }

  .col-mb-offset-7 {
    margin-left: 58.33333333% !important;
  }

  .col-mb-offset-6 {
    margin-left: 50% !important;
  }

  .col-mb-offset-5 {
    margin-left: 41.66666667% !important;
  }

  .col-mb-offset-4 {
    margin-left: 33.33333333% !important;
  }

  .col-mb-offset-3 {
    margin-left: 25% !important;
  }

  .col-mb-offset-2 {
    margin-left: 16.66666667% !important;
  }

  .col-mb-offset-1 {
    margin-left: 8.33333333% !important;
  }

  .col-mb-offset-0 {
    margin-left: 0 !important;
  }
}

.bg-transparent {
  background-color: transparent;
}

@media (min-width: 1200px) {
  .row-fix-content {
    max-height: 685px;
    margin-top: 80px;
    .gf-posts {
      position: relative;
      top: -140px;
      margin-bottom: -50px;
    }
  }
}

.gsf-white-text {
  color: #fff !important;
}

.gsf-accent-text {
  color: @accent_color !important;
}

//add class
.pos-absolute {
  position: absolute !important;
}

.top-0 {
  top: 0 !important;
}

.top-left-40 {
  top: 40px !important;
  left: 40px !important;
}

.left-0 {
  left: 0 !important;
}

.bottom-0 {
  bottom: 0 !important;
}

.right-neg-30 {
  right: -30px !important;
}

.margin-left-50 {
  margin-left: 50%;
}
.margin-left-25 {
  margin-left: 25px;
}

.display-inline-block {
  display: inline-block;
}

.pd-right-100 {
  padding-right: 100px !important;
}

// Small screen
@media screen and (max-width: 991px) {
  .sm-pos-inherit {
    position: inherit !important;
  }

  .sm-text-center {
    text-align: center !important;
  }
}

//mini screen
@media screen and (max-width: 767px) {
  .xs-text-center {
    text-align: center !important;
  }
}

// Animation Owl Carousel
@keyframes slideInLeft {
  from {
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.slideInLeft {
  animation-name: slideInLeft;
}

.typed-cursor {
  opacity: 1;
  -webkit-animation: blink 0.7s infinite;
  -moz-animation: blink 0.7s infinite;
  animation: blink 0.7s infinite;
}

@keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

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

@-moz-keyframes blink {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

//md screen
@media screen and (max-width: 1199px) {
  .md-mg-top-50 {
    margin-top: 50px !important;
  }

  .md-mg-bottom-50 {
    margin-bottom: 50px !important;
  }
}

// add class
/* postion : static */
.pos-static {
  position: static !important;
  transform: translateX(0);
  width: 100% !important;;
  padding: 0;
  background-color: transparent !important;
}

.pos-absolute-top-50 {
  position: absolute;
  top: 50%;
  .transform(translateY(-50%));
}



.topbar-social {
  .social-icon-small {
    li > a {
      margin-right: 23px;
    }
  }
}

.social-float-right {
  float: right;
  padding: 11px 30px;
}

.sm-float-right {
  float: right;
}

.btn-xxl {
  padding: 22px 47px !important;
}
// Top bar 1
.top-bar-padding{
  .widget-info_box{
    ul li{
      padding-top: 14px;
      padding-bottom: 14px;
      &:after{
        height: 100% !important;
      }
    }
  }
}
.widget-info_box.info-box-text-normal{
  .info-content p{
    font-style: normal !important;
  }
}
@media (max-width: 991px){
  .widget-info_box.info-box-text-normal{
    ul li {
      margin-left: 10px !important;
    }
    ul li:first-child {
      margin-left: 0 !important;
    }
    ul li:not(:last-child) {
      padding-right: 10px;
    }
  }
  .social-float-right {
    float: right;
    padding: 0 20px;
  }
}

// Top bar 2
.custom-dropdown-list {
  position: relative;
  p {
    margin-bottom: 0;
  }
  .top-bar-info-box {
    i {
      margin-left: 8px;
    }

  }
  .fold-out-drop {
    list-style: none;
    .transition(all .6s);
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    display: none;
    z-index: 1;
    background-color: #fff;
    .box-shadow(0 4px 10px 1px rgba(0, 0, 0, 0.15));
    white-space: normal;
    li {
      line-height: 20px;
      padding: 10px 20px;
      border-top: 1px solid #eee;
    }
    li:first-child {
      border-top: none;
    }
  }
  &:hover {
    .fold-out-drop {
      display: block;
    }
  }
}

.display-table-cell {
  display: table-cell;
  vertical-align: middle;
}

.nowrap {
  white-space: nowrap;
}

.width-100 {
  width: 100%;
}

.pd-left-40 {
  padding-left: 40px;
}

//margin
@media (min-width: 1600px) {
  .lg-mg-240 {
    margin-left: 240px !important;
    margin-right: 240px !important;
    width: auto;
    border: 20px solid #fff;
    background-color: #fcfcfc;
  }

  .lg-mg-220 {
    margin-left: 220px !important;
    margin-right: 220px !important;
    width: auto !important;
  }
}

@media (max-width: 1599px) and (min-width: 992px) {
  .md-mg-100 {
    margin-left: 100px !important;
    margin-right: 100px !important;
  }
}

@media (max-width: 991px) and (min-width: 768px) {
  .sm-mg-50 {
    margin-left: 50px !important;
    margin-right: 50px !important;
  }
}

//margin
@media (min-width: 1600px) {
  .lg-mg-160 {
    margin-left: 160px !important;
    margin-right: 160px !important;
    width: auto;
    padding-left: 0;
    padding-right: 0;
    background-color: @accent_color;
    &.gf-portfolio {
      background-color: transparent !important;
    }

  }
}

.portfolio-column-wrap {
  div.vc_column-inner:first-child {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

@media (max-width: 1599px) {
  .mg-auto {
    margin: auto !important;
    padding-left: 15px !important;
    padding-right: 15px !important;

  }
  .mg-auto.border-20 {
    > div:first-child {
      border: 20px solid #fff;
      background-color: #fcfcfc;
    }
  }

  .mg-auto.back-ground-accent {
    > div:first-child {
      background-color: @accent_color;
    }
  }
}
@media (max-width: 600px) {
  .mg-auto.xs-pd-0{
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

@media (min-width: 1200px) {
  .lg-mg-top-neg-85 {
    margin-top: -85px !important;
  }

  .lg-pd-right-30 {
    padding-right: 30px !important;
  }

  .lg-mg-neg-100 {
    margin-top: -100px;
  }

  .lg-mg-bottom-neg-217 {
    margin-bottom: -217px !important;
  }
}

@media (max-width: 1199px) {
  .md-mg-neg-60 {
    margin-top: -60px;
  }

  .md-pos-static {
    position: static !important;
  }

  .md-mg-left-0 {
    margin-left: 0 !important;
  }
}

@media (max-width: 1190px) and (min-width: 768px) {
  .md-mg-top-neg-65 {
    margin-top: -65px !important;
  }

  .md-pd-right-10 {
    padding-right: 10px !important;
  }

  .md-mg-bottom-neg-150 {
    margin-bottom: -150px !important;
  }
}

@media (max-width: 767px) {
  .xs-mg-top-neg-25 {
    margin-top: -25px !important;
  }

  .xs-mg-bottom-neg-100 {
    margin-bottom: -100px !important;
  }
}

.z-index-2 {
  z-index: 2 !important;
}

.position-relative {
  position: relative !important;
}

.position-static {
  position: static !important;
}

.top-neg-130 {
  top: -130px;
}

.top-neg-60 {
  top: -60px;
}

.top-neg-100 {
  top: -100px;
}

.certificate-3 {
  left: 0;
  right: 0;
  top: 100%;
  .transform(translateY(-100px));

}

@media (max-width: 767px) {
  .xs-position-static {
    position: static !important;
    .transform(translate(0));
  }

  .xs-mailchip-center {
    .g5plus-mailchimp {
      margin: auto;
    }
  }
}

.absolute-skew {
  position: relative;
  &:before {
    position: absolute;
    content: '';
    display: block;
    top: 100%;
    right: 0;
    width: 100%;
    height: 0;
    transform: skewY(3deg) translateY(-50%);
    z-index: 100;
    padding-bottom: 5.4%;
  }

}

// footer home-2
.footer-mg-top-neg-100 {
  footer {
    margin-top: -100px;
    .vc_row:first-child {
      padding-top: 215px !important;
    }
  }
}

.custom-menu-sidebar.widget_nav_menu {
  max-width: 300px;
  padding: 40px;
  text-transform: uppercase;
  ul li {
    margin-top: 15px !important;
    &:hover,
    &:focus,
    &:active,
    &.current-menu-item {
      &:before {
        color: @accent_color !important;
      }
    }
  }
  ul > li:first-child {
    margin-top: 0 !important;

  }

}

@media (max-width: 1199px) {
  .custom-menu-sidebar.widget_nav_menu {
    padding: 30px 20px !important;
  }

}

.contact-info.widget-info_box {
  .info-content {
    h6 {
      &:extend(.fs-16);
      &:extend(.fw-normal);
      text-transform: none !important;
    }
    p {
      font-style: normal !important;
      &:extend(.fs-13);
      line-height: 1.7;
    }
  }
}

.block-deep {
  position: relative;
  .block-after {
    position: relative;
  }
  .block-before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    .transition(all .6s ease-in-out);
    transform-origin: left;
    z-index: 100;
  }
  &:hover {
    .block-before {
      .transform(rotate3d(0, 1, 0, -180deg));
    }
  }
}

@media (max-width: 1190px) and (min-width: 768px) {
  .block-deep {
    .block-before {
      .transform(rotate3d(0, 1, 0, -180deg));
    }
  }
}

@media (max-width: 767px) {
  .block-deep {
    .block-before {
      position: static !important;
      .transform(rotate3d(0, 0, 0, 0)) !important;
      transform-origin: 0 !important;
    }
    &:hover {
      .block-before {
        .transform(rotate3d(0, 0, 0, 0)) !important;
      }
    }
  }
}

.container-1 {
  &:extend(.container);
}

.image-horizontal-flip {
  img {
    -webkit-animation-name: horizontal-flip;
    -webkit-animation-duration: 4s;
    -webkit-animation-delay: 3s;
    animation-name: horizontal-flip;
    animation-duration: 4s;
    animation-delay: 3s;
    animation-iteration-count: infinite;
  }

}

@-webkit-keyframes horizontal-flip {
  0% {
    .transform(perspective(400px) rotateY(0));
  }
  100% {
    .transform(perspective(400px) rotateY(359deg));
  }
}

@keyframes horizontal-flip {
  0% {
    .transform(perspective(400px) rotateY(0));
  }
  100% {
    .transform(perspective(400px) rotateY(359deg));
  }
}

.vc_row.bg-bottom {
  background-position: bottom !important;
}

.bg-top-left {
  .vc_column-inner:first-child {
    background-position: top left !important;
  }

}

.max-width-450 {
  max-width: 450px;
  text-align: center;
  margin: auto;
  float: none !important;
}