/*---------------------------------------------------------------------

    File Name: style.css

---------------------------------------------------------------------*/



/*---------------------------------------------------------------------

    import Fonts

---------------------------------------------------------------------*/



@import url("https://fonts.googleapis.com/css?family=Rajdhani:300,400,500,600,700");

@import url("https://fonts.googleapis.com/css?family=Poppins:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i");



/*****----------------------------------------

     1) font-family: 'Rajdhani', sans-serif;  

     2) font-family: 'Poppins', sans-serif; 

----------------------------------------*****/



/*---------------------------------------------------------------------

    import Files

---------------------------------------------------------------------*/



@import url(animate.min.css);

@import url(normalize.css);

@import url(icomoon.css);

@import url(font-awesome.min.css);

@import url(meanmenu.css);

@import url(owl.carousel.min.css);

@import url(swiper.min.css);

@import url(slick.css);

@import url(jquery.fancybox.min.css);

@import url(jquery-ui.css);

@import url(nice-select.css);



/*---------------------------------------------------------------------

    skeleton

---------------------------------------------------------------------*/



* {

  box-sizing: border-box !important;

}



html {

  scroll-behavior: smooth;

}



body {

  color: #666666;

  font-size: 14px;

  font-family: "poppins", sans-serif;

  line-height: 1.80857;

  font-weight: normal;

  overflow-x: hidden;

}



a {

  color: #1f1f1f;

  text-decoration: none !important;

  outline: none !important;

  -webkit-transition: all 0.3s ease-in-out;

  -moz-transition: all 0.3s ease-in-out;

  -ms-transition: all 0.3s ease-in-out;

  -o-transition: all 0.3s ease-in-out;

  transition: all 0.3s ease-in-out;

}



h1,

h2,

h3,

h4,

h5,

h6 {

  letter-spacing: 0;

  font-weight: normal;

  position: relative;

  padding: 0 0 10px 0;

  font-weight: normal;

  line-height: normal;

  color: #111111;

  margin: 0;

}



h1 {

  font-size: 24px;

}



h2 {

  font-size: 22px;

}



h3 {

  font-size: 18px;

}



h4 {

  font-size: 16px;

}



h5 {

  font-size: 14px;

}



h6 {

  font-size: 13px;

}



*,

*::after,

*::before {

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  box-sizing: border-box;

}



h1 a,

h2 a,

h3 a,

h4 a,

h5 a,

h6 a {

  color: #212121;

  text-decoration: none !important;

  opacity: 1;

}



button:focus {

  outline: none;

}



ul,

li,

ol {

  margin: 0px;

  padding: 0px;

  list-style: none;

}



p {

  margin: 0px;

  font-weight: 300;

  font-size: 15px;

  line-height: 24px;

}



a {

  color: #222222;

  text-decoration: none;

  outline: none !important;

}



a,

.btn {

  text-decoration: none !important;

  outline: none !important;

  -webkit-transition: all 0.3s ease-in-out;

  -moz-transition: all 0.3s ease-in-out;

  -ms-transition: all 0.3s ease-in-out;

  -o-transition: all 0.3s ease-in-out;

  transition: all 0.3s ease-in-out;

}



img {

  max-width: 100%;

  height: auto;

}



:focus {

  outline: 0;

}



.btn-custom {

  margin-top: 20px;

  background-color: transparent !important;

  border: 2px solid #ddd;

  padding: 12px 40px;

  font-size: 16px;

}



.lead {

  font-size: 18px;

  line-height: 30px;

  color: #767676;

  margin: 0;

  padding: 0;

}



.form-control:focus {

  border-color: #ffffff !important;

  box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.25);

}



.navbar-form input {

  border: none !important;

}



.badge {

  font-weight: 500;

}



blockquote {

  margin: 20px 0 20px;

  padding: 30px;

}



button {

  border: 0;

  margin: 0;

  padding: 0;

  cursor: pointer;

}



.full {

  float: left;

  width: 100%;

}



.layout_padding {

  padding-top: 90px;

  padding-bottom: 90px;

}



.layout_padding_2 {

  padding-top: 75px;

  padding-bottom: 75px;

}



.light_silver {

  background: #f9f9f9;

}



.theme_bg {

  background: #38c8a8;

}



.margin_top_30 {

  margin-top: 30px !important;

}



.full {

  width: 100%;

  float: left;

  margin: 0;

  padding: 0;

}



/**-- heading section --**/



.main_heading {

  text-align: center;

  display: flex;

  justify-content: center;

  position: relative;

  margin-bottom: 50px;

}



.main_heading h2 {

  padding: 0;

  font-size: 48px;

  line-height: 60px;

  font-weight: 400;

  position: relative;

  letter-spacing: -0.5px;

  color: #114c7d;

  border-left: solid #38c8a8 10px;

  padding-left: 15px;

}



.main_heading h2 strong {

  background: #38c8a8;

  color: #fff;

  font-weight: 600;

  padding: 0 15px;

  line-height: 68px;

}



.white_heading_main h2 {

  color: #fff;

}



.small_main_heading {

  margin-top: 25px;

  float: left;

  width: 100%;

  border-bottom: solid rgba(0, 0, 0, 0.07) 1px;

  margin-bottom: 25px;

}



.small_main_heading h2 {

  padding: 2px 0 20px 0;

  color: #114c7d;

  font-weight: 400;

  font-size: 28px;

  background-image: url("../images/fevicon.png");

  background-repeat: no-repeat;

  padding-left: 55px;

  letter-spacing: -0.5px;

}



.small_main_heading h2 strong {

  color: #38c8a8;

  font-weight: 600;

}



.main_bt {

  background: #000;

  color: #fff;

  padding: 10px 60px 10px 60px;

  float: left;

  font-size: 15px;

  font-weight: 400;

  border: solid #000 5px;

  border-radius: 0;

  margin-right: 30px;

}



a.readmore_bt {

  color: #fff;

  font-weight: 300;

  text-decoration: underline !important;

}



.main_bt:hover,

.main_bt:focus {

  background: #ad2101;

  border: solid #ad2101 5px;

  color: #fff;

}



/**-- list icon --**/



.ul_list_info_icon ul {

  list-style: none;

}



.ul_list_info_icon ul li {

  display: inline;

  float: left;

  width: 100%;

}



.ul_list_info_icon ul li img {

  width: 75px;

}



/*----------------------------

    preloader area

----------------------------*/



.loader_bg {

  position: fixed;

  z-index: 9999999;

  background: #fff;

  width: 100%;

  height: 100%;

}



.loader {

  height: 100%;

  width: 100%;

  position: absolute;

  left: 0;

  top: 0;

  display: flex;

  justify-content: center;

  align-items: center;

}



.loader img {

  width: 280px;

}



/*----------------------------

    scroll to top area

----------------------------*/



.scrollup {

  float: right;

  position: absolute;

  color: #fff;

  right: 20px;

  padding: 0px 5px;

  text-transform: uppercase;

  font-weight: 600;

  background: #38c8a8;

  position: fixed;

  bottom: 20px;

  z-index: 99;

  text-align: center;

  color: #fff;

  cursor: pointer;

  border-radius: 0px;

  opacity: 0;

  backface-visibility: hidden;

  -webkit-backface-visibility: hidden;

  transform: scale(1);

  -moz-transform: scale(1);

  -o-transform: scale(1);

  -webkit-transform: scale(1);

  transition: 0.2s all ease;

  -moz-transition: 0.2s all ease;

  -o-transition: 0.2s all ease;

  -webkit-transition: 0.2s all ease;

  width: 50px;

  height: 50px;

  border-radius: 100%;

  line-height: 48px;

  font-size: 16px;

}



.scrollup.b-show_scrollBut {

  opacity: 1;

  visibility: visible;

}



.top_awro {

  background: #ee4a79 none repeat scroll 0 0;

  cursor: pointer;

  padding: 6px 8px;

  position: fixed;

  bottom: 59px;

  right: 20px;

  display: none;

  height: 45px;

  width: 45px;

  border-radius: 50%;

  text-align: center;

  line-height: 30px;

  transition: all 0.5s ease;

}



.sale_pro {

  background: #f25252 !important;

}



.margin_top_50 {

  margin-top: 50px;

}



.margin_bottom_30_all {

  margin-bottom: 30px;

}



.text_align_center {

  text-align: center;

}



/*---------------------------------------------------------------------

    header area

---------------------------------------------------------------------*/



.logo_section {

  text-align: center;

}



.logo {

  float: left;

}



nav.main-menu {

  float: right;

  margin-left: 0;

}



.menu-area-main li:hover a,

.menu-area-main li:focus a {

  color: #ffc221;

}



.menu-area-main li.active a {

  color: #ffc221;

}



.right_cart_section {

  float: right;

  width: auto;

}



.right_cart_section ul {

  float: left;

  min-height: auto;

  margin: 0;

  padding: 12px 0 0;

}



.right_cart_section .cart_icons {

  padding: 18px 0 0;

}



.main-menu ul > li nth:child(5) a {

  padding-right: 0px;

}



.right_cart_section ul li {

  float: left;

  font-size: 17px;

  font-weight: 400;

  color: #fff;

  margin-right: 30px;

}



.right_cart_section ul.cart_update li {

  font-size: 13px;

  color: #ccc;

  line-height: normal;

  margin: 0;

  font-weight: 300;

}



.right_cart_section ul.cart_update li span {

  font-size: 18px;

  font-weight: 300;

  color: #fff;

  line-height: 21px;

}



.right_cart_section ul li i {

  margin-right: 10px;

  margin-top: 5px;

  float: left;

  color: #fff;

  font-size: 21px;

}



.right_cart_section ul li a {

  color: #fff;

}



/*-- end header middle --*/



.top-bar-info {

  background: #111111;

  padding: 5px 0px;

}



.top-menu-left {

  float: left;

}



.top-menu-left li {

  position: relative;

  display: inline-block;

  margin-right: 11px;

  padding-right: 12px;

}



.top-menu-left li::before {

  content: "";

  position: absolute;

  right: 0;

  top: 9px;

  height: 10px;

  border-right: 1px dotted #999;

}



.top-menu-left li:last-child::before {

  display: none;

}



.top-menu-left li:last-child {

  padding: 0px;

  margin: 0px;

}



.top-menu-left li a {

  color: #ffffff;

  font-size: 12px;

  text-transform: uppercase;

  text-decoration: none;

}



.top-menu-left li a:hover {

  color: #38c8a8;

}



.right-dropdown-language {

  float: right;

  margin-left: 12px;

}



.dropdown-bar .dropdown-link {

  position: absolute;

  z-index: 1009;

  top: 40px;

  left: 0;

  right: auto;

  min-width: 50px;

  padding: 15px;

  background: #ffffff;

  list-style: none;

  border: 2px solid #38c8a8;

  opacity: 0;

  visibility: hidden;

  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);

  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);

  -webkit-transition: opacity 0.2s ease 0s, visibility 0.2s linear 0s;

  -o-transition: opacity 0.2s ease 0s, visibility 0.2s linear 0s;

  transition: opacity 0.2s ease 0s, visibility 0.2s linear 0s;

  text-align: left;

}



.dropdown-bar:hover .dropdown-link {

  opacity: 1;

  visibility: visible;

  top: 25px;

}



.dropdown-bar.right-dropdown-language > a::after {

  font-family: "FontAwesome";

  content: "\f107";

  text-decoration: none;

  padding-left: 4px;

  color: #ffffff;

}



.right-dropdown-language > a {

  line-height: 10px;

  padding: 5px 5px;

  cursor: pointer;

}



.dropdown-bar .dropdown-link li a {

  color: #111111;

  display: block;

  font-size: 12px;

  line-height: 15px;

  padding: 5px 0;

}



.dropdown-bar .dropdown-link li a:hover {

  color: #38c8a8;

}



.dropdown-bar .dropdown-link li a img {

  margin-right: 7px;

}



.dropdown-bar .dropdown-link li.active {

  font-weight: bold;

}



.right-dropdown-language .dropdown-link {

  min-width: 100px;

  padding: 7px 10px;

  color: #111111;

}



.dropdown-bar {

  position: relative;

  padding: 0 5px;

  font-size: 13px;

}



.dropdown-bar .dropdown-link.right-sd {

  left: auto;

  right: 0;

}



.right-dropdown-currency {

  float: right;

  margin-left: 12px;

}



.dropdown-bar.right-dropdown-currency > a::after {

  font-family: "FontAwesome";

  content: "\f107";

  text-decoration: none;

  padding-left: 4px;

  color: #ffffff;

}



.right-dropdown-currency > a {

  line-height: 10px;

  padding: 5px 5px;

  cursor: pointer;

  color: #ffffff;

}



.right-dropdown-currency .dropdown-link {

  min-width: 100px;

  padding: 7px 10px;

  color: #111111;

}



.right-dropdown-currency .dropdown-link {

  min-width: 55px;

  padding: 7px 10px;

}



.right-dropdown-currency .dropdown-link li a span.symbol {

  margin-right: 7px;

}



#login-modal .modal-content {

  border-radius: 0px;

}



#login-modal .modal-content .modal-header {

  background: #38c8a8;

  border-radius: 0;

}



#login-modal .modal-content .modal-body .form-group input {

  background: #ffffff;

  border: 1px solid #c8c8c8;

  border-radius: 0px;

}



