.carousel img                             { width: 100%; display: block; }
.carousel__controls                       { width: 28px; margin-top: -20px; position: absolute;  top: 50%; z-index: 20; cursor: pointer; transition: top 1s; }
.carousel__prev                           { left: 0px; }
.carousel__next                           { right: 0px; }

.carousel__container                      { position: relative; }
.carousel__element                        { width: 60%; position: absolute; left: 20%; transform: scale(0.5); z-index: 5; opacity: 0.45; transition: width 1s ease-in-out, height 1s ease-in-out, left 1s ease-in-out, transform 1s ease-in-out, opacity 3s; box-sizing: border-box; cursor: pointer; }
.carousel__element:hover                  { opacity: 1; transition: width 1s ease-in-out, height 1s ease-in-out, left 1s ease-in-out, transform 1s ease-in-out, opacity 1s; }
.carousel__element--center                { left: 20%; top: 0px; transform: scale(1); z-index: 10; opacity: 1; transition: width 1s ease-in-out, height 1s ease-in-out, left 1s ease-in-out, transform 1s ease-in-out, opacity 1s }
.carousel__element--left                  { left: -10%; z-index: 8; }
.carousel__element--right                 { left: 50%; z-index: 8; }
.carousel__inner                          { position: relative; }

.carousel__link                           { width: 100%; display: block; }
.carousel__image                          { width: 100%; }

.carousel__caption                        { width: 100%; padding: 14px; background: rgba(0, 0, 0, 0.7); color: #FFF; position: absolute; bottom: 0; left: 0px; box-sizing: border-box; }
.carousel__caption h4                     { margin-top: 0px; margin-bottom: 8px; }
.carousel__movil                          { display: none; }

@media (max-width: 767px) {
		.carousel                                 { padding-left: 10px; padding-right: 15px; overflow: hidden; }
		.carousel__element                        { width: 100% !important; padding-left: 34px; padding-right: 34px; left: 0% !important; transform: scale(1) !important; opacity: 0; transition: left 0s, opacity 0s; }
		.carousel__element--center                { opacity: 1; transition: left 1s ease-in-out; }
		.carousel__element--left                  { left: -100% !important; margin-left: -10px; opacity: 1; transition: left 1s ease-in-out, opacity 4s; }
		.carousel__element--right                 { left: 100% !important; margin-left: 10px; opacity: 1; transition: left 1s ease-in-out, opacity 4s; }
		.carousel__description                    { display: block; }
		
		.carousel__movil                          { display: block; }
}