@charset "utf-8";
/* CSS Document */
/**
 * NeoTheme Austrlia (Neo Industries Pty Ltd)
 *
 * NOTICE OF LICENSE
 *
 * This source file is subject to Neo Industries Pty LTD Non-Distributable Software Modification License (NDSML)
 * that is bundled with this package in the file LICENSE.txt.
 * It is also available through the world-wide-web at this URL:
 * http://www.neotheme.com.au/legal/licenses/NDSM.html
 * If the license is not included with the package or for any other reason, 
 * you did not receive your licence please send an email to 
 * license@neotheme.com.au so we can send you a copy immediately.
 *
 * This software comes with no warrenty of any kind. By Using this software, the user agrees to hold 
 * Neo Industries Pty Ltd harmless of any damage it may cause.
 *
 * @category    modules
 * @module      NeoTheme_ImageRotator
 * @copyright   Copyright (c) 2011 Neo Industries Pty Ltd (http://www.neotheme.com.au)
 * @license     http://www.neotheme.com.au/  Non-Distributable Software Modification License(NDSML 1.0)
 */
/* ----- Global ------ */
.nbanner { position: relative; }
.nbanner .carousel-inner > .item > img,
.nbanner .carousel-inner > .item > a > img { display: block; max-width: 100%; width: 100%; height: auto;  }
.nbanner .carousel-inner { position: relative; width: 100%; overflow: hidden; }
.nbanner .carousel-inner > .item {
    position: absolute;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
.nbanner .carousel-inner > .active {  }
.nbanner .carousel-caption { width: 100%; padding: 20px; box-sizing: border-box; color:#FFF; position: absolute; bottom: 0; background: rgba(0,0,0, 0.5); }
.nbanner .carousel-nav a { text-align: left; color: #FFF; cursor: pointer; text-decoration: none; }

/* ----- Nav Icons ------ */
.nbanner .carousel-control:before {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    display: block;
}
.nbanner .carousel-control.right:before {
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-left: 15px solid #FFF;
    border-right: none;
}
.nbanner .carousel-control.left:before {
    border-top: 15px solid transparent;
    border-bottom: 15px solid transparent;
    border-right: 15px solid #FFF;
    border-left: none;
}

/* ----- DEFAULT ----- */
.nbanner.default .carousel-nav { width:100%; float:left;  background:#333; padding:5px 0px; }
.nbanner.default .carousel-nav ul { float:right; }
.nbanner.default .carousel-nav ul ul { float:left; }
.nbanner.default .carousel-nav li { float:left; }
.nbanner.default .carousel-nav a { display:block; z-index:100; border:none; font-size:13px; text-align:center; font-weight:bold; margin-right:5px; width:15px; line-height:21px;  color:#FFF; cursor:pointer; text-decoration:none; }
.nbanner.default .carousel-control { background:none; }
.nbanner.default .carousel-control img { margin-top:5px; width:auto; max-width:100%; }

/* ----- BACK / FORWARD ----- */
.nbanner.backforward .carousel-inner { position:relative; }
.nbanner.backforward .carousel-nav { position: absolute; bottom: 20px; width: 100%; }
.nbanner.backforward .carousel-nav ul { display: table;  margin: 0 auto; }
.nbanner.backforward .carousel-nav ul .carousel-control { position: relative; }
.nbanner.backforward .carousel-nav ul li { display: inline-block; }
.nbanner.backforward .carousel-nav ul li:last-child a { margin-right: 0; }
.nbanner.backforward .carousel-nav a { display: block; background: #DDD; width: 15px; height: 15px; margin-right: 10px; font-size:0; line-height:0; cursor:pointer; text-decoration:none; }
.nbanner.backforward .carousel-nav a.active { background: #FFF; }
.nbanner.backforward .carousel-control { position:absolute; top:50%; margin-top: -8px; z-index: 100; cursor:pointer; }
.nbanner.backforward .carousel-control.right { right: 30px; }
.nbanner.backforward .carousel-control.left { left: 15px; }
.nbanner.backforward .carousel-caption { padding-bottom: 60px; }

/* ----- RIGHT COLUMN ----- */
.nbanner.rightcol .carousel-inner { float:left; width:80%; }
.nbanner.rightcol .carousel-caption { height:100%; width:35%; left: 10%;  }
.nbanner.rightcol .carousel-nav { float:right; width:20%; height:100%; background:#333; overflow:hidden; }
.nbanner.rightcol .carousel-nav a { display:block; z-index:100; padding:10px 15px; }
.nbanner.rightcol .carousel-nav a.active { background-color:#666; }

/* ----- LEFT COLUMN ----- */
.nbanner.leftcol .carousel-inner { float:right; width:80%; }
.nbanner.leftcol .carousel-caption { height:100%; width:35%; right: 10%;  }
.nbanner.leftcol .carousel-nav { float:left; width:20%; height:100%; background:#333; overflow:hidden; }
.nbanner.leftcol .carousel-nav a { display:block; z-index:100; padding:10px 15px; }
.nbanner.leftcol .carousel-nav a.active { background-color:#666; }

/* ----- RIGHT TEXT ----- */
.nbanner.righttxt .carousel-caption { width:25%; height:100%; bottom:0; right:30px; }
.nbanner.righttxt .carousel-control { background:#333; position:absolute; bottom:50px; z-index: 100; cursor:pointer; }
.nbanner.righttxt .carousel-control.left { left:15px; }
.nbanner.righttxt .carousel-control.right { left:50px; }

/* ----- LEFT TEXT ----- */
.nbanner.lefttxt .carousel-caption { width:25%; height:100%; bottom:0; left:30px; }
.nbanner.lefttxt .carousel-control { background:#333; position:absolute; bottom:50px; z-index: 100; cursor:pointer; }
.nbanner.lefttxt .carousel-control.left { right:65px; }
.nbanner.lefttxt .carousel-control.right { right:30px; }

/* ----- THUMBNAILS ----- */
.nbanner.thumbnails .carousel-nav { float:left; width:100%; background:#333; padding:10px 0; }
.nbanner.thumbnails .carousel-nav ul { float:left; margin-left:15px; }
.nbanner.thumbnails .carousel-nav ul ul { float:left; margin:0; }
.nbanner.thumbnails .carousel-nav li { float:left; cursor:pointer; }
.nbanner.thumbnails .carousel-nav li.scroll { margin:0 15px; width:auto; overflow:hidden; }
.nbanner.thumbnails .carousel-nav a { display:block; z-index: 100; margin-top:19px;  }
.nbanner.thumbnails .carousel-nav .thumbnail img { width: auto; max-width:100%; height:60px; }
.nbanner.thumbnails .carousel-control { float:right; margin-right:15px; z-index:6000; }

/* ----- BACKGROUND ----- */
.nbanner.background { height:inherit; }
.nbanner.background .carousel-inner { position:relative; }
.nbanner.background .carousel-nav { position: absolute; bottom: 20px; width: 100%; }
.nbanner.background .carousel-nav ul { display: table;  margin: 0 auto; }
.nbanner.background .carousel-nav ul .carousel-control { position: relative; }
.nbanner.background .carousel-nav ul li { display: inline-block; }
.nbanner.background .carousel-nav ul li:last-child a { margin-right: 0; }
.nbanner.background .carousel-nav a { display: block; background: #DDD; width: 15px; height: 15px; margin-right: 10px; font-size:0; line-height:0; cursor:pointer; text-decoration:none; }
.nbanner.background .carousel-nav a.active { background: #FFF; }
.nbanner.background .carousel-control { position:absolute; top:50%; margin-top: -8px; z-index: 100; cursor:pointer; }
.nbanner.background .carousel-control.right { right: 30px; }
.nbanner.background .carousel-control.left { left: 15px; }
.nbanner.background .carousel-caption { padding-bottom: 60px; }


/* =============================================
 TRANSITION EFFECTS
============================================= */

/* ----- SLIDE IN/OUT LEFT ----- */
@-webkit-keyframes slideInLeft {
    from {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
        visibility: visible;
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slideInLeft {
    from {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
        visibility: visible;
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.nbanner .carousel-inner > .slideInLeft.active {
    -webkit-animation-name: slideInLeft;
    animation-name: slideInLeft;
}

@-webkit-keyframes slideOutLeft {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    100% {
        visibility: hidden;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
}

@keyframes slideOutLeft {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    100% {
        visibility: hidden;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
}

.nbanner .carousel-inner > .slideOutLeft {
    -webkit-animation-name: slideOutLeft;
    animation-name: slideOutLeft;
}

/* ----- SLIDE IN/OUT RIGHT ----- */
@-webkit-keyframes slideInRight {
    from {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
        visibility: visible;
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slideInRight {
    from {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
        visibility: visible;
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.nbanner .carousel-inner > .slideInRight.active {
    -webkit-animation-name: slideInRight;
    animation-name: slideInRight;
}

@-webkit-keyframes slideOutRight {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    100% {
        visibility: hidden;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }
}

@keyframes slideOutRight {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    100% {
        visibility: hidden;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }
}

.nbanner .carousel-inner > .slideOutRight {
    -webkit-animation-name: slideOutRight;
    animation-name: slideOutRight;
}


/* ----- SLIDE IN/OUT DOWN ----- */
@-webkit-keyframes slideInDown {
    from {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
        visibility: visible;
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slideInDown {
    from {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
        visibility: visible;
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.nbanner .carousel-inner > .slideInDown.active {
    -webkit-animation-name: slideInDown;
    animation-name: slideInDown;
}

@-webkit-keyframes slideOutDown {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    100% {
        visibility: hidden;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }
}

@keyframes slideOutDown {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    100% {
        visibility: hidden;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }
}

.nbanner .carousel-inner > .slideOutDown {
    -webkit-animation-name: slideOutDown;
    animation-name: slideOutDown;
}


/* ----- SLIDE IN/OUT UP ----- */
@-webkit-keyframes slideInUp {
    from {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible;
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes slideInUp {
    from {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible;
    }

    100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.nbanner .carousel-inner > .slideInUp.active {
    -webkit-animation-name: slideInUp;
    animation-name: slideInUp;
}

@-webkit-keyframes slideOutUp {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    100% {
        visibility: hidden;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }
}

@keyframes slideOutUp {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    100% {
        visibility: hidden;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }
}

.nbanner .carousel-inner > .slideOutUp {
    -webkit-animation-name: slideOutUp;
    animation-name: slideOutUp;
}


/* ----- FADE IN/OUT ----- */
@-webkit-keyframes fadeIn {
    0% {
        display: none;
        opacity: 0;
    }
    1% {
        display: block;
    }
    100% {
        opacity: 1;
    }
/*    from {
        opacity: 0;
        display: none;
    }

    to {
        opacity: 1;
        display: block;
    }*/
}

@keyframes fadeIn {
    0% {
        display: none;
        opacity: 0;
    }
    1% {
        display: block;
    }
    100% {
        opacity: 1;
    }
/*    from {
        opacity: 0;
        display: none;
    }

    to {
        opacity: 1;
        display: block;
    }*/
}

.nbanner .carousel-inner > .fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
}

@-webkit-keyframes fadeOut {

    0% {
        display: block;
        opacity: 1;
    }
    99% {
        display: none;
    }
    100% {
        opacity: 0;
    }

/*    from {
        opacity: 1;
        display: block;
    }

    to {
        opacity: 0;
        display: none;
    }*/
}

@keyframes fadeOut {
    0% {
        display: block;
        opacity: 1;
    }
    99% {
        display: none;
    }
    100% {
        opacity: 0;
    }
/*    from {
        opacity: 1;
        display: block;
    }

    to {
        opacity: 0;
        display: none;
    }*/
}

.nbanner .carousel-inner > .fadeOut {
    -webkit-animation-name: fadeOut;
    animation-name: fadeOut;
}