/* This <div> element is wrapped by jCarousel around the list and has the classname "jcarousel-container".
****************************************************************************************************************/

#main #content .jcarousel-container
	{ position:relative; }

#main #content .jcarousel-container h3
	{ clear:both; float:left; margin: 2px 45px 5px 20px; *margin: 2px 0px 5px 20px; *width:180px;}
#main #content .jcarousel-container h3 a
	{ font-weight:normal; }
#main #content .jcarousel-container span.topics a
	{ display:block; margin: 10px 0 0 20px; }

#main #content .jcarousel-clip
	{ margin: 0px; overflow: hidden; padding: 0; position: relative; z-index: 2; }

#main #content ul.jcarousel-list
	{ left: 0; margin: 0; overflow: hidden; padding: 0; position: relative; top: 0; z-index: 1; }

/* We set the width/height explicitly. No width/height causes infinite loops. */
#main #content .jcarousel-list li,
#main #content .jcarousel-item
	{ background: #fff url(/YardSmarts/Resources/YardSmarts/pics/shared/mycarousel-bk.png) top left no-repeat; /*display:block;*/ float:left; height:235px; list-style:none; margin-top:7px;/*margin-right:10px; position:relative;*/ width:225px; }

#main #content span.bub
	{ background:transparent url(/YardSmarts/Resources/YardSmarts/pics/shared/speech.png) top left no-repeat; color:#8f6018; display:block; font-size:12px; font-weight:bold; height:25px; line-height:20px; left:170px; margin:0; padding:0; position:relative; text-align:center; top:85px; width:28px; z-index:10; }

#main #content #mycarousel ul li img,
#main #content #mycarousel2 ul li img
	{ background-color:#fff; border:1px solid #ccc; float:left; left:20px; /*margin:5px 0 5px 20px;*/ padding:2px; position:absolute; top:20px; }
#main #content #mycarousel ul li,
#main #content #mycarousel2 ul li
	{ padding: 0; position:relative; }

#main #content .jcarousel-item-bk
	{ background: transparent url(/YardSmarts/Resources/YardSmarts/pics/shared/scroller-box-bottom.gif) top left no-repeat; float:left; height:36px; width:225px; }

#main #content #mycarousel div.button,
#main #mycarousel div.search_btn,
#main #mycarousel div.contactus-btn,
#main #content #mycarousel2 div.button,
#main #mycarousel2 div.search_btn,
#main #mycarousel2 div.contactus-btn
	{ background:transparent url(/YardSmarts/Resources/YardSmarts/pics/shared/button.png) center top no-repeat; bottom:0px; display:block; height:22px; left:51px; margin:0; padding:11px 0 0 0; position:absolute; text-align:center; text-transform:uppercase; width:122px; }
#main #content #mycarousel div.button a,
#main #mycarousel div.search_btn a,
#main #mycarousel #tabs ul li div.contactus-btn a,
#main #content #mycarousel2 div.button a,
#main #mycarousel2 div.search_btn a,
#main #mycarousel2 #tabs ul li div.contactus-btn a
	{ color:#7b001d; font-weight:normal; font-size:10px; margin: 5px auto 0; }
#main #content #mycarousel div.button a:hover,
#mycarousel div.search_btn a:hover,
#mycarousel #tabs ul li div.contactus-btn a:hover,
#main #content #mycarousel2 div.button a:hover,
#mycarousel2 div.search_btn a:hover,
#mycarousel2 #tabs ul li div.contactus-btn a:hover
	{ color:#111; }

#main #content #mycarousel .topics,
#main #content #mycarousel2 .topics
	{ clear:both; display:block; float:left; /*height:1.2em;*/ line-height:1em; margin: 0 0 0 0; width:100%; }

#main #content .controls
	{ margin: 0 0 30px 195px; position:relative; width:300px; }

#main #content #mycarousel,
#main #content #mycarousel2
	{ clear:both; display:block; float:left; margin:0; padding:0; width:700px; }
#main #content #mycarousel .left,
#main #content #mycarousel2 .left
	{ float: left; }
#main #content #mycarousel .right,
#main #content #mycarousel2 .right
	{ float: right; }

/*
#main .jcarousel-scroll
	{ width: 50px; }
#mycarousel-prev a
	{ display: block;width: 20px;height: 20px;background: url(/Resources/YardSmarts/pics/shared/arrow.gif) top left; }
#main #mycarousel-next  a
	{ display: block;width: 20px;height: 20px;background: url(/Resources/YardSmarts/pics/shared/arrow.gif) top right; }
*/


/**
 * The buttons are added dynamically by jCarousel before
 * the <ul> list (inside the <div> described above) and
 * have the classnames "jcarousel-next" and "jcarousel-prev".
 */
#main #content .jcarousel-next,
#main #content .jcarousel-next2
	{ display:none; z-index:3; }

#main #content .jcarousel-prev,
#main #content .jcarousel-prev2
	{ display:none; z-index:3; }

/*#main #content .jcarousel-control a
	{ }*/

#main #content .controls a
	{ cursor:pointer; display:block; height:30px; text-indent:-5000px; width:30px; }


/* attempt A
**************************************/
/*
#main #content .jcarousel-control,
#main #content .jcarousel-control2
	{ margin: 10px auto; height:30px; text-align:center; width:auto; }
#main #content .controls .jcarousel-control,
#main #content .controls .jcarousel-control2
	{ margin: 10px auto; height:30px; text-align:center; width:auto; }

#main #content .controls .jcarousel-control a:focus,
#main #content .controls .jcarousel-control a:active,
#main #content .controls .jcarousel-control a:hover,
#main #content .controls .jcarousel-control a.on,

#main #content .controls .jcarousel-control2 a:focus,
#main #content .controls .jcarousel-control2 a:active,
#main #content .controls .jcarousel-control2 a:hover,
#main #content .controls .jcarousel-control2 a.on
{ background-position:bottom center; }
#main #content .jcarousel-scroll,
#main #content .jcarousel-scroll2
	{ margin:0px; text-align:center; }
#main #content .jcarousel-scroll form,
#main #content .jcarousel-scroll2 form
	{ margin:0; padding:0; }
#main #content .jcarousel-scroll select,
#main #content .jcarousel-scroll2 select
	{ font-size:75%; }


#main #content .controls .jcarousel-control a,
#main #content .controls .jcarousel-control2 a
	{ background: transparent url(/Resources/YardSmarts/pics/shared/dot.gif) top center no-repeat; color:#999; display:inline-block; line-height:18px; float:left; height:10px; margin:7px 2px; padding:0; text-align:center; text-indent:-5000px; width:10px; }

#main #content .controls .jcarousel-control a span,
#main #content .controls .jcarousel-control2 a span
	{ display:inline; font-size:36px; letter-spacing:5px; line-height:32px; padding:0; visibility:visible; }

*/


/* attempt B
**************************************/
#main #content .jcarousel-control,
#main #content .jcarousel-control2
	{ margin: 10px auto; height:10px;text-align:center; width:75px; }
#main #content .controls .jcarousel-control,
#main #content .controls .jcarousel-control2
	{ margin: 10px auto; height:10px; text-align:center; width:75px;padding-top: 10px; }

#main #content .controls .jcarousel-control a:focus,
#main #content .controls .jcarousel-control a:active,
#main #content .controls .jcarousel-control a:hover,
#main #content .controls .jcarousel-control a.on,
#main #content .controls .jcarousel-control2 a:focus,
#main #content .controls .jcarousel-control2 a:active,
#main #content .controls .jcarousel-control2 a:hover,
#main #content .controls .jcarousel-control2 a.on { background: #fff url(/YardSmarts/Resources/YardSmarts/pics/shared/dot-on.png) top center no-repeat; }

#main #content .controls .jcarousel-control a,
#main #content .controls .jcarousel-control2 a { float: left;display: block;width: 10px;height: 10px;margin: 0 3px;background: #fff url(/YardSmarts/Resources/YardSmarts/pics/shared/dot-off.png) top center no-repeat;text-align: center; }

/* { display:inline-block;background: #fff url(/Resources/YardSmarts/pics/shared/dot.png) top center no-repeat; color:#999; height:10px; padding:0; margin: 0 2px;text-align:center; text-indent:-5000px; width:10px; } */

#main #content p.paginater span.right a,
#main #content a.mycarousel-next,
#main #content a.mycarousel-next2
	{ background: transparent url(/YardSmarts/Resources/YardSmarts/js/carousel/skins/tango/next-horizontal.png) top right; }

#main #content p.paginater span.left a,
#main #content a.mycarousel-prev,
#main #content a.mycarousel-prev2
	{ background: transparent url(/YardSmarts/Resources/YardSmarts/js/carousel/skins/tango/prev-horizontal.png) top left; }

#main #content p.paginater span.right a:hover,
#main #content a:hover.mycarousel-next,
#main #content a:hover.mycarousel-next2
	{ background-position:top -34px; }
#main #content p.paginater span.left a:hover,
#main #content a:hover.mycarousel-prev,
#main #content a:hover.mycarousel-prev2
	{ background-position:top -32px; }
#main #content p.paginater span.right a:active,
#main #content a:active.mycarousel-next,
#main #content a:active.mycarousel-next2
	{ background-position:top -66px; }
#main #content p.paginater span.left a:active,
#main #content a:active.mycarousel-prev,
#main #content a:active.mycarousel-prev2
	{ background-position:top -64px; }
/*#main #content a.jcarousel-prev-disabled*/

#main #content .jcarousel-clip-horizontal
	{ margin:0 0 0 10px;width: 675px; height:auto; }
#main #content .jcarousel-clip-vertical
	{ width: 100%; }
#main #content .jcarousel-item
	{ height: 100%; }
