/*
 Theme Name: Prologue
 Theme URI: https://themeforest.net/user/themewar/portfolio
 Author: themewar
 Author URI: 
 Description: Prologue - Creative Multipurpose Responsive HTML5 Template
 Version: 1.0
 License:
 License URI:
*/

/*==================================
    [Table of contents]
===================================
    1. Topbars
    2. Headers
    3. Popup Search
    4. Sliders
    5. About Section 
    6. Feature Section 
    7. Client Section 
    8. Info Section 
    9. Info 2 Section 
    10. Project Section 
    11. Testimonial Section
    12. Insight Section 
    13. Footer 01 Section 
    14. About Section 02
    15. Info Section 03
    16. Skill Section
    17. Project 02 Section
    18. Pricing Section
    19. Video Section
    20. Team Section
    21. Info 04 Section
    22. Video Action Section
    23. Testimonial 02 Section
    24. Subscribe Section
    25. Feature 03 Section
    26. About 03 Section
    27. Service Section
    28. Funfact
    29. Blog Page
    30. Blog Single Page
    31. Shop Page
    32. Shop Details Page
    33. Contact Page
    34. Service Details Page
    35. Folio List Page
    36. Folio Details Page
    37. Site Preloader
*/

/*------------------------------------------------------
/ 1. Topbars
/------------------------------------------------------*/
.topbar {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 999;
  border-bottom: 1px solid #e4e4e4;
  background-color: #fff;
}
.tb_infos {
  display: flex;
  justify-content: flex-start;
  padding: 7px 0 8px;
}
.tb_infos p {
  font-size: 14px;
  line-height: 34px;
  font-weight: 500;
  color: #262f42;
  margin: 0 79px 0 0;
}
.tb_infos p:last-of-type,
.tb_infos p:last-child {
  margin-right: 0;
}
.tb_infos p i {
  font-size: 16px;
  color: #01d85f;
  position: relative;
  top: 1px;
  margin-right: 15px;
}
.tb_social {
  position: relative;
  display: flex;
  justify-content: flex-end;
  padding: 14px 0 9px;
}
.tb_social a {
  font-size: 18px;
  line-height: 28px;
  color: #262f42;
  margin-left: 24px;
}
.tb_social a:first-child {
  margin-left: 0;
}
.tb_social a:hover {
  color: #c3323a;
}

