/*-----------------------------------------------------------------------------------

    Template Name: Businet - Multipurpose Business HTML5 Template
    Author: Pixelcurve
    Support: help.pixelcurve@gmail.com
    Author URI: https://themeforest.net/user/pixelcurve
    Version: 1.1

-----------------------------------------------------------------------------------

    CSS INDEX
    ===================

    1.COMMON
    2.HEADER
    3.BANNER
    4.FEATURES
    5.ABOUT
    6.SERVICES
    7.CASES
    8.COMPANY FEATURES
    9.TESTINOMIALS
    10.CALL TO ACTION
    11.TEAM
    12.QUOTE
    13.NEWS
    14.PARTNER LOGO
    15.FOOTER
    16.PAGE BANNER
    17.ABOUT PAGE
    18.COUNTER
    19.SERVICES
    20.SERVICES
    21.BLOG PAGE
    22.BLOG DETAILS PAGE
    23. PRICING PAGE
    24.SHOP PAGE
    25.SHOP DETAILS PAGE
    26.CONTACT PAGE

-----------------------------------------------------------------------------------*/

/*===========================
    1.COMMON css 
===========================*/
@import url("https://fonts.googleapis.com/css?family=Lato:400,700,900|Roboto:400,500,700");

* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

body {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

img {
  max-width: 100%;
}

a:focus,
select:focus,
input:focus,
textarea:focus,
button:focus {
  text-decoration: none;
  outline: none;
}

a:focus,
a:hover {
  text-decoration: none;
}

i,
span,
a {
  display: inline-block;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Lato", sans-serif;
  font-weight: 700;
  color: #191919;
  margin: 0px;
}

h1 {
  font-size: 60px;
}

h2 {
  font-size: 36px;
}

h3 {
  font-size: 28px;
}

h4 {
  font-size: 22px;
}

h5 {
  font-size: 18px;
}

h6 {
  font-size: 16px;
}

ul,
ol {
  margin: 0px;
  padding: 0px;
  list-style-type: none;
}

p {
  font-size: 16px;
  font-weight: 400;
  line-height: 27px;
  color: #555;
  margin: 0px;
}

.bg_cover {
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
}

/*===== All Button Style =====*/
.main-btn {
  display: inline-block;
  font-weight: 700;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  border: 1px solid #D61728;
  padding: 0 30px;
  font-size: 16px;
  font-family: "Lato", sans-serif;
  line-height: 48px;
  color: #fff;
  cursor: pointer;
  z-index: 5;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
  background-color: #D61728;
}

.main-btn:hover {
  background-color: #fff;
  color: #D61728;
  border-color: #D61728;
}

.main-btn.main-btn-2 {
  background-color: #fff;
  color: #D61728;
  border-color: #D61728;
}

.main-btn.main-btn-2:hover {
  background-color: #D61728;
  border-color: #D61728;
  color: #fff;
}

/*===== All Section Title Style =====*/
.section-title h6 {
  position: relative;
  text-transform: uppercase;
  font-size: 13px;
  color: #D61728;
  font-weight: 700;
  display: inline-block;
  margin-bottom: 9px;
  letter-spacing: 2px;
}

.section-title h6::before {
  position: absolute;
  content: '';
  background-color: #D61728;
  width: 100px;
  height: 1px;
  right: -110px;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}

.section-title h2 {
  font-size: 48px;
  font-weight: 900;
}

@media (max-width:767px) {
  .section-title h2 {
    font-size: 30px;
  }

}

.section-title.section-title-2 {
  position: relative;
  z-index: 9;
}

.section-title.section-title-2 h6 {
  color: #fff;
}

.section-title.section-title-2 h6::before {
  background-color: #fff;
}

.section-title.section-title-2 h2 {
  color: #fff;
}

/*===== All Preloader Style =====*/
#preloader {
  background-color: #fff;
  bottom: 0;
  height: 100%;
  left: 0;
  position: fixed;
  right: 0;
  top: 0;
  z-index: 99999;
}

#status {
  left: 50%;
  margin: -25px 0 0 -15px;
  position: fixed;
  top: 50%;
}

#status,
.spinner {
  height: 30px;
  width: 50px;
}

.spinner {
  font-size: 10px;
  margin: 0 auto;
  text-align: center;
}

.spinner > div {
  -webkit-animation: stretchdelay 1.2s infinite ease-in-out;
  -moz-animation: stretchdelay 1.2s infinite ease-in-out;
  -o-animation: stretchdelay 1.2s infinite ease-in-out;
  animation: stretchdelay 1.2s infinite ease-in-out;
  background-color: #D61728;
  display: inline-block;
  height: 100%;
  width: 6px;
}

.spinner .rect2 {
  -webkit-animation-delay: -1.1s;
  -moz-animation-delay: -1.1s;
  -o-animation-delay: -1.1s;
  animation-delay: -1.1s;
}

.spinner .rect3 {
  -webkit-animation-delay: -1s;
  -moz-animation-delay: -1s;
  -o-animation-delay: -1s;
  animation-delay: -1s;
}

.spinner .rect4 {
  -webkit-animation-delay: -0.9s;
  -moz-animation-delay: -0.9s;
  -o-animation-delay: -0.9s;
  animation-delay: -0.9s;
}

.spinner .rect5 {
  -webkit-animation-delay: -0.8s;
  -moz-animation-delay: -0.8s;
  -o-animation-delay: -0.8s;
  animation-delay: -0.8s;
}

@-webkit-keyframes stretchdelay {
  0%,
  40%,
  100% {
    -webkit-transform: scaleY(1);
    -moz-transform: scaleY(1);
    -ms-transform: scaleY(1);
    -o-transform: scaleY(1);
    transform: scaleY(1);
  }

  20% {
    -webkit-transform: scaleY(1.6);
    -moz-transform: scaleY(1.6);
    -ms-transform: scaleY(1.6);
    -o-transform: scaleY(1.6);
    transform: scaleY(1.6);
  }

}

@keyframes stretchdelay {
  0%,
  40%,
  100% {
    -webkit-transform: scaleY(1);
    -moz-transform: scaleY(1);
    -ms-transform: scaleY(1);
    -o-transform: scaleY(1);
    transform: scaleY(1);
  }

  20% {
    -webkit-transform: scaleY(1.6);
    -moz-transform: scaleY(1.6);
    -ms-transform: scaleY(1.6);
    -o-transform: scaleY(1.6);
    transform: scaleY(1.6);
  }

}

/*===========================
    2.HEADER css 
===========================*/
@media only screen and (min-width:768px) and (max-width:991px) {
  .header-area {
    padding-bottom: 20px;
  }

}

@media (max-width:767px) {
  .header-area {
    padding-bottom: 20px;
  }

}

.transparent {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  right: 0;
  z-index: 99;
}

.header-top {
  background-color: #2c2c2c;
}

.header-top .header-info {
  padding-top: 5px;
}

.header-top .header-info ul li {
  display: inline-block;
  margin-left: 30px;
}

@media only screen and (min-width:768px) and (max-width:991px) {
  .header-top .header-info ul li {
    margin: 0 10px;
  }

}

.header-top .header-info ul li:first-child {
  margin-left: 0;
}

.header-top .header-info ul li p {
  font-size: 14px;
  color: #fff;
}

.header-top .header-info ul li p i {
  margin-right: 10px;
}

.header-top .header-info ul li .main-btn {
  line-height: 43px;
}

.header-top .header-social {
  padding-top: 5px;
}

.header-top .header-social ul li {
  display: inline-block;
  margin-right: 20px;
}

.header-top .header-social ul li:last-child {
  margin-right: 0;
}

.header-top .header-social ul li a {
  color: #fff;
  font-size: 16px;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.header-top .header-social ul li a:hover {
  color: #D61728;
}

.navigation.sticky {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  background-color: #fff;
  z-index: 999;
  -webkit-box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.2);
  box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.2);
  -webkit-animation: sticky 2s;
  -moz-animation: sticky 2s;
  -o-animation: sticky 2s;
  animation: sticky 2s;
}

@media only screen and (min-width:768px) and (max-width:991px) {
  .navigation.sticky {
    padding-bottom: 20px;
  }

}

@media (max-width:767px) {
  .navigation.sticky {
    padding-bottom: 20px;
  }

}

.navigation.sticky .logo {
  margin-top: 25px;
}

.navigation.sticky .main-menu .nav-menubar > li > a {
  padding: 24px 0;
  color: #2c2c2c;
}

.navigation.sticky .search-cart {
  padding: 24px 0;
}

@media only screen and (min-width:768px) and (max-width:991px) {
  .navigation.sticky .search-cart {
    padding: 0;
    top: 27px;
  }

}

@media (max-width:767px) {
  .navigation.sticky .search-cart {
    padding: 0;
    top: 27px;
  }

  .header-top {
    display: none;
  }

}

.navigation.sticky .search-cart ul li a {
  color: #2c2c2c;
}

.navigation.sticky .mean-container a.meanmenu-reveal span {
  background-color: #2c2c2c;
}

@keyframes sticky {
  0% {
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    -o-transform: translateY(-100%);
    transform: translateY(-100%);
  }

  100% {
    -webkit-transform: translateY(0%);
    -moz-transform: translateY(0%);
    -ms-transform: translateY(0%);
    -o-transform: translateY(0%);
    transform: translateY(0%);
  }

}

.header-menu .logo {
	margin-top: 30px;
	position: relative;
	display: inline-block;
	z-index: 9999;
}

.header-menu .main-menu .nav-menubar > li {
  margin-left: 30px;
  position: relative;
  display: inline-block;
}

.header-menu .main-menu .nav-menubar > li:first-child {
  margin-left: 0;
}

@media only screen and (min-width:992px) and (max-width:1200px) {
  .header-menu .main-menu .nav-menubar > li {
    margin-left: 20px;
  }

}

.header-menu .main-menu .nav-menubar > li > a {
  font-size: 18px;
  font-family: "Lato", sans-serif;
  color: #fff;
  font-weight: 700;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
  padding: 30px 0;
}

