@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,400i,700,700i');

.SourceSansPro span {
   font-family: 'Source Sans Pro', sans-serif !important;
}


.ballon {
  position: relative;
  font-family: 'Source Sans Pro' !important;
  sans-serif !important;
  font-size: 10px;
  background: #fff;
  border-radius: 4px !important;
padding: -2px -2px -2px 10px; !important;
  text-align: left !important;
  color: #003547 !important;
}

.ballon-links:before {
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  border-left: 24px solid #fff;
  border-right: 12px solid transparent;
  border-top: 12px solid #fff;
  border-bottom: 20px solid transparent;
  left: 32px;
  bottom: -24px;
}

.ballon-rechts::before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-left: 12px solid transparent;
  border-right: 24px solid #fff;
  border-top: 12px solid #fff;
  border-bottom: 20px solid transparent;
  right: 16px;      
  bottom: -24px;
}

.ballonblauw {
  position: relative;
  font-family: 'Source Sans Pro' !important;
  sans-serif !important;
  font-size: 10px;
  background: #003547;
  border-radius: 4px !important;
padding: -2px -2px -2px 10px; !important;
  text-align: left !important;
  color: #FFF !important;
}

.ballon-linksblauw:before {
  content: "";
  width: 0px;
  height: 0px;
  position: absolute;
  border-left: 24px solid #003547;
  border-right: 12px solid transparent;
  border-top: 12px solid #003547;
  border-bottom: 20px solid transparent;
  left: 32px;
  bottom: -24px;
}

.ballon-rechtsblauw::before {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-left: 12px solid transparent;
  border-right: 24px solid #003547;
  border-top: 12px solid #003547;
  border-bottom: 20px solid transparent;
  right: 16px;      
  bottom: -24px;
}


.title {
   font-family: 'Source Sans Pro', sans-serif;
   font-weight: 400;         
   font-size: 2.5rem;        
   line-height: 1.2;
   letter-spacing: 0.07em;  
   text-transform: uppercase;
}

}
.feedback.correct img, 
.feedback.incorrect img,
.feedback.correct svg,
.feedback.incorrect svg
{
    display:none;
}

.feedback.correct{
    background-color: #FFFFFF;
    border: 0px solid #FFFFFF;
    border-radius: 4px;
    box-sizing: border-box;
}


.feedback.incorrect{
    background-color: #DA3111;
    border: 0px solid #DA3111;
    border-radius: 4px 0 0 4px;
    box-sizing: border-box;
}


.donkerblauw {
    background-color: #003547;
    border: 0px solid #003547;
    border-radius: 4px !important;
    box-sizing: border-box;
}

.perzik {
    background-color: #FFF6EC;
    border: 0px solid #FFF6EC;
    border-radius: 4px !important;
    box-sizing: border-box;
}