/*------------------------------------------------------
/ 2. Headers
/------------------------------------------------------*/
.header_01 {
  position: absolute;
  left: 0;
  top: 0px;
  width: 100%;
  z-index: 999;
  background-color: #fff;
}
.header_01.fixedHeader {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  background: #f7f4fb;
  box-shadow: 0 17px 30px 2px rgba(30, 30, 30, 0.1);
  z-index: 999;
}
.logo {
  position: relative;
  padding: 29px 0;
}
.logo img {
  height: 50px;
  width: auto;
  max-width: 100%;
}
.mainMenu {
  position: relative;
}
.mainMenu ul {
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: flex-start;
}
.mainMenu ul li {
  list-style: none;
  padding: 36px 17px 38px;
  margin: 0 6px 0 0;
  position: relative;
}
.mainMenu ul li:last-child {
  margin-right: 0;
}
.mainMenu > ul > li:before {
  content: "";
  position: absolute;
  left: auto;
  top: 0;
  right: 0;
  margin: 0 auto;
  width: 0;
  height: 2px;
  background: #c3323a;

  transition: width 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
  -moz-transition: width 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
  -webkit-transition: width 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
}
.mainMenu > ul > li:hover:before,
.mainMenu > ul > li.active:before {
  width: 100%;
  left: 0;
  right: auto;
}
.mainMenu ul li a {
  display: block;
  font-size: 16px;
  line-height: 34px;
  color: #262f42;
  font-weight: 500;
  text-transform: capitalize;
}
.mainMenu ul li:hover > a,
.mainMenu ul li.active > a {
  color: #c3323a;
}
.mainMenu > ul ul {
  position: absolute;
  left: 0;
  top: 100%;
  background: #f7f4fb;
  width: 260px;
  display: block;
  border-radius: 0 0 5px 5px;
  z-index: 5;
  opacity: 0;
  visibility: hidden;

  -webkit-transition: all 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95);
  -moz-transition: all 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95);
  -ms-transition: all 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95);
  -o-transition: all 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95);
  transition: all 300ms cubic-bezier(0.445, 0.05, 0.55, 0.95);

  transform: translate3d(0, 50px, 0);
  -moz-transform: translate3d(0, 50px, 0);
  -webkit-transform: translate3d(0, 50px, 0);
}
.mainMenu > ul li:hover > ul {
  opacity: 1;
  visibility: visible;
  transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -webkit-transform: translate3d(0, 0, 0);
}
.mainMenu > ul ul ul {
  left: 100%;
  top: 0;
}
.mainMenu > ul ul li {
  padding: 0;
  border-bottom: 1px solid rgba(228, 228, 288, 0.5);
  display: block;
  width: 100%;
}
.mainMenu > ul ul li:last-child {
  border-bottom: none;
}
.mainMenu > ul ul li a {
  font-size: 14px;
  font-weight: 500;
  color: #262f42;
  padding: 7px 15px 7px 39px;
}
.mainMenu > ul ul li a:before {
  content: "\ea65";
  font-family: "IcoFont";
  font-size: 18px;
  color: inherit;
  line-height: 0.8;
  position: absolute;
  left: 15px;
  top: 18px;
}
.header_access_btns {
  position: relative;
  display: flex;
  justify-content: flex-end;
}
.header_access_btns .shoping_cart {
  margin-top: 45px;
  margin-right: 26px;
}
.header_access_btns .shoping_cart .cart_btn {
  font-size: 24px;
  line-height: 1;
  letter-spacing: 0;
  color: #262f42;
  position: relative;
}
.header_access_btns .shoping_cart .cart_btn:hover {
  color: #c3323a;
}
.header_access_btns .shoping_cart .cart_btn span {
  height: 18px;
  width: 18px;
  border-radius: 50%;
  text-align: center;
  line-height: 18px;
  font-size: 11px;
  font-weight: 500;
  position: absolute;
  right: -4px;
  top: -3px;
  background: #01d85f;
  color: #fff;

  transition: all ease 300ms;
  -moz-transition: all ease 300ms;
  -webkit-transition: all ease 300ms;
}
.header_access_btns .shoping_cart .cart_btn:hover span {
  background: #c3323a;
}
.header_access_btns a.search_btn {
  font-size: 24px;
  line-height: 1;
  letter-spacing: 0;
  color: #5d5d5d;
  position: relative;
  margin-top: 45px;
}
.header_access_btns .search_btn:hover {
  color: #c3323a;
}
.header_access_btns .pro_btn {
  margin-left: 46px;
  margin-top: 28px;
}
.header_access_btns .menu_btn {
  height: 55px;
  width: 55px;
  background: #c3323a;
  color: #fff;
  line-height: 55px;
  font-size: 17px;
  text-align: center;
  margin-top: 28px;
  margin-left: 15px;
}
.header_access_btns .menu_btn:hover,
.header_access_btns .menu_btn.active {
  background: #01d85f;
}

.header_01 .col-lg-3.smaller_width {
}
.header_01 .col-lg-6 {
  -ms-flex: 0 0 47%;
  flex: 0 0 47%;
  max-width: 47%;
}
.header_01 .col-lg-3.extra_width {
  -ms-flex: 0 0 28%;
  flex: 0 0 28%;
  max-width: 28%;
}

/* Light Mode Modification */
.header_01.light_mode {
  top: 33px;
}
.light_mode .mainMenu ul li a,
.light_mode .header_access_btns .shoping_cart .cart_btn,
.light_mode .header_access_btns a.search_btn {
  color: #ffffff;
}
.light_mode .mainMenu ul li:hover > a,
.light_mode .mainMenu ul li.active > a,
.light_mode .header_access_btns .shoping_cart .cart_btn:hover,
.light_mode .header_access_btns a.search_btn:hover {
  color: #01d85f;
}
.light_mode .mainMenu > ul > li:before {
  display: none;
}
.light_mode .mainMenu > ul ul {
  background: #1e1e1e;
  box-shadow: -32px 21px 68.6px 1.4px rgba(30, 30, 30, 0.5);
}
.light_mode .mainMenu > ul ul li {
  border-bottom: 1px solid rgba(228, 228, 288, 0.05);
}
.light_mode .mainMenu > ul ul li a {
  color: #959595;
}

/* Light Mode 2 Modification */
.header_01.light_mode_02 {
  top: 33px;
}
.light_mode_02 .mainMenu ul li a,
.light_mode_02 .header_access_btns .shoping_cart .cart_btn,
.light_mode_02 .header_access_btns a.search_btn {
  color: #ffffff;
}
.light_mode_02 .header_access_btns .shoping_cart .cart_btn span {
  background: #1e1e1e;
}
.light_mode_02 .mainMenu ul li:hover > a,
.light_mode_02 .mainMenu ul li.active > a,
.light_mode_02 .header_access_btns .shoping_cart .cart_btn:hover,
.light_mode_02 .header_access_btns a.search_btn:hover {
  color: #c3323a;
}
.light_mode_02 .mainMenu > ul > li:before {
  display: none;
}
.light_mode_02 .mainMenu > ul ul {
  background: #1e1e1e;
  box-shadow: -32px 21px 68.6px 1.4px rgba(30, 30, 30, 0.5);
}
.light_mode_02 .mainMenu > ul ul li {
  border-bottom: 1px solid rgba(228, 228, 288, 0.05);
}
.light_mode_02 .mainMenu > ul ul li a {
  color: #959595;
}

