/*
    Thumbelina Content Slider
    V1.0 Rev 1302190900

    A lightweight horizontal and vertical content slider designed for image thumbnails.
    http://www.starplugins.com/thumbelina

    Developed by Star Plugins
    http://www.starplugins.com

    Copyright 2013, Star Plugins
    License: GNU General Public License, version 3 (GPL-3.0)
    http://www.opensource.org/licenses/gpl-3.0.html
*/



.thumbelina {
    list-style:none;
    padding:0px 20px;
    margin:0px;
    position:absolute;
    white-space:nowrap;
    font-size:0;
    /* prevent annoying iPad cut/paste actions */
    -webkit-touch-callout: none;
    -webkit-user-select: none;
}

/* Style for the list items that surround the thumbnails */
.thumbelina li {
    /*padding:5px 7px;*/
    /*line-height: 0px;*/
    /*margin:0px;*/
}

/* Add a border to the thumbnails. */
.thumbelina li {
    text-align: center;
    border:1px solid #ccc;
    margin: 20px 0;
    height: 200px;
}
.thumbelina .li-current{
    border:1px solid #006962;

}
/* Hover effect for the images */
.thumbelina li:hover {
    border:1px solid #006962;
}



/*
    Following is the CSS for the navigation buttons.
    They are designed to fit flush on the ends of the slider
    using absolute positioning, with the container as the parent element.
    The sizes are set to match the demo slider.
    You can change any of this as you wish - you don't even need to use these classes.
    Position the buttons where you like on the page, change sizes, use images etc.
    They don't have to be children of the container.
*/

/* Common style for the buttons */
.thumbelina-but {
    position:absolute;z-index: 1;cursor:pointer;color:#888;text-align:center;vertical-align:middle;font-size:25px;font-weight: bolder;font-family:monospace;
}

/* Hover style for active button */
.thumbelina-but:hover {
    color:#007FC3
}
.thumbelina-but.disabled:hover {
    color: #007FC3;cursor:default;box-shadow:none;
}
/* Horizontal buttons. */
.thumbelina-but.horiz {
    top:50%;margin-top: -5px;
    
}
/* Left edge button. */
.thumbelina-but.horiz.left {
    left:18px;
}
/* Right edge button */
.thumbelina-but.horiz.right {
    right:18px;
}

/* Vertical buttons. */
.thumbelina-but.vert {
    left:-1px;height: 20px;line-height: 20px;width:93px
}

/* Top edge button. */
.thumbelina-but.vert.top {
    top:-22px;border-radius: 5px 5px 0px 0px;
}

/* Bottom edge button. */
.thumbelina-but.vert.bottom {
    bottom:-22px;border-radius: 0px 0px 5px 5px;
}