@font-face {
  font-family: Rubik-Bold;
  src: url(../font/Rubik/Rubik-Bold.ttf);
}

@font-face {
  font-family: Rubik-light;
  src: url(../font/Rubik/Rubik-Light.ttf);
}

@font-face {
  font-family: Rubik-medium;
  src: url(../font/Rubik/Rubik-Medium.ttf);
}

@font-face {
  font-family: Rubik-regular;
  src: url(../font/Rubik/Rubik-Regular.ttf);
}

@font-face {
  font-family: Rubik-black;
  src: url(../font/Rubik/Rubik-Black.ttf);
}

@font-face {
  font-family: Intervogue-Soft-Bold;
  src: url(../font/Intervogue-soft/Intervogue-Soft-Bold.otf);
}

@font-face {
  font-family: Intervogue-Soft-Light;
  src: url(../font/Intervogue-soft/Intervogue-Soft-Light.otf);
}

@font-face {
  font-family: Intervogue-Soft-Regular;
  src: url(../font/Intervogue-soft/Intervogue-Soft-Regular.otf);
}

@font-face {
  font-family: Intervogue-Soft-Ultra;
  src: url(../font/Intervogue-soft/Intervogue-Soft-Ultra.otf);
}

body {
  padding-top: 92px
}

.navigation .navbar-default.navbar-one {
  background-color: #F45977;
  border: 1px solid #F45977;
  padding: 20px 0;
  border-radius: 0px;
}

.navigation .navbar-default.navbar-white,
.navigation .navbar-default.navbar-white-two {
  background-color: #ffffff;
  border: 1px solid #ffffff;
  padding: 20px 0;
  border-radius: 0px;
}

.navigation .navbar-header {
  height: 50px;
}

.navigation .navbar-default.navbar-two {
  background-color: #7BBDF6;
  border: 1px solid #7BBDF6;
  padding: 20px 0;
  border-radius: 0px;
}

.navigation .navbar {
  margin-bottom: 0px
}

.navigation .navbar .nav li a {
  color: #1D1A4E;
  font-family: Rubik-Bold;
  font-size: 16pt
}

.navigation .navbar .nav li:last-child a {
  font-family: Rubik-light;
  color: #1D1A4E;
  font-size: 14pt;
  text-decoration: underline;
}

.navigation .navbar-header img {
  width: 60%;
}

.navigation .navbar-default .navbar-toggle:hover,
.navigation .navbar-default .navbar-toggle:focus {
  background-color: transparent;
}

.navigation .navbar-default .navbar-toggle .icon-bar {
  background-color: #1D1A4E;
}

.navigation .navbar-default .navbar-toggle {
  border-color: transparent;
}

.hamburger-menu-button-open {
  top: 50%;
  margin-top: -1px;
  left: 50%;
  margin-left: -12px;
}

.hamburger-menu-button-open,
.hamburger-menu-button-open::before,
.hamburger-menu-button-open::after {
  position: absolute;
  width: 24px;
  height: 2px;
  background: #1D1A4E;
  border-radius: 4px;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}

.hamburger-menu-button-open::before,
.hamburger-menu-button-open::after {
  left: 0;
  content: "";
}

.hamburger-menu-button-open::before {
  top: 6px;
}

.hamburger-menu-button-open::after {
  bottom: 6px;
}

