﻿/* FAQS Standard Assets 10 */
.FAQCategoryHeading { color: #fff; font-size: 18px; line-height: normal; background-color: #001a4a; padding: 10px 10px 10px 20px; border-radius: 5px; }
.FaqQuestionHead { font-size: 24px; font-weight: bold; color: #000; line-height: 17px; }
.FaqFrame { width: 96%; height: auto; overflow: auto; border: 1px solid #ccc; padding: 0 10px 8px 10px; }
    .FaqFrame h2 { margin: 5px 0 3px 0; }
    .FaqFrame p { margin: 0 0 5px 0; }
.FAQCategoryDescription { color: #999; }

/* Columns */
.FAQAnswer { width: 100%; float: left; }
    .FAQAnswer p { font-size: 16px; line-height: initial; vertical-align: middle; margin: 0; padding: 5px 0; }
.FAQLink { padding: 8px 0 15px 0; }


/* Format our link that will be used to trigger the toggle */
.TriggerText { font-size: 18px; width: 100%; color: #333; padding: 15px 10px 15px 10px; box-sizing: border-box; }
div.TriggerText:hover, div.TriggerText:hover span { text-decoration: none; cursor: pointer; background-color: #f5f5f5; }

/* Set the container DIV that will be transitioned */
.Outer { height: 0; position: relative; overflow: hidden; width: auto }

/* Set the inner DIV(s), that hold the real content.  *** THIS MUST HAVE A BORDER OR PADDING APPLIED!  Otherwise the dynamic height calc may fail due to not recognising margin values */
.Inner { padding: 5px 5px 5px 30px; width: auto; }


.faq-cont { line-height: initial; }
    .faq-cont .TriggerRow { display: flex; align-items: center; padding: 0; box-shadow: 0 0 10px 2px rgba(0, 0, 0, 0.15); border-radius: 3px; margin: 4px 0; }
        .faq-cont .TriggerRow > div:nth-of-type(1) { width: calc(100% - 35px); box-sizing: border-box; color: #000; padding: 10px; }
        .faq-cont .TriggerRow:hover > div:nth-of-type(1) { color: #333 !important; text-decoration: none; cursor: pointer; }
        /* Text Row */
        .faq-cont .TriggerRow > div:nth-of-type(2) { width: 35px; box-sizing: border-box; color: #001a4a; text-align: center; }
        .faq-cont .TriggerRow:hover > div:nth-of-type(2) { color: #333 !important; text-decoration: none; cursor: pointer; }
    /* Down Arrow */

    .faq-cont .Outer { vertical-align: top; padding: 0; margin-bottom: 2px; }
    .faq-cont .Inner { padding: 5px 5px 5px 10px; width: auto; }
    .faq-cont .FAQAnswer { padding: 15px 10px; margin: 5px 0 5px 0; border-radius: 5px; background-color: #fff; box-sizing: border-box; }
        .faq-cont .FAQAnswer a { padding: 2px 5px; display: inline-block; margin: 0; border: 1px solid transparent; border-radius: 3px; font-weight: 600; }
            .faq-cont .FAQAnswer a:hover { cursor: pointer; border: 1px solid #2b6290; color: #fff; background-color: #fafafa; }
    .faq-cont p:nth-of-type(1) { margin-top: 0; }
    .faq-cont p:nth-last-of-type(1) { margin-bottom: 0; }

    /* Expand / collapse icon animation */
    .faq-cont .material-icons { transition: transform 0.3s ease; }
        .faq-cont .material-icons.rotated { transform: rotate(180deg); }




@media only screen and (max-width:640px) {

    .FAQAnswer { width: 100%; }
}