#login-modal .modal-content .modal-body .form-group input:focus {

  border: 1px solid #c8c8c8 !important;

}



#login-modal .modal-content form {

  margin-bottom: 10px;

}



.modal-title {

  padding: 0px;

  color: #ffffff;

  font-size: 18px;

  text-transform: uppercase;

}



.btn-template-outlined {

  background: #111111;

  color: #ffffff;

  border: none;

  border-radius: 0px;

}



.btn-template-outlined i {

  padding-right: 10px;

}



.text-muted {

  padding: 10px 0px;

}



.slogan-line {

  float: right;

  color: #ffffff;

  font-size: 13px;

}



.middle-area {

  padding: 30px 0px;

}



.header-search {

  padding: 3px 0px;

}



.header-search form {

  position: relative;

  -webkit-box-shadow: 0px 1px 10px -1px rgba(0, 0, 0, 0.2);

  box-shadow: 0px 1px 10px -1px rgba(0, 0, 0, 0.2);

}



.header-search .btn-group.bootstrap-select {

  position: absolute;

  left: 0px;

  top: 0px;

}



.header-search input {

  width: 100%;

  min-height: 45px;

  border-radius: 0px;

  border: none;

  padding-left: 15px;

  border: 1px solid #e0e7ed;

}



.header-search form .search-btn {

  position: absolute;

  right: 0;

  top: 0;

  border: 0;

  color: #fff;

  font-size: 20px;

  padding: 4px 15px;

  border-radius: 0px;

  background-color: #38c8a8;

  cursor: pointer;

}



.header-search form .search-btn:hover {

  background: #111111;

}



.cart-box {

  float: right;

  margin-left: 10px;

  position: relative;

}



.cart-content-box {

  position: absolute;

  z-index: 1009;

  top: 40px;

  left: auto;

  right: 0;

  min-width: 250px;

  max-width: 250px;

  padding: 15px;

  background: #ffffff;

  list-style: none;

  border: 2px solid #38c8a8;

  opacity: 0;

  visibility: hidden;

  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);

  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);

  text-align: left;

  -webkit-transform: scaleY(0);

  transform: scaleY(0);

  -webkit-transform-origin: 0 0 0;

  transform-origin: 0 0 0;

  -webkit-transition: all 0.3s ease 0s;

  transition: all 0.3s ease 0s;

  transition: all 0.3s ease 0s;

}



.cart-box:hover .cart-content-box {

  opacity: 1;

  visibility: visible;

  top: 100%;

  -webkit-transform: scaleY(1);

  transform: scaleY(1);

}



.inner-cart {

  background: #38c8a8;

  border-radius: 2px;

  padding: 0px;

  color: #ffffff;

  position: relative;

  width: 40px;

  height: 40px;

  text-align: center;

}



.cart-box .inner-cart:hover {

  color: #ffffff;

}



.line-cart {

  float: left;

  line-height: 40px;

  margin-right: 9px;

}



.cart-box a {

  display: inline-block;

}



.cart-box a:hover {

  color: #38c8a8;

}



.cart-box a span.icon {

  background: #38c8a8;

  width: 30px;

  height: 40px;

  display: inline-block;

  line-height: 40px;

  text-align: center;

  color: #ffffff;

  position: relative;

  border-radius: 2px;

}



.cart-box a .p-up {

  position: absolute;

  right: -8px;

  top: -8px;

  line-height: initial;

  background: #38c8a8;

  padding: 3px;

  border-radius: 50%;

  width: 17px;

  height: 17px;

  font-size: 12px;

  text-align: center;

  line-height: 10px;

}



.wish-box {

  float: right;

}



.wish-box a {

  display: inline-block;

}



.wish-box a:hover {

  color: #38c8a8;

}



.wish-box a span.icon {

  background: #38c8a8;

  width: 40px;

  height: 40px;

  display: inline-block;

  line-height: 40px;

  text-align: center;

  color: #ffffff;

  position: relative;

  border-radius: 2px;

}



.wish-box a span.icon:hover {

  background: #111111;

}



.cart-content-right {

  padding: 5px 0px;

}



.cart-content-box .items {

  text-align: center;

}



.product-media {

  width: 60px;

  float: left;

  position: relative;

}



.cart-content-box .items:hover .product-media::before {

  transform: scale(1);

  -webkit-transform: scale(1);

  -moz-transform: scale(1);

  -ms-transform: scale(1);

  -o-transform: scale(1);

}



.product-media::before {

  position: absolute;

  content: "";

  z-index: 2;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background-color: #38c8a8;

  opacity: 0.4;

  transform: scale(0);

  -webkit-transform: scale(0);

  -moz-transform: scale(0);

  -ms-transform: scale(0);

  -o-transform: scale(0);

  transition: all 0.5s ease;

  -webkit-transition: all 0.5s ease;

  -moz-transition: all 0.5s ease;

  -o-transition: all 0.5s ease;

}



.cart-content-box .items .item .remove {

  position: absolute;

  right: 0px;

  top: 0px;

  background: #38c8a8;

  color: #ffffff;

  width: 20px;

  height: 20px;

  line-height: 18px;

  border-radius: 2px;

}



.cart-content-box .items .item {

  margin-bottom: 10px;

  padding-bottom: 10px;

  border-bottom: 1px solid #e0e7ed;

  position: relative;

}



.cart-content-box .items .item .product-info {

  padding-top: 10px;

  padding-left: 71px;

  text-align: left;

}



.cart-content-box .items .item .remove:hover {

  background: #111111;

}



.subtotal {

  text-align: left;

  text-transform: capitalize;

  color: #38c8a8;

  font-weight: 500;

  margin-bottom: 15px;

}



.subtotal span {

  font-weight: bold;

  color: #111111;

  padding-left: 15px;

  float: right;

}



.actions .btn-process {

  padding: 5px 16px;

  color: #ffffff;

  font-family: "Roboto", sans-serif;

  font-size: 14px;

  border-radius: 2px;

  overflow: hidden;

}



.actions .btn-process:hover {

  color: #ffffff;

}



.line-cart {

  position: relative;

}



.wish-box a span.icon span {

  position: absolute;

  right: -8px;

  top: -8px;

  line-height: initial;

  background: #38c8a8;

  padding: 3px;

  border-radius: 50%;

  width: 17px;

  height: 17px;

  font-size: 12px;

}



.main-menu {

  text-align: center;

}



.main-menu ul {

  margin: 0;

  list-style-type: none;

}



.main-menu ul > li {

  display: inline-block;

  position: relative;

}



.main-menu ul > li a {

  padding: 30px 23px 0 23px;

  line-height: 20px;

  font-size: 16px;

  display: block;

  font-weight: 500;

  color: #010005;

  text-transform: uppercase;

}



.main-menu ul li:last-child a {

  padding-right: 0;

}



.sub-down li {

  background: #ffffff;

}



.main-menu ul > li .sub-down li a {

  color: #114c7d;

  font-size: 15px;

  text-transform: capitalize;

  font-weight: 300;

  padding: 12px 5px;

  position: relative;

  border-bottom: solid #eee 1px;

}



.main-menu ul > li .sub-down li a::before {

}



.main-menu ul > li .sub-down li a:hover {

  color: #111111;

}



.main-menu ul > li .sub-down li a:hover::before {

}



.main-menu ul li:first-child {

  margin-left: 0;

}



.main-menu ul > li > ul {

  opacity: 0;

  position: absolute;

  text-align: left;

  top: 100%;

  -webkit-transform: scaleY(0);

  transform: scaleY(0);

  -webkit-transform-origin: 0 0 0;

  transform-origin: 0 0 0;

  -webkit-transition: all 0.3s ease 0s;

  transition: all 0.3s ease 0s;

  visibility: hidden;

  width: 240px;

  z-index: 999;

  background: #fff;

  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);

  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);

}



.main-menu > ul > li:hover > ul {

  -webkit-transform: scaleY(1);

  transform: scaleY(1);

  visibility: visible;

  opacity: 1;

}



.main-menu ul > li > ul > li {

  margin: 0px;

  position: relative;

  display: block;

}



.main-menu ul > li > ul > li:hover > ul {

  -webkit-transform: scaleY(1);

  transform: scaleY(1);

  visibility: visible;

  opacity: 1;

  left: 100%;

  top: 10px;

}



.main-menu ul > li > ul > li > a {

  background: none !important;

}



.mean-container .mean-nav {

  margin-top: 0px;

  position: absolute;

  top: 100%;

}



.main-menu ul > li {

  position: inherit;

  display: inline-block;

  vertical-align: middle;

}



.main-menu ul > li:nth-child (6) {

  padding-right: 0px;

}



.nav > li {

  position: inherit;

  display: inline-block;

  vertical-align: middle;

}



.megamenu .sub-down {

  max-width: 1140px;

  width: 100%;

  left: 0;

  margin: 0 auto;

  right: 0;

  padding: 15px 0px;

}



.sub-full {

}



.simple-down {

  padding: 15px;

}



.megamenu-categories {

  padding: 10px 0px;

}



.sub-full.megamenu-categories li {

  display: block;

}



.megamenu .sub-full.megamenu-categories ol li a {

  padding: 5px 0px;

  font-size: 15px !important;

  font-weight: 500;

}



.sub-full.megamenu-categories ol li .category-title {

  padding: 15px 0px;

  font-size: 16px;

  font-weight: 600;

  text-transform: uppercase;

}



.sub-full.megamenu-categories ol li .category-box a {

  padding: 5px 0px;

}



.menu-add {

  padding: 30px 15px;

}



.menu-add img {

  width: 100%;

}



.main-w img {

  width: 100%;

}



.women-box {

  position: relative;

}



.women-box::before {

  content: "";

  position: absolute;

  background: rgba(0, 0, 0, 0.3);

  width: 100%;

  height: 100%;

}



.banner-up-text {

  position: absolute;

  bottom: 10px;

  left: 0px;

  right: 0px;

  text-align: center;

}



.text-a {

  color: #fff;

  text-transform: uppercase;

  font-size: 40px;

  line-height: 40px;

  font-weight: 700;

}



.text-b {

  color: #fff;

  font-size: 28px;

  text-transform: uppercase;

  line-height: 30px;

  padding: 20px 0px;

}



.text-c {

  color: #ffffff;

  font-size: 31px;

  font-weight: 300;

  text-transform: uppercase;

  line-height: 30px;

  padding-bottom: 20px;

}



.megamenu .sub-full.megamenu-categories .women-box .banner-up-text a {

  background: #111111;

  color: #ffffff !important;

  display: inline-block;

  padding: 10px 16px;

  border-radius: 2px;

  overflow: hidden;

  font-size: 16px;

}



.sticky-wrapper .sticky-wrapper-header {

  z-index: 20 !important;

  background: #ffffff;

}



.is-sticky .sticky-wrapper-header .middle-area {

  padding: 10px 0px;

}



.sticky-wrapper:not(.is-sticky) {

  height: auto !important;

}



.hover-btn {

  display: inline-block;

  vertical-align: middle;

  -webkit-transform: perspective(1px) translateZ(0);

  transform: perspective(1px) translateZ(0);

  box-shadow: 0 0 1px rgba(0, 0, 0, 0);

  position: relative;

  background: #111111;

  -webkit-transition-property: color;

  transition-property: color;

  -webkit-transition-duration: 0.3s;

  transition-duration: 0.3s;

}



.hover-btn::before {

  content: "";

  position: absolute;

  z-index: -1;

  top: 0;

  bottom: 0;

  left: 0;

  right: 0;

  background: #38c8a8;

  -webkit-transform: scaleX(0);

  transform: scaleX(0);

  -webkit-transform-origin: 50%;

  transform-origin: 50%;

  -webkit-transition-property: transform;

  transition-property: transform;

  -webkit-transition-duration: 0.3s;

  transition-duration: 0.3s;

  -webkit-transition-timing-function: ease-out;

  transition-timing-function: ease-out;

  display: block !important;

}



.hover-btn:hover::before,

.hover-btn:focus::before,

.hover-btn:active::before {

  -webkit-transform: scaleX(1);

  transform: scaleX(1);

}



.hover-btn:hover,

.hover-btn:focus,

.hover-btn:active {

  color: white;

  box-shadow: none;

}



.btn-secondary.focus,

.btn-secondary:focus {

  box-shadow: none;

}



.img-responsive {

  max-width: 100%;

}



.padding_right_15_inner {

  padding-right: 15px;

}



.padding_left_15_inner {

  padding-left: 15px;

}



.dark_bg {

  background: #114c7d;

}



/*---------------------------------------------------------------------

    top banner area

---------------------------------------------------------------------*/



.top-banner-slider {

  overflow: hidden;

  clear: both;

  height: 600px;

}



.top-banner-slider .heroslider {

  margin: 0px;

  padding: 0px;

  border: none;

  position: relative;

  border-radius: 0;

}



.swiper-overlay {

  height: 100%;

  position: relative;

}



.swiper-overlay {

  background: rgba(0, 0, 0, 0.5);

  content: "";

  width: 100%;

  height: 100%;

  left: 0px;

  top: 0px;

}



.heroslider .container {

  position: relative;

  height: 100%;

  padding-left: 0;

  padding-right: 0;

  z-index: 5;

}



.swiper-container {

  width: 100%;

  height: 100%;

}



.heroslider .slider-01 {

  width: 100%;

  background-image: url(../images/slider-01.jpg);

  background-size: cover;

  background-position: center;

}



