.c-faq__answer {

  position: absolute;

  opacity: 0;

  z-index: -1;

}



body {

  box-sizing: border-box;

  font-family: "ABeeZee", sans-serif;

  line-height: 1.48;

  font-size: 16px;

  color: #333;

}



body *,

body *::after,

body *::before {

  box-sizing: inherit;

}



.container {

  max-width: 1100px;

  margin-left: auto;

  margin-right: auto;

}



.section__headline {

  font-family: "Varela Round", sans-serif;

  font-size: 62px;

  font-weight: light;

  color: #1e88e5;

  padding-left: 15px;

  padding-top: 30px;

}



.c-faqs__headline {

  font-family: "Varela Round", sans-serif;

  text-align: left;

  padding-left: 15px;

  font-size: 1.5em;

  margin-top: 1.5em;

  font-weight: bold;

  color: #254ce9;
	text-transform: uppercase;

}



.c-faqs {

  margin: 15px 0;

  padding: 0 15px;

  border-top: 1px solid transparent;

  border-bottom: 1px solid transparent;

}



.c-faq {

  font-family: "Varela Round", sans-serif;

  list-style: none;

  margin: 10px 0 5px;

}



.c-faq__title {

  cursor: pointer;

  font-weight: 500;

     background: transparent;

  z-index: 10;

  position: relative;

  font-size: 1.1em;

      color: #1a065b;

}

.c-faq__title:hover {

  text-decoration: underline;

}

.c-faq__title::after {

  white-space: nowrap;

  font-weight: 300;

  padding-left: 5px;

  opacity: 0;

  -webkit-transform-origin: 11px;

          transform-origin: 11px;

  -webkit-transform: rotateZ(90deg);

          transform: rotateZ(90deg);

  display: none;

  content: ">";

}



.c-faq--active .c-faq__title {

      color: #254ce9;

}

.c-faq--active .c-faq__title::after {

  opacity: 1;

  -webkit-transform: rotateZ(90deg);

          transform: rotateZ(90deg);

  display: inline-block;

}



.c-faq__answer {

  font-weight: normal;

  margin-top: -10%;

  transition: all 0.1s;

  z-index: 1;

  font-size: 0.9em;

  color: #505050;

}



.c-faq--active .c-faq__answer {

    opacity: 1;

    position: relative;

    top: 0;

    left: 0;

    font-weight: 300;

    margin-top: 5px;

    margin-bottom: 10px;

    transition: all 0.2s;

    border-radius: 3px;

    border: 3px solid #1a065b;

    border-top: 2px solid #f4f4f4;

    padding: 20px;

    border-left-color: #f4f4f4;

    border-top-color: #f1f2f3;

    /* background: #8d28de; */

    background: #1f59bc url(images/bgs.jpg) no-repeat top center;

    color: #fdfcfa;

    font-size: 18px;

}



@media (min-width: 780px) {

  .c-faqs {

    position: relative;

    margin-left: auto;

    margin-right: auto;

    height: auto;

  }



  .c-faqs::before {

    opacity: 0.2;

  }



  .c-faq {

    margin-top: 15px;

    margin-bottom: 15px;

  }

  .c-faq .c-faq__title {

    width: 50%;

    padding-right: 40px;

    display: inline-block;

    text-decoration: none;

    font-size: 18px;

  }

  .c-faq .c-faq__title::after {

    display: none;

  }

  .c-faq .c-faq__answer {

     position: absolute;

    top: 50%;

    -webkit-transform: translateY(-50%);

    transform: translateY(-50%);

    left: 50%;

    width: 50%;

   border: 3px solid #1a065b;

    border-top: 2px solid #f4f4f4;

    border-left-color: #f4f4f4;

    border-top-color: #f1f2f3;

     background: #1f59bc url(images/bgs.jpg) no-repeat top center;

        color: #fdfcfa;

    font-size: 18px;

  }

  .c-faq .c-faq__answer a

  {

	          color: #02f9ff;

  }

}

.c-note {

  font-size: 0.8em;

  padding-left: 15px;

  opacity: 0.5;

  transition: opacity 0.2s ease-in-out;

}

.c-note:hover {

  opacity: 1;

  transition: opacity 0.2s ease-in-out;

}

.c-note a {

  color: #1e88e5;

}