.hamburger-menu-button-close {
  background: transparent;
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.hamburger-menu-button-close::before {
  -webkit-transform: translateY(-6px) rotate(45deg);
  transform: translateY(-6px) rotate(45deg);
}

.hamburger-menu-button-close::after {
  -webkit-transform: translateY(6px) rotate(-45deg);
  transform: translateY(6px) rotate(-45deg);
}

/* home page */
.banner {
  background: url('../img/Image/BS.png') no-repeat bottom;
  background-size: contain;
  position: relative;
  width: 100%;
  max-width: 2000px;
  margin: 0 auto;
  padding-bottom: 30%;
  background-color: #eeeeee;
  padding-top: 10%;
}

.carousel-divider img {
  position: absolute;
  bottom: 0;
  z-index: 1;
  width: 100%;
  bottom: -1px;
  overflow: hidden;
}

.home-slider .modal.in .modal-dialog {
  -webkit-transform: translate(0, 50%);
  -ms-transform: translate(0, 50%);
  -o-transform: translate(0, 50%);
  transform: translate(0, 50%);
}

.home-slider .modal-header {
  background: #F45977;
  color: #ffffff;
  font-family: Rubik-bold;
  font-size: 20pt;
}

.report {
  background-color: #eeeeee;
  padding: 50px 0
}


.report .report-heading {
  margin-bottom: 50px
}

.report .report-heading h1 {
  color: #1D1A4E;
  font-family: Rubik-Bold;
  font-size: 44px;
  text-align: center
}

.report .report-heading h2 {
  color: #1D1A4E;
  font-family: Rubik-regular;
  font-size: 44px;
  text-align: center;
  /* width: 70%;
    margin-left: 15%; */
}

.report .stat img {
  width: 50%
}

.report .stat .oneinthree {
  width: 61%
}

.report .stat h3 {
  font-family: Rubik-regular;
  font-size: 23pt;
  color: #1D1A4E;
  text-align: center
}

.report .stat p,
.report .stat p a {
  font-family: Rubik-regular;
  color: #1D1A4E;
  text-align: center;
}

.report .stat h4 {
  font-family: Rubik-regular;
  color: #1D1A4E;
  text-align: center;
  font-size: 24pt;
}

.report .stat .stat-content {
  min-height: 120px;
}

.report .stat .stat-header {
  height: 55px
}

.report .stat hr {
  border-top: 3pt solid #F45977;
}

.report .stat .stat-details {
  min-height: 60px
}

.report .stat .social-links {
  display: block;
  text-align: center;
  background: #ffffff;
  border-radius: 20px;
  padding-top: 10px;
  width: 284px;
  margin: 0 auto;
}

.report .stat .social-links span {
  /* margin-top: 10px; */
  color: #1D1A4E;
  font-family: Rubik-regular;
  display: inline-block;
}

.report .stat .social-links ul {
  padding-left: 0px;
  display: inline-block
}

.report .stat .social-links ul li {
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
}

.report .stat .social-links ul li img {
  width: 70%;
}

.report .stat-footer {
  padding: 60px 0 30px 0
}

.report .stat-footer p {
  width: 75%;
  margin-left: 12%;
  text-align: center;
  font-family: Rubik-regular;
  font-size: 22pt;
  color: #1D1A4E;
}

.verification {
  padding: 100px 0 80px 0
}

.verification .heading h1 {
  text-align: center;
  color: #1D1A4E;
  font-family: Rubik-regular;
  font-size: 28pt;
  margin-bottom: 50px;
  line-height: 1.5
}

.verification .heading h1 b {
  font-family: Rubik-Bold;
}

.verification .item .caption {
  position: relative;
}

.verification .item .caption h3 {
  font-size: 22pt;
  text-align: center;
  line-height: 1.5;
  font-family: Rubik-regular;
  color: #1D1A4E
}

.verification .item .caption h3 b {
  font-family: Rubik-Bold;
  text-transform: uppercase;
  color: #1D1A4E
}

.verification .item .content p {
  font-size: 18pt;
  text-align: center;
  line-height: 1.4;
  font-family: Rubik-regular;
  color: #1D1A4E;
  padding: 0 20%;
}

.verification .item .content p a {
  font-size: 18pt;
  text-align: center;
  line-height: 1.4;
  font-family: Rubik-bold;
  color: #1D1A4E;
  text-decoration: underline
}

/* .verification .owl-dots {
    counter-reset: dots;
    outline: none
}

.verification .owl-dot:before {
    counter-increment: dots;
    content: counter(dots);
    padding: 6px;
    outline: none
} */
.verification .owl-carousel .owl-item img {
  display: block;
  width: auto;
}

.verification .owl-theme .owl-dots .owl-dot span {
  display: block;
  width: 3px;
  height: 3px;
  margin: 3px;
  background: none
}

.verification .item {
  text-align: center;
  height: 450px;
}

.verification .verify-source .item img,
.verification .verify-claim .item img,
.verification .verify-image .item img {
  max-width: 100%;
  height: auto
}

.verification .owl-dots button {
  border-radius: 35px;
  margin: 5px;
}

.verification .owl-dots button.active,
.verification .owl-dots button.active:focus {
  color: #ffffff;
  outline: none;
}

.verification .verify-claim .owl-dots button {
  border: 2px solid #7bbdf6;
}

.verification .verify-claim .owl-dots button.active,
.verification .verify-claim .item {
  background-color: #7BBDF6;
}

.verification .verify-source .owl-dots button {
  border: 2px solid #30c5cc;
}

.verification .verify-source .owl-dots button.active,
.verification .verify-source .item {
  background-color: #30c5cc;
}

.verification .verify-image .owl-dots button {
  border: 2px solid #F45977;
}

.verification .verify-image .owl-dots button.active,
.verification .verify-image .item {
  background-color: #F45977;
}

.verification .share {
  display: block;
  text-align: center;
  margin-top: 100px
}

.verification .share h1 {
  color: #1D1A4E;
  font-family: Rubik-regular
}

.verification .share ul li {
  display: inline-block;
  text-decoration: none;
  margin: 50px 15px 0 15px;
  cursor: pointer;
}

.verification .share ul {
  padding-left: 0px
}

.verification .owl-nav button.owl-prev {
  position: absolute;
  left: 20px;
  font-size: 36pt;
  color: #ffffff;
  top: 40%;
  font-family: Rubik-light;
  outline: none
}

.verification .owl-nav button.owl-next {
  position: absolute;
  right: 20px;
  font-size: 36pt;
  color: #ffffff;
  top: 40%;
  font-family: Rubik-light;
  outline: none
}

.verification .verify-claim,
.verification .verify-image,
.verification .verify-source {
  margin: 30px 0
}

.verification .owl-nav [class*=owl-]:hover {
  background: none;
}

/* .banner{
    background: #eeeeee;
    padding: 100px 0 40px 0;
} */
/* .quick-tip .owl-nav {
    position: relative;
} */

/* .quick-tip .owl-nav button.owl-prev {
    position: absolute;
    left: 20px;
    font-size: 36pt;
    color: #ffffff;
    top: 40%;
    font-family: Rubik-light;
    outline: none
}

.quick-tip .owl-nav button.owl-next {
    position: absolute;
    right: 20px;
    font-size: 36pt;
    color: #ffffff;
    top: 40%;
    font-family: Rubik-light;
    outline: none
}

.quick-tip .owl-nav [class*=owl-]:hover {
    background: none;
}

.quick-tip .caption-tips {
    position: relative;
}

.quick-tip .caption-tips h3 {
    font-family: Rubik-Bold;
    color: white;
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 3vw;
    text-align: center
}

.quick-tip .social-links {
    display: inline-flex;
    text-align: center;
    left: 50%;
    top: 85%;
    transform: translate(-50%, -50%);
    position: absolute;
}

.quick-tip .social-links ul {
    padding-left: 15px
}

.quick-tip .social-links ul li {
    display: inline-block;
    text-decoration: none;
    padding-left: 15px
}

.quick-tip .social-links span {
    margin-top: 10px;
    color: #ffffff;
    font-family: Rubik-regular;
    font-size: 18pt;
}

.quick-tip .item {
    position: relative;
}

.quick-tips .thumbnail-carousel .item {
    border-radius: 5px;
    margin: 0 10px
}

.quick-tips .thumbnail-carousel h1 {
    text-align: center;
    font-family: Rubik-regular;
    color: #1D1A4E;
    padding: 20px 0;
}

.quick-tips .thumbnail-carousel h1 b {
    text-align: center;
    font-family: Rubik-Bold;
}

.quick-tips .thumbnail-carousel .claim {
    background-color: #7BBDF6;
}

.quick-tips .thumbnail-carousel .source {
    background-color: #30c5cc;
}

.quick-tips .thumbnail-carousel .image {
    background-color: #F45977;
}

.quick-tips .heading h1 {
    text-align: center;
    color: #1D1A4E;
    font-family: Rubik-regular;
    font-size: 28pt;
    margin-bottom: 50px
}

.quick-tips .heading h1 b {
    font-family: Rubik-Bold;
}

.quick-tips .break {
    display: none;
} */

.bg-video {
  position: relative;
  background-color: #F1F1F1;
}

.bg-video video {
  width: 100%;
}

.bg-video h1 {
  text-align: center;
  position: absolute;
  left: 50%;
  top: 40%;
  transform: translate(-50%, -50%);
  color: #1D1A4E;
  font-family: Rubik-Bold;
  font-size: 32pt
}

.bg-video .verify-facts p {
  margin-bottom: 30px;
  font-size: 18pt;
  font-family: Rubik-regular;
  color: #1D1A4E;
  min-height: 70px;
}

.bg-video .verify-facts b {
  font-family: Rubik-bold;

}

.home-carousel img {
  background-size: cover;
  position: relative;
  width: 100%;
  max-width: 2000px;
  margin: 0 auto;
  background: #f45877;
}

.home-carousel .banner-content {
  position: absolute;
  top: 10%;
  left: 40%;
  width: 40%;
}

.home-carousel .banner-content h1 {
  font-size: 5vw;
  font-family: Intervogue-Soft-Ultra;
  color: #ffffff;

}

.home-carousel .banner-content p {
  font-size: 1.5vw;
  color: #ffffff;
  font-family: Rubik-regular;
  margin-top: 25px;
}

.home-videos {
  padding: 80px 0;
  background-color: #F1F1F1;
}

.home-videos img {
  width: 100%;
}

.home-videos h1 {
  font-family: Rubik-Bold;
  color: #1D1A4E;
  text-align: center;
  margin: 60px 0
}

.home-videos h2 {
  font-family: Rubik-regular;
  color: #1D1A4E;
  text-align: center;
  margin: 25px 0;
  font-size: 18pt;
}
.home-videos .modal.in .modal-dialog {
  -webkit-transform: translate(0, 50%);
  -ms-transform: translate(0, 50%);
  -o-transform: translate(0, 50%);
  transform: translate(0, 50%);
}

.home-videos .modal-header {
  background: #F45977;
  color: #ffffff;
  font-family: Rubik-bold;
  font-size: 20pt;
}
.quiz {
  background-color: #7BBDF6;
  padding: 80px 0
}

.quiz-header img {
  width: 100%;
  background-color: #F1F1F1
}

.quiz-header-white img {
  width: 100%;
  background-color: #ffffff;
}

.quiz img {
  width: 75%
}

.quiz p {
  color: #1D1A4E;
  font-family: Rubik-Regular;
  font-size: 18pt;
  text-align: center;
  margin: 20px 0;
  min-height: 140px
}

.quiz button {
  color: #1D1A4E;
  background-color: #ffffff;
  width: 50%;
  padding: 15px;
  font-size: 18pt;
  font-family: Rubik-Bold;
  text-transform: uppercase;
  margin-bottom: 30px
}

.fact-check {
  padding: 0 0 80px 0;
  text-align: center;
}

/* .fact-check .col-md-2 {
    width: 20%;
    padding-left: 5px;
    padding-right: 5px;
    text-align: center;
} */

.fact-check a {
  text-decoration: underline;
  text-transform: capitalize;
  font-family: Rubik-regular;
  font-size: 16pt;

}

.fact-check img {
  width: 100%;
  margin: 20px 0
}

.fact-check h1 {
  color: #1D1A4E;
  font-family: Rubik-regular;
  text-align: center;
  font-size: 26pt;
  width: 70%;
  margin-left: 15%;
  line-height: 1.5
}

/* footer */
.footer {
  background-color: #1D1A4E;
  padding: 50px 0
}

.footer img {
  margin: 20px 0;
  width: 100%;
  height: 60px;
  object-fit: contain;
  object-position: bottom;
}

.footer-header img {
  width: 100%;
  background-color: #7BBDF6
}

.footer-header-white img {
  width: 100%;
  background-color: #ffffff
}

.footer p {
  color: #ffffff;
  margin-top: 20px;
  font-family: Rubik-regular;
  font-size: 10px;
}

.footer a {
  color: #ffffff;
  font-family: Rubik-regular;
  font-size: 18pt;
  color: #1D1A4E;
  background: #30C5CC;
  border-radius: 6px;
  padding: 10px 50px;
}

.footer .footer-head {
  margin-bottom: 50px
}

/* aboutus */
.aboutus-hero-banner {
  background: url(../img/Image/about-us-header.png) no-repeat center bottom;
  background-size: cover;
  width: 100%;
  max-width: 2000px;
  margin: 0 auto;
  padding-bottom: 45%;
  position: relative;
}

.aboutus-hero-banner .container {
  position: relative;
}

.aboutus-hero-banner .banner-content {
  color: #ffffff;
  position: absolute;
  text-align: left;
}

.aboutus-hero-banner .banner-content h1 {
  font-family: Intervogue-Soft-Ultra;
  font-size: 5vw;
}

.aboutus-hero-banner .banner-content h1:first-child {
  margin-top: 7%;
}

.aboutus-hero-banner p {
  font-size: 1.8vw;
  color: #1D1A4E;
  width: 55%;
  line-height: 1.2;
}

.about-us {
  margin: 10% 0 15% 0;
  padding-left: 15px;
  padding-right: 15px;
}

.about-us h1 {
  color: #1D1A4E;
  font-family: Rubik-regular;
  line-height: 1.2;
  font-size: 28pt;
  margin: 40px 0
}

.about-us .why-now h2 {
  font-family: Rubik-Bold;
  color: #1D1A4E;
  margin: 60px 0 30px 0;
  line-height: 1.2
}

.about-us .why-now p {
  color: #1D1A4E;
  font-family: Rubik-light;
  margin: 30px 0;
  font-size: 18pt;
  line-height: 1.3
}

.about-us .why-now p a {
  text-decoration: underline
}

/*Truth Matters*/
.truth-matters-header {

  background: url('../img/Image/Truth Matters Header@1x.jpg') no-repeat center bottom;
  background-size: cover;
  position: relative;
  width: 100%;
  max-width: 2000px;
  margin: 0 auto;
  padding-bottom: 45%;
}

.truth-matters-header h1 {
  font-family: Intervogue-Soft-Ultra;
  font-size: 5vw;
  margin: 0;
  color: #ffffff;
  position: absolute;
  top: 30%;
  left: 20%;
  text-transform: uppercase;
  width: 60%;
}

.truth-matters-description {

  padding: 150px 0px;
}

.truth-matters-description p {
  font-family: Rubik-regular;
  font-size: 22pt;
  color: #1D1A4E;

}

.truth-matters-description p b {
  font-family: Rubik-bold;
  font-size: 22pt;
  color: #1D1A4E;


}

.truth-matters-bubbles .container {
  padding: 100px 80px;
}

.truth-matters-bubbles h2 {
  font-family: Rubik-bold;
  font-size: 28pt;
  color: #1D1A4E;
  padding-bottom: 20px;

}

.truth-matters-bubbles p {
  font-family: Rubik-regular;
  font-size: 18pt;
  color: #1D1A4E;
}

.truth-matters-timeline {
  background: #F45977;
  border-bottom: 5px solid #ffffff;
}

.truth-matters-timeline .horizontal-timeline {
  padding: 50px 50px;
}

.truth-matters-timeline .horizontal-timeline .events {
  background: #ffffff;
  bottom: 18%;
}

.truth-matters-timeline .horizontal-timeline .filling-line {
  background: #08558E;
  bottom: 18%;
}

.truth-matters-timeline .horizontal-timeline .events a.older-event::after,
.truth-matters-timeline .horizontal-timeline .events a.selected::after {
  background-color: #08558E;

}
.truth-matters-timeline .horizontal-timeline .events a.last.selected::before{
  content: '';
  height:5px;
  width: 300px;
  background-color: #08558E;
  position: absolute;
  bottom: 0;
  left: 40%;
  animation: 0.3s fadeInLeft;
  animation-fill-mode: forwards;
}
.truth-matters-timeline .horizontal-timeline .events a::after {
  background-color: #ffffff;
  height: 20px;
  width: 20px;
  bottom: -9px;
}

.truth-matters-timeline .horizontal-timeline .events a {
  color: #ffffff;
  font-family: Rubik-bold;
  font-size: 14pt;
}

.truth-matters-timeline .timeline-navigation a {
  color: #ffffff;
}

.truth-matters-timeline .timeline-navigation a.inactive {
  color: #D8D8D8;

}

.truth-matters-timeline .horizontal-timeline .events-content {
  margin-left: 30px;
  margin-right: 30px;

}

.truth-matters-timeline .horizontal-timeline ol li {
  background-color: transparent;
  list-style-type: none;

}

.truth-matters-timeline .horizontal-timeline ol li img {
  /* width: 100%; */
}

.truth-matters-timeline .horizontal-timeline ol li p {

  border-radius: 0px;
  padding: 30px;
  border: 2px solid #ffffff;
  text-align: center;
  font-family: Rubik-regular;
  font-size: 14pt;
  color: #1D1A4E;
  background-color: #D8D8D8;

}

.truth-matters-videos {
  background: #F45977;
  padding: 50px 0;
}

.truth-matters-videos .truth-matters-video-gallery-1 {
  padding-bottom: 20px;

}

.truth-matters-videos .truth-matters-video-gallery-1 .modal.in .modal-dialog {
  -webkit-transform: translate(0, 50%);
  -ms-transform: translate(0, 50%);
  -o-transform: translate(0, 50%);
  transform: translate(0, 50%);
}

.truth-matters-videos .truth-matters-video-gallery-1 .modal-header {
  background: #F45977;
  color: #ffffff;
  font-family: Rubik-bold;
  font-size: 20pt;
}

.truth-matters-videos .truth-matters-video-gallery-1 ul,
.truth-matters-videos .truth-matters-video-gallery-2 ul {
  padding: 20px 0px;
}

.truth-matters-videos .truth-matters-video-gallery-1 ul#gallery-videos-1 li {
  list-style-type: none;
  padding-bottom: 50px;
  padding-left: 20px;
  padding-right: 20px;
}

