/************************************************************
*															*
* PHP JS CSS Image Slider v1.0.0							*
*															*
* Copyright 2016, PedroHenriques 							*
* http://www.pedrojhenriques.com 							*
* https://github.com/PedroHenriques 						*
*															*
* Free to use under the MIT license.			 			*
* http://www.opensource.org/licenses/mit-license.php 		*
*															*
************************************************************/
div.slider.ImgFocus:hover div.slider_buttons.hidden {
  bottom: 10%; }
div.slider.ImgFocus:hover div.slider_descriptions.hidden {
  top: 0%; }
div.slider.ImgFocus:hover div.slider_images div.arrow_prev.hidden {
  left: 0%; }
div.slider.ImgFocus:hover div.slider_images div.arrow_next.hidden {
  right: 0%; }
div.slider.ImgFocus div.slider_buttons {
  position: absolute;
  z-index: 100;
  width: auto;
  height: 2.5rem;
  padding: 0.5rem 0.5rem;
  background-color: rgba(255, 255, 255, 0.3);
  left: 50%;
  -webkit-transform: translate(-50%, 0%);
  -moz-transform: translate(-50%, 0%);
  -ms-transform: translate(-50%, 0%);
  -o-transform: translate(-50%, 0%);
  transform: translate(-50%, 0%); }
  div.slider.ImgFocus div.slider_buttons.hidden {
    opacity: 1;
    bottom: -2.5rem;
    -webkit-transition: bottom 300ms ease-in-out;
    -moz-transition: bottom 300ms ease-in-out;
    -o-transition: bottom 300ms ease-in-out;
    transition: bottom 300ms ease-in-out; }
  div.slider.ImgFocus div.slider_buttons.visible {
    opacity: 1;
    bottom: 10%; }
  div.slider.ImgFocus div.slider_buttons span.slider_item_button {
    width: 1.5rem;
    height: 1.5rem;
    margin-right: 1rem;
    background-color: black; }
  div.slider.ImgFocus div.slider_buttons span:last-child {
    margin-right: 0; }
  div.slider.ImgFocus div.slider_buttons span.slider_item_button.square {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0; }
  div.slider.ImgFocus div.slider_buttons span.slider_item_button.circle {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%; }
  div.slider.ImgFocus div.slider_buttons span.slider_item_button.active, div.slider.ImgFocus div.slider_buttons span.slider_item_button.inactive {
    border-top-width: 0.0625rem;
    border-bottom-width: 0.0625rem;
    border-left-width: 0.0625rem;
    border-right-width: 0.0625rem;
    border-style: solid; }
  div.slider.ImgFocus div.slider_buttons span.slider_item_button.active {
    background-color: grey; }
div.slider.ImgFocus div.slider_descriptions {
  position: absolute;
  z-index: 100;
  width: 100%;
  height: 20%;
  border: 0;
  background-color: rgba(0, 0, 0, 0.6);
  color: white;
  left: 50%;
  -webkit-transform: translate(-50%, 0%);
  -moz-transform: translate(-50%, 0%);
  -ms-transform: translate(-50%, 0%);
  -o-transform: translate(-50%, 0%);
  transform: translate(-50%, 0%); }
  div.slider.ImgFocus div.slider_descriptions.hidden {
    opacity: 1;
    top: -20%;
    -webkit-transition: top 300ms ease-in-out;
    -moz-transition: top 300ms ease-in-out;
    -o-transition: top 300ms ease-in-out;
    transition: top 300ms ease-in-out; }
div.slider.ImgFocus div.slider_images {
  height: 100%; }
  div.slider.ImgFocus div.slider_images.white {
    background-color: white;
    /*border: 0.0625rem solid black;*/ }
  div.slider.ImgFocus div.slider_images.black {
    background-color: black;
    /*border: 0.0625rem solid white;*/ }
  div.slider.ImgFocus div.slider_images div.arrow_prev.hidden,
  div.slider.ImgFocus div.slider_images div.arrow_next.hidden {
    opacity: 1; }
  div.slider.ImgFocus div.slider_images div.arrow_prev.hidden {
    left: -5%;
    -webkit-transition: left 300ms ease-in-out;
    -moz-transition: left 300ms ease-in-out;
    -o-transition: left 300ms ease-in-out;
    transition: left 300ms ease-in-out; }
  div.slider.ImgFocus div.slider_images div.arrow_next.hidden {
    right: -5%;
    -webkit-transition: right 300ms ease-in-out;
    -moz-transition: right 300ms ease-in-out;
    -o-transition: right 300ms ease-in-out;
    transition: right 300ms ease-in-out; }

div.slider.ShowAll div.slider_buttons {
  height: 5%; }
  div.slider.ShowAll div.slider_buttons span.slider_item_button {
    height: 100%;
    margin-bottom: 0;
    padding-top: 0.3125rem;
    -webkit-border-top-left-radius: 0.5rem;
    -webkit-border-top-right-radius: 0.5rem;
    -moz-border-top-left-radius: 0.5rem;
    -moz-border-top-right-radius: 0.5rem;
    border-top-left-radius: 0.5rem;
    border-top-right-radius: 0.5rem; }
    div.slider.ShowAll div.slider_buttons span.slider_item_button.active, div.slider.ShowAll div.slider_buttons span.slider_item_button.inactive {
      border-top-width: 0.0625rem;
      border-bottom-width: 0;
      border-left-width: 0.0625rem;
      border-right-width: 0.0625rem;
      border-style: solid; }
    div.slider.ShowAll div.slider_buttons span.slider_item_button.active {
      background-color: rgba(0, 0, 255, 0.35); }
