﻿
.iconWrap {
    position: absolute;
    bottom: 41%;
    width: 48px;
    height: 95px;
}

    .iconWrap:hover {
        cursor: pointer;
    }

.left {
    left: 15px;
}

.right {
    right: 15px;
}



/*-----------------------Prev---------------------*/


#slider-prev {
    text-align: left;
    bottom: 0;
    width: 45px;
    height: 100%;
}

    #slider-prev a {
        width: 100%;
        height: 100%;
        display: block;
    }


        #slider-prev a::after {
            top: 50%;
            -webkit-transform: translateX(-50%) rotate(-30deg);
            transform: translateX(-50%) rotate(-35deg);
            -webkit-transform-origin: 0 0;
            transform-origin: 0 0;
        }

        #slider-prev a::before {
            -webkit-transform: translateX(-50%) rotate(35deg);
            transform: translateX(-50%) rotate(30deg);
            -webkit-transform-origin: 0 100%;
            transform-origin: 0 100%;
        }

        #slider-prev a::before {
            position: absolute;
            width: 3px;
            bottom: 50%;
            height: 10%;
            background: #fff;
            content: '';
            -webkit-transition: -webkit-transform 0.3s, background-color 0.3s;
            transition: transform 0.3s, background-color 0.3s;
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
        }

        #slider-prev a::after {
            position: absolute;
            width: 3px;
            top: 50%;
            height: 10%;
            background: #fff;
            content: '';
            -webkit-transition: -webkit-transform 0.3s, background-color 0.3s;
            transition: transform 0.3s, background-color 0.3s;
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
        }


    #slider-prev:hover a::after {
        top: 50%;
        -webkit-transform: translateX(-50%) rotate(-30deg);
        transform: translateX(-50%) rotate(-45deg);
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
    }

    #slider-prev:hover a::before {
        -webkit-transform: translateX(-50%) rotate(30deg);
        transform: translateX(-50%) rotate(45deg);
        -webkit-transform-origin: 0 100%;
        transform-origin: 0 100%;
    }

    #slider-prev:hover a::before {
        position: absolute;
        width: 3px;
        bottom: 50%;
        height: 10%;
        background: #cc3300;
        content: '';
        -webkit-transition: -webkit-transform 0.3s, background-color 0.3s;
        transition: transform 0.3s, background-color 0.3s;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }

    #slider-prev:hover a::after {
        position: absolute;
        width: 3px;
        top: 50%;
        height: 10%;
        background: #cc3300;
        content: '';
        -webkit-transition: -webkit-transform 0.3s, background-color 0.3s;
        transition: transform 0.3s, background-color 0.3s;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }


/*-----------------------next---------------------*/


#slider-next {
    text-align: left;
    bottom: 0;
    width: 45px;
    height: 100%;
    transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
}

    #slider-next a {
        width: 100%;
        height: 100%;
        display: block;
    }


        #slider-next a::after {
            top: 50%;
            -webkit-transform: translateX(-50%) rotate(-30deg);
            transform: translateX(-50%) rotate(-35deg);
            -webkit-transform-origin: 0 0;
            transform-origin: 0 0;
        }

        #slider-next a::before {
            -webkit-transform: translateX(-50%) rotate(35deg);
            transform: translateX(-50%) rotate(30deg);
            -webkit-transform-origin: 0 100%;
            transform-origin: 0 100%;
        }

        #slider-next a::before {
            position: absolute;
            width: 3px;
            bottom: 50%;
            height: 10%;
            background: #fff;
            content: '';
            -webkit-transition: -webkit-transform 0.3s, background-color 0.3s;
            transition: transform 0.3s, background-color 0.3s;
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
        }

        #slider-next a::after {
            position: absolute;
            width: 3px;
            top: 50%;
            height: 10%;
            background: #fff;
            content: '';
            -webkit-transition: -webkit-transform 0.3s, background-color 0.3s;
            transition: transform 0.3s, background-color 0.3s;
            -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
        }


    #slider-next:hover a::after {
        top: 50%;
        -webkit-transform: translateX(-50%) rotate(-30deg);
        transform: translateX(-50%) rotate(-45deg);
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
    }

    #slider-next:hover a::before {
        -webkit-transform: translateX(-50%) rotate(30deg);
        transform: translateX(-50%) rotate(45deg);
        -webkit-transform-origin: 0 100%;
        transform-origin: 0 100%;
    }

    #slider-next:hover a::before {
        position: absolute;
        width: 3px;
        bottom: 50%;
        height: 10%;
        background: #cc3300;
        content: '';
        -webkit-transition: -webkit-transform 0.3s, background-color 0.3s;
        transition: transform 0.3s, background-color 0.3s;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }

    #slider-next:hover a::after {
        position: absolute;
        width: 3px;
        top: 50%;
        height: 10%;
        background: #cc3300;
        content: '';
        -webkit-transition: -webkit-transform 0.3s, background-color 0.3s;
        transition: transform 0.3s, background-color 0.3s;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    }