.heroslider .slider-02 {

  width: 100%;

  background-image: url(../images/slider-02.jpg);

  background-size: cover;

  background-position: center;

}



.heroslider .slider-03 {

  width: 100%;

  background-image: url(../images/slider-03.jpg);

  background-size: cover;

  background-position: center;

}



.heroslider .slides li {

  height: 600px;

}



.top-banner-slider .heroslider .slides li::before {

  content: "";

  position: absolute;

  background: rgba(0, 0, 0, 0.4);

  height: 100%;

  width: 100%;

  left: 0px;

  top: 0px;

}



.top-banner-slider .flex_caption3 {

  position: absolute;

  z-index: 30;

  left: 0;

  right: 0;

  bottom: 50px;

  margin: 0 -15px;

  display: flex;

}



a.slide_banner {

  position: relative;

  display: inline-block;

  margin: 0 12px 0 15px;

}



.slide1_banner1 {

  width: 570px;

}



.slide1_banner2 {

  width: 270px;

}



.slide1_banner3 {

  width: 270px;

}



.top-banner-slider .flex_caption1 {

  text-align: center;

  position: absolute;

  z-index: 30;

  left: 0;

  right: 0;

  margin: 0 auto;

  top: 31%;

  max-width: 720px;

  width: 100%;

  text-transform: uppercase;

  color: #333;

}



.top-banner-slider .flex_caption1 .title1 {

  font-size: 36px;

  font-weight: 300;

  color: #ffffff;

}



.top-banner-slider .flex_caption1 .title2 {

  font-size: 60px;

  font-weight: 900;

  color: #ffffff;

}



.top-banner-slider .flex_caption2 {

  text-align: center;

}



.top-banner-slider .flex_caption2 {

  position: absolute;

  z-index: 30;

  left: 0;

  top: 20%;

  display: table;

  width: 177px;

  height: 177px;

  background-color: #242424;

}



.top-banner-slider .flex_caption2 .middle {

  display: table-cell;

  vertical-align: middle;

  text-transform: uppercase;

  text-align: center;

  font-weight: 700;

  line-height: 31px;

  font-size: 26px;

  color: #fff;

  transition: all 0.1s ease-in-out;

  -webkit-transition: all 0.1s ease-in-out;

}



.top-banner-slider .flex_caption2 .middle:hover {

  background: #38c8a8;

}



.top-banner-slider .flex_caption2 span {

  display: block;

  font-weight: 100;

  line-height: 36px;

  font-size: 34px;

}



a.slide_banner::before {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  right: 0;

  bottom: 0;

  opacity: 0;

  border: 2px solid #ffffff;

  transition: all 0.1s ease-in-out;

  -webkit-transition: all 0.1s ease-in-out;

}



a.slide_banner:hover::before {

  left: -7px;

  top: -7px;

  right: -7px;

  bottom: -7px;

  opacity: 1;

}



.flex-control-nav {

  background: #38c8a8;

  bottom: 0px;

  position: relative;

}



.flex-control-nav li {

  line-height: 10px;

}



.flex-control-paging li a {

  background: rgba(255, 255, 255, 1);

  border: 2px solid #ffffff;

}



.flex-control-paging li a.flex-active {

  border: 2px solid #ffffff;

}



.flex-direction-nav a {

  background: #111111;

  text-align: center;

}



.heroslider:hover .flex-direction-nav .flex-prev:hover {

  background: #38c8a8;

}



.heroslider:hover .flex-direction-nav .flex-next:hover {

  background: #38c8a8;

}



.flex-direction-nav a::before {

  color: #ffffff;

}



.top-banner-slider .swiper-pagination {

  padding: 10px 0px;

}



.heroslider .swiper-pagination {

  bottom: 0px;

  background: #38c8a8;

}



.heroslider .swiper-pagination .swiper-pagination-bullet-active {

  background: #fff;

}



.heroslider .swiper-pagination::before {

  content: "";

  width: 22px;

  height: 22px;

  position: absolute;

  left: -10px;

  top: 4px;

  z-index: -1;

  background: #e12d4f;

  -webkit-transform: rotate(45deg);

  transform: rotate(45deg);

}



.heroslider .swiper-pagination::after {

  content: "";

  width: 22px;

  height: 22px;

  position: absolute;

  right: -10px;

  top: 4px;

  z-index: -1;

  background: #e12d4f;

  -webkit-transform: rotate(45deg);

  transform: rotate(45deg);

}



.heroslider .swiper-pagination.swiper-pagination-bullets-dynamic {

  overflow: visible;

  width: 110px !important;

}



.heroslider .swiper-pagination .swiper-pagination-bullet {

  opacity: 1;

}



input[type="checkbox"].styled:checked + label:after,

input[type="radio"].styled:checked + label:after {

  font-family: "FontAwesome";

  content: "\f00c";

}



input[type="checkbox"] .styled:checked + label::before,

input[type="radio"] .styled:checked + label::before {

  color: #fff;

}



input[type="checkbox"] .styled:checked + label::after,

input[type="radio"] .styled:checked + label::after {

  color: #fff;

}



/*---------------------------------------------------------------------

    layout new css 

---------------------------------------------------------------------*/



.buy {

  background: #ffc221;

  padding: 7px 41px !important;

  margin-top: 18px;

  border-radius: 5px;

  display: inline-block;

  float: right;

}



.buy:hover {

  color: #fff;

}



.head_top {

  background: #ffc221;

  margin-bottom: 35px;

}

ul.sociel_link {

  display: flex;

  flex-wrap: wrap;

  justify-content: center;

  margin: 0 auto;

  float: left;

}



.top-box p {

  float: right;

  padding-top: 10px;

  color: #000;

}

ul.sociel_link li {

  display: inline-block;

}



ul.sociel_link li a {

  color: #000;

  width: 50px;

  height: 50px;

  float: left;

  text-align: center;

  line-height: 50px;

  border-radius: 100%;

  font-size: 18px;

}

.header {

  background: #fff;

  padding-bottom: 35px;

}



.logo a {

  font-size: 40px;

  font-weight: bold;

  text-transform: uppercase;

  color: #000;

  line-height: 40px;

}



.relative {

  position: absolute;

  top: 50%;

  transform: translateY(-50%);

  bottom: auto;

  text-align: left;

}



.banner-main {

  position: relative;

}

.banner-main .carousel-caption h1 {

  color: #020000;

  font-size: 85px;

  line-height: 90px;

  text-transform: uppercase;

}

.banner-main .carousel-caption p {

  color: #050000;

  font-weight: 500;



  line-height: 23px;

}

.banner-main .carousel-caption a {

  width: 250px;

  background: #ffc221;

  padding: 9px 0px;

  color: #fff;

  font-size: 17px;

  border-radius: 30px 0px 30px 30px;

  display: inline-block;

  text-align: center;

  margin-top: 20px;

}

.banner-main .carousel-caption a:hover {

  background: #000;

}

.yellow_bold {

  color: #ffc221;

}



/** whyschose section **/



.whyschose {

  background: #fff;

  padding-top: 85px;

}



.title {

  text-align: center;

  padding-bottom: 60px;

}



.title h2 {

  font-size: 50px;

  line-height: 55px;

  color: #ffc221;

  font-weight: 500;

  text-transform: uppercase;

  margin-bottom: 27px;

  position: relative;

  padding-bottom: 8px;

}

.title h2:after {

  position: relative;

  content: "";

  top: 100%;

  width: 110px;

  height: 10px;

  display: block;

  margin: 0 auto;

  background: #000;

}



.title span {

  color: #070500;

  font-size: 28px;

  line-height: 28px;

  margin-top: 20px;

}

.black {

  font-weight: 500;

  color: #070500;

}



.choose_bg {

  background: #f9be20;

}



.choose_bg .white_bg {

  background: #fff;

  padding: 40px 20px;

  box-shadow: #ddd 0px 0px 10px 3px;

  margin-bottom: 5px;

}

.choose_bg .white_bg .for_box {

  text-align: center;

  padding: 1px;

}

.choose_bg .white_bg .for_box i {

  display: block;

}

.choose_bg .white_bg .for_box h3 {

  font-size: 26px;

  line-height: 21px;

  color: #070500;

  padding: 25px 0px 15px 0px;

  display: inline-block;

}



.choose_bg .white_bg .for_box p {

  color: #0d0c0a;

  font-size: 17px;

  line-height: 28px;

}



.read-more {

  width: 190px;

  margin: 0 auto;

  background: #fff;

  display: block;

  border: #f9be20 solid 2px;

  text-align: center;

  padding: 10px 0px;

  color: #0a0401 !important;

  font-size: 20px;

  margin-top: 40px;

}

.read-more:hover {

  background: #f9be20;

  color: #0a0401;

}



/** end whyschose section **/



/** service section **/

.service {

  background: #fff;

  padding-top: 90px;

}

.service .service-box {

  padding: 30px 20px;

  box-shadow: #00000040 0px 0px 19px 0px;

  margin-bottom: 30px;

  text-align: center;

}



.service .service-box i img {

  height: 88px;

}



.service .service-box h3 {

  font-weight: 500;

  font-size: 22px;

  line-height: 22px;

  color: #050000;

  padding: 20px 0px;

}



.service .service-box p {

  color: #0d0c0a;

  font-size: 17px;

  line-height: 28px;

}



/** end service section **/



/** product section **/

.product {

  background: #fff;

  padding-top: 60px;

}



.product .title {

  text-align: left;

  padding-bottom: 60px;

}



.product .title h2 {

  font-size: 50px;

  line-height: 55px;

  color: #ffc221;

  font-weight: 500;

  text-transform: uppercase;

  margin-bottom: 27px;

  position: relative;

  padding-bottom: 8px;

}



.product .title h2:after {

  position: absolute;

  border-bottom: #000 solid 10px;

  content: "";

  top: 100%;

  width: 110px;

}



.product .title span {

  color: #070500;

  font-size: 22px;

  line-height: 28px;

  margin-top: 20px;

}



.product-bg {

  background: url(../images/bg.jpg);

  background-repeat: no-repeat;

  background-size: 100% 100%;

}

.product-bg-white {

  background: #ffffffbd;

  box-shadow: #00000040 0px 0px 25px 0px;

  padding-top: 80px;

  padding-bottom: 60px;

}

.product-bg .product-bg-white .product-box {

  background: #ddd;

  text-align: center;

  margin-bottom: 30px;

  padding: 20px 25px;

}

.product-bg .product-bg-white .product-box i img {

  width: 100%;

}

.product-bg .product-bg-white .product-box:hover {

  background: #fdc24f;

}



.product-bg .product-bg-white .product-box h3 {

  color: #020000;

  font-weight: 500;

  font-size: 17px;

  line-height: 20px;

  padding-top: 15px;

}



.product-bg .product-bg-white .product-box span {

  color: #020000;

  font-weight: 500;

  font-size: 22px;

  line-height: 22px;

}

.product-bg .product-bg-white .product-box span:hover {

  color: #fff;

}



.Clients_bg_white {

  background: #ffffffbd;

  margin-top: 6px;

  padding-bottom: 40px;

}



.Clients_bg_white .title {

  text-align: left;

  padding-bottom: 30px;

}

.Clients_bg_white .title h3 {

  color: #030000;

  font-size: 50px;

  line-height: 50px;

  padding-top: 40px;

}



.banner_Client {

  position: relative;

}



.text-bg {

  position: inherit;

  text-align: left;

}



.text-bg p {

  color: #030000;

  font-size: 17px;

  line-height: 28px;

  padding-top: 40px;

  padding-bottom: 40px;

  display: inline-block;

}

.img_bg i {

  float: left;

  display: flex;

  flex-wrap: wrap;

}

.img_bg i img {

  width: 149px;

  height: 149px;

}

.img_bg span {

  color: #000;

  font-size: 28px;

  line-height: 28px;

  padding-left: 40px;

  padding-top: 41px;

}

.img_bg .date {

  font-weight: normal;

  font-size: 16px;

}



.carousel-indicators li {

  width: 25px;

  height: 25px;

  border-radius: 30px;

}



.carousel-indicators {

  right: inherit;

  margin-left: 7px;

}



.carousel-indicators .active {

  background-color: #fdc24f;

}

.carousel-indicators li {

  background: #0c0505;

}



.yellow_bg {

  background: #ffc221;

  padding: 40px 30px;

  margin-top: 100px;

}



.yellow_bg .yellow-box h3 {

  color: #fff;

  font-size: 31px;

  font-weight: bold;

  display: inline-block;

  padding-bottom: 6px;

}

.yellow_bg .yellow-box i {

  padding-bottom: 10px;

  padding-left: 15px;

}

.yellow_bg .yellow-box p {

  font-size: 22px;

  line-height: 28px;

  color: #010101;

}

.yellow_bg .yellow-box a {

  background: #000;

  border-radius: 30px;

  max-width: 344px;

  width: 100%;

  font-size: 31px;

  line-height: 33px;

  color: #fff;

  padding: 16px 73px;

  display: inline-block;

  text-align: center;

  margin-left: 50px;

  margin-top: 17px;

  font-weight: 500;

}



/** end product section **/



/** map section **/

.map img {

  width: 100%;

  padding: 0px;

}



.padi {

  padding: 0px;

}



/** end map section **/



/** footer section **/