/* Light Mode 3 Modification */
.header_01.light_mode_03 {
  top: 0;
  border-bottom: 1px solid #848484;
}
.header_01.light_mode_03:after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;
  height: 1px;
  background: #757575;
  width: 100%;
}
.light_mode_03.no_border {
  border: none;
}
.light_mode_03.no_border:after {
  display: none;
}
.light_mode_03 .logo {
  padding: 20px 0 21px;
}
.light_mode_03 .mainMenu li {
  padding: 28px 17px 29px;
}
.light_mode_03 .mainMenu ul li a,
.light_mode_03 .header_access_btns .shoping_cart .cart_btn,
.light_mode_03 .header_access_btns a.search_btn {
  color: #ffffff;
}
.light_mode_03 .header_access_btns .pro_btn {
  margin-top: 18px;
}
.light_mode_03 .header_access_btns .shoping_cart,
.light_mode_03 .header_access_btns a.search_btn {
  margin-top: 36px;
}
.light_mode_03 .header_access_btns .shoping_cart .cart_btn span {
  background: #1e1e1e;
}
.light_mode_03 .mainMenu ul li:hover > a,
.light_mode_03 .mainMenu ul li.active > a,
.light_mode_03 .header_access_btns .shoping_cart .cart_btn:hover,
.light_mode_03 .header_access_btns a.search_btn:hover {
  color: #01d85f;
}
.light_mode_03 .mainMenu > ul > li:before {
  display: none;
}
.light_mode_03 .mainMenu > ul ul {
  background: #1e1e1e;
  box-shadow: -32px 21px 68.6px 1.4px rgba(30, 30, 30, 0.5);
}
.light_mode_03 .mainMenu > ul ul li {
  border-bottom: 1px solid rgba(228, 228, 288, 0.05);
  padding: 0;
}
.light_mode_03 .mainMenu > ul ul li a {
  color: #959595;
}

/* Dark Mode 1 Modification */
.header_01.dark_mode_01 {
  top: 0;
  border-bottom: 1px solid rgba(206, 206, 206, 0.2);
}
.header_01.dark_mode_01 .logo {
  padding: 20px 0 21px;
}
.dark_mode_01 .header_access_btns .pro_btn {
  margin-top: 18px;
}
.dark_mode_01 .header_access_btns .shoping_cart,
.dark_mode_01 .header_access_btns a.search_btn {
  margin-top: 36px;
}
.dark_mode_01 .header_access_btns .shoping_cart .cart_btn,
.dark_mode_01 .header_access_btns a.search_btn {
  color: #c8c8c8;
}
.dark_mode_01 .header_access_btns .shoping_cart .cart_btn:hover,
.dark_mode_01 .header_access_btns a.search_btn:hover {
  color: #c3323a;
}
.dark_mode_01 .header_access_btns .shoping_cart .cart_btn span {
  background: #1e1e1e;
}
.dark_mode_01 .header_access_btns .shoping_cart .cart_btn:hover span {
  background: #01d85f;
}
.dark_mode_01 .mainMenu ul li {
  padding: 27px 17px 30px;
}
.dark_mode_01 .mainMenu ul li a {
  color: #1e1e1e;
}
.dark_mode_01 .mainMenu ul li:hover > a,
.dark_mode_01 .mainMenu ul li.active > a {
  color: #c3323a;
}
.dark_mode_01 .mainMenu > ul > li:before {
  display: none;
}
.dark_mode_01 .mainMenu > ul ul li {
  padding: 0;
}