div.slider.ShowAll div.slider_descriptions {
  height: 10%;
  background-color: rgba(0, 0, 255, 0.2);
  border-top: 0.0625rem;
  border-bottom: 0;
  border-left: 0.0625rem;
  border-right: 0.0625rem;
  border-style: solid;
  border-color: red; }
div.slider.ShowAll div.slider_images {
  height: 85%;
  border-top: 0;
  border-bottom: 0.0625rem;
  border-left: 0.0625rem;
  border-right: 0.0625rem;
  border-style: solid;
  border-color: red; }

div.slider {
  position: relative;
  width: 750px;
  height: 500px;
  overflow: hidden;
  font-size: 1rem;
  font-weight: normal; }
  div.slider * {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box; }
  div.slider:hover div.slider_buttons.hidden, div.slider:hover div.slider_descriptions.hidden, div.slider:hover div.slider_images div.arrow_prev.hidden, div.slider:hover div.slider_images div.arrow_next.hidden {
    opacity: 1; }
  div.slider div.slider_buttons {
    position: relative;
    width: 100%;
    overflow: hidden; }
    div.slider div.slider_buttons.adjust_arrows {
      max-width: 90%; }
    div.slider div.slider_buttons.hidden {
      opacity: 0;
      -webkit-transition: opacity 300ms ease-in-out;
      -moz-transition: opacity 300ms ease-in-out;
      -o-transition: opacity 300ms ease-in-out;
      transition: opacity 300ms ease-in-out; }
    div.slider div.slider_buttons span.slider_item_button {
      position: relative;
      float: left;
      text-align: center;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      cursor: pointer; }
      div.slider div.slider_buttons span.slider_item_button.active {
        border-color: red; }
      div.slider div.slider_buttons span.slider_item_button.inactive {
        border-color: black; }
  div.slider div.slider_descriptions {
    position: relative;
    width: 100%; }
    div.slider div.slider_descriptions.adjust_arrows {
      width: 90%; }
    div.slider div.slider_descriptions.hidden {
      opacity: 0;
      -webkit-transition: opacity 300ms ease-in-out;
      -moz-transition: opacity 300ms ease-in-out;
      -o-transition: opacity 300ms ease-in-out;
      transition: opacity 300ms ease-in-out; }
    div.slider div.slider_descriptions span.slider_item_description {
      position: absolute;
      width: 100%;
      height: 100%;
      margin: 0;
      padding: 0rem 0.625rem;
      word-wrap: break-word; }
      div.slider div.slider_descriptions span.slider_item_description.visible {
        display: block; }
      div.slider div.slider_descriptions span.slider_item_description.hidden {
        display: none; }
  div.slider div.slider_images {
    position: relative;
    width: 100%;
    overflow: hidden; }
    div.slider div.slider_images.white {
      background-color: white; }
    div.slider div.slider_images.black {
      background-color: black; }
    div.slider div.slider_images span.slider_item_image {
      position: absolute;
      width: 100%;
      height: 100%;
      background-repeat: no-repeat;
      background-size: contain;
      /*background-position: 50% 50%;*/
      background-position: 20% 20%; }
      div.slider div.slider_images span.slider_item_image.front {
        z-index: 1;
        opacity: 1;
        left: 0; }
      div.slider div.slider_images span.slider_item_image.back, div.slider div.slider_images span.slider_item_image.middle {
        z-index: 0;
        opacity: 0;
        left: 0; }
    div.slider div.slider_images.switch_opacity.with_transition span.slider_item_image {
      -webkit-transition: opacity 300ms ease-in-out;
      -moz-transition: opacity 300ms ease-in-out;
      -o-transition: opacity 300ms ease-in-out;
      transition: opacity 300ms ease-in-out; }
    div.slider div.slider_images.switch_slide.with_transition span.slider_item_image {
      -webkit-transition: left 300ms ease-in-out;
      -moz-transition: left 300ms ease-in-out;
      -o-transition: left 300ms ease-in-out;
      transition: left 300ms ease-in-out; }
    div.slider div.slider_images.forward.switch_slide span.slider_item_image.middle {
      z-index: 1;
      opacity: 1;
      left: -100%; }
    div.slider div.slider_images.forward.switch_slide span.slider_item_image.front {
      left: 0; }
    div.slider div.slider_images.forward.switch_slide span.slider_item_image.back {
      z-index: 1;
      left: 100%; }
    div.slider div.slider_images.backward.switch_slide span.slider_item_image.middle {
      z-index: 1;
      opacity: 1;
      left: 100%; }
    div.slider div.slider_images.backward.switch_slide span.slider_item_image.front {
      left: 0; }
    div.slider div.slider_images.backward.switch_slide span.slider_item_image.back {
      z-index: 1;
      left: -100%; }
    div.slider div.slider_images div.arrow_prev,
    div.slider div.slider_images div.arrow_next {
      position: absolute;
      z-index: 100;
      width: 5%;
      height: 100%;
      background: rgba(0, 0, 0, 0.6);
      font-weight: bold;
      color: white;
      cursor: pointer;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none; }
      div.slider div.slider_images div.arrow_prev span,
      div.slider div.slider_images div.arrow_next span {
        position: absolute;
        left: 50%;
        top: 50%;
        -webkit-transform: translate(-50%, -50%);
        -moz-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        -o-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%); }
      div.slider div.slider_images div.arrow_prev.hidden,
      div.slider div.slider_images div.arrow_next.hidden {
        opacity: 0;
        -webkit-transition: opacity 300ms ease-in-out;
        -moz-transition: opacity 300ms ease-in-out;
        -o-transition: opacity 300ms ease-in-out;
        transition: opacity 300ms ease-in-out; }
    div.slider div.slider_images div.arrow_prev {
      left: 0; }
    div.slider div.slider_images div.arrow_next {
      right: 0; }

/*# sourceMappingURL=imageslider.css.map */