/* carousel global styles */

.carrousel {
    position:relative;
}

.invisible {
    position: absolute !important;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    margin:0; padding:0;
}

.carrousel__container {
  white-space: nowrap;
  overflow:hidden;
}

.carrousel__content[aria-hidden=true] {
  display: none;
  position:absolute;
  top:0; left:0;
}

.theme-a-carrousel__control__list {
  position: absolute;
  list-style-type: none;
  bottom: -25px;
  top:auto;
  right: 0;
  left: 0;
  padding-left: 0;
  text-align: center;
  z-index:100;
  opacity:0;
  transition:bottom 0.5s, opacity 0.5s;
}

.carrousel:hover .theme-a-carrousel__control__list {
  bottom:0;
  opacity:1;
  top:auto;
}
[data-whatinput='keyboard']:not([data-whatintent='mouse']) .theme-a-carrousel__control__list {
  opacity:1;
  bottom:auto;
  top:4px;
}

.theme-a-carrousel__control__list__item {
  display: inline-block;
  margin: 0 .5em;
}
.theme-a-carrousel__control__list__link {
  display: inline-block;
  width: 12px;
  height: 12px;
  background: #fff;
  border-radius: 12px;
  opacity:0.75;
}
[data-whatinput='mouse'] .theme-a-carrousel__control__list__link { outline:0; }

.theme-a-carrousel__button-container {
  position: absolute;
  z-index:100;
  top: 50%;
  transform: translateY(-50%);
  width:32px;
  height:32px;
  overflow:hidden;
}

.theme-a-carrousel__button__previous {
  position:absolute;
  left:8;
}
.theme-a-carrousel__button__next {
  position:absolute;
  right:0;
}

.theme-a-carrousel__button__previous .theme-a-carrousel__button__button {
  left: -32px;
  transition:left 0.5s, opacity 0.5s;
  opacity:0;
}

.carrousel:hover .theme-a-carrousel__button__previous .theme-a-carrousel__button__button,
[data-whatinput='keyboard'] .theme-a-carrousel__button__previous .theme-a-carrousel__button__button:focus {
    left: 8px;
    opacity:1;
}

.theme-a-carrousel__button__next .theme-a-carrousel__button__button {
  right: -32px;
  transition:right 0.5s, opacity 0.5s;
  opacity:0;
}

.carrousel:hover .theme-a-carrousel__button__next .theme-a-carrousel__button__button,
[data-whatinput='keyboard'] .theme-a-carrousel__button__next .theme-a-carrousel__button__button:focus {
    right:8px;
    opacity:1;
}

.theme-a-carrousel__button__button {
    display:block;
    white-space: nowrap;
    padding-top:32px;
    overflow: hidden;
    position:absolute;
    width:24px;
    height:32px;
    cursor:pointer;
    background:rgba(255,255,255,0.5);
}
[data-whatinput='mouse'] .theme-a-carrousel__button__button { outline:0; }

.theme-a-carrousel__button__button::before {
    content:'';
    display: block;
    position:absolute;
    top:8px; left:8px;
    border:solid black;
    border-width:0 2px 2px 0;
    width:16px;
    height:16px;
}
.theme-a-carrousel__button__previous .theme-a-carrousel__button__button::before {
    transform:rotate(135deg);
}
.theme-a-carrousel__button__next .theme-a-carrousel__button__button::before {
    transform:rotate(-45deg);
    left:0;
}

.carrousel__pause {
      background:rgba(255,255,255,0.5);
      position:absolute;
      top:-12px;
      left:8px;
      width:18px;
      height:18px;
      z-index:200;
      cursor:pointer;
      transition:top 0.5s, opacity 0.5s;
      opacity:0;
}

.carrousel:hover .carrousel__pause,
.carrousel__pause:focus {
    top:8px;
    opacity:1;
}

.carrousel__pause::after {
     content:'';
     border-left:2px solid black;
     border-right:2px solid black;
     position:absolute;
     top:4px; left:5px;
     width:8px;
     height:10px;
}





/* transition slide */
.slide .carrousel__content {
  display: inline-block;
  vertical-align: top;
  visibility: visible;
  width: 100%;
  position: relative;
  -webkit-transition: left .5s ease-in;
  -moz-transition: left .5s ease-in;
  -o-transition: left .5s ease-in;
  -ms-transition: left .5s ease-in;
  transition: left .5s ease-in;
}

.slide .carrousel__content.visibility-off {
  visibility: hidden;
}


.carrouselslide-1-1.slide > div { left: 0; }
.carrouselslide-1-2.slide > div { left: -100%; }
.carrouselslide-1-3.slide > div { left: -200%; }
.carrouselslide-1-4.slide > div { left: -300%; }
.carrouselslide-1-5.slide > div { left: -400%; }
.carrouselslide-1-6.slide > div { left: -500%; }
.carrouselslide-1-7.slide > div { left: -600%; }
.carrouselslide-1-8.slide > div { left: -700%; }
.carrouselslide-1-9.slide > div { left: -800%; }
.carrouselslide-1-10.slide > div { left: -900%; }
.carrouselslide-1-11.slide > div { left: -1000%; }
.carrouselslide-1-12.slide > div { left: -1100%; }
.carrouselslide-1-13.slide > div { left: -1200%; }
.carrouselslide-1-14.slide > div { left: -1200%; }
.carrouselslide-1-15.slide > div { left: -1300%; }
.carrouselslide-1-16.slide > div { left: -1400%; }
.carrouselslide-1-17.slide > div { left: -1500%; }
.carrouselslide-1-18.slide > div { left: -1600%; }
.carrouselslide-1-19.slide > div { left: -1700%; }
.carrouselslide-1-20.slide > div { left: -1800%; }


.slide .carrousel__content[aria-hidden=true] {
  display: inline-block;
}

/* transition fade */
.fade .carrousel__content {
  -webkit-animation: fadein 1s;
  -moz-animation:    fadein 1s;
  -o-animation:      fadein 1s;
  -ms-animation:     fadein 1s;
  animation:         fadein 1s;
}
.fade .carrousel__content[aria-hidden=true] {
  -webkit-animation: fadeout 1s;
  -moz-animation:    fadeout 1s;
  -o-animation:      fadeout 1s;
  -ms-animation:     fadeout 1s;
  animation:         fadeout 1s;
}

@-webkit-keyframes fadeout {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@-moz-keyframes fadeout {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@-o-keyframes fadeout {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@-ms-keyframes fadeout {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@keyframes fadeout {
  0%   { opacity: 1; }
  100% { opacity: 0; }
}

@-webkit-keyframes fadein {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@-moz-keyframes fadein {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@-o-keyframes fadein {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@-ms-keyframes fadein {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}
@keyframes fadein {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}



/* carrousel */
.theme-a-carrousel__control__list__link:focus,
.theme-a-carrousel__control__list__link:hover,
.theme-a-carrousel__control__list__link:active,
.theme-a-carrousel__control__list__link[aria-selected=true] {
  background: #000;
}


.carrousel__content {
  display:none;
}