﻿@charset "utf-8";

#makeMeScrollable {
    height: auto;
    margin: 20px auto;
    max-width: 850px;
    position: relative;
    width: 100%;
	overflow: hidden;
}

div.scrollingHotSpotLeft {
    background-image: url(../images/big_transparent.gif);
    background-position: 0 center;
    background-repeat: no-repeat;
    cursor: pointer;
    height: 100%;
    left: -6px;
    position: absolute;
    width: 40px;
    z-index: 200;
	opacity: 1 !important;
	/*  The first url is for Firefox and other browsers, the second is for Internet Explorer */
	cursor: url(../images/cursors/cursor_arrow_left.png), url(../images/cursors/cursor_arrow_left.cur),w-resize;
}
div.scrollingHotSpotLeft:hover{
	background-image: url(../images/arrow_left.gif);
	background-repeat: no-repeat;
	background-position: 0 center;
	opacity: 0.7!important;
}
/* Visible left hotspot */
div.scrollingHotSpotLeftVisible
{
	/*background-image: url(../images/arrow_left.gif);				*/
	background-repeat: no-repeat;
	opacity: 1; /* Standard CSS3 opacity setting */
	-moz-opacity: 1; /* Opacity for really old versions of Mozilla Firefox (0.9 or older) */
}


div.scrollingHotSpotRight {
    background-image: url(../images/big_transparent.gif);
    background-position: -60px center;
    background-repeat: no-repeat;
    cursor: pointer;
    height: 100%;
    position: absolute;
    right: 4px;
    width: 40px;
    z-index: 200;
	opacity: 1 !important;
	cursor: url(../images/cursors/cursor_arrow_right.png), url(../images/cursors/cursor_arrow_right.cur),e-resize;
}
div.scrollingHotSpotRight:hover{
	background-image: url(../images/arrow_right.gif);
	background-repeat: no-repeat;
	background-position: -60px center;
	opacity:0.7!important;
}

div.scrollingHotSpotRightVisible
{
	background-image: url(../images/arrow_right.gif);
	background-repeat: no-repeat;
	opacity: 1;
	-moz-opacity: 1;
}

div.scrollWrapper
{
	position: relative;
	overflow: hidden;
	width: 90%;
	max-height: 315px;
	margin: 0 auto;
}

div.scrollableArea
{
	position: relative;
	width: 300%!important;
	height: 100%;
}


#makeMeScrollable .karusel {
    float: left;
    width: 9%;
	margin: 0 5px;
	min-height: 316px;
}
.karusel p{
	display: block;
    margin: -90px auto 0 auto;
    text-align: center;
	max-width: 127px;
	color: #297bd2;
line-height: 1.2;}
.karusel img{
	display: block;
    margin: 0 auto;
}