.truth-matters-videos .truth-matters-video-gallery-1 ul#gallery-videos-1 li img,
.truth-matters-videos .truth-matters-video-gallery-2 ul#gallery-videos-2 li img,
.truth-matters-videos .truth-matters-video-gallery-2 ul#gallery-videos-3 li img {
  cursor: pointer;

}

.truth-matters-videos .truth-matters-video-gallery-1 ul#gallery-videos-1 li h3 {
  display: block;
  height: 60px;
  font-family: Rubik-bold;
  font-size: 20pt;
  color: #ffffff;
}

.truth-matters-videos .truth-matters-video-gallery-2 ul#gallery-videos-2 li,
.truth-matters-videos .truth-matters-video-gallery-2 ul#gallery-videos-3 li {
  list-style-type: none;
  padding-bottom: 50px;
  padding-left: 20px;
  padding-right: 20px;
}

.truth-matters-videos .truth-matters-video-gallery-2 .learn-heading {
  padding-top: 40%;
  font-family: Rubik-bold;
  font-size: 20pt;
  color: #ffffff;
  padding-left: 5px;
}

.truth-matters-videos .truth-matters-video-gallery-2 ul#gallery-videos-2 li p,
.truth-matters-videos .truth-matters-video-gallery-2 ul#gallery-videos-3 li p {
  display: block;
  height: 60px;
  font-family: Rubik-bold;
  font-size: 13pt;
  color: #ffffff;
}

