.slider {
    width: 100%;
    height: 391px !important;
    position: relative;
    background: #000096
}

.slItems {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
}

.slItem {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: #000096;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    opacity: 0;
    visibility: hidden;
    -webkit-backface-visibility: hidden; /* Chrome, Safari, Opera */
    backface-visibility: hidden;
}

.slText {
    position: absolute;
    width: 30%;
    padding-top: 10px;
    text-align: left;
    /*transform: translate3d(-50%, -50%, 0);
    -webkit-transform: translate3d(-50%, -50%, 0);
    -moz-transform: translate3d(-50%, -50%, 0);
    -o-transform: translate3d(-50%, -50%, 0);
    -ms-transform: translate3d(-50%, -50%, 0);*/
    color: #fff;
    font-size: 32px;
    right: 16%;
    top: 18%;
    font-weight: normal;
    line-height: normal;
}

.slider [class*="ctrl"] {
    position: absolute;
    top: 19%;
    color: #fff;
    font-size: 35px;
    font-weight: normal;
    margin-top: -42.5px;
    cursor: pointer;
}

.ctrlNext {
    right: 44.4%;
}

.ctrlPrev {
    left: auto;
    right: 45.4%;
}

.slItem.active {
    opacity: 1;
    visibility: visible;
    transform: translate3d(0,0,0);
    -webkit-transform: translate3d(0,0,0);
    -moz-transform: translate3d(0,0,0);
    -o-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0);
}

.next, .prev {
    transition: transform 0.7s ease-in-out;
    -webkit-transition: -webkit-transform 0.7s ease-in-out;
    -moz-transition: -moz-transform 0.7s ease-in-out;
    -o-transition: -o-transform 0.7s ease-in-out;
    -ms-transition: -ms-transform 0.7s ease-in-out;
}

.slItem.nextItem {
    opacity: 1;
    visibility: visible;
    transform: translate3d(100%,0, 0);
    -webkit-transform: translate3d(100%,0,0);
    -moz-transform: translate3d(100%,0,0);
    -o-transform: translate3d(100%,0,0);
    -ms-transform: translate3d(100%,0,0);
}

    .slItem.nextItem.next, .slItem.prevItem.prev {
        transform: translate3d(0,0);
        -webkit-transform: translate3d(0,0,0);
        -moz-transform: translate3d(0,0,0);
        -o-transform: translate3d(0,0,0);
        -ms-transform: translate3d(0,0,0);
    }

.slItem.active.next {
    transform: translate3d(-100%,0,0);
    -webkit-transform: translate3d(-100%,0,0);
    -moz-transform: translate3d(-100%,0,0);
    -o-transform: translate3d(-100%,0,0);
    -ms-transform: translate3d(-100%,0,0);
}

.slItem.prevItem {
    opacity: 1;
    visibility: visible;
    transform: translate3d(-100%,0,0);
    -webkit-transform: translate3d(-100%,0,0);
    -moz-transform: translate3d(-100%,0,0);
    -o-transform: translate3d(-100%,0,0);
    -ms-transform: translate3d(-100%,0,0);
}

.slItem.active.prev {
    transform: translate3d(100%,0,0);
    -webkit-transform: translate3d(100%,0,0);
    -moz-transform: translate3d(100%,0,0);
    -o-transform: translate3d(100%,0,0);
    -ms-transform: translate3d(100%,0,0);
}

.slDots {
    position: absolute;
    bottom: 50px;
    left: 50%;
    transform: translate(-50%, 0);
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    display: none
}

.slDotsSingle {
    width: 13px;
    height: 13px;
    float: left;
    border: 2px solid #FFFFFF;
    border-radius: 50%;
    margin-left: 5px;
    cursor: pointer;
    transition: background 0.3s ease;
}

    .slDotsSingle.active {
        background: #FFFFFF;
    }

    .slDotsSingle:hover {
        background: #D0D0D0;
        border-color: #D0D0D0;
    }















/*Media Queries Starts here*/
@media (max-width: 575px) {
    .slider {
        height: 220px !important;
    }

    .slItem {
        background-position: 58% center
    }

    .slText {
        width: 50%;
        padding-top: 0;
        font-size: 15px;
        padding-bottom: 0;
        right: 3%;
        top: 22%
    }

    .ctrlNext {
        right: 44.4%;
    }

    .ctrlPrev {
        left: auto;
        right: 50.5%;
    }
}

@media (min-width: 576px) and (max-width: 767px) {
    .slider {
        height: 220px !important;
    }

    .slItem {
        background-position: 58% center
    }

    .slText {
        width: 43%;
        padding-top: 0;
        font-size: 15px;
        padding-bottom: 0;
        right: 3%;
        top: 22%
    }

    .ctrlNext {
        right: 40.4%;
    }

    .ctrlPrev {
        left: auto;
        right: 44.5%;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .slText {
        width: 38%;
        padding-top: 0;
        font-size: 24px;
        padding-bottom: 0;
        right: 3%;
        top: 22%;
    }

    .ctrlNext {
        right: 36.4%;
    }

    .ctrlPrev {
        left: auto;
        right: 39.4%;
    }
}

@media (min-width: 1279px) and (max-width: 1440px) {
    .slText {
        width: 40%;
        font-size: 28px;
        right: 6%
    }

    .ctrlNext {
        right: 43.4%;
    }
}