@media only screen and (min-width:992px) and (max-width:1200px) {
  .header-menu .main-menu .nav-menubar > li > a {
    font-size: 16px;
  }

}

.header-menu .main-menu .nav-menubar > li a.active,
.header-menu .main-menu .nav-menubar > li:hover > a {
  color: #D61728;
}

.header-menu .main-menu .nav-menubar > li .sub-menu {
  position: absolute;
  top: 115%;
  left: 0;
  width: 220px;
  background-color: #D61728;
  padding: 5px 20px;
  border-top: 2px solid #fce9ee;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
  z-index: 9;
}

.header-menu .main-menu .nav-menubar > li .sub-menu li {
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
  position: relative;
}

.header-menu .main-menu .nav-menubar > li .sub-menu li:last-child {
  border-bottom: 0;
}

.header-menu .main-menu .nav-menubar > li .sub-menu li a {
  display: block;
  font-size: 16px;
  padding: 9px 0;
  color: #fff;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.header-menu .main-menu .nav-menubar > li .sub-menu li a.active,
.header-menu .main-menu .nav-menubar > li .sub-menu li:hover > a {
  padding-left: 5px;
}

.header-menu .main-menu .nav-menubar > li .sub-menu li .sub-menu {
  left: 111%;
  top: 0;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
  opacity: 0;
  visibility: hidden;
}

.header-menu .main-menu .nav-menubar > li .sub-menu li:hover .sub-menu {
  opacity: 1;
  visibility: visible;
}

.header-menu .main-menu .nav-menubar > li:hover .sub-menu {
  opacity: 1;
  visibility: visible;
  top: 100%;
}

.header-menu .mean-container a.meanmenu-reveal span {
  background-color: #fff;
}

.header-menu .search-cart {
  padding: 31px 0;
}

@media only screen and (min-width:768px) and (max-width:991px) {
  .header-menu .search-cart {
    padding: 0;
    position: absolute;
    right: 60px;
    top: 33px;
    z-index: 9999;
  }

}

@media (max-width:767px) {
  .header-menu .search-cart {
    padding: 0;
    position: absolute;
    right: 55px;
    top: 33px;
    z-index: 9999;
  }

}
.header-menu .search-cart ul {
  margin-right: 10px;
}
.header-menu .search-cart ul li {
  display: inline-block;
  margin-left: 15px;
}

.header-menu .search-cart ul li:first-child {
  margin-left: 0;
}

.header-menu .search-cart ul li a {
  font-size: 18px;
  color: #fff;
}

@media only screen and (min-width:992px) and (max-width:1200px) {
  .header-menu .search-cart ul li a {
    font-size: 16px;
  }

}

.header-menu .search-cart ul li .cart {
  position: relative;
}

.header-menu .search-cart ul li .cart span {
  position: absolute;
  top: -10px;
  right: -10px;
  font-size: 12px;
  background-color: #D61728;
  width: 20px;
  height: 20px;
  line-height: 20px;
  text-align: center;
  border-radius: 50%;
  color: #fff;
}

/*===== SEARCH BOX =====*/
.search-box {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  z-index: 99999;
  display: none;
}

.search-box .search-form .closebtn {
  position: absolute;
  top: 20px;
  right: 50px;
  cursor: pointer;
  width: 30px;
  height: 25px;
}

.search-box .search-form .closebtn span {
  width: 30px;
  height: 2px;
  background-color: #fff;
  position: relative;
  display: block;
}

.search-box .search-form .closebtn span:nth-of-type(1) {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  top: 11px;
}

.search-box .search-form .closebtn span:nth-of-type(2) {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  top: 9px;
}

.search-box .search-form input {
  width: 50%;
  height: 50px;
  position: absolute;
  top: 50%;
  left: 50%;
  background-color: #fff;
  border: 2px solid #D61728;
  color: #D61728;
  padding-left: 20px;
  border-radius: 50px;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

@media (max-width:767px) {
  .search-box .search-form input {
    width: 80%;
  }

}

.search-box .search-form button {
  position: absolute;
  top: 50%;
  left: 72%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  padding: 0;
  border: 0;
  background-color: transparent;
  color: #07294d;
  cursor: pointer;
  font-size: 16px;
}

@media (max-width:767px) {
  .search-box .search-form button {
    left: 84%;
  }

}

/*===== INER PAGE BOX =====*/

/*===========================
    3.SLIDER css 
===========================*/
.slider-area .single-slider {
  padding-top: 200px;
  padding-bottom: 200px;
  position: relative;
}


@media only screen and (min-width:576px) and (max-width:767px) {
    .slider-area .single-slider {
      padding-top: 180px;
    }

}

.slider-area .slider-content {
  background-color: #D61728;
  position: relative;
  z-index: 5;
  overflow: hidden;
  padding: 30px 40px 40px;
  border-radius: 5px;
  -webkit-box-shadow: 0px -5px 20px 0px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0px -5px 20px 0px rgba(0, 0, 0, 0.1);
  box-shadow: 0px -5px 20px 0px rgba(0, 0, 0, 0.1);
}

@media (max-width:767px) {
  .slider-area .slider-content {
    padding: 10px 20px 20px;
  }

}

@media only screen and (min-width:576px) and (max-width:767px) {
  .slider-area .slider-content {
    padding: 20px 30px 30px;
  }

}

.slider-area .slider-content .slider-title {
  font-size: 50px;
  font-weight: 700;
  color: #fff;
}

@media (max-width:767px) {
  .slider-area .slider-content .slider-title {
    font-size: 42px;
  }

}

.slider-area .slider-content p {
  color: #fff;
  font-size: 18px;
}

@media (max-width:767px) {
  .slider-area .slider-content p {
    font-size: 16px;
  }

}

.slider-area .slider-content .main-btn {
  border-color: #fff;
}

.slider-area .slider-content .main-btn:hover {
  border-color: #fff;
}

.slider-active .slick-arrow {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  z-index: 9;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.slider-active .slick-arrow i {
  font-size: 50px;
  color: #fff;
  cursor: pointer;
}

.slider-active .slick-arrow.prev {
  left: 0px;
}

.slider-active .slick-arrow.next {
  right: 0px;
  left: auto;
}

.slider-active:hover .slick-arrow {
  opacity: 1;
  visibility: visible;
  left: 40px;
}

.slider-active:hover .slick-arrow.prev {
  left: 40px;
}

.slider-active:hover .slick-arrow.next {
  right: 40px;
  left: auto;
}

/*===========================
    4.FEATURES css 
===========================*/
.features {
  position: relative;
  z-index: 5;
  margin-top: -130px;
}

.single-features {
  background-color: #fff;
  padding: 30px;
  border-radius: 5px;
  -webkit-box-shadow: 0px -5px 20px 0px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0px -5px 20px 0px rgba(0, 0, 0, 0.1);
  box-shadow: 0px -5px 20px 0px rgba(0, 0, 0, 0.1);
}

@media only screen and (min-width:992px) and (max-width:1200px) {
  .single-features {
    padding: 20px;
  }

}
@media only screen and (min-width:768px) and (max-width:991px) {
  .single-features {
    padding: 15px;
  }

}

.single-features .features-content .features-title {
  font-size: 24px;
  font-weight: 900;
  color: #23282d;
}

@media only screen and (min-width:768px) and (max-width:991px) {
  .single-features .features-content .features-title {
    font-size: 18px;
  }

}

@media only screen and (min-width:768px) and (max-width:991px) {
  .single-features .features-content p {
    font-size: 14px;
  }

}


/*===== FEATURE 3 =====*/
.feature-area-3 {
  position: relative;
}

@media (max-width:767px) {
  .feature-area-3 {
    padding-top: 30px;
    padding-bottom: 90px;
  }

}

.feature-area-3 .feature-bg-3 {
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
}

@media only screen and (min-width:768px) and (max-width:991px) {
  .feature-area-3 .feature-bg-3 {
    width: 100%;
  }

}

@media (max-width:767px) {
  .feature-area-3 .feature-bg-3 {
    width: 100%;
  }

}

.feature-area-3 .feature-bg-3.left {
  left: auto;
  right: 0;
}

.feature-content-3 {
  position: relative;
  z-index: 9;
  padding-right: 60px;
}

@media only screen and (min-width:992px) and (max-width:1200px) {
  .feature-content-3 {
    padding-right: 40px;
  }

}

.feature-content-3 p {
  color: #fff;
}

.feature-content-3 ul li {
  color: #fff;
  position: relative;
  padding-left: 25px;
  margin-top: 20px;
}

.feature-content-3 ul li i {
  position: absolute;
  top: 3px;
  left: 0;
}

/*===========================
    5.ABOUT css 
===========================*/
@media (max-width:767px) {
  .about-area {
    padding-top: 35px;
    padding-bottom: 90px;
  }

}

.about-image {
  padding-right: 40px;
  padding-bottom: 40px;
  position: relative;
}

@media (max-width:767px) {
  .about-image {
    padding-right: 25px;
    padding-bottom: 25px;
  }

}

.about-image img {
  width: 100%;
  position: relative;
  z-index: 5;
}

.about-image::before {
  position: absolute;
  width: 80%;
  height: 80%;
  content: '';
  bottom: 0;
  right: 0;
  background-color: #D61728;
  -webkit-box-shadow: 0px -5px 20px 0px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0px -5px 20px 0px rgba(0, 0, 0, 0.1);
  box-shadow: 0px -5px 20px 0px rgba(0, 0, 0, 0.1);
}

.about-content {
  position: relative;
}

.about-content h5 {
  font-size: 13px;
  font-weight: 700;
}

/*===========================
   8.COMPANY FEATURES css 
===========================*/
.company-features-area {
  background-color: #191919;
  position: relative;
}

.company-features-area .company-bg {
  position: absolute;
  top: 0;
  right: 0;
  width: 50%;
  height: 100%;
}

@media (max-width:767px) {
  .company-features-area {
    padding-top: 30px;
    padding-bottom: 90px;
  }

}

.company-features h2 {
  font-size: 48px;
  font-weight: 900;
  color: #fff;
  padding-right: 70px;
}

@media only screen and (min-width:992px) and (max-width:1200px) {
  .company-features h2 {
    font-size: 30px;
    padding-right: 10px;
  }

}

@media (max-width:767px) {
  .company-features h2 {
    font-size: 30px;
    padding-right: 0px;
  }

}

.company-features > p {
  color: #fff;
  padding-right: 80px;
}

@media only screen and (min-width:992px) and (max-width:1200px) {
  .company-features > p {
    padding-right: 20px;
  }

}

@media (max-width:767px) {
  .company-features > p {
    padding-right: 0px;
  }

}

.company-features .single-company h6 {
  font-size: 24px;
  font-weight: 900;
  color: #fff;
}

@media (max-width:767px) {
  .company-features .single-company h6 {
    font-size: 20px;
  }

}

.company-features .single-company p {
  color: #fff;
}

.company-video {
  position: relative;
  z-index: 9;
}

@media (max-width:767px) {
  .company-video {
    padding-right: 0px;
  }

}

.company-video a {
  width: 100px;
  height: 100%;
  line-height: 100px;
  border-radius: 50%;
  background-color: #D61728;
  text-align: center;
  font-size: 20px;
  color: #fff;
  position: relative;
}

.company-video a::before,
.company-video a::after {
  position: absolute;
  content: '';
  width: 100px;
  height: 100%;
  border-radius: 50%;
  background-color: #D61728;
  left: 0;
  top: 0;
  z-index: -1;
  -webkit-animation: pulse-border 2.5s linear infinite;
  -moz-animation: pulse-border 2.5s linear infinite;
  -o-animation: pulse-border 2.5s linear infinite;
  animation: pulse-border 2.5s linear infinite;
}

.company-video a::after {
  -webkit-animation: pulse-border-2 1.5s linear infinite;
  -moz-animation: pulse-border-2 1.5s linear infinite;
  -o-animation: pulse-border-2 1.5s linear infinite;
  animation: pulse-border-2 1.5s linear infinite;
}

@keyframes pulse-border {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }

  100% {
    -webkit-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -ms-transform: scale(1.3);
    -o-transform: scale(1.3);
    transform: scale(1.3);
    opacity: 0;
  }

}

@keyframes pulse-border-2 {
  0% {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }

  100% {
    -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -ms-transform: scale(1.5);
    -o-transform: scale(1.5);
    transform: scale(1.5);
    opacity: 0;
  }

}

/*===========================
    6.SERVICES css 
===========================*/
.single-services .services-image {
  overflow: hidden;
}

.single-services .services-image a {
  display: block;
}

.single-services .services-image img {
  width: 100%;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.single-services:hover .services-image img {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  transform: scale(1.1);
}

.single-services .services-content .services-title > a {
  font: 24px;
  font-weight: 900;
  color: #23282d;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.single-services .services-content .services-title > a:hover {
  color: #D61728;
}

.single-services .services-content > a {
  font-size: 16px;
  font-weight: 700;
  color: #D61728;
}

/*===========================
   9.TESTINOMIALS css 
===========================*/
@media (max-width:767px) {
  .testimonial-area {
    padding-top: 80px;
    padding-bottom: 90px;
  }

}

.single-testimonial {
  background-color: #f4f7fc;
  padding-left: 60px;
  padding-right: 20px;
  padding-top: 40px;
  padding-bottom: 45px;
  position: relative;
}

@media (max-width:767px) {
  .single-testimonial {
    padding-left: 40px;
    padding-right: 10px;
    padding-top: 30px;
    padding-bottom: 35px;
  }

}

.single-testimonial .quote {
  width: 70px;
  height: 70px;
  background-color: #D61728;
  border-radius: 50%;
  text-align: center;
  position: absolute;
  left: -35px;
  top: 50px;
  padding: 19px 15px;
}

.single-testimonial .author-name .image img {
  border-radius: 50%;
}

.testimonial-active {
  position: relative;
  z-index: 9;
}

.testimonial-active .slick-dots {
  text-align: center;
  margin-top: 35px;
}

.testimonial-active .slick-dots li {
  display: inline-block;
  margin: 0 5px;
}

.testimonial-active .slick-dots li button {
  font-size: 0;
  width: 10px;
  height: 10px;
  background-color: #fff;
  border-radius: 50%;
  border: 0;
  cursor: pointer;
}

.testimonial-active .slick-dots li.slick-active button {
  background-color: #D61728;
}

.single-testimonial-2 {
  position: relative;
  z-index: 9;
}

.single-testimonial-2 img {
  display: inline-block;
}

.single-testimonial-2 p {
  color: #fff;
}

.single-testimonial-2 .testimonial-author .author-image img {
  border-radius: 50%;
}

.single-testimonial-2 .testimonial-author .author-meta {
  text-align: left;
}

.single-testimonial-2 .testimonial-author .author-meta h6 {
  color: #fff;
}

.single-testimonial-2 .testimonial-author .author-meta span {
  color: #fff;
}

/*===========================
   10.CALL TO ACTION css 
===========================*/
.call-to-action {
  position: relative;
}

.call-to-action::before {
  position: absolute;
  content: '';
  background-color: rgba(0, 0, 0, 0.7);
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

@media (max-width:767px) {
  .call-to-action {
    padding-top: 80px;
    padding-bottom: 90px;
  }

}

.action-content {
  padding: 0 60px;
  position: relative;
  z-index: 9;
}

@media only screen and (min-width:992px) and (max-width:1200px) {
  .action-content {
    padding: 0 30px;
  }

}

@media (max-width:767px) {
  .action-content {
    padding: 0;
  }

}

.action-content h2 {
  font-size: 48px;
  font-weight: 900;
  color: #fff;
}

.action-content h2 span {
  color: #D61728;
}

@media only screen and (min-width:992px) and (max-width:1200px) {
  .action-content h2 {
    font-size: 40px;
  }

}

@media only screen and (min-width:768px) and (max-width:991px) {
  .action-content h2 {
    font-size: 46px;
  }

}

@media (max-width:767px) {
  .action-content h2 {
    font-size: 30px;
  }

}

.action-content .main-btn {
  padding: 0 50px;
}

@media (max-width:767px) {
  .call-to-action-2 {
    padding-top: 80px;
    padding-bottom: 90px;
  }

}

.action-content-2 {
  position: relative;
  z-index: 9;
  padding: 0 45px;
}

@media only screen and (min-width:768px) and (max-width:991px) {
  .action-content-2 {
    padding: 0;
  }

}

@media (max-width:767px) {
  .action-content-2 {
    padding: 0;
  }

}

.action-content-2 h2 {
  font-size: 48px;
  color: #fff;
  font-weight: 900;
}

@media only screen and (min-width:768px) and (max-width:991px) {
  .action-content-2 h2 {
    font-size: 38px;
  }

}

@media (max-width:767px) {
  .action-content-2 h2 {
    font-size: 28px;
  }

}

.action-content-2 .main-btn img {
  margin-right: 8px;
}

.action-content-2 .main-btn:hover {
  background-color: transparent;
  color: #fff;
}

/*===========================
   11.TEAM css 
===========================*/
.team-area {
  position: relative;
}

.team-area .team-shape {
  position: absolute;
}

.team-area .tmshape01 {
  right: 12%;
  bottom: 24%;
}

.team-area .tmshape02 {
  left: 8%;
  top: 45%;
}

.team-area .tmshape03 {
  left: 32%;
  bottom: 14%;
}

.team-area .tmshape04 {
  left: 44%;
  bottom: 7%;
  z-index: -1;
}

.team-area .tmshape05 {
  top: 24%;
  right: 14%;
  z-index: -1;
}

@media (max-width:767px) {
  .team-area {
    padding-top: 80px;
    padding-bottom: 90px;
  }

}

.single-team .image {
  position: relative;
}

.single-team .image img {
  width: 100%;
}

.single-team .shape-right::before {
  position: absolute;
  content: '';
  width: 20px;
  height: 100%;
  background-image: url(../images/team/shape-right.png);
  top: 0;
  right: 0;
}

@media (max-width:767px) {
  .single-team .shape-right::before {
    display: none;
  }

}

.single-team .shape-left::before {
  position: absolute;
  content: '';
  width: 20px;
  height: 100%;
  background-image: url(../images/team/shape-left.png);
  top: 0;
  left: 0;
}

@media (max-width:767px) {
  .single-team .shape-left::before {
    display: none;
  }

}

.single-team .content {
  padding-left: 15px;
  padding-right: 15px;
}

.single-team .content h5 {
  font-size: 20px;
  font-weight: 900;
}

.single-team .content span {
  font-size: 14px;
  color: #828282;
  position: relative;
  padding-bottom: 20px;
}

.single-team .content span::before {
  position: absolute;
  content: '';
  width: 35px;
  height: 3px;
  background-color: #D61728;
  left: 50%;
  bottom: 0;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%);
}

.single-team .content ul li {
  display: inline-block;
  margin: 0 5px;
}

.single-team .content ul li a {
  font-size: 16px;
  color: #191919;
}

.single-team-2 {
  position: relative;
  overflow: hidden;
}

.single-team-2 .image a {
  display: block;
}

.single-team-2 .image img {
  width: 100%;
}

.single-team-2 .content {
  width: 75%;
  background-color: #fff;
  position: absolute;
  bottom: 40px;
  left: 50%;
  -webkit-transform: translateX(-50%) translateY(180%);
  -moz-transform: translateX(-50%) translateY(180%);
  -ms-transform: translateX(-50%) translateY(180%);
  -o-transform: translateX(-50%) translateY(180%);
  transform: translateX(-50%) translateY(180%);
  -webkit-transition: all 0.6s linear 0s;
  -moz-transition: all 0.6s linear 0s;
  -ms-transition: all 0.6s linear 0s;
  -o-transition: all 0.6s linear 0s;
  transition: all 0.6s linear 0s;
  padding: 20px 0;
  opacity: 0;
}

.single-team-2 .content a h5 {
  font-size: 20px;
  font-weight: 900;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.single-team-2 .content a h5:hover {
  color: #D61728;
}

.single-team-2 .content span {
  display: block;
  font-size: 14px;
  color: #555;
}

.single-team-2 .content .social li {
  display: inline-block;
  margin: 0 5px;
}

.single-team-2 .content .social li a {
  font-size: 16px;
  color: #8e8e8e;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.single-team-2 .content .social li a:hover {
  color: #D61728;
}

.single-team-2:hover .content {
  -webkit-transform: translateX(-50%) translateY(0%);
  -moz-transform: translateX(-50%) translateY(0%);
  -ms-transform: translateX(-50%) translateY(0%);
  -o-transform: translateX(-50%) translateY(0%);
  transform: translateX(-50%) translateY(0%);
  opacity: 1;
}

@media (max-width:767px) {
  .team-page {
    padding-top: 60px;
    padding-bottom: 90px;
  }

}

/*===========================
   12.QUOTE css 
===========================*/
.requeast-quote {
  position: relative;
}

.requeast-quote::before {
  position: absolute;
  content: '';
  width: 100%;
  height: 100%;
  background: white;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #232655 100%);
  left: 0;
  top: 0;
}

.requeast-quote .quote-shape {
  position: absolute;
}

.requeast-quote .rqshape01 {
  right: 13%;
  bottom: 26%;
}

.requeast-quote .rqshape02 {
  left: 41%;
  top: 17%;
}

.requeast-quote .rqshape03 {
  left: 48%;
  bottom: 25%;
}

.requeast-quote .section-title h2 {
  color: #fff;
}

@media (max-width:767px) {
  .requeast-quote {
    padding-top: 80px;
    padding-bottom: 90px;
  }

}

.requeast-form .single-form {
  margin-top: 30px;
}

.requeast-form .single-form input,
.requeast-form .single-form textarea {
  width: 100%;
  height: 50px;
  padding: 0 20px;
  border: 0;
  background-color: #fff;
  font-size: 16px;
}

.requeast-form .single-form input::placeholder,
.requeast-form .single-form textarea::placeholder {
  color: #23282d;
}

.requeast-form .single-form textarea {
  height: 110px;
  padding-top: 15px;
  resize: none;
}

/*===========================
   13.NEWS css 
===========================*/
@media (max-width:767px) {
  .news-area {
    padding-top: 80px;
    padding-bottom: 90px;
  }

}

.single-news {
  background-color: #fff;
}

.single-news .news-image a {
  display: block;
}

.single-news .news-image a img {
  width: 100%;
}

.single-news .news-content {
  padding-right: 10px;
}

@media (max-width:767px) {
  .single-news .news-content {
    padding: 0;
  }

}

@media (max-width:767px) {
  .single-news .news-content {
    padding: 15px 20px 20px;
  }

}

.single-news .news-content .news-title a {
  font-size: 24px;
  color: #23282d;
  font-weight: 900;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

@media only screen and (min-width:992px) and (max-width:1200px) {
  .single-news .news-content .news-title a {
    font-size: 20px;
  }

}

@media (max-width:767px) {
  .single-news .news-content .news-title a {
    font-size: 20px;
  }

}

.single-news .news-content .news-title a:hover {
  color: #D61728;
}

.single-news .news-content ul li {
  display: inline-block;
  margin-right: 20px;
}

.single-news .news-content ul li:last-child {
  margin-right: 0;
}

.single-news .news-content ul li a {
  font-size: 14px;
  color: #adadad;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.single-news .news-content ul li a i {
  color: #D61728;
  margin-right: 5px;
}

.single-news .news-content ul li a:hover {
  color: #D61728;
}

/*===========================
   14.PARTNER LOGO css 
===========================*/

/*===========================
   15.FOOTER css 
===========================*/
.footer-widgets {
  background-color: #191919;
}

.footer-widgets .footer-about {
  padding-right: 100px;
}

@media only screen and (min-width:992px) and (max-width:1200px) {
  .footer-widgets .footer-about {
    padding-right: 40px;
  }

}

@media only screen and (min-width:768px) and (max-width:991px) {
  .footer-widgets .footer-about {
    padding-right: 30px;
  }

}

@media (max-width:767px) {
  .footer-widgets .footer-about {
    padding-right: 0px;
  }

}

@media only screen and (min-width:576px) and (max-width:767px) {
  .footer-widgets .footer-about {
    padding-right: 20px;
  }

}

.footer-widgets .footer-about p {
  color: #f5f5f5;
}

.footer-widgets .footer-about .social li {
  display: inline-block;
  margin-right: 15px;
}

.footer-widgets .footer-about .social li:last-child {
  margin-right: 0;
}

.footer-widgets .footer-about .social li a {
  width: 35px;
  line-height: 35px;
  border-radius: 50%;
  background-color: #D61728;
  text-align: center;
  color: #fff;
  font-size: 16px;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.footer-widgets .footer-about .social li a:hover {
  color: #D61728;
  background-color: #fff;
}

.footer-widgets .footer-title h5 {
  color: #fff;
  font-size: 18px;
  font-weight: 900;
}

.footer-widgets .footer-link ul li {
  line-height: 35px;
}

.footer-widgets .footer-link ul li a {
  font-size: 14px;
  color: #f5f5f5;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.footer-widgets .footer-link ul li a i {
  color: #D61728;
  margin-right: 8px;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.footer-widgets .footer-link ul li a:hover {
  color: #D61728;
}

.footer-widgets .footer-link ul li a:hover i {
  margin-right: 11px;
}

.footer-widgets .footer-info ul li {
  margin-top: 10px;
}

.footer-widgets .footer-info ul li .single-info {
  position: relative;
}

.footer-widgets .footer-info ul li .single-info .icon {
  position: absolute;
  top: 0;
  left: 0;
}

.footer-widgets .footer-info ul li .single-info .icon i {
  color: #D61728;
  font-size: 18px;
}

.footer-widgets .footer-info ul li .single-info .content p {
  font-size: 14px;
  color: #f5f5f5;
}

.footer-copyright {
  background-color: #1d1d1d;
}

.footer-copyright .copyright p {
  color: #f5f5f5;
  font-size: 14px;
}

.footer-copyright .copyright p a {
  color: #f5f5f5;
  font-weight: 700;
  margin-left: 3px;
}

.back-to-top {
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 40px;
  height: 40px;
  line-height: 35px;
  text-align: center;
  background-color: #D61728;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
  color: #fff;
  font-size: 24px;
  z-index: 99;
  display: none;
}

.back-to-top:hover {
  color: #fff;
  background-color: #191919;
}

/*===========================
   16.PAGE BANNER css 
===========================*/
.page-banner {
  padding-top: 250px;
}

.page-banner .page-content {
  position: relative;
  z-index: 5;
}

.page-banner .page-content h3 {
  font-size: 48px;
  font-weight: 900;
  color: #fff;
}

@media (max-width:767px) {
  .page-banner .page-content h3 {
    font-size: 36px;
  }

}

@media (max-width:991px) {
  .page-banner {
    padding-top: 155px;
    padding-bottom: 75px;
  }

}

.breadcrumb-area {
  background-color: #f4f7fc;
}

.breadcrumb-area .breadcrumb {
  margin: 0;
  padding: 0;
  background: none;
}

.breadcrumb-area .breadcrumb .breadcrumb-item {
  color: #555;
}

.breadcrumb-area .breadcrumb .breadcrumb-item a {
  color: #555;
}

.breadcrumb-area .breadcrumb .breadcrumb-item.active {
  color: #D61728;
}

.breadcrumb-area .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
  content: "\f105";
  color: #555;
  font-family: FontAwesome;
}

/*===========================
   17.ABOUT PAGE css 
===========================*/
@media (max-width:767px) {
  .about-page {
    padding-top: 40px;
    padding-bottom: 90px;
  }

}

@media (max-width:767px) {
  .who-we-are {
    padding-top: 40px;
  }

}

.main-who-we {
  background-color: #191919;
  padding: 40px 50px;
  margin-right: 35px;
}

@media only screen and (min-width:768px) and (max-width:991px) {
  .main-who-we {
    margin-right: 0px;
  }

}

@media (max-width:767px) {
  .main-who-we {
    margin-right: 0px;
    padding: 20px 30px;
  }

}

.main-who-we h3 {
  color: #fff;
  font-size: 30px;
}

.main-who-we p {
  color: #fff;
}

.main-who-we ul li {
  color: #fff;
  position: relative;
  padding-left: 25px;
  margin-top: 20px;
}

.main-who-we ul li i {
  position: absolute;
  top: 3px;
  left: 0;
}

.single-who .content h4 {
  color: #23282d;
  font-size: 24px;
}

.about-feature {
  position: relative;
}

.about-feature .feature-bg {
  position: absolute;
  top: 0;
  right: 0;
  width: 48%;
  height: 100%;
}

@media (max-width:767px) {
  .about-feature {
    padding-top: 80px;
    padding-bottom: 90px;
  }

}

.single-about-feature .content {
  padding-top: 25px;
}

.single-about-feature .content h6 {
  font-size: 24px;
  font-weight: 900;
  color: #23282d;
}

@media (max-width:767px) {
  .single-about-feature .content {
    padding-left: 0;
    padding-top: 25px;
  }

}

.about-feature-video {
  position: relative;
  z-index: 9;
}

.about-feature-video a {
  width: 100px;
  height: 100px;
  line-height: 100px;
  text-align: center;
  border-radius: 50%;
  background-color: #D61728;
  font-size: 24px;
  color: #fff;
  position: relative;
}

.about-feature-video a::before {
  position: absolute;
  content: '';
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background-color: #D61728;
  top: 0;
  left: 0;
  z-index: -1;
  -webkit-animation: pulse-border 2.5s linear infinite;
  -moz-animation: pulse-border 2.5s linear infinite;
  -o-animation: pulse-border 2.5s linear infinite;
  animation: pulse-border 2.5s linear infinite;
}

/*===== ABOUT 2 =====*/
.about-2 h3 {
  font-size: 36px;
  font-weight: 900;
}

@media (max-width:767px) {
  .about-2 h3 {
    font-size: 30px;
  }

}

.about-2 img {
  width: 100%;
}

.single-about-2 h5 {
  font-size: 24px;
  font-weight: 900;
}

@media (max-width:767px) {
  .about-feature-2 {
    padding-top: 40px;
    padding-bottom: 90px;
  }

}

.single-about-feature-2 .image img {
  width: 100%;
}

.single-about-feature-2 .content h5 {
  font-size: 24px;
  font-weight: 900;
}

/*===== ABOUT 3 =====*/
@media (max-width:767px) {
  .about-page-3 {
    padding-top: 60px;
    padding-bottom: 90px;
  }

}

.about-items-3 img {
  width: 100%;
}

.about-items-3 h3 {
  font-size: 36px;
  font-weight: 900;
  padding-right: 10px;
}

@media (max-width:767px) {
  .about-items-3 h3 {
    font-size: 30px;
  }

}

.about-items-3 .bold {
  font-weight: 700;
  font-style: italic;
}

.about-items-3 .signature img {
  width: auto;
}

.about-feature-3 {
  border: 1px solid #eceff8;
  padding: 30px;
  position: relative;
}

@media only screen and (min-width:768px) and (max-width:1200px) {
  .about-feature-3 {
    padding: 20px;
  }

}

.about-feature-3 .feature-icon {
  position: absolute;
  top: 30px;
  left: 30px;
}

@media only screen and (min-width:768px) and (max-width:1200px) {
  .about-feature-3 .feature-icon {
    position: relative;
    top: 0;
    left: 0;
  }

}

@media (max-width:767px) {
  .about-feature-3 .feature-icon {
    position: relative;
    top: 0;
    left: 0;
  }

}

@media only screen and (min-width:768px) and (max-width:1200px) {
  .about-feature-3 .feature-icon img{
    width: 50px;
  }

}

@media only screen and (min-width:576px) and (max-width:767px) {
  .about-feature-3 .feature-icon {
    position: absolute;
    top: 30px;
    left: 30px;
  }

}

@media only screen and (min-width:768px) and (max-width:1200px) {
  .about-feature-3 .about-content {
    padding-left: 0;
    padding-top: 25px;
  }

}

@media (max-width:767px) {
  .about-feature-3 .about-content {
    padding-left: 0;
    padding-top: 25px;
  }

}

@media only screen and (min-width:576px) and (max-width:767px) {
  .about-feature-3 .about-content {
    padding-left: 80px;
    padding-top: 0px;
  }

}

.about-feature-3 .about-content h4 {
  color: #23282d;
  font-size: 24px;
  font-weight: 900;
}

@media only screen and (min-width:768px) and (max-width:1200px) {
  .about-feature-3 .about-content h4 {
    font-size: 20px;
  }

}
@media only screen and (min-width:768px) and (max-width:1200px) {
  .about-feature-3 .about-content p {
    font-size: 14px;
  }

}

@media (max-width:767px) {
  .about-feature-3 .about-content h4 {
    font-size: 20px;
  }

}

/*===========================
       18.COUNTER css 
============================*/
.single-counter {
  position: relative;
  z-index: 9;
}

.single-counter span {
  color: #fff;
  font-size: 36px;
  font-family: "Lato", sans-serif;
  font-weight: 900;
}

.single-counter p {
  color: #fff;
}

.single-counter::after {
  position: absolute;
  content: '';
  width: 1px;
  height: 100%;
  background-color: #fff;
  left: 0;
}

@media (max-width:767px) {
  .single-counter::after {
    display: none;
  }

}

@media only screen and (min-width:576px) and (max-width:767px) {
  .single-counter::after {
    display: block;
  }

}

.single-counter.none::after {
  display: none;
}


@media only screen and (min-width:576px) and (max-width:767px) {
  .single-counter.none-2::after {
    display: none;
  }

}

@media (max-width:767px) {
  .counter-area-2 {
    padding-top: 20px;
    padding-bottom: 80px;
  }

}

.single-counter-2 span {
  font-size: 36px;
  font-weight: 900;
  color: #D61728;
}

/*===========================
       19.SERVICES css 
============================*/
@media (max-width:767px) {
  .services-page {
    padding-top: 30px;
    padding-bottom: 85px;
  }

}

.single-services-page .image > a {
  display: block;
}

.single-services-page .image img {
  width: 100%;
}

.single-services-page .content .services-title > a {
  color: #23282d;
  font-size: 24px;
  font-weight: 900;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.single-services-page .content .services-title > a:hover {
  color: #D61728;
}

.single-services-page .content > a {
  font-size: 14px;
  font-weight: 700;
  color: #D61728;
  line-height: 43px;
}

/*===== SERVICES 2 =====*/
.services-category ul li {
  margin-bottom: 5px;
}

.services-category ul li a {
  line-height: 50px;
  padding: 0 35px;
  background-color: #f4f7fc;
  display: block;
  font-size: 14px;
  color: #23282d;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.services-category ul li a i {
  margin-right: 10px;
}

.services-category ul li:hover a {
  color: #D61728;
}

.services-contact {
  background-color: #D61728;
  position: relative;
  overflow: hidden;
}

@media only screen and (min-width:992px) and (max-width:1200px) {
  .services-contact {
    padding-top: 70px;
    padding-bottom: 70px;
  }

}

@media only screen and (min-width:768px) and (max-width:991px) {
  .services-contact {
    padding-top: 70px;
    padding-bottom: 70px;
  }

}

@media (max-width:767px) {
  .services-contact {
    padding-top: 70px;
    padding-bottom: 70px;
  }

}

.services-contact::before {
  position: absolute;
  content: '';
  background-image: url("../images/services/contact-bg.png");
  background-size: contain;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  top: -105px;
  right: -65px;
  opacity: 0.05;
}

.services-contact img {
  position: relative;
  z-index: 9;
}

.services-contact h6 {
  font-size: 18px;
  color: #fff;
  position: relative;
  z-index: 9;
}

.services-contact > a {
  font-size: 30px;
  color: #fff;
  position: relative;
  z-index: 9;
}

/*===========================
       20.SERVICES css 
============================*/
@media (max-width:767px) {
  .services-page {
    padding-top: 30px;
    padding-bottom: 85px;
  }

}

.services-details-image img {
  width: 100%;
}

.services-details-content h3 {
  font-size: 36px;
  font-weight: 900;
  color: #23282d;
}

@media (max-width:767px) {
  .services-details-content h3 {
    font-size: 30px;
  }

}

.services-faq-image img {
  width: 100%;
}

.services-faq-content .card {
  border: 0;
  border-radius: 0;
  margin-bottom: 10px;
  background: none;
}

.services-faq-content .card .card-header {
  border-radius: 0;
  padding: 0 30px;
  line-height: 45px;
  border: 1px solid #eceff8;
  background: none;
  margin-bottom: 0;
}

.services-faq-content .card .card-header a {
  font-size: 16px;
  font-weight: 700;
  font-family: "Lato", sans-serif;
  color: #23282d;
  display: block;
  position: relative;
}

.services-faq-content .card .card-header a::before,
.services-faq-content .card .card-header a::after {
  position: absolute;
  content: "";
  width: 10px;
  height: 2px;
  background: #23282d;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
  right: 0;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.services-faq-content .card .card-header a.collapsed::after,
.services-faq-content .card .card-header a::after {
  width: 2px;
  height: 10px;
  right: 4px;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.services-faq-content .card .card-header a::after {
  height: 0;
}

.services-faq-content .card .card-body {
  padding: 25px 0 10px;
}

/*===========================
      21.BLOG PAGE css 
============================*/
.single-blog .blog-thum {
  overflow: hidden;
}

.single-blog .blog-thum img {
  width: 100%;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.single-blog .blog-thum:hover img {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
  transform: scale(1.1);
}

.single-blog .blog-content ul li {
  display: inline-block;
  margin-right: 20px;
}

.single-blog .blog-content ul li:last-child {
  margin-right: 0;
}

.single-blog .blog-content ul li a {
  font-size: 14px;
  color: #adadad;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.single-blog .blog-content ul li a i {
  color: #D61728;
  margin-right: 5px;
}

.single-blog .blog-content ul li a:hover {
  color: #D61728;
}

.single-blog .blog-content .blog-title a {
  font-size: 36px;
  font-weight: 900;
  color: #23282d;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.single-blog .blog-content .blog-title a:hover {
  color: #D61728;
}

@media (max-width:767px) {
  .single-blog .blog-content .blog-title a {
    font-size: 30px;
  }

}

.pagination-area .pagination .page-item {
  margin-left: 10px;
}

.pagination-area .pagination .page-item:first-child {
  margin-left: 0;
}

.pagination-area .pagination .page-item a {
  width: 40px;
  height: 40px;
  line-height: 38px;
  text-align: center;
  border-radius: 5px;
  color: #23282d;
  border: 1px solid #eceff8;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.pagination-area .pagination .page-item a.active,
.pagination-area .pagination .page-item a:hover {
  background-color: #D61728;
  color: #fff;
  border-color: #D61728;
}

@media (max-width:767px) {
  .blog-sidebar-right {
    padding: 30px 25px;
  }

}

.blog-sidebar-right .title h4 {
  font-size: 24px;
  color: #23282d;
  font-weight: 900;
}

.blgo-search {
  padding: 30px;
  background-color: #f4f7fc;
}

.blgo-search form {
  position: relative;
}

.blgo-search form input {
  width: 100%;
  height: 50px;
  padding: 0 15px;
  border: 0;
  background-color: #fff;
}

.blgo-search form button {
  padding: 0;
  height: 50px;
  line-height: 50px;
  width: 45px;
  text-align: center;
  background-color: #2c2c2c;
  color: #fff;
  border: 0;
  position: absolute;
  top: 0;
  right: 0;
  cursor: pointer;
}

.blog-categories {
  padding: 25px 30px 20px;
  background-color: #f4f7fc;
}

.blog-categories ul li {
  line-height: 30px;
}

.blog-categories ul li a {
  font-size: 14px;
  color: #555;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.blog-categories ul li a:hover {
  color: #D61728;
}

.blog-mini-post {
  padding: 25px 30px;
  background-color: #f4f7fc;
}

.blog-mini-post .mini-post {
  position: relative;
}

.blog-mini-post .mini-post .thum {
  max-width: 90px;
  position: absolute;
  top: 0;
  left: 0;
}

.blog-mini-post .mini-post .thum a img {
  width: 100%;
}

.blog-mini-post .mini-post .cont {
  padding-left: 110px;
  min-height: 95px;
}

.blog-mini-post .mini-post .cont h5 a {
  font-weight: 700;
  font-size: 18px;
  color: #23282d;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.blog-mini-post .mini-post .cont h5 a:hover {
  color: #D61728;
}

@media only screen and (min-width:992px) and (max-width:1200px) {
  .blog-mini-post .mini-post .cont h5 a {
    font-size: 16px;
  }

}

@media (max-width:767px) {
  .blog-mini-post .mini-post .cont h5 a {
    font-size: 16px;
  }

}

@media only screen and (min-width:576px) and (max-width:767px) {
  .blog-mini-post .mini-post .cont h5 a {
    font-size: 18px;
  }

}

.blog-mini-post .mini-post .cont span {
  font-size: 14px;
  color: #555;
}

@media (max-width:767px) {
  .blog-page {
    padding-top: 30px;
    padding-bottom: 90px;
  }

}

/*===========================
   22.BLOG DETAILS PAGE css 
============================*/
.blog-details .details-image img {
  width: 100%;
}

.blog-details .details-content ul li {
  display: inline-block;
  margin-right: 20px;
}

.blog-details .details-content ul li:last-child {
  margin-right: 0;
}

.blog-details .details-content ul li a {
  font-size: 14px;
  color: #adadad;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.blog-details .details-content ul li a i {
  color: #D61728;
  margin-right: 5px;
}

.blog-details .details-content ul li a:hover {
  color: #D61728;
}

.blog-details .details-content .blog-details-title {
  font-size: 36px;
  font-weight: 900;
  color: #23282d;
}

@media (max-width:767px) {
  .blog-details .details-content .blog-details-title {
    font-size: 30px;
  }

}

.blog-details .details-content .blockquote {
  border-left: 5px solid #D61728;
  padding: 20px 15px;
  background-color: #f4f7fc;
  margin-bottom: 0;
}

.blog-details .details-content .blockquote p {
  font-weight: 600;
  font-style: italic;
}

.blog-details .blog-tag-share {
  border-bottom: 1px solid #eceff8;
}

.blog-details .blog-tag-share .blog-tag {
  float: left;
}

@media (max-width:767px) {
  .blog-details .blog-tag-share .blog-tag {
    float: none;
  }

}

.blog-details .blog-tag-share .blog-tag .title {
  float: left;
}

.blog-details .blog-tag-share .blog-tag .title h6 {
  font-size: 18px;
  font-weight: 600;
  color: #23282d;
}

@media (max-width:767px) {
  .blog-details .blog-tag-share .blog-tag .title h6 {
    font-size: 16px;
  }

}

.blog-details .blog-tag-share .blog-tag .tag {
  float: left;
}

.blog-details .blog-tag-share .blog-tag .tag ul li {
  display: inline-block;
  margin-left: 10px;
}

.blog-details .blog-tag-share .blog-tag .tag ul li a {
  font-size: 14px;
  color: #D61728;
  color: #adadad;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.blog-details .blog-tag-share .blog-tag .tag ul li a:hover {
  color: #D61728;
}

.blog-details .blog-tag-share .share {
  float: right;
}

@media (max-width:767px) {
  .blog-details .blog-tag-share .share {
    float: none;
  }

}

.blog-details .blog-tag-share .share .title {
  float: left;
  margin-top: 5px;
  margin-right: 10px;
}

.blog-details .blog-tag-share .share .title h6 {
  font-size: 18px;
  font-weight: 600;
  color: #23282d;
}

@media (max-width:767px) {
  .blog-details .blog-tag-share .share .title h6 {
    font-size: 16px;
  }

}

.blog-details .blog-tag-share .share .social {
  float: left;
}

.blog-details .blog-tag-share .share .social ul li {
  display: inline-block;
  margin-left: 6px;
}

.blog-details .blog-tag-share .share .social ul li a {
  font-size: 16px;
  color: #D61728;
  width: 35px;
  line-height: 33px;
  border-radius: 50%;
  border: 1px solid #D61728;
  text-align: center;
  display: block;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.blog-details .blog-tag-share .share .social ul li a:hover {
  background-color: #D61728;
  color: #fff;
}

.blog-details .blog-title h4 {
  font-size: 24px;
  font-weight: 900;
  color: #23282d;
}

.blog-details .blog-comment .single-comment {
  position: relative;
}

.blog-details .blog-comment .single-comment .comment-image {
  position: absolute;
  top: 0;
  left: 0;
}

.blog-details .blog-comment .single-comment .comment-image img {
  border-radius: 50%;
}

@media (max-width:767px) {
  .blog-details .blog-comment .single-comment .comment-image {
    position: relative;
    padding-bottom: 25px;
  }

}

.blog-details .blog-comment .single-comment .comment-content {
  padding-left: 100px;
}

@media (max-width:767px) {
  .blog-details .blog-comment .single-comment .comment-content {
    padding-left: 0;
  }

}

.blog-details .blog-comment .single-comment .comment-content h6 {
  font-size: 18px;
  font-weight: 700;
  padding-bottom: 5px;
  color: #23282d;
}

.blog-details .blog-comment .single-comment .comment-content a {
  font-size: 16px;
  font-weight: 900;
  color: #23282d;
  margin-top: 10px;
}

.blog-details .blog-comment .replay {
  padding-left: 100px;
}

@media (max-width:767px) {
  .blog-details .blog-comment .replay {
    padding-left: 0;
  }

}

@media only screen and (min-width:576px) and (max-width:767px) {
  .blog-details .blog-comment .replay {
    padding-left: 100px;
  }

}

.blog-details .blog-comment-form .single-comment {
  margin-top: 20px;
}

.blog-details .blog-comment-form .single-comment input,
.blog-details .blog-comment-form .single-comment textarea {
  width: 100%;
  height: 60px;
  padding: 0 25px;
  border: 1px solid #cbcbcb;
}

.blog-details .blog-comment-form .single-comment textarea {
  height: 120px;
  padding-top: 15px;
  resize: none;
}

@media (max-width:767px) {
  .blog-page {
    padding-top: 30px;
    padding-bottom: 90px;
  }

}

/*===========================
   23. PRICING PAGE css 
============================*/
.single-pricimg {
  -webkit-box-shadow: 0px 0px 139px 0px rgba(0, 0, 0, 0.09);
  -moz-box-shadow: 0px 0px 139px 0px rgba(0, 0, 0, 0.09);
  box-shadow: 0px 0px 139px 0px rgba(0, 0, 0, 0.09);
  background-color: #fff;
}

@media only screen and (min-width:768px) and (max-width:991px) {
  .single-pricimg {
    padding-top: 55px;
    padding-bottom: 60px;
    padding-left: 20px;
    padding-right: 20px;
  }

}

@media (max-width:767px) {
  .single-pricimg {
    padding-top: 55px;
    padding-bottom: 60px;
    padding-left: 20px;
    padding-right: 20px;
  }

}

.single-pricimg.active {
  position: relative;
  z-index: 9;
}

@media only screen and (min-width:768px) and (max-width:991px) {
  .single-pricimg.active {
    z-index: auto;
  }

}

.single-pricimg h5 {
  font-size: 18px;
  font-weight: 900;
  color: #23282d;
  text-transform: uppercase;
}

.single-pricimg h2 {
  font-size: 48px;
  font-weight: 900;
  color: #D61728;
}

.single-pricimg h2 span {
  font-size: 14px;
  font-weight: 400;
}

.single-pricimg ul li {
  font-size: 14px;
  color: #555;
  line-height: 40px;
}

@media (max-width:767px) {
  .pricing-page {
    padding-top: 40px;
    padding-bottom: 90px;
  }

}

/*===========================
   24.SHOP PAGE css 
============================*/
.shop-menu .nav .nav-item {
  margin-right: 10px;
}

.shop-menu .nav .nav-item:last-child {
  margin-right: 0;
}

.shop-menu .nav .nav-item a {
  font-size: 15px;
  color: #555;
}

.shop-menu .nav .nav-item a.active {
  color: #D61728;
}

.shop-menu .nav .nav-item span {
  font-size: 15px;
  color: #555;
}

.shop-select .nice-select {
  height: 35px;
  line-height: 35px;
  width: 130px;
  float: right;
  padding: 0 20px;
  border-radius: 0;
  border-color: #cbcbcb;
}

@media (max-width:767px) {
  .shop-select .nice-select {
    float: left;
    margin-top: 25px;
  }

}

@media only screen and (min-width:576px) and (max-width:767px) {
  .shop-select .nice-select {
    float: right;
    margin-top: 0;
  }

}

.shop-select .nice-select .current {
  font-size: 15px;
  color: #555;
}

.shop-select .nice-select .list {
  width: 100%;
  margin-top: 0;
  border-radius: 0;
}

.shop-select .nice-select:focus {
  border-color: #cbcbcb;
}

.shop-select .nice-select::after {
  border-bottom: 2px solid #555;
  border-right: 2px solid #555;
  width: 7px;
  height: 7px;
  right: 20px;
}

.single-shop .shop-image {
  position: relative;
  overflow: hidden;
}

.single-shop .shop-image .product-icon {
  font-size: 14px;
  color: #fff;
  width: 40px;
  line-height: 40px;
  border-radius: 50%;
  background-color: #f9b522;
  text-align: center;
  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 9;
  -webkit-transform: rotate(40deg);
  -moz-transform: rotate(40deg);
  -ms-transform: rotate(40deg);
  -o-transform: rotate(40deg);
  transform: rotate(40deg);
}

.single-shop .shop-image img {
  width: 100%;
}

.single-shop .shop-image .shop-hover {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  opacity: 0;
  visibility: hidden;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.single-shop .shop-image .shop-hover ul {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.single-shop .shop-image .shop-hover ul > li {
  display: inline-block;
  margin: 0 5px;
}

.single-shop .shop-image .shop-hover ul > li > a {
  width: 40px;
  line-height: 38px;
  text-align: center;
  color: #fff;
  border: 1px solid #fff;
  font-size: 16px;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.single-shop .shop-image .shop-hover ul > li > a:hover {
  border-color: #D61728;
  background-color: #D61728;
}

.single-shop .shop-image > a {
  display: block;
  font-size: 14px;
  font-weight: 900;
  color: #fff;
  background-color: #D61728;
  text-align: center;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  line-height: 60px;
  -webkit-transform: translateY(100%);
  -moz-transform: translateY(100%);
  -ms-transform: translateY(100%);
  -o-transform: translateY(100%);
  transform: translateY(100%);
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.single-shop .shop-image > a > i {
  font-size: 16px;
  padding-right: 10px;
}

.single-shop:hover .shop-image a {
  -webkit-transform: translate(0%);
  -moz-transform: translate(0%);
  -ms-transform: translate(0%);
  -o-transform: translate(0%);
  transform: translate(0%);
}

.single-shop:hover .shop-hover {
  opacity: 1;
  visibility: visible;
}

.single-shop .shop-content .title-shop {
  padding-bottom: 5px;
}

.single-shop .shop-content .title-shop a {
  font-weight: 900;
  font-size: 18px;
  color: #23282d;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.single-shop .shop-content .title-shop a:hover {
  color: #D61728;
}

.single-shop .shop-content ul li {
  display: inline-block;
  margin: 0 3px;
}

.single-shop .shop-content ul li del {
  font-size: 13px;
  color: #555;
}

.single-shop .shop-content ul li span {
  color: #555;
  font-size: 16px;
  font-weight: 600;
}

.single-shop .shop-content > a > i {
  font-size: 16px;
  padding-right: 10px;
}

.shop-modal .modal .modal-dialog {
  max-width: 768px;
}

@media only screen and (min-width:768px) and (max-width:991px) {
  .shop-modal .modal .modal-dialog {
    max-width: 676px;
  }

}

@media only screen and (min-width:576px) and (max-width:767px) {
  .shop-modal .modal .modal-dialog {
    max-width: 400px;
  }

}

@media (max-width:767px) {
  .shop-modal .modal .modal-dialog {
    max-width: 85%;
    margin: auto;
  }

}

.shop-modal .modal .modal-dialog .modal-content .modal-body {
  padding: 0;
  padding-bottom: 30px;
}

@media only screen and (min-width:768px) and (max-width:991px) {
  .shop-modal .modal .modal-dialog .modal-content .modal-body {
    padding-bottom: 15px;
    padding-left: 15px;
    padding-right: 15px;
    margin-top: -15px;
  }

}

@media (max-width:767px) {
  .shop-modal .modal .modal-dialog .modal-content .modal-body {
    padding-bottom: 15px;
    padding-left: 15px;
    padding-right: 15px;
    margin-top: -15px;
  }

}

@media (max-width:767px) {
  .shop-page {
    padding-top: 30px;
    padding-bottom: 90px;
  }

}

/*===========================
  25.SHOP DETAILS PAGE css 
============================*/
.shop-left .shop-image a {
  display: block;
}

.shop-left .shop-image a img {
  width: 100%;
}

.shop-left .nav .nav-item {
  margin-right: 25px;
}

@media (max-width:767px) {
  .shop-left .nav .nav-item {
    margin-right: 15px;
  }

}

.shop-left .nav .nav-item:last-child {
  margin-right: 0;
}

.shop-left .nav .nav-item a {
  display: block;
}

.shop-left .nav .nav-item a .shop-thum img {
  width: 100%;
}

.shop-right .shop-title {
  font-weight: 900;
  font-size: 24px;
  color: #23282d;
  padding-bottom: 5px;
}

.shop-right .price {
  font-size: 18px;
  color: #555;
}

.shop-right .rating li {
  display: inline-block;
  font-size: 16px;
  color: #f9b522;
}

.shop-right .rating li span {
  color: #555;
  margin-left: 10px;
  font-size: 15px;
}

.shop-right .nice-number,
.shop-right .add-btn {
  display: inline-block;
}

.shop-right .nice-number {
  position: relative;
}

.shop-right .nice-number input {
  width: 50px !important;
  height: 40px;
  border-radius: 5px;
  border: 2px solid #eceff8;
  padding-right: 20px;
}

.shop-right .nice-number button {
  position: absolute;
  width: 25px;
  padding: 0;
  right: 2px;
  top: 2px;
  border: 0;
  border-top-right-radius: 5px;
  background: none;
  cursor: pointer;
}

.shop-right .nice-number button:last-child {
  top: auto;
  bottom: 2px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 5px;
}

.shop-right .shop-tag li {
  font-size: 14px;
  color: #555;
  line-height: 30px;
}

.shop-right .shop-tag li a {
  color: #D61728;
  margin-left: 5px;
}

.shop-reviews .nav {
  border-bottom: 1px solid #eceff8;
}

.shop-reviews .nav .nav-item a {
  padding: 0 40px;
  line-height: 50px;
  color: #555;
  font-size: 14px;
  font-weight: 900;
  font-family: "Lato", sans-serif;
  position: relative;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

@media (max-width:767px) {
  .shop-reviews .nav .nav-item a {
    padding: 0 35px;
  }

}

.shop-reviews .nav .nav-item a::before {
  position: absolute;
  content: '';
  width: 100%;
  height: 2px;
  background-color: #D61728;
  left: 0;
  bottom: 0;
  opacity: 0;
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
}

.shop-reviews .nav .nav-item a.active {
  -webkit-transition: all 0.4s linear 0s;
  -moz-transition: all 0.4s linear 0s;
  -ms-transition: all 0.4s linear 0s;
  -o-transition: all 0.4s linear 0s;
  transition: all 0.4s linear 0s;
  color: #D61728;
}

.shop-reviews .nav .nav-item a.active::before {
  opacity: 1;
}

.shop-reviews .tab-content .reviews-content .reviews-comment ul li {
  margin-top: 30px;
}

.shop-reviews .tab-content .reviews-content .reviews-comment ul li .single-reviews {
  position: relative;
}

.shop-reviews .tab-content .reviews-content .reviews-comment ul li .single-reviews .reviews-thumb {
  position: absolute;
  left: 0;
  top: 0;
}

.shop-reviews .tab-content .reviews-content .reviews-comment ul li .single-reviews .reviews-thumb img {
  border-radius: 50%;
}

@media (max-width:767px) {
  .shop-reviews .tab-content .reviews-content .reviews-comment ul li .single-reviews .reviews-thumb {
    position: relative;
  }

}

.shop-reviews .tab-content .reviews-content .reviews-comment ul li .single-reviews .reviews-content {
  padding-left: 100px;
}

@media (max-width:767px) {
  .shop-reviews .tab-content .reviews-content .reviews-comment ul li .single-reviews .reviews-content {
    padding-left: 0;
    padding-top: 25px;
  }

}

.shop-reviews .tab-content .reviews-content .reviews-comment ul li .single-reviews .reviews-content .reviews-title {
  font-size: 18px;
  font-weight: 700;
  color: #23282d;
}

.shop-reviews .tab-content .reviews-content .reviews-comment ul li .single-reviews .reviews-content span {
  font-size: 14px;
  color: #555;
}

.shop-reviews .tab-content .reviews-content .reviews-comment ul li .single-reviews .reviews-content p {
  padding-top: 10px;
}

.shop-reviews .tab-content .reviews-content .reviews-comment ul li .single-reviews .rating {
  position: absolute;
  right: 0;
  top: 0;
}

.shop-reviews .tab-content .reviews-content .reviews-comment ul li .single-reviews .rating ul li {
  display: inline-block;
  margin-top: 0;
  color: #f9b522;
}

.shop-reviews .tab-content .reviews-content .reviews-from .single-form {
  margin-top: 30px;
}

.shop-reviews .tab-content .reviews-content .reviews-from .single-form .rating-stars span {
  margin-right: 10px;
  font-size: 16px;
  font-weight: 700;
  color: #23282d;
}

.shop-reviews .tab-content .reviews-content .reviews-from .single-form .rating-stars .star-rating i {
  color: #f9b522;
  cursor: pointer;
}

.shop-reviews .tab-content .reviews-content .reviews-from .single-form textarea,
.shop-reviews .tab-content .reviews-content .reviews-from .single-form input {
  width: 100%;
  height: 60px;
  padding: 0 25px;
  border: 1px solid #cbcbcb;
}

.shop-reviews .tab-content .reviews-content .reviews-from .single-form textarea {
  height: 120px;
  padding-top: 15px;
  resize: none;
}

.releted-title h3 {
  font-size: 30px;
  font-weight: 900;
  color: #23282d;
}

@media (max-width:767px) {
  .shop-details-page {
    padding-top: 40px;
    padding-bottom: 90px;
  }

}

/*===========================
     26. CONTACT PAGE css 
============================*/
.contact-form .single-input {
  margin-top: 30px;
}

.contact-form .single-input textarea,
.contact-form .single-input input {
  width: 100%;
  height: 50px;
  padding: 0 15px;
  font-size: 16px;
  border: 1px solid #cbcbcb;
}

.contact-form .single-input textarea {
  height: 120px;
  padding-top: 10px;
  resize: none;
}

.contact-info ul li {
  margin-top: 30px;
}

.contact-info ul li .single-info {
  position: relative;
}

.contact-info ul li .single-info .info-icon {
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}

.contact-info ul li .single-info .info-icon i {
  font-size: 24px;
  color: #fff;
  background-color: #D61728;
  border-radius: 50%;
  text-align: center;
  width: 50px;
  line-height: 50px;
}

.contact-info ul li .single-info .info-content {
  padding-left: 70px;
}

#contact-map {
  height: 260px;
  width: 100%;
  border-radius: 10px;
}

.form-group {
  margin: 0;
}

.list-unstyled li {
  font-size: 13px;
  margin-left: 2px;
  margin-top: 5px;
  color: #f00;
}

p.form-message.success,
p.form-message.error {
  font-size: 16px;
  color: #353535;
  background: #ddd;
  padding: 10px 15px;
  margin-left: 15px;
  margin-top: 15px;
}

@media (max-width:767px) {
  .contact-page {
    padding-top: 40px;
    padding-bottom: 90px;
  }

}

/*===========================
     27. ERROR PAGE css 
============================*/
@media (max-width:767px) {
  .error-page {
    padding-top: 90px;
    padding-bottom: 90px;
  }

}


/* ==== Trade Cycle image – fixed position on the right ==== */

.about-feature {
    position: relative;          /* allows absolute positioning inside */
}

.about-image-right {
    position: absolute;
    right: 80px;                 /* horizontal position on desktop */
    top: 120px;                  /* vertical position on desktop */
    width: 44vw;                /* <<< MAIN IMAGE SIZE ON DESKTOP >>> */
    max-width: 100%;             /* safe for smaller screens */
}

.about-responsive-img {
    width: 100%;
    height: auto;
    display: block;
}

/* Large tablets / medium desktops */
@media (max-width: 1199px) {
    .about-image-right {
        right: 40px;
        top: 100px;
        width: 360px;            /* resized for 1200px screens */
    }
}

/* Tablets + mobile landscape */
@media (max-width: 991px) {
    .about-image-right {
        position: static;        /* remove absolute */
        width: 300px;            /* image size below content */
        margin: 40px auto 0;     /* center it */
        text-align: center;
    }
}

/* Small mobile phones */
@media (max-width: 600px) {
    .about-image-right {
        width: 260px;            /* smaller version for small phones */
    }
}






/* Fix spacing for "Reason to choose us" section */

.about-feature {
    padding-top: 100px !important;    /* antes 110px */
    padding-bottom: 90px !important; /* antes 120px */
}

/* reducir margen entre título y contenido */
.about-feature .section-title {
    margin-bottom: -10px !important;  /* antes venía con mb-30 */
}

/* reducir mt-60 entre título y las tarjetas */
.about-feature .row.mt-60 {
    margin-top: 20px !important;     /* antes 60px */
}



/* Override del ancho estándar para un layout moderno */
@media (min-width: 1200px) {
    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1280px !important;
    }
}

/* ========================================================= */
/* ====================== HEADER TOP ======================== */
/* ========================================================= */

/* ==== Selector de idioma (solo desktop) ==== */

.language-switcher {
    line-height: 1;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.language-switcher a {
    color: #ffffff;
    font-size: 13px;
    text-decoration: none;
    opacity: 0.8;
    padding: 0 2px;
}

.language-switcher a:hover,
.language-switcher a.active {
    opacity: 1;
}

.language-switcher span {
    color: #ffffff;
    opacity: 0.5;
    padding: 0 2px;
}

/* ==== Desktop >= 992px: barra roja visible, idiomas alineados ==== */
@media (min-width: 992px) {
    .header-top .col-lg-3 {
        display: flex;
        justify-content: flex-end;
        align-items: center;
    }

    .header-top .language-switcher {
        margin-bottom: 0;
    }
}

/* ==== Móvil < 992px: ocultar COMPLETAMENTE la barra roja ==== */
@media (max-width: 991.98px) {
    .header-top {
        display: none !important;
    }
}




/* =========================================================
   MENÚ MÓVIL – SELECTOR DE IDIOMAS
   ========================================================= */

/* 1) Ocultar el <li> de idiomas en el menú de escritorio */
@media (min-width: 992px) {
    nav#mobile-menu .nav-menubar li.mobile-lang-selector {
        display: none !important;
    }
}

/* 2) Estilos del selector de idiomas en el MENÚ MÓVIL */
@media (max-width: 991.98px) {

    /* Mostrar el <li> sólo en el menú móvil (MeanMenu y/o nav) */
    .mean-container .mean-nav ul li.mobile-lang-selector,
    nav#mobile-menu .nav-menubar li.mobile-lang-selector {
        display: block;
        background-color: #d61728; /* rojo del header */
        padding: 14px 0;
        border-top: 1px solid rgba(255, 255, 255, 0.50);
        text-align: center;
    }

    /* Contenedor de los idiomas (EN ES DE PT) */
    .mobile-lang-selector .lang-options {
        display: flex;
        justify-content: center;
        align-items: flex-end;
        max-width: 320px;
        margin: 0 auto;
        gap: 5px;           
    }

    /* Cada idioma */
    .mobile-lang-selector .lang-options span {
        position: relative;
        padding-bottom: 8px;        /* espacio para la línea inferior */
        font-size: 15px;
    }

    .mobile-lang-selector .lang-options a {
        color: #ffffff;
        text-decoration: none;
        font-weight: 500;
    }

    .mobile-lang-selector .lang-options a.active {
        font-weight: 700;           /* idioma activo un poco más fuerte */
    }

    /* Línea blanca DEBAJO de cada idioma */
    .mobile-lang-selector .lang-options span::after {
display: none !important;
    }

    /* Por si aún quedaran separadores antiguos tipo | */
    .mobile-lang-selector .separator {
        display: none !important;
    }
}


/* ===== REMOVE TOP WHITE LINES ABOVE LANGUAGE CODES ===== */

.mobile-lang-selector .lang-options a,
.mobile-lang-selector .lang-options span {
    text-decoration: none !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
}



/* --- TOOLTIP PROFESIONAL SIEMPRE ARRIBA --- */

.services-category ul li {
    position: relative;
    list-style: none;
    margin-bottom: 14px;
}

.services-category ul li .tooltip {
    position: absolute;
    bottom: 100%;            /* SIEMPRE arriba */
    left: 50%;
    transform: translateX(-50%);
    margin-bottom: 14px;
    background: #d61728;
    color: #fff;
    padding: 10px 14px;
    border-radius: 6px;
    width: 300px;
    font-size: 15px;
    line-height: 1.45;
    visibility: hidden;
    opacity: 0;
    transition: 0.25s ease;
    z-index: 999;
    pointer-events: none;
    text-align: left;
    box-shadow: 0 6px 18px rgba(0,0,0,0.15);
}

/* Flechita */
.services-category ul li .tooltip::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border-width: 7px;
    border-style: solid;
    border-color: #d61728 transparent transparent transparent;
}

/* Mostrar tooltip */
.services-category ul li:hover .tooltip {
    visibility: visible;
    opacity: 1;
}

/* --- RESPONSIVE (tooltip más angosto, sigue arriba) --- */
@media(max-width: 600px) {
    .services-category ul li .tooltip {
        width: 70vw;               /* ancho moderado */
        left: 50%;
        transform: translateX(-50%);
        font-size: 16px;           /* ⬅️ más grande */
        padding: 10px 13px;        /* un poco más de aire */
    }
}




/* Quitar completamente comportamiento de enlace sin romper estilos */
.services-category ul li a {
    pointer-events: none;         /* No se puede clicar */
    cursor: default !important;   /* No aparece la manito */
    text-decoration: none !important; /* No subrayado */
    color: inherit !important;    /* Mantiene color del diseño */
}



/* ============================
   AJUSTE ESPACIO "WHY CHOOSE US"
   ============================ */

/* Escritorio: reduce la separación vertical entre tarjetas */
.about-feature .about-feature-content .single-about-feature.mt-60 {
    margin-top: 30px !important;   /* ANTES 60px. Cambia este valor si quieres más o menos espacio */
    margin-bottom: 10px;           /* puedes subir/bajar este valor también */
}

/* Reduce la distancia entre el título y la primera tarjeta */
.about-feature .row.mt-60 {
    margin-top: 25px !important;   /* ajusta este número si quieres el bloque más pegado al título */
}

/* MÓVIL: separación un poco menor todavía */
@media (max-width: 767.98px) {
    .about-feature .about-feature-content .single-about-feature.mt-60 {
        margin-top: 22px !important;  /* aquí controlas el espacio entre tarjetas en móvil */
        margin-bottom: 8px;
    }

    .about-feature .row.mt-60 {
        margin-top: 18px !important;  /* espacio entre título y primera tarjeta en móvil */
    }
}



/* ========================================================= */
/* === LANGUAGE SWITCHERS – DESKTOP VS MOBILE ============== */
/* ========================================================= */

/* Base style: make both switchers links white */
.language-switcher a,
.lang-options a {
    color: #ffffff;
    font-size: 13px;
    text-decoration: none;
}

/* Desktop / tablets (>= 992px): 
   - Show ONLY the header-top language switcher
   - Hide the menu/mobile language selector
*/
@media (min-width: 992px) {
    nav#mobile-menu .mobile-lang-selector {
        display: none !important;
    }
}

/* Mobile (< 992px):
   - Hide the header-top language switcher (red bar)
   - Show the language selector inside the mobile menu
*/
@media (max-width: 991.98px) {

    .header-top .language-switcher {
        display: none !important;
    }

    /* MeanMenu container (mobile) */
    .mean-container .mean-nav ul li.mobile-lang-selector,
    /* Fallback for nav list */
    nav#mobile-menu .nav-menubar li.mobile-lang-selector {
        display: block;
    }
}

/* ===== Fix horizontal scroll on mobile ===== */
html, body {
    max-width: 100%;
    overflow-x: hidden;
}



/*# sourceMappingURL=style.css.map */


