/* Footer styles */
.footer {
  -webkit-clip-path: polygon(100% 100%, 0 100%, 0 0, 28.8% 30px, 100% 0);
  clip-path: polygon(100% 100%, 0 100%, 0 0, 28.8% 30px, 100% 0);
}
#autovisieBrandsFooter {
  padding-bottom: 25px;
}
#autovisieBrandsFooter ul {
  list-style: none;
  padding-left: 0px;
  font-size: 16px;
  margin-top: 5px;
}
#av-footer-right ul {
  display: flex;
  flex-wrap: wrap;
}
#autovisieBrandsFooter ul a,
#autovisieBrandsFooter ul a:hover,
#autovisieBrandsFooter ul a:link,
#autovisieBrandsFooter ul a:active {
  color: #9c9b9b;
  text-decoration: none;
  font-family: 'Roboto', serif;
}
#av-footer-right ul li {
  width: 50%;
}
#av-footer-right {
  display: flex;
  flex: 0 100%;
  flex-direction: column;
}
.footer-about,
.footer-other {
  margin: 5px 0 20px 0;
}
.footer-header {
  font-size: 23px;
  margin-left: 0px;
  font-weight: 500;
  color: #d00019;
  font-family: 'Roboto', serif;
}
.footer .footer__totop .button--totop.button--totop {
  top: 35px;
}

@media only screen and (min-width: 767px) {
  .footer {
    -webkit-clip-path: polygon(100% 100%, 0 100%, 0 0, 28.8% 42px, 100% 0);
    clip-path: polygon(100% 100%, 0 100%, 0 0, 28.8% 42px, 100% 0);
  }
  #autovisieBrandsFooter {
    padding-bottom: 25px;
  }
  #autovisieBrandsFooter ul {
    padding-left: 10px;
  }
  #av-footer-right ul {
    display: flex;
    flex-wrap: wrap;
    padding: 0 5px 30px 10px;
    margin-top: 8px;
    max-width: 95%;
  }
  #autovisieBrandsFooter ul a:hover {
    /* text-decoration: underline; */
    color: white;
  }
  #av-footer-right ul li {
    /* margin: 0px 5px; */
    width: 25%;
  }
  #autovisieBrandsFooter .container {
    display: flex;
  }
  #av-footer-left {
    display: flex;
    flex: 0 28%;
    flex-direction: column;
    border-right: 1px solid rgba(255, 255, 255, 0.3);
    margin-right: 32px;
  }
  #av-footer-right {
    display: flex;
    flex: 0 calc(72% - 32px);
    flex-direction: column;
    margin-left: 32px;
  }
  .footer-about,
  .footer-other {
    margin: 5px 0 20px 0;
  }
  .footer-header {
    margin-left: 10px;
  }
  .footer .footer__navigation .footer__navigation-container {
    padding-bottom: 0;
    padding-top: 4%;
  }
}

/* Abonnement in article */
@media screen and (max-width: 767px) {
  .subscription_banner {
    margin-top: 20px;
    background: url(../images/av-promotion-mobile.jpg) center no-repeat;
    height: 720px;
    display:none;
  }
}
@media screen and (min-width: 768px) {
  .subscription_banner {
    margin-top: 20px;
    background: url(../images/av-promotion-tablet.jpg) center no-repeat;
    height: 482px;
    display:none;
  }
}
@media screen and (min-width: 1180px) {
  .subscription_banner {
    margin-top: 30px;
    background: url(../images/av-promotion-desktop.jpg) center no-repeat;
    height: 520px;
    display:none;
  }
}

/* YOUTUBE BLOCK */
.av-yt {
  display: flex;
  border: 1px solid #333;
  margin: 1rem 1.5rem;
  flex-direction: column;
}
.av-yt .av-yt--header {
  display: flex;
  flex-direction: row;
  padding: 1rem;
}
.av-yt .av-yt--title {
  font-family: 'Roboto Slab', serif;
  font-weight: 400;
  font-size: 18px;
  display: flex;
  flex: 1;
  flex-direction: column;
  margin-top: 0;
}
.av-yt .av-yt--channelbtn {
  display: flex;
  width: 89px;
  height: 20px;
  justify-content: center;
  margin-right: 10px;
  flex-direction: column;
  align-items: flex-end;
  align-self: center;
}
.av-yt .av-yt--channelbtn img {
  width: 100%;
  height: auto;
}

