﻿/*FAQ*/
.faq_container { padding: 30px 20px; }
    .faq_container .faq_first_copy a { color: #111; text-decoration: underline; }
    .faq_container .italy_grad { margin: 30px auto; }
    .faq_container .capitoli { margin-bottom: 30px; }
    .faq_container .faqs { width: 95%; max-width: 1500px; margin: 20px auto; }
        .faq_container .faqs details { background-color: rgba(240,240,240,1); margin-bottom: 10px; transition: .5s ease-in-out; box-shadow: 0 0 2px rgba(0,0,0,.15); }
            .faq_container .faqs details summary.domanda { font-size: 18px; padding: 20px 50px 20px 10px; outline: none; cursor: pointer; background: url('../img/icon/Down_red.svg') center right 25px no-repeat; background-size: 20px auto; transition: .5s ease-in-out; }
                .faq_container .faqs details summary.domanda::-webkit-details-marker { color: transparent; }
            .faq_container .faqs details .risposta { font-size: 16px; margin-top: 10px; padding: 20px; border-top: solid 1px #ccc; border-bottom: solid 1px #ddd; color: #333; }
                .faq_container .faqs details .risposta a { color: #333; text-decoration: underline; }
            /*Sezione Hover*/
            .faq_container .faqs details:hover { background-color: rgba(240,240,240,.3); }
                .faq_container .faqs details:hover summary.domanda { background: url('../img/icon/Down_red.svg') center 5px right 25px no-repeat; background-size: 20px auto; }
            /* Animazione Apertura Faqs */
            .faq_container .faqs details[open] summary.domanda { background: url('../img/icon/Up_red.svg') center right 25px no-repeat; background-size: 20px auto; transition: .5s ease-in-out; }
            .faq_container .faqs details[open] .risposta { animation-name: invisiblyGrowFontSize, fadeIn; animation-duration: 300ms, 250ms; animation-delay: 0ms, 350ms; }

@keyframes invisiblyGrowFontSize {
    0% { font-size: 0; opacity: 0; }
    100% { font-size: 1em; opacity: 0; }
}
@keyframes fadeIn {
    0% { opacity: 0; }
    100% { opacity: 1; }
}