.lg-backdrop {
  background-color: rgba(0, 0, 0, 0.5);
}
.lg-toolbar {
  background-color: rgba(0,0,0,0);
}
.lg-toolbar .lg-icon{
color: #ffffff;
}
.lg-toolbar #lg-counter {
color: #ffffff;
}
.truth-matters-comparison {
  margin-top: 100px;
}
.truth-matters-comparison .beer-handle{
  border: 2px solid #ffffff;
}
.truth-matters-comparison .beer-reveal {
  border-right: 2px solid #ffffff;
}
/*test-yourself*/
.test-yourself-header {
  background: url('../img/Image/Quiz-Header.png') no-repeat center bottom;
  background-size: cover;
  position: relative;
  width: 100%;
  max-width: 2000px;
  margin: 0 auto;
  padding-bottom: 45%;
  text-align: center;
  position: relative;
}

.test-yourself-header h1 {
  font-family: Intervogue-Soft-Ultra;
  font-size: 5vw;
  margin: 0;
  color: #ffffff;
  position: absolute;
  top: 30%;
  left: 30%;
  width: 40%;
  text-transform: uppercase;

}

.quiz-container.container {

  padding: 150px 150px;
  position: relative;
}

.quiz-container .description p {
  font-family: Rubik-regular;
  font-size: 18pt;
  color: #1D1A4E;
  padding-bottom: 50px;
}

