/*===========================
7.FAQ css
===========================*/
.faq-area{
padding-bottom: 100px;
& .section-title{
& .title{
padding-bottom: 10px;
@media #{$lg} {
font-size: 56px;
}
@media #{$xs} {
font-size: 34px;
}
@media #{$sm} {
font-size: 54px;
}
}
}
& .faq-accordion{
& .accordion{
border: 2px solid $border-color;
& .card{
border-radius: 0;
border: 0;
border-top: 2px solid $border-color;
&:first-child{
border-top: 0;
}
& .card-header{
border-bottom: 0;
padding: 0;
margin: 0;
background-color: transparent;
& a{
line-height: 60px;
padding: 0 0 0 40px;
text-decoration: none;
font-weight: 700;
color: $heading-color;
font-size: 16px;
width: 100%;
color: $theme-color;
position: relative;
@media #{$xs} {
padding: 10px 30px 10px 20px;
line-height: 20px;
font-size: 15px;
}
@media #{$sm} {
padding: 0 0 0 40px;
line-height: 60px;
font-size: 16px;
}
&.collapsed{
color: $heading-color;
&::before{
content: '\f063';
color: #cddae8;
}
}
&::before{
position: absolute;
content: '\f062';
right: 36px;
font-family: 'Font Awesome 5 Pro';
@media #{$xs} {
right: 18px;
}
}
}
}
& .card-body{
padding: 0 40px 14px 40px !important;
@media #{$xs} {
padding: 0 40px 14px 20px !important;
}
@media #{$sm} {
padding: 0 40px 14px 40px !important;
}
& p{
margin-top: -10px;
font-size: 14px;
}
}
&.show{
.card-body{
padding: 0 40px 14px 40px !important;
& p{
margin-top: -10px;
font-size: 14px;
}
}
}
}
}
}
& .single-faq{
border: 2px solid $border-color;
padding: 34px 38px;
position: relative;
z-index: 10;
overflow: hidden;
@media #{$lg} {
padding: 34px 20px;
}
@media #{$md} {
margin-top: 40px;
}
@media #{$xs} {
margin-top: 40px;
}
& .title{
color: $theme-color;
font-size: 16px;
& span{
font-size: 50px;
}
}
& > span{
font-size: 14px;
font-weight: 700;
}
& p{
font-size: 14px;
padding-top: 15px;
}
& i{
font-size: 120px;
position: absolute;
top: 10px;
right: 15px;
color: #f6fbff;
z-index: -1;
}
}
&.faq-area-3{
& .section-title{
& .title{
&::before{
display: none;
}
}
}
& .faq-thumb{
margin-top: 35px;
& .faq-thumb-1{
padding-right: 40px;
position: relative;
&::before{
position: absolute;
content: '';
height: 90px;
width: 90px;
border-radius: 50%;
background: #edf4ff;
right: -6px;
bottom: -43px;
z-index: -1;
}
}
& .faq-thumb-2{
margin-top: -220px;
position: relative;
z-index: 5;
& img{
border: 15px solid #f5faff;
}
}
}
}
}