/* ------------------------------------------------------------
   RESET
------------------------------------------------------------ */

*{
margin:0;
padding:0;
box-sizing:border-box;
}

body{
font-family:'poppins', sans-serif;
}


/* ------------------------------------------------------------
   GLOBAL
------------------------------------------------------------ */

.container{
margin:auto;
padding:0 20px;
}

/* ------------------------------------------------------------
   FAQ SECTION
------------------------------------------------------------ */

.faq-section{
padding:120px 20px;
background:#ffffff;
}

.faq-container{
max-width:900px;
margin:auto;
}

/* SEARCH BAR */

.search-bar{
position:relative;
margin-bottom:25px;
}

.search-bar input{
width:100%;
padding:14px 45px 14px 18px;

border-radius:12px;
border:1px solid #e5e7eb;

font-family:'Poppins';
font-size:0.95em;

transition:0.25s;
}

.search-bar input:focus{
outline:none;
border-color:#F2B705;
box-shadow:0 0 0 2px rgba(242,183,5,0.2);
}

.search-bar i{
position:absolute;
right:15px;
top:50%;
transform:translateY(-50%);
color:#888;
}

/* INTRO */

.faq-intro{
text-align:center;
color:#666;
margin-bottom:45px;
}

.contact-link{
color:#113356;
font-weight:600;
text-decoration:none;
transition:0.2s;
}

.contact-link:hover{
color:#F2B705;
}

/* THEME TITLE */

.theme-title{
font-size:1.4em;
color:#113356;
margin:40px 0 15px;
font-weight:600;
}

/* FAQ ITEM */

.faq-item{
border-bottom:1px solid #eee;
}

/* QUESTION */

.faq-question{
display:flex;
justify-content:space-between;
align-items:center;

cursor:pointer;

padding:16px 0;

font-weight:500;
color:#113356;
}

.faq-question span{
max-width:90%;
}

.faq-question i{
transition:0.3s;
color:#113356;
}

/* rotation icone */

.faq-question i.rotate{
transform:rotate(90deg);
}

/* ANSWER */

.faq-answer{
max-height:0;
overflow:hidden;

transition:max-height 0.35s ease;

color:#666;
font-size:0.95em;
line-height:1.6;
}

.faq-answer p{
padding:0 0 18px 0;
}

/* active */

.faq-answer.active{
max-height:300px;
}

/* ------------------------------------------------------------
   HOVER
------------------------------------------------------------ */

.faq-question:hover{
color:#F2B705;
}

/* ------------------------------------------------------------
   TABLET
------------------------------------------------------------ */

@media(max-width:900px){

.theme-title{
font-size:1.3em;
}

}

/* ------------------------------------------------------------
   MOBILE
------------------------------------------------------------ */

@media(max-width:600px){

.faq-section{
padding:80px 20px;
}

.theme-title{
font-size:1.2em;
}

.faq-question{
font-size:0.95em;
}

.faq-answer{
font-size:0.9em;
}

}