.footer {

  background: #1b1b1b;

  padding-top: 70px;

}

ul.sociel {

  display: flex;

  flex-wrap: wrap;

  justify-content: center;

  margin: 0 auto;

}

ul.sociel li {

  display: inline-block;

  padding: 0px 10px;

}



ul.sociel li a {

  color: #fff;

  width: 50px;

  height: 50px;

  float: left;

  text-align: center;

  line-height: 50px;

  border-radius: 100%;

  font-size: 18px;

}



ul.sociel li a:hover {

  color: #fff;

  width: 50px;

  height: 50px;

  background: #181201;

  float: left;

  text-align: center;

  line-height: 50px;

  border-radius: 100%;

  font-size: 18px;

}



.contact {

  margin-top: 50px;

}



.contact h3 {

  color: #fff;

  font-weight: 500;

  font-size: 28px;

  line-height: 30px;

  padding-bottom: 30px;

  text-transform: uppercase;

}



.contact span {

  color: #fff;

  font-size: 17px;

  line-height: 27px;

}



ul.lik li a {

  color: #fff;

  font-size: 17px;

  line-height: 27px;

}



ul.lik li a:hover {

  color: #ffc221;

}



.copyright {

  background-color: #ffc221;

  padding: 20px 0px;

  margin-top: 70px;

}



.copyright p {

  color: #023023;

  font-size: 18px;

  line-height: 22px;

  text-align: center;

}



.copyright a:hover {

  color: #fff;

}



/** end footer section **/

/*---------------------------------------------------------------------

    ener page css

---------------------------------------------------------------------*/

.brand_color .titlepage h2 {

  font-weight: bold;

  font-size: 40px !important;

  text-transform: uppercase;

}



.brand_color {

  background-color: #ffc221;

}

.brand_color .titlepage {

  margin-top: 70px;

  padding-bottom: 70px;

  text-align: center;

}



.brand_color .abouttitle h2 {

  color: #fff;

  text-transform: uppercase;

  font-size: 40px;

  line-height: 45px;

  padding: 40px 0;

  font-weight: 500;

  text-align: center;

}



.contact .main_form {

  background: #fff;



  padding: 40px;

}



.form-control {

  border: #ffc221 solid 2px;

  border-radius: inherit;

  margin-bottom: 30px;

  padding: 13px 20px;

  font-family: poppins;

}

.form-control:focus {

  box-shadow: inherit;

  border: #ffc221 solid 2px !important;

}



.textarea {

  font-family: poppins;

  border: #ffc221 solid 2px;

  margin-bottom: 30px;

  padding: 13px 20px;

  width: 100%;

  padding-top: 40px;

}



.send {

  font-family: poppins;

  max-width: 212px;

  margin: 0 auto;

  display: block;

  background: #000;

  color: #fff;

  padding: 12px 0px;

  width: 100%;

  font-size: 17px;

}



.send:hover {

  background: #ffc221;

}



.product_page .title {

  text-align: center;

}



/** Lastestnews **/

.Lastestnews {

  padding: 90px 0px;

  background: #fff;

}

.Lastestnews .titlepage {

  text-align: center;

  margin-bottom: 60px;

}

.Lastestnews .titlepage span {

  color: #060606;

  font-size: 17px;

  line-height: 23px;

}

.Lastestnews .news-box {

  background: #fff;

  box-shadow: #ddd 0px 0px 8px 4px;

  margin-bottom: 30px;

}

.Lastestnews .news-box figure {

  margin: 0;

}

.Lastestnews .news-box figure img {

  width: 100%;

}

.Lastestnews .news-box h3 {

  font-size: 22px;

  line-height: 24px;

  color: #060606;

  font-weight: 500;

  padding: 20px 20px 4px 20px;

}

.Lastestnews .news-box span {

  color: #e61414;

  margin-left: 20px;

}

.Lastestnews .news-box p {

  color: #7b7a7a;

  font-size: 16px;

  line-height: 23px;

  padding: 7px 20px 20px 20px;

}

/** Lastestnews **/



.about {

  padding-top: 90px;

}

.about .about_box figure {

  margin: 0;

}

.about .about_box figure img {

  width: 100%;

}

.about .about_box h3 {

  color: #000;

  font-weight: bold;

  font-size: 30px;

  line-height: 35px;

}

.about .about_box p {

  color: #000;

  font-size: 17px;

  line-height: 23px;

  padding-top: 10px;

}



.about-bg {

  background-color: #ad2100;

  margin-bottom: 90px;

}



.about-bg .abouttitle h2 {

  color: #fff;

  text-transform: uppercase;

  font-size: 40px;

  line-height: 45px;

  padding: 40px 0;

  font-weight: 500;

  text-align: center;

}



.Currency-bg {

  background-color: #ad2100;

}



.Currency-bg .abouttitle h2 {

  color: #fff;

  text-transform: uppercase;

  font-size: 40px;

  line-height: 45px;

  padding: 40px 0;

  font-weight: 500;

  text-align: center;

}



.Request-bg {

  background-color: #ad2100;

}



.Request-bg .abouttitle h2 {

  color: #fff;

  text-transform: uppercase;

  font-size: 40px;

  line-height: 45px;

  padding: 40px 0;

  font-weight: 500;

  text-align: center;

}



.Team-bg {

  background-color: #ad2100;

}



.Team-bg .abouttitle h2 {

  color: #fff;

  text-transform: uppercase;

  font-size: 40px;

  line-height: 45px;

  padding: 40px 0;

  font-weight: 500;

  text-align: center;

}



/** slider arrow **/



#main_slider .carousel-control-prev,

#main_slider .carousel-control-next {

  width: 52px;

  height: 52px;

  background: #fffdfd;

  opacity: 1;

  font-size: 30px;

  color: #000;

}



#main_slider .carousel-control-prev:hover,

#main_slider .carousel-control-next:hover,

#main_slider .carousel-control-prev:focus,

#main_slider .carousel-control-next:focus {

  background: #ffc221;

  color: #fff;

}



#main_slider a.carousel-control-prev {

  position: absolute;

  left: 82px;

  bottom: 10px;

  top: inherit;

}



#main_slider a.carousel-control-next {

  position: absolute;

  left: 10px;

  top: inherit;

  bottom: 10px;

}



body{

        

    margin: 0;

  }



  .wccr_box_shadow{

    margin: 35px;

    box-shadow: 0 0px 65px 0 rgba(0, 0, 0, 0.2);

    border-radius: 30px;

  }

    .main_container{

      background-color: rgba(255, 255, 255, 0.12);

    }

  .fs_div_ img{

    width: 200px;

    padding: 25px;

    margin-top: 25px;

  }

  .sec_div_c_3333{

    display: flex;

    justify-content: center;

  }

  .four_div_co{

    width: 760px;

    padding: 20px;

    background-color: #FF7A28;

    border-radius: 60px;

   

  }

  .fooor_kjdg{

    display: flex;

    justify-content: center;

    margin-top: 25px;

  }



  .circle_div{

    border-radius: 100%;

    background-color: #16110e;

    width: 85px;

    height: 85px;

    border: 4px solid #fff;

    position: absolute;

    margin-top: -24px;

  }

  .circle_div img{

    width: 65px;

    height: 65px;

    margin: 7px 0px 0px 12px;

  }

  .poor_dsee{

    display: flex;

    justify-content: space-around;

  }

  .sec_exte{

    padding: 1px;

    background-color: #FF7A28;

    height: 25px;

    width: 0;



  }

  .sec_exte span{

    display: flex;

    justify-content: center;

    margin-top: 25px;

    font-family: 'Futura Std Condensed';

  }

  .fst_poor{

    width: 0;

    padding: 1px;

    background-color: #FF7A28;

    height: 25px;

  }

  .fst_poor span{

    display: flex;

    justify-content: center;

    margin-top: 25px;

    font-family: 'Futura Std Condensed';

  }



.slider {

-webkit-appearance: none;

width: 80%;

height: 30px;

border-radius: 30px;

background: #FF7A28;

outline: none;

opacity: 1;

-webkit-transition: .2s;

transition: opacity .2s;

}



/* .slider:hover {

opacity: 1;

} */



.slider::-webkit-slider-thumb {

-webkit-appearance: none;

appearance: none;

width: 80px;

height: 80px;

border-radius: 100%;

background: #000;

cursor: pointer;

background-image: url("../images/rating.png");

background-position: center;

background-repeat: no-repeat;

background-size: cover;

border: 4px solid #fff;



}



.slider::-moz-range-thumb {

width: 25px;

height: 25px;

border-radius: 50%;

background: #04AA6D;

cursor: pointer;

}

.Wccr_biggest_image {

display: flex;

justify-content: center;



}



.Wccr_biggest_image img{

width: 400px;

margin-bottom: 25px;

}

.progress_main span{

font-family: 'Futura Std Condensed';



}

#last_progress{

border-radius: 0px 30px 30px 0px;

}

  .four_div_co{

    width: 760px;

    padding: 20px;

    background-color: #FF7A28;

    border-radius: 60px;

   

  }

  .fooor_kjdg{

    display: flex;

    justify-content: center;

    margin-top: 25px;

  }



  .circle_div{

    border-radius: 100%;

    background-color: #16110e;

    width: 85px;

    height: 85px;

    border: 4px solid #fff;

    position: absolute;

    margin-top: -24px;

  }

  .circle_div img{

    width: 65px;

    height: 65px;

    margin: 7px 0px 0px 12px;

  }

  .poor_dsee{

    display: flex;

    justify-content: space-around;

  }

  .sec_exte{

    padding: 1px;

    background-color: #FF7A28;

    height: 25px;

    width: 0;



  }

  .sec_exte span{

    display: flex;

    justify-content: center;

    margin-top: 25px;

    font-family: 'Futura Std Condensed';

  }

  .fst_poor{

    width: 0;

    padding: 1px;

    background-color: #FF7A28;

    height: 25px;

  }

  .fst_poor span{

    display: flex;

    justify-content: center;

    margin-top: 25px;

    font-family: 'Futura Std Condensed';

  }

.slider {

-webkit-appearance: none;

width: 80%;

height: 30px;

border-radius: 30px;

background: #FF7A28;

outline: none;

opacity: 1;

-webkit-transition: .2s;

transition: opacity .2s;

}



/* .slider:hover {

opacity: 1;

} */



.slider::-webkit-slider-thumb {

-webkit-appearance: none;

appearance: none;

width: 80px;

height: 80px;

border-radius: 100%;

background: #000;

cursor: pointer;

background-image: url("../images/rating.png");

background-position: center;

background-repeat: no-repeat;

background-size: cover;

border: 4px solid #fff;



}



.slider::-moz-range-thumb {

width: 25px;

height: 25px;

border-radius: 50%;

background: #04AA6D;

cursor: pointer;

}

.Wccr_biggest_image {

display: flex;

justify-content: center;



}



.Wccr_biggest_image img{

width: 400px;

margin-bottom: 25px;

}

.sm_circle span {

width: 50px;

height: 50px;

background: #0f0f0f;

position: absolute;

border-radius: 100%;

}

.wccr_box_shadow {

margin: 35px;

box-shadow: 0 0px 65px 0 rgba(0, 0, 0, 0.2);

border-radius: 30px;

}

$number-of-options: 5;

html, body {

width: 100%;

height: 100%;

display: flex;

align-items: center;

justify-content: center;

font-family: 'Futura Std Condensed';

color: #000;

user-select: none;

}



#form-title {

    margin-top: 0;

    font-weight: 400;

    text-align: center;

}

