@-webkit-keyframes ticker {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: visible;
  }

  100% {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

@keyframes ticker {
  0% {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    visibility: visible;
  }

  100% {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
  }
}

.ticker-wrap { 
  background-color: #faa61a !important;
    color: #fff;
  width: 100%;
  overflow: hidden;
  height: 4rem;
  padding-left: 100%;
  box-sizing: content-box;
}

.sidebar_message_inner h2 {
  margin-bottom: 12px;
  text-align: left;
}

  .ticker {
    display: inline-block;
    height: 4rem;
    line-height: 4rem;  
    white-space: nowrap;
    padding-right: 100%;
    box-sizing: content-box;
    background-color: #faa61a !important;
    color: #fff;

    -webkit-animation-iteration-count: infinite; 
            animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
            animation-timing-function: linear;
   -webkit-animation-name: ticker;
           animation-name: ticker;
    -webkit-animation-duration: 35s;
            animation-duration: 35s;

    &__item {

      display: inline-block;

      padding: 0 2rem;
      font-size: 2rem;
      color: white;   

    }
  }

.ticker-wrap {
    overflow: hidden;
    padding-left: 100%;
    box-sizing: content-box;
}

.ticker {
    display: inline-block;
    white-space: nowrap;
    padding-right: 100%;
    box-sizing: content-box;
    animation: ticker 50s linear infinite; 
}

.ticker__item {
    display: inline-block;
    padding: 0 2rem;
    font-size: 2em;
    font-family: 'Open sans', sans-serif;
    font-weight: 700;
}

a#ticker_message_verstuur {
  width: fit-content;
  padding-right: 18px !important;
  margin-right: 5px;
}

@keyframes ticker {
    0% {
        transform: translate3d(0, 0, 0);
    }
    100% {
        transform: translate3d(-100%, 0, 0);
    }
}

span.name {
  color: #f04124;
}

@media (min-width: 768px) {
	
	.tickertop {
		    display: none;
	}
	
		.tickerbottom {
		    display: block;
	}
	
}


@media (max-width: 768px) {
	
	.tickertop {
		    display: block;
	}
	
		.tickerbottom {
		    display: none;
	}
	
	
    .ticker-wrap {
            padding: 4px 0 0 0;
    margin: 0;
    }

    .ticker__item {
        padding: 0 1rem;
        font-size: 1.3rem;
        line-height: 1.2;
    }

    .ticker {
        animation-duration: 40s; /* rustiger snelheid op mobiel */
    }
}
