/* 
  Template Name: Hossmate - Automobile Bootstrap Template
  Template URI: https://www.designtocodes.com/product/hossmate-automobile-bootstrap-template/
  Description: Hossmate Automobile Template is a paid and elegant website template that is built on Bootstrap.
  Author: DesigntoCodes
  Author URI: https://www.designtocodes.com
  Text Domain: Hossmate
*/

/* =========================================== FAQ page css start ===========================================*/

.d2c_FAQ_main {
  padding: 100px 0px 100px 0px;
  background-image: url("../images/faq_image.png");
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
}

.d2c_FAQ_main .btn {
  width: 100%;
  font-family: var(--primary_font);
  font-weight: 500;
  font-size: 22px;
  text-transform: capitalize;
  color: var(--secondary_color);
  padding: 10px 20px;
  border-radius: 0px;
  border: none;
  text-align: left;
  position: relative;
}
.d2c_FAQ_main .btn::before {
  content: "";
  position: absolute;
  bottom: -7px;
  width: 15px;
  height: 15px;
  background: var(--primary_color);
  transform: rotate(45deg);
  opacity: 0;
}
.d2c_FAQ_main .btn[aria-expanded="true"]::before {
  opacity: 1;
  transition: 0.4s all ease;
}
.d2c_FAQ_main .btn[aria-expanded="true"] {
  background: var(--primary_color);
  color: var(--default_one);
}
.d2c_FAQ_main .btn:focus {
  box-shadow: none;
}
.d2c_FAQ_main .d2c_faq_content .card {
  margin-bottom: 20px;
  box-shadow: 0px 0px 22px rgba(0, 0, 0, 0.06);
  border-radius: 0px;
  border: none;
}
.d2c_FAQ_main .d2c_faq_content .card .card-header {
  border-bottom: 0px;
  padding: 0px;
  background: var(--default_one);
}
.d2c_FAQ_main .d2c_faq_content .card .card-body {
  font-family: var(--secondary_font);
  color: var(--paragraph_color);
  font-size: 17px;
  font-weight: 500;
}

.d2c_FAQ_main .d2c_FAQ_right {
  padding: 30px 20px;
  background: var(--default_one);
  box-shadow: 0px 0px 25px rgba(43, 46, 57, 0.05);
}
.d2c_FAQ_main .d2c_FAQ_right p {
  font-family: var(--primary_font);
  font-weight: bold;
  font-size: 20px;
  text-transform: uppercase;
  color: var(--secondary-color);
}
.d2c_FAQ_main .d2c_FAQ_right form .form-control {
  font-family: var(--secondary_font);
  color: var(--secondary_color) !important;
  font-size: 15px;
  background: var(--default_one) !important;
  border: 1px solid #cdcdd0 !important;
  text-transform: capitalize;
  font-weight: 500;
  padding: 5px 15px;
  height: auto;
  margin-bottom: 15px;
  border-radius: 0px;
}
.d2c_FAQ_main .d2c_FAQ_right form .form-control:focus {
  box-shadow: none;
  border-color: var(--secondary_color) !important;
}
.d2c_FAQ_main .d2c_FAQ_right form .form-control::placeholder {
  color: var(--secondary_color) !important;
  opacity: 0.6;
}
.d2c_FAQ_main .d2c_FAQ_right form .d2c_button_small {
  background: var(--secondary_color) !important;
  color: var(--default_one) !important;
  text-align: center;
}
.d2c_FAQ_main .d2c_FAQ_right form .d2c_button_small:hover {
  background: var(--primary_color) !important;
  color: var(--secondary_color) !important;
  text-align: center;
}

/* =========================================== FAQ page css end ===========================================*/