.debt-amount-slider {

    display: flex;

    flex-direction: row;

    align-content: stretch;

    position: relative;

    width: 100%;

    height: 50px;

    user-select: none;

    &::before {

        content: " ";

        position: absolute;

        height: 20px;

        width: 100%;

        width: calc(100% * (#{$number-of-options - 1} / #{$number-of-options}));

        top: 50%;

        left: 50%;

        transform: translate(-50%, -50%);

        background: #FF7A28;

        border-radius: 30px;

    }

    input, label {

        box-sizing: border-box;

        flex: 1;

        user-select: none;

        cursor: pointer;

    }

    label {

        display: inline-block;

        position: relative;

        width: 20%;

        height: 100%;

        user-select: none;

        &::before {

            content: attr(data-debt-amount);

            position: absolute;

            left: 50%;

            padding-top: 10px;

            transform: translate(-50%, 45px);

            font-size: 14px;

            letter-spacing: 0.4px;

            font-weight: 700;

            white-space: nowrap;

            opacity: 0.85;

            transition: all 0.15s ease-in-out;

            font-family: 'Futura Std Condensed';

        }

        &::after {

            content: " ";

            position: absolute;

            left: 50%;

            top: 50%;

            transform: translate(-50%, -50%);

            width: 50px;

            height: 50px;

            border: 2px solid #ffffff;

            background: #000;

            border-radius: 50%;

            pointer-events: none;

            user-select: none;

            z-index: 1;

            cursor: pointer;

            transition: all 0.15s ease-in-out;

            background-image: url("../images/rating.png");

            background-position: center;

            background-repeat: no-repeat;

            background-size: cover;

        }

        &:hover::after {

            transform: translate(-50%, -50%) scale(1.25);

        }

    }

    input {

        display: none;

        &:checked {

            + label::before {

                font-weight: 800;

                opacity: 1;

            }

            + label::after {

                /* border-width: 4px; */

                transform: translate(-50%, -50%) scale(0.75);

                border: 4px solid #252E46;

            }

            /* ~ .debt-amount-pos {

                opacity: 1;

            } */

            @for $i from 1 through $number-of-options {

                &:nth-child(#{$i * 2 - 1}) ~ .debt-amount-pos {

                    left: #{($i * 20%) - 10%};

                }

            }

        }

    }

    .debt-amount-pos {

        display: block;

        position: absolute;

        top: 50%;

        width: 12px;

        height: 12px;

        background: #000;

        border-radius: 50%;

        transition: all 0.15s ease-in-out;

        transform: translate(-50%, -50%);

        border: 2px solid #fff;

        opacity: 0;

        z-index: 2;

    }

}

&:valid {

    .debt-amount-slider {

        input {

            + label::before {

                transform: translate(-50%, 45px) scale(0.9);

                transition: all 0.15s linear;

            }

            &:checked + label::before {

                transform: translate(-50%, 45px) scale(1.1);

                transition: all 0.15s linear;

            }

        }

    }

}

& + button {

    display: block;

    position: relative;

    margin: 56px auto 0;

    padding: 10px 20px;

    appearance: none;

    transition: all 0.15s ease-in-out;

    font-family: 'Futura Std Condensed';

    font-size: 24px;

    font-weight: 600;

    background: #fff;

    border: 2px solid #000;

    border-radius: 8px;

    outline: 0;

    user-select: none;

    cursor: pointer;

    &:hover {

        // transform: scale(1.1);

        background: #000;

        color: #fff;

        &:active {

            transform: scale(0.9);

        }

    }

    &:focus {

        background: #4caf50;

        border-color: #4caf50;

        color: #fff;

        pointer-events: none;

        &::before {

            animation: spin 1s linear infinite;

        }

    }

    &::before {

        display: inline-block;

        width: 0;

        opacity: 0;

        content: "\f3f4";

        font-family: 'Futura Std Condensed';

        font-weight: 900;

        margin-right: 0;

        transform: rotate(0deg);

    }

}

&:invalid + button {

    pointer-events: none;

    opacity: 0.25;

}

}

@keyframes spin {

from {

    transform: rotate(0deg);

    width: 24px;

    opacity: 1;

    margin-right: 12px;

}

to {

    transform: rotate(360deg);

    width: 24px;

    opacity: 1;

    margin-right: 12px;

}



}

.wccr_email{

    margin-top: 20px;

  }

  .wccr_email input{

    padding: 10px 10px;

  }

  .nxt_btn{

    margin-top: 20px;

  }

  .button_btn_sub {

    padding: 10px 30px;

    background-color: #252e46;

    width: 33%;

    align-items: center;

    display: flex;

    justify-content: center;

    gap: 14px;

    }

  

  .button_btn_sub a{

    color: #fff;

    text-decoration: none;

    font-family: 'Futura Std Condensed';

  }

  .second_div img{

    width: 500px;

  }

  .two_sdkk{

    /* margin-top: 40px; */

    width: 50%;

  }

  



  .radio_btn_d{

    display: inline-grid;

    text-align: center;

    padding: 14px;

  }

  .radio_btn_d span{

    font-size: 22px;

  }

  .radio_btn_d input{

    width: 20px;

    height: 20px;

  }

  .text_box{

    display: flex;

    flex-direction: column;

    margin-top: 20px;

  }

  .text_box span{

    font-size: 22px;

    font-weight: 500;

    color: #757575;

    font-family: sans-serif;

  }

  #text_dasss{

    background-color: #ddd;

    margin-top: 15px;

    border: 2px solid #9b9b9b;

  }

.wckk_star_all{

  display: flex;

}

.trip_btn_de {background-image: url("../images/tripadvisor.png");

background-repeat: no-repeat;

background-size: 38px 38px;

background-position-x: 4%;

background-position-y: center;

    

}



.trip_btn_de.se_2th_image {

background-image: url("../images/google.png");

background-repeat: no-repeat;

background-size: 38px 38px;

background-position-x: 4%;

background-position-y: center;

}

.trip_btn_de.se_3th_image {

background-image: url("../images/facebook.png");

background-repeat: no-repeat;

background-size: 38px 38px;

background-position-x: 4%;

background-position-y: center;

}



.trip_btn_de{

  padding: 12px 30px;

  background-color: #252e46;

  border: none;

  border-radius: 30px 30px 0px 30px;

  width: 200px;

      color: #ffffff;

}

.trip_btn_de a{

    text-decoration: none;

    color: #fff;

    font-family: 'Futura Std Condensed';

}

.wccr_all_socail_btn {

gap: 30px;

display: flex;

margin-top: 30px;

flex-direction: column;

align-items: center;



}

.Wccr_biggest_image {

display: flex;

justify-content: center;



}

body{

    margin: 0;

    font-family:'Futura Std Condensed';

    font-weight: 600;



  }



  .wccr_co_container{

    background-color: #fff;

    margin: 40px;

   

  }

  .wccr_email{

    margin-top: 20px;

  }

  .wccr_email input{

    padding: 10px 10px;

  }

  .nxt_btn{

    margin-top: 20px;

  }

  .button_btn_sub {

    padding: 10px 30px;

    background-color: #252e46;

    width: 33%;

    align-items: center;

    display: flex;

    justify-content: center;

    gap: 14px;

    }

  

  .button_btn_sub a{

    color: #fff;

    text-decoration: none;

    font-family: 'Futura Std Condensed';

  }

  .second_div img{

    width: 500px;

  }

  .two_sdkk{

    /* margin-top: 40px; */

    width: 50%;

  }

  



  .radio_btn_d{

    display: inline-grid;

    text-align: center;

    padding: 14px;

  }

  .radio_btn_d span{

    font-size: 22px;

  }

  .radio_btn_d input{

    width: 20px;

    height: 20px;

  }

  .text_box{

    display: flex;

    flex-direction: column;

    margin-top: 20px;

  }

  .text_box span{

    font-size: 22px;

    font-weight: 500;

    color: #757575;

    font-family: 'Futura Std Condensed';

  }

  #text_dasss{

    background-color: #ddd;

    margin-top: 15px;

    border: 2px solid #9b9b9b;

  }





.wckk_star_all{

  display: flex;

}

.wrcc_d33 {

display: flex;

align-items: center;

gap: 15px;

width: 35px;

height: 35px;

background-color: #252e46;

border-radius: 100%;

justify-content: center;

color: #fff;

padding: 15px;

}



.vrr_logo_dkd {display: flex;justify-content: center;}

.Wccr_biggest_image {

display: flex;

justify-content: center;



}

.wccr_ggle {

display: flex;

justify-content: start;

align-items: center;

gap: 20px;

padding-left: 40px;

}

.wccr_smsa_img img{

width: 100%;

max-width: 100px;

}

.wccr_3th_main{

    display: flex;

    justify-content: start;

    align-items: center;

    width: 100%;

}

.wccr_text_ar{

margin-top: 20px;

}

.wccr_text_ar textarea{

width: 300px;

height: 75px;

border: 0.3px solid #D3D3D3;

border-radius: 10px;

box-shadow: 0px 0 21px 0 rgba(0, 0, 0, 0.3);

font-family: 'Futura Std Condensed';

outline: none;

padding: 10px;

}

.rate {

float: left;

height: 46px;

/* padding: 0 10px; */

margin-bottom: 15px;

position: relative;

}

.rate:not(:checked) > input {

/* position:absolute;

top:-9999px;

 */

 position:absolute;

 opacity: 0;

 visibility: hidden;

}

.rate:not(:checked) > label {

float:right;

width:1em;

overflow:hidden;

white-space:nowrap;

cursor:pointer;

font-size:45px;

color:#fff;

}

.rate:not(:checked) > label:before {

    content: '★  ';

    

}

.rate > input:checked ~ label {

    color: #FF7A28; 

      

}

.rate:not(:checked) > label:hover,

.rate:not(:checked) > label:hover ~ label {

    color: #FF7A28;

}

.rate > input:checked + label:hover,

.rate > input:checked + label:hover ~ label,

.rate > input:checked ~ label:hover,

.rate > input:checked ~ label:hover ~ label,

.rate > label:hover ~ input:checked ~ label {

    color: #FF7A28;

}

  .sec_div_c{

    display: flex;

    justify-content: center;

    align-items: center;

    /* flex-direction: column; */

    width: 100%;

  }

  .sec_div_c_3333 span{

    font-size: 22px;

    margin: 20px;

    font-family: 'Futura Std Condensed';

    font-weight: 600;

    color: #000;

  }

  .four_div_co{

   ;

    border-radius: 60px;

   

  }

  .fooor_kjdg{

    display: flex;

    justify-content: center;

    margin-top: 25px;

  }



  .circle_div{

    border-radius: 100%;

    background-color: #16110e;

    width: 85px;

    height: 85px;

    border: 4px solid #fff;

    position: absolute;

    margin-top: -24px;

  }

  .circle_div img{

    width: 65px;

    height: 65px;

    margin: 7px 0px 0px 12px;

  }

  .poor_dsee{

    display: flex;

    justify-content: space-around;

  }

  .sec_exte{

    padding: 1px;

    background-color: #FF7A28;

    height: 25px;

    width: 0;



  }

  .sec_exte span{

    display: flex;

    justify-content: center;

    margin-top: 25px;

    font-family: 'Futura Std Condensed';

  }

  .fst_poor{

    width: 0;

    padding: 1px;

    background-color: #FF7A28;

    height: 25px;

  }

  .fst_poor span{

    display: flex;

    justify-content: center;

    margin-top: 25px;

    font-family: 'Futura Std Condensed';

  }









  .slidecontainer {

width: 100%;

margin-top: 25px;

text-align: center;

}



.slider {

-webkit-appearance: none;

width: 80%;

height: 30px;

border-radius: 30px;

background: #FF7A28;

outline: none;

opacity: 1;

-webkit-transition: .2s;

transition: opacity .2s;

}



/* .slider:hover {

opacity: 1;

} */



.slider::-webkit-slider-thumb {

-webkit-appearance: none;

appearance: none;

width: 80px;

height: 80px;

border-radius: 100%;

background: #000;

cursor: pointer;

background-image: url("../images/rating.png");

background-position: center;

background-repeat: no-repeat;

background-size: cover;

border: 4px solid #fff;



}

.slider::-moz-range-thumb {

width: 25px;

height: 25px;

border-radius: 50%;

background: #04AA6D;

cursor: pointer;

}



/* .slidecontainer p{

text-align: right;

} */



/* start footer */



.weecc_dttf {

background-image: url("../images/prev.png");

background-position: left;

background-repeat: no-repeat;

background-size: 38px 38px;

background-color: #252E46;

padding: 10px 15px;

border-radius: 22px;

transition: 180;

color: #fff;

width: 150px;

font-weight: 600;

background-position-x: 5%;

background-position-y: center;

}

.weecc_dttf a {

color: #fff;

text-decoration: none;

padding-left: 10px;

}



.sec_btn_dkdk{

background-image: url("../images/next.png");

background-position: right;

background-repeat: no-repeat;

background-size: 38px 38px;

background-color: #252E46;

padding: 10px 15px;

border-radius: 22px;

transition: 180;

width: 150px;

color: #fff;

font-weight: 600;

background-position-x: 96%;

background-position-y: center;



}



.sec_btn_dkdk a{

color: #fff;

text-decoration: none;

padding-right: 10px;

}

.Wccr_biggest_image {

display: flex;

justify-content: center;



}



.Wccr_biggest_image img{

width: 400px;

margin-bottom: 25px;

}



.f_1_div{

height: 20px;

width: 40px;

background-color: #FF7A28;

border-radius: 30px 0px 0px 30px;

}



.f_2_div{

height: 20px;

width: 40px;

background-color: #252E46;

}

.progress_main{

display: flex;

align-items: center;

gap: 5px;

}

.sm_circle span {

width: 50px;

height: 50px;

background: #0f0f0f;

position: absolute;

border-radius: 100%;

}

.wccr_box_shadow {

margin: 35px;

box-shadow: 0 0px 65px 0 rgba(0, 0, 0, 0.2);

border-radius: 30px;

height: auto;

}

.footer_part {

background-color: #F7F7F7;

padding: 40px;

display: flex;

justify-content: space-between;

margin-top: 25px;

box-shadow: 0px 0 65px 0 rgba(0, 0, 0, 0.2);

border-radius: 0px 0px 30px 30px;

}

















$number-of-options: 5;

html, body {

width: 100%;

height: 100%;

display: flex;

align-items: center;

justify-content: center;

font-family: 'Futura Std Condensed';

color: #000;

user-select: none;

}

.form-wrapper {

width: 100%;

display: flex;

flex-direction: column;

align-items: center;

margin-bottom: 30px;

margin-top: 30px;

}

form {

	/*width: 60%;

 max-width: 500px; */

#form-title {

    margin-top: 0;

    font-weight: 400;

    text-align: center;

}