.quiz-container .description p b {
  font-family: Rubik-bold;
  font-size: 18pt;
  color: #1D1A4E;


}

.quiz-container .quiz-play-button {
  text-align: center;
  cursor: pointer;
}

.quiz-container .quiz-play-button .btn-basic {
  width: 350px;
  height: 70px;
  background: #30C5CC;
  font-family: Rubik-regular;
  font-size: 26pt;
  color: #ffffff;
  position: relative;
}

.quiz-container .quiz-play-button .btn-basic:after {
  content: "\f105";
  font-size: 26pt;
  position: absolute;
  right: 80px;
  font-family: FontAwesome;
}

.quiz-container #quiz-counter {
  width: 500px;
  margin: 0 auto;
  font-family: Rubik-regular;
  font-size: 16pt;
  padding-top: 20px;
  padding-bottom: 20px;
  text-align: left;
}

.quiz-container .question-container {
  width: 500px;
  border: 2px solid #1D1A4E;
  margin: 0 auto;
  background: #D8D8D8;
  border-radius: 5px;
  overflow: hidden;
}

.quiz-container .question-container .post-container {
  width: 100%;
  padding: 20px;
  float: left;
  background: #ffffff;
}

.quiz-container .question-container .post-container .post_img {
  float: left;
  width: 15%;
}