/*------------------------------------------------------
/ 3. Popup Search
/------------------------------------------------------*/
.popup_search_sec {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
}
.popup_search_overlay {
  position: fixed;
  left: 0;
  top: -100%;
  width: 100%;
  height: 100%;
  background: rgba(30, 30, 30, 0.6);
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  cursor: url(../images/close.png), auto;
  -webkit-transition: all 0.4s ease-in 0.8s;
  -o-transition: all 0.4s ease-in 0.8s;
  transition: all 0.4s ease-in 0.8s;
}
.popup_search_sec.active .popup_search_overlay {
  visibility: visible;
  -webkit-transition: all 0.8s ease-out 0s;
  -o-transition: all 0.8s ease-out 0s;
  transition: all 0.8s ease-out 0s;
  top: 0;
  opacity: 1;
}
.pop_search_background {
  background: #1e1e1e;
  width: 100%;
  height: 400px;
  top: -100%;
  z-index: 99;
  position: fixed;
  left: 0;
  opacity: 0;
  visibility: hidden;
  -webkit-overflow-scrolling: touch;
  -webkit-transition: all 0.6s cubic-bezier(0.9, 0.03, 0, 0.96) 0.7s;
  -o-transition: all 0.6s cubic-bezier(0.9, 0.03, 0, 0.96) 0.7s;
  transition: all 0.6s cubic-bezier(0.9, 0.03, 0, 0.96) 0.7s;
}
.popup_search_sec.active .pop_search_background {
  opacity: 1;
  visibility: visible;
  top: 0;
  -webkit-transition: all 0.5s cubic-bezier(0.9, 0.03, 0, 0.96) 0.5s;
  -o-transition: all 0.5s cubic-bezier(0.9, 0.03, 0, 0.96) 0.5s;
  transition: all 0.5s cubic-bezier(0.9, 0.03, 0, 0.96) 0.5s;
}
.middle_search {
  position: relative;
  top: 43%;
  transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  position: relative;
  z-index: 2;
}
.popup_search_form {
  position: relative;
}
.popup_search_form:after {
  -webkit-animation-delay: 0.8s;
  -moz-animation-delay: 0.8s;
  -o-animation-delay: 0.8s;
  animation-delay: 0.8s;
  position: absolute;
  content: "";
  height: 1px;
  background: rgba(233, 236, 239, 0.1);
  width: 0;
  visibility: hidden;
  opacity: 0;
  position: absolute;
  left: 0;
  bottom: 0;
}
.popup_search_sec.active .popup_search_form:after {
  -webkit-animation-name: fadeInGo;
  animation-name: fadeInGo;
  -webkit-animation-duration: 0.8s;
  animation-duration: 0.8s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  visibility: visible;
  opacity: 1;
  width: 100%;
}
.popup_search_form:before {
  content: "";
  position: absolute;
  left: auto;
  right: 0;
  bottom: 0;
  height: 1px;
  width: 0;
  transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
  -moz-transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
  -webkit-transition: width 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
  background: #01d85f;
}
.popup_search_form.focused:before {
  width: 100%;
  left: 0;
  right: auto;
}
.popup_search_form input[type="search"] {
  width: 100%;
  height: 64px;
  border: none;
  background: transparent;
  outline: none;
  font-size: 20px;
  line-height: 64px;
  color: #ffffff;
  font-weight: 300;
}
.popup_search_form input[type="search"]::-moz-placeholder {
  color: #ffffff;
  opacity: 1;
}
.popup_search_form input[type="search"]::-ms-input-placeholder {
  color: #ffffff;
  opacity: 1;
}
.popup_search_form input[type="search"]::-webkit-input-placeholder {
  color: #ffffff;
  opacity: 1;
}
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

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

@-webkit-keyframes fadeInGo {
  0% {
    opacity: 0.1;
    width: 0;
  }
  100% {
    opacity: 1;
    width: 100%;
  }
}
@keyframes fadeInGo {
  0% {
    opacity: 0.1;
    width: 0;
  }
  100% {
    opacity: 1;
    width: 100%;
  }
}

@-webkit-keyframes fadeOutGo {
  0% {
    opacity: 1;
    width: 100%;
  }
  100% {
    opacity: 0;
    width: 0;
  }
}
@keyframes fadeOutGo {
  0% {
    opacity: 1;
    width: 100%;
  }
  100% {
    opacity: 0;
    width: 0;
  }
}

@-webkit-keyframes fadeOutGo2 {
  0% {
    opacity: 0.8;
    width: 100%;
  }
  100% {
    opacity: 0.14;
    width: 0;
  }
}
@keyframes fadeOutGo2 {
  0% {
    opacity: 0.8;
    width: 100%;
  }
  100% {
    opacity: 0.14;
    width: 0;
  }
}
.popup_search_form button[type="submit"] {
  position: absolute;
  right: 0;
  bottom: 14px;
  border: none;
  outline: none;
  z-index: 2;
  font-size: 18px;
  line-height: 32px;
  margin: 0;
  padding: 0;
  background: transparent;
  color: #ffffff;
  transition: all ease 300ms;
  -moz-transition: all ease 300ms;
  -webkit-transition: all ease 300ms;
  -ms-transition: all ease 300ms;
  -o-transition: all ease 300ms;
}
.popup_search_form button[type="submit"]:hover {
  color: #01d85f;
}