.debt-amount-slider {

    display: flex;

    flex-direction: row;

    align-content: stretch;

    position: relative;

    width: 85%;

    height: 50px;

    gap: 260px;

    user-select: none;

    &::before {

        content: " ";

        position: absolute;

        height: 30px;

        width: 100%;

        width: calc(100% * (#{$number-of-options - 1} / #{$number-of-options}));

        top: 50%;

        left: 50%;

        transform: translate(-50%, -50%);

        background: #FF7A28;

        border-radius: 30px;

    }

    input, label {

        box-sizing: border-box;

        flex: 1;

        user-select: none;

        cursor: pointer;

    }

    label {

        display: inline-block;

        position: relative;

        width: 20%;

        height: 100%;

        user-select: none;

        &::before {

            content: attr(data-debt-amount);

            position: absolute;

            left: 50%;

            padding-top: 10px;

            transform: translate(-50%, 45px);

            font-size: 14px;

            letter-spacing: 0.4px;

            font-weight: 700;

            white-space: nowrap;

            opacity: 0.85;

            transition: all 0.15s ease-in-out;

            font-family: 'Futura Std Condensed';

        }

        &::after {

            content: " ";

            position: absolute;

            left: 50%;

            top: 50%;

            transform: translate(-50%, -50%);

            width: 60px;

            height: 60px;

            border: 2px solid #ffffff;

            background: #000;

            border-radius: 50%;

            pointer-events: none;

            user-select: none;

            z-index: 1;

            cursor: pointer;

            transition: all 0.15s ease-in-out;

            /*background-image: url("../images/rating.png");*/

            background:#000000;

            background-position: center;

            background-repeat: no-repeat;

            background-size: cover;

        }

        &:hover::after {

            transform: translate(-50%, -50%) scale(1.25);

        }

    }

    input {

        display: none;

        &:checked {

            + label::before {

                font-weight: 800;

                opacity: 1;

            }

            + label::after {

                /* border-width: 4px; */

                transform: translate(-50%, -50%) scale(1.2);

                border: 4px solid #252E46;

                background-image: url("../images/rating.png");

            }

            /* ~ .debt-amount-pos {

                opacity: 1;

            } */

            @for $i from 1 through $number-of-options {

                &:nth-child(#{$i * 2 - 1}) ~ .debt-amount-pos {

                    left: #{($i * 20%) - 10%};

                }

            }

        }

    }

    .debt-amount-pos {

        display: block;

        position: absolute;

        top: 50%;

        width: 12px;

        height: 12px;

        background: #000;

        border-radius: 50%;

        transition: all 0.15s ease-in-out;

        transform: translate(-50%, -50%);

        border: 2px solid #fff;

        opacity: 0;

        z-index: 2;

    }

}

&:valid {

    .debt-amount-slider {

        input {

            + label::before {

                transform: translate(-50%, 45px) scale(0.9);

                transition: all 0.15s linear;

            }

            &:checked + label::before {

                transform: translate(-50%, 45px) scale(1.1);

                transition: all 0.15s linear;

            }

        }

    }

}

& + button {

    display: block;

    position: relative;

    margin: 56px auto 0;

    padding: 10px 20px;

    appearance: none;

    transition: all 0.15s ease-in-out;

    font-family: 'Futura Std Condensed';

    font-size: 24px;

    font-weight: 600;

    background: #fff;

    border: 2px solid #000;

    border-radius: 8px;

    outline: 0;

    user-select: none;

    cursor: pointer;

    &:hover {

        // transform: scale(1.1);

        background: #000;

        color: #fff;

        &:active {

            transform: scale(0.9);

        }

    }

    &:focus {

        background: #4caf50;

        border-color: #4caf50;

        color: #fff;

        pointer-events: none;

        &::before {

            animation: spin 1s linear infinite;

        }

    }

    &::before {

        display: inline-block;

        width: 0;

        opacity: 0;

        content: "\f3f4";

        font-family: 'Futura Std Condensed';

        font-weight: 900;

        margin-right: 0;

        transform: rotate(0deg);

    }

}

&:invalid + button {

    pointer-events: none;

    opacity: 0.25;

}

}

@keyframes spin {

from {

    transform: rotate(0deg);

    width: 24px;

    opacity: 1;

    margin-right: 12px;

}

to {

    transform: rotate(360deg);

    width: 24px;

    opacity: 1;

    margin-right: 12px;

}



}









#signUpForm .form-header .stepIndicator {

  position: relative;

  flex: 1;

  padding-bottom: 30px;

}



#signUpForm .form-header .stepIndicator.active {

  font-weight: 600;

}



#signUpForm .form-header .stepIndicator.finish {

  font-weight: 600;

  color: #009688;

}



#signUpForm .form-header .stepIndicator::before {

  content: "";

  position: absolute;

  left: 50%;

  bottom: 0;

  transform: translateX(-50%);

  z-index: 9;

  width: 20px;

  height: 20px;

  background-color: #d5efed;

  border-radius: 50%;

  border: 3px solid #ecf5f4;

}



#signUpForm .form-header .stepIndicator.active::before {

  background-color: #a7ede8;

  border: 3px solid #d5f9f6;

}



#signUpForm .form-header .stepIndicator.finish::before {

  background-color: #009688;

  border: 3px solid #b7e1dd;

}



#signUpForm .form-header .stepIndicator::after {

  content: "";

  position: absolute;

  left: 50%;

  bottom: 8px;

  width: 100%;

  height: 3px;

  background-color: #f3f3f3;

}



#signUpForm .form-header .stepIndicator.active::after {

  background-color: #a7ede8;

}



#signUpForm .form-header .stepIndicator.finish::after {

  background-color: #009688;

}



#signUpForm .form-header .stepIndicator:last-child:after {

  display: none;

}







#signUpForm input:focus {

  border: 1px solid #009688;

  outline: 0;

}



#signUpForm input.invalid {

  border: 1px solid #ffaba5;

}



#signUpForm .step {

  display: none;

}



.submit_feedB{

  display: flex;

  flex-direction: row;

  }

  

  .sec_div_c span {

      font-size: 26px;

      font-family: 'Futura Std Condensed';

      font-weight: 600;

      padding: 25px;

      color: #000;

      /* width: 45%; */

      text-align: end;

  }



  

  .sec_div_c p {

      font-size: 22px;

      font-family: 'Futura Std Condensed';

      font-weight: 600;

      color: #000;

      margin-bottom: 30px;

  }

  .rate:not(:checked) > label {

    float: right;

    width: 60px;

    overflow: hidden;

    /* white-space: nowrap; */

    cursor: pointer;

    font-size: 37px;

    color: #fff;

}

.wrcc_star_s {

    background-color: #252e46;

    border-radius: 12px;

    margin-left: 10px;

    text-align: center;

}

.f_2_div.stepIndicator.active {

    background-color: #FF7A28;

}

.f_2_div.stepIndicator.finish{

     background-color: #FF7A28;

}

.wrcc_submit_f_m_page {

    max-width: 1200px;

    margin: 0 auto;

    text-align: center;

    width: 100%;

}

.wrcc_final_sbm_form {

    display: flex;

    /* justify-content: end; */

    align-items: center;

    flex-direction: row;

    width: 100%;

    gap: 10px;

}



.wrcc_final_sbm_form p {

    font-size: 18px;

    font-family: 'Futura Std Condensed';

    font-weight: 500;

    color: #000;

    width: 36%;

    text-align: left;

    padding: 25px;

}

.wrcc_space_1{

    width: 100%;

    height: 80px;

}



p.rating_overview {

    margin-top: 15px;

}

.vrcc_fix_width{

    width: 20%;

}

.wccr_smsa_img{

    width: 20%;

}

.vrcc_fix_star_width{

    width: 55%;

}

.vrcc_text_ar_fix_width{

    width: 30%;

}

.vrcc_sld_survey_f{

    background-color: #FF7A28;

    padding: 3px;

    border-radius: 35px;

    width: 30%;

}

.vrcc_sld_survey_f::after {

   content:'';

  display:block;

  width:20px;

  height:20px;

  border-radius: 100%;

  background-color:#000;

  position: absolute;

  transform: translate(340px, -10px);

}

.vrcc_dkdkdk::after{

  content:'';

  display:block;

  width:20px;

  height:20px;

  border-radius: 100%;

  background-color:#000;

  position: absolute;

  transform: translate(195px, -10px);

}

.vrcc_sld_survey_f-2{

    width: 30%;

    background-color: #FF7A28;

    padding: 3px;

    border-radius: 35px; 

}

.vrcc_servey_hh12{

    font-size: 16px;

    font-family: 'Futura Std Condensed';

    font-weight: 600;

    padding: 15px;

    color: #000;

    text-align: left;

    word-wrap: break-word;

}

.wrcc_final_sbm_form .vrcc_servey_hh12{
  width: 32%;
  text-align: end;
}
.wrcc_final_sbm_form .vrcc_st_mai12{
  width:68%;
  margin-top: 30px;
}

span.vrcc_circle1::after {

    transform: translate(-5px, -10px);

}

span.vrcc_circle2::after {

    transform: translate(42px, -10px);

}

span.vrcc_circle3::after {

    transform: translate(92px, -10px);

}

span.vrcc_circle4::after {

    transform: translate(145px, -10px);

}

span.vrcc_circle5::after {

    transform: translate(195px, -10px);

}

.vrcc_thank_u{

    display: flex;

    justify-content: center;

    flex-direction: column;

    align-items: center;

}

.vrcc_thank_u h2{

    font-size: 26px;

    font-family: 'Futura Std Condensed';

    font-weight: 600;

    padding: 25px;

    color: #000;

}

.vrcc_thank_u p{

    font-size: 16px;

    font-family: 'Futura Std Condensed';
    padding: 0px 25px 25px 25px;
    width: 650px;

}

.submit_feedB h2{

    margin-top: 25px;

    font-weight: 700;

    font-size: 28px;

}

.vrxx_common_circle::after{

        content: '';

    display: block;

    width: 20px;

    height: 20px;

    border-radius: 100%;

    background-color: #000;

    position: absolute;

}

.vrxx_common_circle.active::after{

    content: '';

    display: block;

    width: 30px;

    height: 30px;

    border-radius: 100%;

    background-color: #000;

    position: absolute;

    background-image: url(../images/rating.png);

    background-repeat: no-repeat;

    background-position: center;

    background-size: cover;

    border: 2px solid #000;

}

.vrcc_survey_lst22{

    width: 100%;

    display: flex;

    align-items: center;

    /* justify-content: center; */

    padding: 25px 0px;

}

 .vrcc_review_lst00 p{

    font-size: 18px;

    font-family: 'Futura Std Condensed';

    font-weight: 500;

    color: #000;

    text-align: left;

    padding: 25px;

    word-break: break-word;

}

.vrcc_star_aa{

    background: unset;

}

label.wrcc_star_s.vrcc_star_aa {

    color: yellow;

    width: unset;

}

.label.wrcc_star_s.vrcc_star_aa:hover{

    color: yellow;

}

.rate.vrcc_st_mai12 > input:checked ~ label{

    color: unset !important;

}

/*.rate.vrcc_st_mai12:not(:checked) > label:hover,*/

/*.rate.vrcc_st_mai12:not(:checked) > label:hover ~ label {*/

/*    color: yellow !important;*/

/*}*/

.rate.vrcc_st_mai12 > input:checked + label:hover,

.rate.vrcc_st_mai12 > input:checked + label:hover ~ label,

.rate.vrcc_st_mai12 > input:checked ~ label:hover,

.rate.vrcc_st_mai12 > input:checked ~ label:hover ~ label,

.rate.vrcc_st_mai12 > label:hover ~ input:checked ~ label {

    color: unset !important;

}

.vrcc_summery_product_image{

    width: 32%;

    display: flex;

    justify-content: end;

    align-items: center;

}
.vrcc_survey_lst22 .vrcc_st_mai12 {
  width: 23%;
  padding-left: 10px;
}
.vrcc_survey_lst22 .vrcc_review_lst00 {
  width: 44%;
}

.rate.vrcc_st_mai12{

    width: 40%;

}

.vrcc_review_lst00{

    width: 35%;

}

.vrcc_summery_product_image img{

    width: 100px;
    display: none;

}

label.wrcc_star_s.active {

    color: #FF7A28;

} 

/*.wrcc_submit_f_m_page .vrcc_st_mai12 .wrcc_star_s.active:hover {*/

/*    color: unset !important;*/

/*} */

.vrcc_st_mai12 label{

    float: left;

    width: 45px;

    overflow: hidden;

    cursor: pointer;

    font-size: 25px;

    color: #fff;

    border-radius: 7px;

    margin-bottom: 0px;

}

.vrcc_st_mai12 .wrcc_star_s::before{

    content: '★';

}

.wrcc_survery_su_p145{

    max-width: 1200px;

    margin: 0 auto;

    text-align: center;

    width: 100%;

}
.vrcc_sld_survey_f-2.Never .vrcc_circle1::after {
    content: '';

    display: block;

    width: 20px;

    height: 20px;

    border-radius: 100%;

    background-color: #000;

    position: absolute;
    transform: translate(-5px, -10px) ; 
}