.quiz-container .question-container .post-container .post_title {
  float: left;
  width: 80%;
  padding: 0;
  margin-top: 10px;
  font-family: Rubik-bold;
  font-size: 12pt;
  padding-left: 15px;

}

.quiz-container .question-container .post-container .post_description {
  float: left;
  width: 80%;
  padding-left: 15px;
  padding-top: 5px;
  padding-right: 15px;
  font-family: Rubik-regular;
  font-size: 10pt;

}

.quiz-container .question-container .question_img {
  width: 100%;
}

.quiz-container .question-container .question {
  font-family: Rubik-bold;
  font-size: 12pt;
  padding: 15px 20px;
  color: #1D1A4E;
  margin: 0;
  width: 100%;
  display: block;
}

.quiz-container .question-container .question_url {
  font-family: Rubik-regular;
  font-size: 12pt;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 15px;
  color: #08558E;
  display: block;
  width: 100%;

}

.quiz-container .question-container .answers {

  width: 100%;
  display: block;
  padding: 0;
  margin: 0;
}

.quiz-container .question-container .answers li {
  width: 50%;
  display: inline-block;
  text-align: center;

}

.quiz-container .question-container .answers li:first-child {
  border-right: 2px solid #D8D8D8;
}

.quiz-container .question-container .answers a {
  border-radius: 0;
  margin: 0;
  font-family: Intervogue-Soft-Ultra;
  font-size: 16pt;
}

.quiz-container .question-container .answers a.correct {
  background: #30C5CC;

}

.quiz-container .question-container .answers a.incorrect {
  background: #F45977;

}

.quiz-container #quiz-start-screen {
  padding: 30px;
}

.quiz-container #quiz-controls {
  width: 500px;
  padding: 0;
  overflow: hidden;
  border-top-left-radius: 0px;
  border-top-right-radius: 0px;
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  margin: -3px auto 0 auto;
  border-left: 2px solid #1D1A4E;
  border-right: 2px solid #1D1A4E;
  border-bottom: 2px solid #1D1A4E;
}

.quiz-container #quiz-controls.correct #quiz-response {
  text-align: left;
  padding: 30px 20px;
  background: #30C5CC;
  position: relative;
}

.quiz-container #quiz-controls.incorrect #quiz-response {
  text-align: left;
  padding: 30px 20px;
  background: #F45977;
  position: relative;

}

.quiz-container #quiz-controls.correct #quiz-response:before {
  content: '';
  background: url('../img/Icon/Like.png') no-repeat center bottom;
  position: absolute;
  top: 20px;
  right: 0;
  left: 0;
  background-size: cover;
  width: 100px;
  height: 100px;
  text-align: center;
  margin: 0 auto;
}

.quiz-container #quiz-controls.incorrect #quiz-response:before {
  content: '';
  background: url('../img/Icon/Dislike.png') no-repeat center bottom;
  position: absolute;
  top: 20px;
  right: 0;
  left: 0;
  background-size: cover;
  width: 100px;
  height: 100px;
  text-align: center;
  margin: 0 auto;
}

