﻿/* New jcarousel */

/* 
    Set the carousel type in the GCMS Dev Tools --> CSSClass

    "firstcarousel": 
    GCMS ColNumber should be set to 1 by default
    Total: 3 items
    Scroll: one by one     

    "secondcarousel":
    GCMS ColNumber should be set to 2 by default
    Total: 6 items
    Scroll: two by two

    "thirdcarousel": 
    GCMS ColNumber should be set to 3 by default
    Total: 9 items
    Scroll: three by three
    
    "thirdcarouselover": 
    GCMS ColNumber should be set to 3 by default
    Total: 9 items
    Scroll: three by three

*/

/* common for all jcarousels *******************************************************************************************************************/
    .jcarousel-skin-tango .jcarousel-container {position:relative}
    .jcarousel-skin-tango .jcarousel-clip {padding:0;margin:0;overflow:hidden;position:relative}
    .jcarousel-skin-tango .jcarousel-clip-horizontal a img{cursor:pointer}
    .jcarousel-skin-tango ul{list-style:none !important;margin:0;padding:0}
    .jcarousel-skin-tango li{background:none !important}
    .jcarousel-skin-tango img {margin-bottom:5px}
    .jcarousel-skin-tango .jcarousel-next-horizontal {cursor:pointer;  background: url('/images/publicsite/foodcures/homepage/img-rotator-next-on.gif') no-repeat;}
    .jcarousel-skin-tango .jcarousel-prev-horizontal  {cursor:pointer;  background: url('/images/publicsite/foodcures/homepage/img-rotator-prev-on.gif') no-repeat;}
    .jcarousel-skin-tango .jcarousel-next-disabled-horizontal  {cursor:pointer;  background: url('/images/publicsite/foodcures/homepage/img-rotator-next-on.gif') no-repeat;}
    .jcarousel-skin-tango .jcarousel-next-disabled-horizontal:active  {cursor:pointer;  background: url('/images/publicsite/foodcures/homepage/img-rotator-next-on.gif') no-repeat;}
    .jcarousel-skin-tango .jcarousel-prev-disabled-horizontal  {cursor:pointer;  background: url('/images/publicsite/foodcures/homepage/img-rotator-prev-on.gif') no-repeat;} 
    .jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:active   {cursor:pointer;  background: url('/images/publicsite/foodcures/homepage/img-rotator-prev-on.gif') no-repeat;}
    
    .jcarousel-list {z-index:1;left:0px;padding:0;margin:0px;position:absolute}
    .jcarousel-list li, .jcarousel-item {padding:0 !important;background:none !important;list-style:none !important;left:0px;position:relative;height:1.8em;cursor:pointer;float:left}
    .jcarousel-list .feature {width:auto}
    .jcarousel-list .feature a{text-decoration:none;font:bold 14px Arial;color:#4C4C4C;}
    .jcarousel-list .details {width:auto}
    .jcarousel-list .details h3 {margin:5px 0 0 0}
    .jcarousel-list .details h3, .jcarousel-list .details h3 a, .jcarousel-list .details h3 a:visited{text-decoration:none;font:bold 14px Arial;color:#4C4C4C}
    .jcarousel-list .details p{line-height:18px !important;margin:0;font:normal 12px Arial;color:#4C4C4C}
    .jcarousel-list .details a, .jcarousel-list .details a:visited{text-decoration:none;font:normal 12px Arial;color:#1B75BC}
    .jcarousel-list a:hover {text-decoration:underline} 

/* firstcarousel NEEDS UPDATING ! *******************************************************************************************************************/
    /* common for firstcarousel */
    .jcarousel-skin-tango #firstcarousel .jcarousel-item {width:600px;height:220px;margin:6px 0 0 0px;} 
    .jcarousel-skin-tango #firstcarousel .jcarousel-clip-horizontal {width:600px;height:225px} 
    .jcarousel-skin-tango #firstcarousel .jcarousel-prev-horizontal, .jcarousel-skin-tango #firstcarousel .jcarousel-prev-disabled-horizontal, .jcarousel-skin-tango #firstcarousel .jcarousel-prev-disabled-horizontal:active {position:absolute;top:219px;left:224px;width:84px;height:20px; background: url('/images/publicsite/foodcures/homepage/img-rotator-prev-on.gif') no-repeat;}

    .jcarousel-skin-tango #firstcarousel .jcarousel-next-horizontal, .jcarousel-skin-tango #firstcarousel .jcarousel-next-disabled-horizontal, .jcarousel-skin-tango #firstcarousel .jcarousel-next-disabled-horizontal:active  {position:absolute;top:219px;right:57px;width:75px;height:20px; background: url('/images/publicsite/foodcures/homepage/img-rotator-next-on.gif') no-repeat;}


/* carousel with mouseover functionality *******************************************************************************************************************/
    .box .content {overflow:hidden !important}
    .box .scroller .outer {background:#ffffff}
    .hover .jcarousel-skin-tango .jcarousel-list .feature {filter:alpha(opacity=75);-moz-opacity:.75;opacity:.75;zoom:1;background:#ffffff;top:88px;text-align:center;left:0;padding-top:2px;position:absolute;width:175px;height:20px !important}
    .hover .jcarousel-skin-tango .jcarousel-list .feature a{font:bold 12px Arial;color:#4C4C4C}
    .hover .jcarousel-skin-tango .jcarousel-list .details {padding-left:7px;padding-right:3px;display:block;margin-top:0px;width:165px;cursor:pointer;position:absolute;top:0px;height:6.1em;left: -9999px;cursor:auto;}
    .hover .jcarousel-skin-tango .jcarousel-list .details h3 {margin:5px 0 0 0}
    .hover .jcarousel-skin-tango .jcarousel-list .details h3 a{text-decoration:none;font:bold 14px Arial;color:#4C4C4C}
    .hover .jcarousel-skin-tango .jcarousel-list .details p{line-height: 1.2em;margin:0;}
    .hover .jcarousel-skin-tango .jcarousel-list .show {left:10px}
    .hover .jcarousel-skin-tango .jcarousel-list .hide {left: -9999px}
    .hover .jcarousel-skin-tango .jcarousel-list .background {filter:alpha(opacity=15);-moz-opacity:.15;opacity:.15}
        
/* Prev Next Buttons for all jcarousels *******************************************************************************************************************/

    .default .jcarousel-skin-tango .jcarousel-next-horizontal { background: url('/images/publicsite/foodcures/homepage/img-rotator-next-on.gif') no-repeat;}
    .default .jcarousel-skin-tango .nexthover { background: url('/images/publicsite/foodcures/homepage/img-rotator-next-on.gif') no-repeat;}
    .default .jcarousel-skin-tango .jcarousel-next-disabled-horizontal, .default .jcarousel-skin-tango .jcarousel-next-disabled-horizontal:active { background: url('/images/publicsite/foodcures/homepage/img-rotator-next-on.gif') no-repeat;}
    .default .jcarousel-skin-tango .jcarousel-prev-horizontal { background: url('/images/publicsite/foodcures/homepage/img-rotator-prev-off.gif') no-repeat;}
    .default .jcarousel-skin-tango .prevhover { background: url('/images/publicsite/foodcures/homepage/img-rotator-prev-off.gif') no-repeat;}
    .default .jcarousel-skin-tango .jcarousel-prev-disabled-horizontal, .default .jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:active { background: url('/images/publicsite/foodcures/homepage/img-rotator-prev-off.gif') no-repeat;}    

/* Scroller common *******************************************************************************************************************/
    .scroller {margin-left:275px; margin-top:-20px;}
    .scroller .inner {background:none !important;padding:0 !important;}/* to overrite module.css*/
    .scroller a, .scroller a:visited {font-weight:bold;}
    .scroller .top, .scroller .bottom {background:#EEEDE9;height:1px;width:auto;overflow:hidden;border:solid 1px #fff;border-width:0 1px;padding:0;margin:0}
    .scroller .outer {background:#EEEDE9;width:auto;height:50px;}
    .scroller p {margin:0;padding:0}
    .scroller .navlink {font-size:12px;float:right;padding-right:10px}
    .scroller .navlink a {line-height:45px}

    /* firstcarousel scroller */
    #firstcarousel .scroller .nav {padding:12px 0;margin-left:39px;_margin-left:20px}
    #firstcarousel .firstcarousel-control { }

    /* secondcarousel scroller */
    #secondcarousel .scroller .nav {padding:12px 0;margin-left:118px}
    #secondcarousel .secondcarousel-control {width:144px !important}

    /* thirdcarousel scroller */
    #thirdcarousel .scroller .nav {padding:12px 0;margin-left:199px}
    #thirdcarousel .thirdcarousel-control {width:216px !important}

    /* common for carousel external control */
   .firstcarousel-control, .secondcarousel-control, .thirdcarousel-control {background:#fff;text-align:center;width:auto;height:23px; }
    .control-number {cursor:pointer;float:left;height:23px!important;width:23px!important;_height:23px!important;_width:23px!important; background: url('/images/publicsite/foodcures/homepage/img-dot-off.gif') 4px 4px no-repeat;}
    .control-number a {cursor:pointer;float:left;height:23px!important;width:23px!important;_height:23px!important;_width:23px!important; background: url('/images/publicsite/foodcures/homepage/img-dot-off.gif') 4px 4pxno-repeat;}
    .control-number a:hover{cursor:pointer;float:left;height:23px!important;width:23px!important;_height:23px!important;_width:23px!important; background: url('/images/publicsite/foodcures/homepage/img-dot-on.gif') 4px 4px no-repeat;}
    .control-clicked {cursor:pointer;float:left;height:23px!important;width:23px!important;_height:23px!important;_width:23px!important; background: url('/images/publicsite/foodcures/homepage/img-dot-on.gif') 4px 4px no-repeat;}



    /* default scroller hover */
    .default .control-hover, .default .control-number .control-clicked { background: url('/images/publicsite/foodcures/homepage/img-dot-on.gif') no-repeat;}
    .default .control-number a {text-decoration:none !important;font:bold 12px Arial !important;color:#7C9825 !important;line-height:23px !important; background: url('/images/publicsite/foodcures/homepage/img-dot-on.gif') no-repeat;}


/* Old Carousel */
/* Slideshow ****************************************************************************** */

	.carousel { 
		position:relative;
		z-index:0;
		margin:0 0 35px;
		}
	.carousel .slideshow {
		width:auto;
		border: solid 1px #D4DEDE;
		border-width:1px 0;
		background:#F3F6F5;
		padding:15px 0;
		text-align:center;
		font:normal 11px/14px arial;
		}
	.carousel .slideshow .inner {		
		overflow:hidden;
		width:495px;
		height:auto;
		position:relative;
		margin:0 auto;
		}
	.carousel .slideshow ul {
		width:10000000px;
		position:relative;
		z-index:1; 
		padding:0;
		}
	.carousel .slideshow ul li {
		width:165px; /* This is the "ListItem-Width" variable; it must be set to match script on content template. */
		float:left;
		padding:0;
		margin:0;
		display:inline-block;
		background:none;
		}
	.carousel .slideshow ul .container {
		width:140px;
		margin:0 auto;
		text-align:left;
		}
	.carousel .slideshow ul .container .links {
		padding:0 0 0 5px;
		}
	.carousel .slideshow ul .container img {
		float:left;
		margin-bottom:5px;
		width:140px;
		height:78px;
		}

/* Next/Prev Buttons ********************************************************************** */

	/* Alignment */
	.carousel .top {height:30px} /* ie float fix */
	.carousel .top h2 {float:left;}
	.carousel .top .scroll {float:right;position:relative;top:-5px;}

	/* Previous Button */
	.carousel .prev {float:left;}
	.carousel .prev a {
		background:transparent url(/images/v1/common/carousel_controls.jpg) no-repeat -10px 0;
		width:25px;
		height:25px;
		margin: 0 2px 0 0;
		display:block;
		}
	.carousel .prev a:hover, .carousel .prev a:active {
		background:transparent url(/images/v1/common/carousel_controls.jpg) no-repeat -73px 0;
		cursor:pointer;
		}
	.carousel .prev a.disable {
		background:transparent url(/images/v1/common/carousel_controls.jpg) no-repeat -135px 0;
		cursor:default;
		}

	/* Next Button */
	.carousel .next {float:left;}
	.carousel .next a, .carousel .next a:visited {
		background:transparent url(/images/v1/common/carousel_controls.jpg) no-repeat -39px 0;
		width:25px;
		height:25px;
		margin: 0 0 0 3px;
		display:block;
		}		
	.carousel .next a:hover {
		background:transparent url(/images/v1/common/carousel_controls.jpg) no-repeat -102px 0;
		cursor:pointer;
		}
	.carousel .next a.disable {
		background:transparent url(/images/v1/common/carousel_controls.jpg) no-repeat -164px 0;
		cursor:default;
		}

	/* Location Dots */
	.carousel .scrollnav {float:left;}
	.carousel .scrollnav a {
		float:left;
		background:transparent url(/images/v1/common/carousel_controls.jpg) no-repeat -216px -10px;
		width:10px;
		height:10px;
		margin:10px 2px 0;
		display:block;
		overflow:hidden;
		}
	.carousel .scrollnav a.current {background-position:-202px -10px;cursor:default;}
	
	
	.jcarousel-item {background:none !important;list-style-type:none;padding:0;}