.vrcc_sld_survey_f-2.Probably.not .vrcc_circle2::after {
  content: '';

  display: block;

  width: 20px;

  height: 20px;

  border-radius: 100%;

  background-color: #000;

  position: absolute;
  transform: translate(85px, -10px) ; 
}
.vrcc_sld_survey_f-2.May.be .vrcc_circle3::after {
  content: '';

  display: block;

  width: 20px;

  height: 20px;

  border-radius: 100%;

  background-color: #000;

  position: absolute;
  transform: translate(170px, -10px) ; 
}
.vrcc_sld_survey_f-2.Most.probably .vrcc_circle4::after {
  content: '';

  display: block;

  width: 20px;

  height: 20px;

  border-radius: 100%;

  background-color: #000;

  position: absolute;
  transform: translate(255px, -10px) ; 
}
.vrcc_sld_survey_f-2.Definitely .vrcc_circle5::after {
  content: '';

  display: block;

  width: 20px;

  height: 20px;

  border-radius: 100%;

  background-color: #000;

  position: absolute;
  transform: translate(340px, -10px) ; 
}
/* .vrcc_circle3::after{

    content: '';

    display: block;

    width: 20px;

    height: 20px;

    border-radius: 100%;

    background-color: #000;

    position: absolute;

    transform: translate(220px, -10px);

} */

.vrcc_sld_survey_f.width-1::after {

    transform: translate(-5px, -10px);

}

.vrcc_sld_survey_f.width-2::after {

    transform: translate(35px, -10px);

}

.vrcc_sld_survey_f.width-3::after {

    transform: translate(70px, -10px);

}

.vrcc_sld_survey_f.width-4::after {

    transform: translate(105px, -10px);

}

.vrcc_sld_survey_f.width-5::after{

    transform: translate(140px, -10px);

}

.vrcc_sld_survey_f.width-6::after {

    transform: translate(175px, -10px);

}

.vrcc_sld_survey_f.width-7::after {

    transform: translate(210px, -10px);

}

.vrcc_sld_survey_f.width-8::after {

    transform: translate(245px, -10px);

}

.vrcc_sld_survey_f.width-9::after {

    transform: translate(300px, -10px);

}

.vrcc_sld_survey_f.width-10::after {

    transform: translate(350px, -10px);

}

.wrcc_survey_m_div {
  box-shadow: 0 0px 65px 0 rgba(0, 0, 0, 0.2);
  border-radius: 20px;
  margin-bottom: 35px;
}

.wrcc_overall_10_circle .slider{
  display: none;
}

.reivew_action_wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
  align-content: center;
}
.wrcc_action_button{
    width: 50%;
    display: flex;
    align-items: center;
    gap: 20px;
    justify-content: center;
    padding: 30px;
}

.wrcc_action_button button {
  width: 200px;
  padding: 10px;
  background-color: #252E45;
  color: #fff;
  font-weight: 600;
  border-radius: 30px 30px 0px 30px;
  border: none;
  cursor: pointer;
}