.quiz-container #quiz-controls #quiz-response:after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: -40px;
  bottom: 0;
  background: url('../img/particle.png') no-repeat top;
  opacity: 0.6;
  mix-blend-mode: normal;
  transform: rotate(-180deg);
  background-size: 100% 100%;
}

.quiz-container #quiz-controls #quiz-response h2 {
  font-family: Rubik-black;
  font-size: 25pt;
  transform: rotate(-3deg);
  padding: 20px 0 20px 0;
  text-transform: uppercase;
  margin: 0;

}

.quiz-container #quiz-controls #quiz-response h3 {
  font-family: Rubik-bold;
  font-size: 12pt;
  padding-bottom: 10px;
}

.quiz-container #quiz-controls #quiz-response p {
  font-family: Rubik-regular;
  font-size: 12pt;

}

.quiz-container #quiz-controls #quiz-response p a {
  font-family: Rubik-bold;
  font-size: 12pt;
  color: #ffffff;
}

.quiz-container #quiz-controls #quiz-buttons {
  text-align: right;
  background: #ffffff;
  padding: 10px;

}

.quiz-container #quiz-controls #quiz-buttons #quiz-next-btn,
.quiz-container #quiz-controls #quiz-buttons #quiz-finish-btn {
  border-radius: 5px;
  font-family: Rubik-regular;
  font-size: 16pt;
  padding-left: 30px;
  padding-right: 30px;
  padding-top: 15px;
  padding-bottom: 15px;
  background: #30C5CC;
  color: #ffffff;
}

.quiz-container #quiz-controls #quiz-buttons #quiz-next-btn:after,
.quiz-container #quiz-controls #quiz-buttons #quiz-finish-btn:after {
  content: "\f105";
  font-size: 16pt;

  padding-left: 20px;
  font-family: FontAwesome;
  color: #ffffff;
}

.quiz-container #quiz-results-screen {
  width: 500px;
  text-align: unset;
  margin: 0 auto;
  border-radius: 15px;
  padding: 50px 40px 50px 40px;
}

.quiz-container #quiz-results-screen #quiz-result-type {
  font-family: Rubik-Bold;
  font-size: 20pt;
  width: 50%;
  float: left;
}

.quiz-container #quiz-results-screen #quiz-results {
  width: 50%;
  text-align: right;
  float: left;
  padding-top: 5px;
  font-family: Rubik-Bold;
  font-size: 14pt;
}

.quiz-container #quiz-results-screen #quiz-results-progress progress[value] {
  width: 100%;
  float: left;
  background: #ffffff;
  border: 1px solid #ffffff;
  color: #ffffff;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.quiz-container #quiz-results-screen #quiz-results-progress progress[value]::-moz-progress-value {
  background: #F45977 !important;
  color: #F45977 !important;
}

.quiz-container #quiz-results-screen #quiz-results-progress progress[value]::-webkit-progress-value {
  background: #F45977 !important;
  color: #F45977 !important;

}

.quiz-container #quiz-results-screen #quiz-results-progress progress[value]::-moz-progress-bar {
  width: 100%;
  float: left;
  background: #F45977 !important;
  border: 1px solid #ffffff;
  color: #F45977 !important;

}

.quiz-container #quiz-results-screen #quiz-results-progress progress[value]::-webkit-progress-bar {
  width: 100%;
  float: left;
  background: #ffffff !important;
  border: 1px solid #ffffff;
  color: #ffffff !important;
}

.quiz-container #quiz-results-screen.type-1 {
  background: #F45977;
}

.quiz-container #quiz-results-screen.type-2 {
  background: #30C5CC;

}

.quiz-container #quiz-results-screen.type-3 {
  background: #7BBDF6;

}

.quiz-container #quiz-results-screen.type-4 {
  background: #F3D799;

}

.quiz-container #quiz-results-screen #quiz-results-img {
  width: 80%;
  margin-bottom: 40px;
  margin-top: 40px;
  border: 5px solid #ffffff;
  border-radius: 5px;
}

.quiz-container #quiz-results-screen #quiz-results-description {
  text-align: left;
  font-family: Rubik-regular;
  font-size: 12pt;
}

.quiz-container #quiz-results-screen #quiz-results-url {
  text-align: left !important;
  font-family: Rubik-regular;
  font-size: 12pt;
  text-decoration: underline;

}

.quiz-container #quiz-results-screen.type-1 #quiz-results-description,
.quiz-container #quiz-results-screen.type-2 #quiz-results-description {
  color: #ffffff;
}

.quiz-container #quiz-results-screen.type-1 #quiz-results-url,
.quiz-container #quiz-results-screen.type-2 #quiz-results-url {
  color: #ffffff;

}

.quiz-container #quiz-results-screen.type-3 #quiz-results-description,
.quiz-container #quiz-results-screen.type-4 #quiz-results-description {
  color: #000000;
}

.quiz-container #quiz-results-screen.type-3 #quiz-results-url,
.quiz-container #quiz-results-screen.type-4 #quiz-results-url {
  color: #000000;

}

.quiz-container #share {
  text-align: center;
  margin: 0 auto;
  width: 500px;
  padding: 30px 0px 30px 0px;
}

