/*
Nombre: Abastecedora de Repuestos | 2017
Description: Web site 
Author: Eduardo Esparza
Author URI: http://www.cocolab.com
Git: git@bitbucket.org:carlos_eduardo_esparza_pinelo/abas.git
Version: 1.0
*/


/*************************

01. slider full screen

*************************/



.slider-area img {

    height: 100vh !important;

    width: 100%;

}



/*************************

02. slider caption

*************************/



.slider-caption {

    padding-top: 35vh;

}

.layer-1-1 h2.title-1 ,

.layer-2-1 h2.title-1 {

    animation: 0.6s ease-in-out 0.6s normal backwards 1 running fadeInDown;

}

.layer-1-2 h2.title-2 ,

.layer-2-2 h2.title-2 {

    animation: 0.6s ease-in-out 1s normal backwards 1 running zoomIn;

}

.layer-1-3 p.title-3,

.layer-2-3 p.title-3 {

    animation: 0.6s ease-in-out 1.6s normal backwards 1 running fadeInLeft;

    margin: auto;

}

.layer-1-4 a.title-4,

.layer-2-4 a.title-4,

.layer-1-4 a.title-5,

.layer-2-4 a.title-5 {

    animation: 0.6s ease-in-out 2s normal backwards 1 running lightSpeedIn;

}

.layer-1-4 a.title-5,

.layer-2-4 a.title-5 {

    animation-delay: 2.6s;

}

.layer-1-5 a.cursor,

.layer-2-5 a.cursor {

    animation: 0.6s ease-in-out 3.2s normal backwards 1 running zoomIn;

}



/*************************

03. preview

*************************/





/*************************

03.1 nivo preview

*************************/



.preview .nivoSlider .nivo-directionNav a.nivo-prevNav,

.preview .nivoSlider .nivo-directionNav a.nivo-nextNav {

    border: 1px solid #fff;

    color: #fff;

    letter-spacing: 5px;

    padding: 5px 10px;

    text-transform: uppercase;

    top: 50%;

    transform: rotate(-90deg);

}

.preview .nivoSlider .nivo-directionNav a {

    right: 10px;

}

.preview .nivoSlider .nivo-directionNav a.nivo-prevNav {

    left: 10px;

    right: auto;

}

.preview .nivo-controlNav {

    bottom: 20px;

    left: 0;

    right: 0;

    margin: auto;

    position: absolute;

    z-index: 99999;

}

.preview .nivo-controlNav a {

    display: inline-block;

    height: 3px;

    margin: 0 5px;

    text-indent: -9999px;

    width: 30px;

    line-height: 8px;

    background: #fff;

    cursor: pointer;

    position: relative;

    z-index: 9;

    opacity: 0;

    z-index: -999;

}

.preview:hover .nivo-controlNav a{

    opacity: 1;

    z-index: 999999;

}

.preview .nivo-controlNav a.active {

    width: 35px;

}

.no-directionNav .nivo-directionNav {

  display: none;

}



/*************************

03.2 owl preview

*************************/



.preview.owl-theme .owl-controls {

    left: 0;

    margin: auto;

    position: absolute;

    right: 0;

    bottom: 0;

}

.preview.owl-controls .owl-page, .owl-controls .owl-buttons div {

    cursor: auto;

}

.preview.owl-theme .owl-controls .owl-page span {

    background-color: #fff;

    border-radius: 0;

    cursor: pointer;

    display: block;

    height: 20px;

    margin: 10px;

    opacity: 1;

    width: 2px;

    transition: all 0.5s ease 0s;

}

.preview.owl-theme .owl-controls .owl-page.active span {

    height: 30px;

    margin-bottom: 5px;

}

.preview-2.owl-theme .owl-controls {

    margin: 0px

}

.preview-2.owl-theme .owl-controls .owl-buttons div {

    background-color: #fff;

    border-radius: 0;

    color: #313131;

    cursor: pointer;

    font-size: 18px;

    height: 40px;

    left: 0;

    line-height: 40px;

    margin: -20px 0 0;

    opacity: 1;

    position: absolute;

    transition: all 0.5s ease 0s;

    top: 50%;

    width: 40px;

}

.preview-2.owl-theme .owl-controls .owl-buttons div:hover {

    color: #fff;

}

.preview-2.owl-theme .owl-controls .owl-buttons div.owl-next {

    left: auto;

    right: 0;

}

.preview-3 .owl-controls.clickable {

    margin: 0;

    position: relative;

    top: 30px;

}

.testimonials.preview-3 .owl-controls.clickable {

    margin: 0;

    position: relative;

    top: -30px;

}

.preview-3 .owl-controls.clickable .owl-pagination .owl-page span {

    background-color: #3e3e3e;

    border-radius: 0;

    height: 3px;

    margin: 0 2px;

    opacity: 1;

    width: 30px;

}