.av-yt .av-yt--list {
  display: flex;
  flex-direction: row;
  overflow-x: auto;
  margin: 1rem;
}
.av-yt .av-yt--list .av-yt--item {
  width: 200px;
  margin: 4px;
}
.av-yt .av-yt--list .av-yt--item:first-of-type {
  margin-left: 0;
}
.av-yt .av-yt--list .av-yt--item img {
  width: 200px;
  height: auto;
}
.av-yt .av-yt--list .av-yt--item a {
  text-decoration: none;
  font-size: 14px;
}
.av-yt .av-yt--list .av-yt--item .av-yt--itemtitle {
  display: flex;
  white-space: normal;
  font-size: 14px;
  text-decoration: none;
  line-height: 18px;
  font-weight: 500;
  color: #2988b6;
  cursor: pointer;
  margin: 4px 0;
}
.av-yt .av-yt--list .av-yt--item .av-yt--videocontainer {
  position: relative;
}
.av-yt .av-yt--list .av-yt--item .av-yt--itemviews {
  font-weight: 400;
  color: #9c9b9b;
  line-height: 18px;
}
.av-yt .av-yt--list .av-yt--item .av-yt--itemduration {
  position: absolute;
  bottom: 0;
  right: 0;
  margin: 3px;
  border-radius: 2px;
  background-color: rgba(0,0,0,.5);
  color: white;
  padding: 2px 4px;
  -ms-flex-align: center;
  align-items: center;
  font-size: 13px;
}
.av-yt .av-yt--footer {
  background: #191a1e;
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1rem;
}

.av-yt .av-yt--footer .av-yt--footer--container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-family: 'Roboto Slab', serif;
}
.av-yt .av-yt--footer .av-yt--footertext {
  font-size: 16px;
  text-align: center;
  font-weight: 300;
}

.av-yt .av-yt--footer .av-yt--joinbtn {
  background: #d00019;
  font-weight: 600;
  padding: 10px 10px;
  margin: 8px 0 10px 0;
  min-width: 180px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  text-decoration: none;
}
.av-yt .av-yt--footer .av-yt--joinbtn img {
  height: 20px;
  width: 28px;
  margin-right: 8px;
}

/* TABLET */

@media screen and (min-width: 768px) {
  .av-yt {
    margin: 1rem;
  }
  .av-yt .av-yt--title {
    font-size: 24px;
  }
  .av-yt .av-yt--channelbtn {
    width: 131px;
    height: 29.5px;
  }

  .av-yt .av-yt--header {
    display: flex;
    flex-direction: row;
    padding: 2rem 2rem 1rem 2rem;
  }
  .av-yt .av-yt--list {
    margin: 1rem 2rem;
  }
  .av-yt .av-yt--list .av-yt--item,
  .av-yt .av-yt--list .av-yt--item img {
    width: 273px;
  }
  .av-yt .av-yt--footer {
    flex-direction: row;
    padding: 2rem 4rem;
  }
  .av-yt .av-yt--footer .av-yt--footer--container {
    align-items: center;
    align-self: center;
    justify-content: flex-end;
    margin: 0 2rem;
  }
  .av-yt .av-yt--footer .av-yt--footer--container:first-of-type {
    align-items: flex-start;
    justify-content: flex-start;
    flex: 1;
    margin: 0 0 2rem 4rem;
  }
  .av-yt .av-yt--footer {
    align-items: flex-end;
  }
}

/* DESKTOP */
@media screen and (min-width: 1180px) {
  .av-yt .av-yt--title {
    font-size: 30px;
  }

  .av-yt .av-yt--channelbtn {
    right: 38px;
    width: 170x;
    /* height: 39.4px; */
  }
  .av-yt .av-yt--footer .av-yt--footertitle {
    font-size: 30px;
  }
  .av-yt .av-yt--footer .av-yt--footertext {
    font-size: 24px;
  }
  .av-yt .av-yt--footer .av-yt--footer--container {
    margin: 0 4rem 0 0;
  }
  .av-yt .av-yt--footer .av-yt--footer--container:first-of-type {
    margin: 0 0 2rem 6rem;
  }
}

/*
 * Extra content block with subscription banner
 *
 */
.block--abonnement {
  padding: 2rem 0;
  background: white;
}
.av-login {
  max-width: 60rem;
  margin: 0 auto;
  padding: 2rem;
  text-align: center;
}
.av-login__title {
  font-size: 3rem;
}
.av-subscription {
  padding: 4rem 0;
  text-align: center;
}
.av-login .btn--secondary {
  border: none;
  background-color: #d00019;
  margin: 2rem auto;
  width: 29rem;
}