.quiz-container #share #share-title {
  font-family: "Rubik-bold";
  font-size: 14pt;
}

.quiz-container #share #share-icons {
  padding-top: 10px;
}

.quiz-container #share #share-icons ul {
  display: inline-block;
  padding: 0;
}

.quiz-container #share #share-icons ul li {
  display: inline-block;
  float: left;
  margin: 15px;

}

.quiz-container #share #share-icons ul li a {
  float: left;
  cursor: pointer;
}

.quiz-container #share #share-icons ul li a img {
  width: 70px;
}

.quiz-container .question-container #photo-credit-data {
  position: absolute;
  bottom: 0;
  font-size: 12pt;
  font-family: "Rubik-regular";
  padding-left: 20px;
}

.test-yourself-result .container {

  padding: 150px 150px;
  position: relative;
}

.test-yourself-result #quiz-results-screen {
  width: 500px;
  text-align: unset;
  margin: 0 auto;
  border-radius: 15px;
  padding: 50px 40px 50px 40px;
}

.test-yourself-result #quiz-results-screen #quiz-result-type {
  font-family: Rubik-Bold;
  font-size: 20pt;
  width: 50%;
  float: left;
}

.test-yourself-result #quiz-results-screen #quiz-results {
  width: 50%;
  text-align: right;
  float: left;
  padding-top: 5px;
  font-family: Rubik-Bold;
  font-size: 14pt;
}

.test-yourself-result #quiz-results-screen #quiz-results-progress progress[value] {
  width: 100%;
  float: left;
  background: #ffffff;
  border: 1px solid #ffffff;
  color: #ffffff;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.test-yourself-result #quiz-results-screen #quiz-results-progress progress[value]::-moz-progress-value {
  background: #F45977 !important;
  color: #F45977 !important;
}

.test-yourself-result #quiz-results-screen #quiz-results-progress progress[value]::-webkit-progress-value {
  background: #F45977 !important;
  color: #F45977 !important;

}

.test-yourself-result #quiz-results-screen #quiz-results-progress progress[value]::-moz-progress-bar {
  width: 100%;
  float: left;
  background: #F45977 !important;
  border: 1px solid #ffffff;
  color: #F45977 !important;

}

.test-yourself-result #quiz-results-screen #quiz-results-progress progress[value]::-webkit-progress-bar {
  width: 100%;
  float: left;
  background: #ffffff !important;
  border: 1px solid #ffffff;
  color: #ffffff !important;
}

.test-yourself-result #quiz-results-screen.type-1 {
  background: #F45977;
}

.test-yourself-result #quiz-results-screen.type-2 {
  background: #30C5CC;

}

.test-yourself-result #quiz-results-screen.type-3 {
  background: #7BBDF6;

}

.test-yourself-result #quiz-results-screen.type-4 {
  background: #F3D799;

}

.test-yourself-result #quiz-results-screen #quiz-results-img {
  width: 80%;
  margin-bottom: 40px;
  margin-top: 40px;
  border: 5px solid #ffffff;
  border-radius: 5px;
}

.test-yourself-result #quiz-results-screen #quiz-results-description {
  text-align: left;
  font-family: Rubik-regular;
  font-size: 12pt;
}

.test-yourself-result #quiz-results-screen #quiz-results-url {
  text-align: left !important;
  font-family: Rubik-regular;
  font-size: 12pt;
  text-decoration: underline;

}

.test-yourself-result #quiz-results-screen.type-1 #quiz-results-description,
.test-yourself-result #quiz-results-screen.type-2 #quiz-results-description {
  color: #ffffff;
}

.test-yourself-result #quiz-results-screen.type-1 #quiz-results-url,
.test-yourself-result #quiz-results-screen.type-2 #quiz-results-url {
  color: #ffffff;

}

.test-yourself-result #quiz-results-screen.type-3 #quiz-results-description,
.test-yourself-result #quiz-results-screen.type-4 #quiz-results-description {
  color: #000000;
}

.test-yourself-result #quiz-results-screen.type-3 #quiz-results-url,
.test-yourself-result #quiz-results-screen.type-4 #quiz-results-url {
  color: #000000;

}

.test-yourself-result #share {
  text-align: center;
  margin: 0 auto;
  width: 500px;
  padding: 30px 0px 30px 0px;
}

.test-yourself-result #share #share-title {
  font-family: "Rubik-bold";
  font-size: 14pt;
}

.test-yourself-result #share #share-icons {
  padding-top: 10px;
}

.test-yourself-result #share #share-icons ul {
  display: inline-block;
  padding: 0;
}

.test-yourself-result #share #share-icons ul li {
  display: inline-block;
  float: left;
  margin: 15px;

}

.test-yourself-result #share #share-icons ul li a {
  float: left;
  cursor: pointer;
}

.test-yourself-result #share #share-icons ul li a img {
  width: 70px;
}
.footer .copyright p{
  margin-top: 10px;
  text-align: left;
}