/*
if u want place 'addon slider' in any 'block'
u 'block' req. settings >> position: relative
*/
.ashwood {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: relative;
  background-color: #c5d8e6;
}
.ashwood > * {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.ashwood__slider {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 10;
}
.ashwood__slider-addon {
  position: absolute;
  bottom: 5px;
  right: 5px;
  z-index: 11;
  overflow: hidden;
  font-size: 0;
}
.ashwood__pagination {
  position: absolute;
  bottom: 20px;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  list-style: none;
  width: 100%;
  text-align: center;
  margin: 0;
  padding: 0;
  font-size: 0;
  z-index: 20;
}
.ashwood__pagination > .button {
  display: inline-block;
  width: 10px;
  height: 10px;
  background-color: transparent;
  border: 1px solid #6b809d;
  border-radius: 50%;
  cursor: pointer;
  margin-right: 15px;
}
.ashwood__pagination > .button:last-child {
  margin-right: 0;
}
.ashwood__pagination > .button.active {
  background-color: #6b809d;
}
.ashwood__content {
  position: relative;
  z-index: 15;
}

/* customize styles */
.ashwood [class*='slideaddon-'] {
  background-color: transparent;
  width: 213px;
  height: 213px;
  display: inline-block;
  position: relative;
  font-size: 1rem;
  background-repeat: no-repeat;
  background-size: contain;
}

.ashwood [class*='slide-'] {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-repeat: no-repeat;
  background-size: cover;
  display: none;
  background-position-y: center;
}
.ashwood [class*='slide-'].active {
  display: block;
}

/* mainslide example */
.ashwood .slide-1{ background-image: url(../img/bg0.jpg);}
.ashwood .slide-3{ background-image: url(../img/bg1.jpg);}
.ashwood .slide-5{ background-image: url(../img/bg2.jpg);}
.ashwood .slide-2{ background-image: url(../img/bg3.jpg);}
.ashwood .slide-4{ background-image: url(../img/bg4.jpg);}
.ashwood .slide-6{ background-image: url(../img/bg5.jpg);
}

/* addonslide example */
.ashwood .slideaddon-1{
  background-image: url(../img/icon_slider.png)

}
.ashwood .slideaddon-2 {
  background-image: url(../img/icon_slider_1.png)
}

.ashwood .slideaddon-3{
  background-image: url(../img/icon_slider_2.png)
}
.ashwood .slideaddon-4 {
  background-image: url(../img/icon_slider_3.png)
}

.ashwood .slideaddon-5{
  background-image: url(../img/icon_slider_4.png)
}
.ashwood .slideaddon-6 {
  background-image: url(../img/icon_slider_5.png)
}

/* for example only */
/*.previwe {
  min-height: 95vh;
  background-color: #222;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-flow: row;
          flex-flow: row;
}

section {
  width: 100%;
  margin: auto;
  padding: 52px 0;
}

.container {
  position: relative;
}
*/