#form-title {

  margin-top: 0;

  font-weight: 400;

  text-align: center;

}
.wrcc_debt_amount_slider {

  display: flex;

  flex-direction: row;

  align-content: stretch;

  position: relative;

  width: 80%;

  gap: 80px;

  height: 50px;

  user-select: none;

  &::before {

      content: " ";

      position: absolute;

      height: 20px;

      width: 100%;

      width: calc(100% * (#{$number-of-options - 1} / #{$number-of-options}));

      top: 50%;

      left: 50%;

      transform: translate(-50%, -50%);

      background: #FF7A28;

      border-radius: 30px;

  }

  input, label {

      box-sizing: border-box;

      flex: 1;

      user-select: none;

      cursor: pointer;

  }

  label {

      display: inline-block;

      position: relative;

      width: 20%;

      height: 100%;

      user-select: none;

      &::before {

          content: attr(data-debt-amount);

          position: absolute;

          left: 50%;

          padding-top: 10px;

          transform: translate(-50%, 45px);

          font-size: 14px;

          letter-spacing: 0.4px;

          font-weight: 700;

          white-space: nowrap;

          opacity: 0.85;

          transition: all 0.15s ease-in-out;

          font-family: 'Futura Std Condensed';

      }

      &::after {

          content: " ";

          position: absolute;

          left: 50%;

          top: 50%;

          transform: translate(-50%, -50%);

          width: 50px;

          height: 50px;

          border: 2px solid #ffffff;

          background: #000;

          border-radius: 50%;

          pointer-events: none;

          user-select: none;

          z-index: 1;

          cursor: pointer;

          transition: all 0.15s ease-in-out;

          background-position: center;

          background-repeat: no-repeat;

          background-size: cover;

      }

      &:hover::after {

          transform: translate(-50%, -50%) scale(1.25);

      }

  }

  input {

      display: none;

      &:checked {

          + label::before {

              font-weight: 800;

              opacity: 1;

          }

          + label::after {

              /* border-width: 4px; */

              transform: translate(-50%, -50%) scale(0.75);

              border: 4px solid #252E46;

              background-image: url('../images/rating.png');

              width: 80px;

              height: 80px;


          }

          /* ~ .debt-amount-pos {

              opacity: 1;

          } */

          @for $i from 1 through $number-of-options {

              &:nth-child(#{$i * 2 - 1}) ~ .debt-amount-pos {

                  left: #{($i * 20%) - 10%};

              }

          }

      }

  }

  .debt-amount-pos {

      display: block;

      position: absolute;

      top: 50%;

      width: 12px;

      height: 12px;

      background: #000;

      border-radius: 50%;

      transition: all 0.15s ease-in-out;

      transform: translate(-50%, -50%);

      border: 2px solid #fff;

      opacity: 0;

      z-index: 2;

  }

}

&:valid {

  .wrcc_debt_amount_slider {

      input {

          + label::before {

              transform: translate(-50%, 45px) scale(0.9);

              transition: all 0.15s linear;

          }

          &:checked + label::before {

              transform: translate(-50%, 45px) scale(1.1);

              transition: all 0.15s linear;


          }

      }

  }

}

& + button {

  display: block;

  position: relative;

  margin: 56px auto 0;

  padding: 10px 20px;

  appearance: none;

  transition: all 0.15s ease-in-out;

  font-family: 'Futura Std Condensed';

  font-size: 24px;

  font-weight: 600;

  background: #fff;

  border: 2px solid #000;

  border-radius: 8px;

  outline: 0;

  user-select: none;

  cursor: pointer;

  &:hover {

      // transform: scale(1.1);

      background: #000;

      color: #fff;

      &:active {

          transform: scale(0.9);

      }

  }

  &:focus {

      background: #4caf50;

      border-color: #4caf50;

      color: #fff;

      pointer-events: none;

      &::before {

          animation: spin 1s linear infinite;

      }

  }

  &::before {

      display: inline-block;

      width: 0;

      opacity: 0;

      content: "\f3f4";

      font-family: 'Futura Std Condensed';

      font-weight: 900;

      margin-right: 0;

      transform: rotate(0deg);

  }

}

&:invalid + button {

  pointer-events: none;

  opacity: 0.25;

}

}

@keyframes spin {

from {

  transform: rotate(0deg);

  width: 24px;

  opacity: 1;

  margin-right: 12px;

}

to {

  transform: rotate(360deg);

  width: 24px;

  opacity: 1;

  margin-right: 12px;

}



}



/* product page css 04-09-2024 */



.wrcc_product_wraaper_page{
  margin: 0 auto;
  max-width: 1160px;
  padding: 0;
}

.wrcc_product_section{
  padding: 10px 25px;
}
.wrcc_restaurant_name h1{
  font-size: 36px;
  font-weight: 700;
  margin: 0;
}
.wrcc_restaurant_name span{
  font-size: 16px;
  font-weight: 700;
  margin: 0;
}
.wrcc_restaurant_image{
  width: 100%;
  display: flex;
  max-height: 600px;
  height: 380px;
}
.wrcc_main_banner{
  width: 60%;
  padding-right: 15px;
}
.wrcc_main_banner img{
  width: 100%;
  height: 100%;
}
.wrcc_last_image{
  width: 20%;
  display: flex;
  justify-content: center;
  
}
.wrcc_last_image img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.wrcc_secon_image {
  width: 20%;
  padding-right: 15px;
  display: flex;
  flex-direction: column;
  gap: 15px;
  height: 100%;
}
.wrcc_small_img_1 img{
  width: 100%;
  height: 100%;
}
.wrcc_small_img_2 img{
  width: 100%;
  height: 100%;
}
.wrcc_small_img_1{
  height: 50%;
}
.wrcc_small_img_2{
  height: 50%;
}
.wrcc_view_gallery{
  position: absolute;
  text-align: center;
  color: #fff;
  font-weight: 700;
  font-size: 16px;
  transform: translate(0px, 130px);
}
.wrcc_lst_img{
  filter: brightness(0.3);
  height: 100%;
  cursor: pointer;
}

.wrcc_img_hover:hover {
  transform: scale(1.05);
  filter: brightness(1.05);
  cursor: pointer;
}
.wrcc_main_banner .wrcc_img_hover:hover {
  transform: scale(1.015);
  filter: brightness(1.05);
}
.wrcc_img_hover {
  transition: transform 0.4s ease-in-out, opacity 1.63s, filter 0.4s;
}

.wrcc_third_section{
  display: flex;
  width: 100%;
}
.wrcc_product_name{
  width: 50%;
}
.wrcc_name_review{
  width: 50%;
  display: flex;
  align-items: center;
  gap: 20px;
}
.wrcc_product_review_star {
  width: 50px;
  background-color: #FF7A28;
  text-align: center;
  color: #fff;
  padding: 3px 0px;
  cursor: pointer;
  border-radius: 3px;
  height: 30px;
}
.wrcc_product_star{
  display: flex;
  width: 50%;
  gap: 12px;
}
.wrcc_4th_section{
  display: flex;
}
.wrcc_star_rating_product {
  padding: 5px 15px;
  background-color: #252E45;
  color: #fff;
  font-size: 20px;
  border-radius: 6px;
  cursor: pointer;
}
.wrcc_name_review button {
  width: 200px;
  padding: 10px;
  background-color: #252E45;
  color: #fff;
  font-weight: 600;
  border-radius: 30px 30px 0px 30px;
  border: none;
  cursor: pointer;
}
.wrcc_5th_section{
  display: flex;
  justify-content: space-around;
  width: 100%;
  gap: 30px;
  margin-top: 20px;
}
.wrcc_takeaway_part{
  width: 25%;

}
.wrcc_booktable_part{
  width: 25%;  

}
.wrcc_giftcard_part{
  width: 25%;
}
.wrcc_loyalty_part{
  width: 25%;
}
.wrcc_card_design{
  box-shadow: 0px 0px 44px -8px #C1C3D4;
  height: auto;
  border-radius: 20px;
  padding-bottom: 10px;
}

.wrcc_card_img img {
  width: 100%;
  height: 150px;
  object-fit: cover;
  border-radius: 20px 20px 0px 0px;
}
.wrcc_card_tittle{
  text-align: center;
  padding-top: 15px;
}
.wrcc_card_tittle span{
  font-size: 22px;
  font-weight: 700;
  text-transform: uppercase;
}
.wrcc_scroll_section{
  display: flex;
  gap: 20px;
  border-bottom: 3px solid #dddddd;
}
.wrcc_scroll_title{
  font-size: 22px;
  font-weight: 700;
}
.wrcc_scroll_name.active{
  color: #FF7A28;
  border-bottom: 4px solid #FF7A28;
  padding-bottom: 10px;

}
.wrcc_card_3{
  display: flex;
  justify-content: space-between;
  margin-bottom: 25px;
}
.wrcc_card_reviews{
  display: flex;
  width: 100%;
  padding-top: 20px;
}
.wrcc_review_icon{
  width: 35%;
  text-align: center;

}
.wrcc_customer_name{
  width: 65%;
}
.wrcc_review_icon img{
  width: 40px;
  height: auto;    
}
.wrcc_customer_name span{
  font-size: 16px;
  font-weight: 700;
}
.wrcc_customer_name p{
  font-size: 18px;
  font-weight: 500;
  margin: 0;
  padding-top: 10px;
  color: #626262;
}
.wrcc_card_stars {
      display: flex;
      gap: 10px;
      justify-content: center;
      padding-top: 15px;
}
.wrcc_star_rating_product .wrcc_stars.active{
  color: #FF7A28;
} 
.wrcc_card_comment{
  padding-top: 15px;
}
.wrcc_card_comment span{
  font-size: 16px;
  font-weight: 700;
  padding-left: 28px;
}
.wrcc_card_like_dislike {
  display: flex;
  justify-content: center;
  width: 100%;
  padding-top: 15px;
}
.wrcc_like_svg svg{
  width: 20px;
  height: 20px;
  fill: #C1C3D4;
}
.wrcc_card_like_div {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50%;
  gap: 10px;
}
.wrcc_card_like_div span{
  color: #C1C3D4;
  font-size: 16px;
  font-weight: 600;
}
.wrcc_card_comment_icon {
  width: 50%;
  display: flex;
  justify-content: center;
  gap: 5px;
}
.wrcc_card_stars .wrcc_star_rating_product{
  padding: 0px 10px;
}
.wrcc_dislike .wrcc_like_svg svg{
  transform: rotate(180deg);
}
.wrcc_loyalty_part .wrcc_card_img img{
  object-fit: contain;
}
body span{
  font-family: 'Futura Std Condensed';
}
.slidecontainer.wrcc_overall_10_circle{
  margin-top: 0px;
}
/* .sec_div_c span:first-child{
  padding-bottom: 0px;
} */

/* .wrcc_overall_10_circle .wrcc_overall_cir:last-child{
  margin-top: 0px;
} */

.wcrcc_main_wrapper_143 .sec_div_c{
  flex-direction: column;
}
.wrcc_fill_review{
  box-shadow: 0 0px 65px 0 rgba(0, 0, 0, 0.2);
  border-radius: 30px;
  width: 1200px;
  margin: auto;
}

/* review range slider css code */

.wrcc_range_container {
	display: flex;
	align-items: center;
	justify-content: center;
}

.wrcc_range-slider {
	position: relative;
	width: 1100px;
	height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.wrcc_range-slider .vrcc_fix_star_width{
  width: 33%;
}

.wrcc_range-slider_input {
	width: 100%;
	position: absolute;
	top: 50%;
	z-index: 3;
	transform: translateY(-50%);
	-webkit-appearance: none;
  	appearance: none;
  	width: 100%;
  	height: 4px;
  	opacity: 0;
	margin: 0;
}

.wrcc_range-slider_input::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 100px;
  height: 100px;
  cursor: pointer;
	border-radius: 50%;
	opacity: 0;
}

.wrcc_range-slider_input::-moz-range-thumb {
  	width: 14vmin;
  	height: 14vmin;
  	cursor: pointer;
	border-radius: 50%;
	opacity: 0;
}

.wrcc_range-slider_thumb {
	width: 50px;
	height: 50px;
	border: 2.5px solid #252E46;
	border-radius: 50%;
	position: absolute;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	background-color: #FF7A28;
	display: flex;
	justify-content: center;
	align-items: center;
	font-weight: 700;
	font-size: 18px;
	color: #fff;
	z-index: 2;
}

.wrcc_range-slider_line {
	height: 20px;
	width: 100%;
	border-radius: 50px;
	background-color: #252E46;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	position: absolute;
	z-index: 1;
}

.wrcc_range-slider_line-fill {
	position: absolute;
	height: 20px;
	width: 0;
	background-color: #FF7A28;
	border-radius: 50px;
}

.wrcc_fill_review .form-wrapper.wrcc_overall_cir{
  display: none;
}
.wrcc_review_fill_wprapper .wrcc_fill_review:last-child{
  margin-top: 30px;
}
.wrcc_fill_review .sec_div_c .wrcc_fs_second_text{
  padding-top: 20px;
  padding-bottom: 0px;
}

.wrcc_review_sm_responsive .sec_div_c{
  flex-direction: column;
}
.wrcc_review_sm_responsive .sec_div_c .ratting_main.vrcc_fix_star_width{
width: unset;
}

/* redesign css 13-12-2024 */

 .vrcc_st_mai12 .wrcc_star_s:first-child{
  margin-left: 0px;
}



@media (min-width: 768px) and (max-width: 1025px){

.progress_main span{

    font-family: 'Futura Std Condensed';

    font-weight: 800;

    font-size: 20px;

}

.f_1_di{

    width: 35px !important;

}

.f_2_d{

    width: 35px !important;

}

.progress_main{

    gap: 3px;

}

.wccr_text_ar textarea{

    margin: 25px 0px 25px 10px;

}

.sec_div_c{

    margin-bottom: 25px;

}

.sec_btn_dkdk{

    width: 125px;

    padding: 10px 0px;

    font-weight: 800;

    border-radius: 100px;

}

.weecc_dttf{

    padding: 10px 0px;

    width: 125px;

    padding: 30px;

    font-weight: 800;

    border-radius: 60px;

}

.wccr_all_socail_btn p{

    font-size: 16px;

    margin: 0px 55px;

    font-weight: 600;

    font-family: 'Futura Std Condensed';

}

.vrcc_thank_u p {

    padding: 20px 40px;

}

}

@media only screen and (max-width: 480px) {

.footer_part{

    padding: 22px 8px;

}

.sec_div_c_3333 span{

    font-size: 16px;

}

.sec_div_c span{

    font-size: 18px;

    padding: 20px;

}

.wrcc_btn_next1188{

    display: flex;

    justify-content: end;

} 

.slider {

    height: 20px;

}

.slider::-webkit-slider-thumb {

    -webkit-appearance: none;

    appearance: none;

    width: 40px;

    height: 40px;

    border-radius: 100%;

    background: #000;

    cursor: pointer;

    background-image: url("../images/rating.png");

    background-position: center;

    background-repeat: no-repeat;

    background-size: cover;

    border: 2px solid #fff;

}

.sec_btn_dkdk {

    background-size: 25px 25px;

    padding: 5px 9px;

    width: 70px;

    font-weight: 100;

    font-size: 12px;

    padding-right: 30px;

}

.sec_div_c span{

    padding: 0;

    font-size: 16px;

    font-weight: 600;

}

.f_1_div{

    height: 10px;

    width: 15px;

}

.progress_main{

    gap: 2px;

}

.weecc_dttf{

    font-size: 12px;

    width: 80px;

    font-weight: 400;

    padding: 5px 6px;

    background-size: 25px 25px;

    padding-left: 30px;

}

.f_2_div{

    height: 10px;

    width: 15px;

}

.sec_div_c p{

    font-size: 16px;

    font-weight: 400;

    padding: 10px;

    text-align: center;

    margin-bottom: 0;

}

.debt-amount-slider::before{

    height: 12px !important;

}

.debt-amount-slider label:before{

    font-size: 9px !important;

    font-weight: 400 !important;

}

.debt-amount-slider label:after{

    width: 20px !important;

    height: 20px !important;

}

.submit_feedB span{

    font-size: 14px;

    font-weight: 600;

}

.submit_feedB h2{

    font-size: 16px;

    font-weight: 600;

}

.wccr_all_socail_btn p{

    margin: 0px 30px;

}



span.vrcc_servey_hh12 {

    font-size: 14px;

    font-weight: 600;

    width: 43%;

    padding: 15px;

}

.wrcc_final_sbm_form .vrcc_servey_hh12{
  width: 100%;
  text-align: center;
}

.vrcc_sld_survey_f{

    width: 32%;

}

.wrcc_final_sbm_form p{

    width: 25%;

    padding: 15px;

    font-weight: 400;

    font-size: 12px;

}
.vrcc_sld_survey_f-2{
  width: 40%;
}

.vrcc_sld_survey_f-2.Definitely .vrcc_circle1::after {

    transform: translate(-5px, -10px);

}

.vrcc_sld_survey_f-2.Definitely .vrcc_circle2::after {

    transform: translate(28px, -10px);

}

.vrcc_sld_survey_f-2.Definitely .vrcc_circle3::after {

    transform: translate(65px, -10px);

}

.vrcc_sld_survey_f-2.Definitely .vrcc_circle4::after {

    transform: translate(105px, -10px);

}

.vrcc_sld_survey_f-2.Definitely .vrcc_circle5::after {

    transform: translate(135px, -10px);

}

.vrxx_common_circle::after{

    width: 12px;

    height: 12px;

}

.vrxx_common_circle.active::after{

    width: 15px;

    height: 15px;

}

.step .debt-amount-slider {

    gap: 60px;

}

.wccr_3th_main{

    flex-direction: column;

    gap: 10px;

}

.vrcc_fix_width {

    width: 100%;

    justify-content: center;

}

.wccr_smsa_img {

    width: 100%;

}

.vrcc_fix_star_width {

    width: 100%;

    display: flex;

    flex-direction: column;

            align-items: center;

}

.vrcc_text_ar_fix_width{

    width: unset;

}

.wrcc_space_1 {

    display: none;

}

.vrcc_thank_u p {

    font-size: 12px;

    font-family: 'Futura Std Condensed';

    padding: 25px;

    text-align: center;
    width: auto;

}

.rate:not(:checked) > label {

    float: right;

    width: 35px;

    overflow: hidden;

    /* white-space: nowrap; */

    cursor: pointer;

    font-size: 22px;

    color: #fff;

    border-radius: 5px;

}
.ratting_main.vrcc_fix_star_width .rate{
  display: flex;
  flex-direction: row-reverse;
}

.vrcc_review_lst00 {

    width: 100%;

    padding: 0px 25px;

}

.vrcc_summery_product_image {

    width: 100%;

    display: flex;

    justify-content: center;

}
.wrcc_submit_f_m_page{
  max-width: 390px;
}
.vrcc_sld_survey_f.width-7::after {
  transform: translate(100px, -10px);
}
.vrcc_fix_width {
  width: 100%;
  justify-content: start;
  gap: 10px;
  padding-left: 20px;
}
.wccr_text_ar {
  margin-top: 20px;
  margin-bottom: 22px;
}
/* .wccr_text_ar textarea {
  width: 265px;
} */
.vrcc_sld_survey_f.width-6::after {
  transform: translate(57px, -10px);
}


.wrcc_debt_amount_slider{
  width: 85%;
  gap: 20px;
}

.wrcc_debt_amount_slider::before{
  width: 100%;
  height: 10px;

}

.wrcc_debt_amount_slider {
  & label { 
      &::after {
  content: " ";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 20px;
  height: 20px;
  border: 2px solid #ffffff;
  background: #000;
  border-radius: 50%;
  pointer-events: none;
  user-select: none;
  z-index: 1;
  cursor: pointer;
  transition: all 0.15s ease-in-out;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  }
}
}

.wrcc_debt_amount_slider {
  & input {
      &:checked{
+label::after {
  /* border-width: 4px; */
  transform: translate(-50%, -50%) scale(0.75);
  border: 4px solid #252E46;
  background-image: url('../images/rating.png');
  width: 40px;
  height: 40px;
}
  }
}
}

.form-wrapper {
  padding-top: 10px;
}
.form-wrapper textarea{
  margin: 0 auto;
  width: 285px;
}

/* product page */

.wrcc_5th_section{
  flex-direction: column;
}
.wrcc_card_design{
  width: 100%;
}
.wrcc_4th_section {
  flex-direction: column-reverse;
  gap: 20px;
}
.wrcc_product_star{
  width: 100%;

}
.wrcc_card_3{
  flex-direction: column;
  gap: 30px;
}
.wrcc_fill_review{
  width: 92%;
  border-radius: 15px;
  padding: 0px 15px;
}
.wrcc_range-slider{
  width: 100%;
  height: 60px;
}
.wrcc_fill_review .sec_div_c span{
  text-align: left;
  padding-top: 15px;
}

.wrcc_fill_review_201{
  margin: 15px;
}
.wrcc_range-slider_thumb {
  width: 35px;
  height: 35px;
}
.wrcc_range-slider_line{
  height: 12px;
}
.wrcc_range-slider_line-fill{
  height: 12px;
}
.wrcc_overall_10_circle{
  display: none;
}
.wrcc_review_sm_responsive .sec_div_c{
  flex-direction: column;
  margin-bottom: 12px;
}
.wrcc_review_sm_responsive .sec_div_c span{
  padding-bottom: 7px;
}
.wccr_box_shadow.wrcc_repon_review{
  margin: 20px;
}
.wrcc_final_sbm_form .vrcc_sld_survey_f {
  width: 40%;
}
.wrcc_sbm_child .wrcc_final_sbm_form p{
  width: 20%;
  text-align: center;
}
.wrcc_booking_submit_survey .wrcc_final_sbm_form{
  flex-direction: column;
}
.wrcc_booking_submit_survey .wrcc_final_sbm_form .vrcc_servey_hh12{
  width: unset;
}
.wrcc_booking_submit_survey .wrcc_final_sbm_form .vrcc_st_mai12{
  width: unset;
}
.wrcc_survey_m_div .reivew_action_wrapper{
  flex-direction: column;
}
.vrcc_survey_lst22 .vrcc_st_mai12 {
  display: flex;
  width: 100%;
  justify-content: center;
}
.wrcc_final_sbm_form .vrcc_st_mai12 {
  width: 100%;
  display: flex;
  justify-content: center;
  margin-top: 0;
}
.wrcc_final_sbm_form{
  flex-direction: column;
  gap: 0;
}

.vrcc_sld_survey_f.width-1::after {

  transform: translate(-5px, -10px);

}

.vrcc_sld_survey_f.width-2::after {

  transform: translate(10px, -10px);

}

.vrcc_sld_survey_f.width-3::after {

  transform: translate(20px, -10px);

}

.vrcc_sld_survey_f.width-4::after {

  transform: translate(30px, -10px);

}

.vrcc_sld_survey_f.width-5::after{

  transform: translate(65px, -10px);

}

.vrcc_sld_survey_f.width-6::after {

  transform: translate(76px, -10px);

}

.vrcc_sld_survey_f.width-7::after {

  transform: translate(80px, -10px);

}

.vrcc_sld_survey_f.width-8::after {

  transform: translate(95px, -10px);

}

.vrcc_sld_survey_f.width-9::after {

  transform: translate(115px, -10px);

}

.vrcc_sld_survey_f.width-10::after {

  transform: translate(140px, -10px);

}
.wrcc_01paa p{
  padding-bottom: 0px;
}
.vrcc_sld_survey_f-2.May.be .vrcc_circle1::after {
  transform: translate(-5px, -10px);
}
.vrcc_sld_survey_f-2.May.be .vrcc_circle2::after {
  transform: translate(30px, -10px);
}
.vrcc_sld_survey_f-2.May.be .vrcc_circle3::after {
  transform: translate(65px, -10px);
}
.vrcc_sld_survey_f-2.May.be .vrcc_circle4::after {
  transform: translate(92px, -10px);
}
.vrcc_sld_survey_f-2.May.be .vrcc_circle5::after {
  transform: translate(135px, -10px);
}
}