/* Information -------------------------------------

Version: 0.1.28

Include on: HermanMiller.com Templates Containing a Rotator

Contains:
	=Rotator
	=Carousel
----------------------------------------------------*/



/* =Rotator
----------------------------------------------------*/
.rotatorWrap {
	min-height: 150px;
	position: relative;
}



.rotatorWrap .slide {
	background: #fff;
	-webkit-border-bottom-left-radius: 8px;
	-webkit-border-bottom-right-radius: 8px;
	-moz-border-radius-bottomleft: 8px;
	-moz-border-radius-bottomright: 8px;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
	display: none;
	left: 0;
	position: relative;
	top: 0;
	width: 900px;
	margin-top: 10px;
	padding-top: 10px;
}




/* ----- Define Slide Widths Based on Container Width ----- */
.container980 .slide {
	width: 978px;
}
.container730 .slide {
	width: 728px;
}
.container650 .slide {
	width: 648px;
}
.container605 .slide,
.cols605-355-c0 .slide {
	width: 603px;
}
.container355 .slide {
	text-align: center;
	width: 353px;
}
.container310 .slide {
	text-align: center;
	width: 308px;
}

/* ----- Position Left & Right Columns ----- */

.slide .colR {
	float: right;
	position: relative;
}

.slide .colL {
	float: left;
	position: relative;
}


/* ----- Set Link Behavior ----- */
.slide a {
	display: block;
}
.slide .text a {
	display: inline;
}
.slide a:hover {
	*cursor: pointer; /* IE7 */
	/*text-decoration: none;*/
}

/* ----- Set Images ----- */
.slide img {
	position: relative;
	z-index: 1;
}

/* ----- Rotator Arrows : Shared ----- */
.rotatorArrow {
	cursor: pointer;
	overflow: hidden;
	position: absolute;
	text-indent: -999.9em;
	z-index: 10;
	-webkit-user-select: none;
}

/* ----- Rotator Arrows : Home Hero ----- */
.homeHero .rotatorArrow {
	background: url("../img/btns/controls-arrows.png") 0 0 no-repeat;
	display: none;
	height: 27px;
	top: 274px;
	width: 25px;
}
.homeHero .rotatorArrow.next {
	background-position: -25px 0;
	right: 110px;
}
.homeHero .rotatorArrow.next:hover { background-position: -25px 0; right: 105px; }
.homeHero .rotatorArrow.prev {
	left: 110px;
	right: auto;
}
.homeHero .rotatorArrow.prev:hover { background-position: 0 0; left: 105px; }

/* ----- Rotator Arrows : Pill ----- */
.rotatorArrow {
	background: url("../img/btns/controls-arrows-pill.png") 0 0 no-repeat;
	height: 25px;
	top: -32px;
	width: 30px;
}
.rotatorArrow.next {
	background-position: -30px 0;
	right: 15px;
}
.rotatorArrow.next:hover { background-position: -30px -25px; }
.rotatorArrow.prev {
	right: 45px;
}
.rotatorArrow.prev:hover { background-position: 0 -25px; }

/* ----- Rotator Arrows : Product Hero ----- */
.productHero .rotatorArrow {
	background: url("../img/btns/controls-arrows-circle.png") 0 0 no-repeat;
	float: left;
	height: 25px;
	left: auto;
	margin: 0 5px 10px 0;
	position: relative;
	right: auto;
	top: -2px;
	width: 25px;
}
.productHero .rotatorArrow.next { background-position: -25px 0; }
.productHero .rotatorArrow.next:hover { background-position: -25px -25px; }
.productHero .rotatorArrow.prev { background-position: 0 0; } 
.productHero .rotatorArrow.prev:hover { background-position: 0 -25px; }

/* ----- Rotator Bullet Nav ----- */
.rotatorBullets {
	position: absolute;
	right: 85px;
	top: -32px;
	z-index: 10;
	-webkit-user-select: none;
}
.rotatorBullets span {
	background: url("../img/btns/controls-dots.png") 0 0 no-repeat;
	cursor: pointer;
	float: left;
	height: 25px;
	margin: 0 0 0 4px;
	text-indent: -999.9em;
	width: 10px;
}
.rotatorBullets span:hover {
	background-position: -10px 0;
}
.rotatorBullets span.active {
	background-position: -20px 0;
}

/* ----- Image Flush Fade Rotator ----- */
.imgFlush .colL,
.imgFlush .colL img,
.imgFlush .colL .overlay {
	-webkit-border-bottom-left-radius: 8px;
	-moz-border-radius-bottomleft: 8px;
	border-bottom-left-radius: 8px;
}
.imgFlush .colR,
.imgFlush .colR img,
.imgFlush .colR .overlay {
	-webkit-border-bottom-right-radius: 8px;
	-moz-border-radius-bottomright: 8px;
	border-bottom-right-radius: 8px;
}
.imgFlush .text {
	padding: 20px;
}
.cols605-355-c0 .imgFlush .text {
	width: 260px;
}
.container650 .imgFlush .text {
	width: 282px;
}
.imgFlush .colL {
	margin-right: 3px;
}
.container650 .imgFlush .colL {
	margin-right: 4px;
}
.imgFlush .overlay {
	background-color: #f30;
	bottom: 0;
	color: #fff;
	display: none;
	font-size: 13px;
	font-weight: bold;
	height: 39px;
	left: 0;
	line-height: 1.2;
	padding: 7px 20px 0 20px;
	position: absolute;
	z-index: 5;
}
.cols605-355-c0 .imgFlush .overlay {
	width: 260px;
}
.container650 .imgFlush .overlay {
	width: 282px;
}
.imgFlush .colL:hover .overlay,
.imgFlush .colR:hover .overlay {
	display: block;
}
.imgFlush a:hover {
	text-decoration: none;
}
.imgFlush a.actionLink:hover {
	text-decoration: underline;
}
.imgFlush h3 {
	margin-bottom: 5px;
	padding-top: 20px;
}
.imgFlush p {
	color: #7f7f7f;
	font-size: 11px;
}

/* ----- Equal Padding Fade Rotator ----- */
.equalPadding .colL,
.equalPadding .colR {
	padding: 14px;
}
.equalPadding .colL.text {
	padding-right: 6px;
}
.equalPadding .colR.text {
	padding-left: 6px;
}
.equalPadding .colL,
.equalPadding .colL img,
.equalPadding .colR,
.equalPadding .colR img {
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
}
.container730 .equalPadding .text {
	width: 317px;
}
.container980 .equalPadding .text {
	width: 343px;
}
.equalPadding h3 {
	font-size: 16px;
	margin-bottom: 6px;
	margin-top: 80px;
}
.equalPadding p {
	color: #7f7f7f;
	font-size: 13px;
	line-height: 1.8;
}
.equalPadding .actionLink {
	font-size: 13px;
	top: -15px;
}

/* ----- Design Image Offset Fade Rotator ----- */
.imgOffset .colL,
.imgOffset .colR {
	padding-top: 30px;
	padding-right: 14px;
	padding-bottom: 30px;
	padding-left: 14px;
}

.imgOffset .colR2 {
	padding-top: 30px;
	padding-right: 14px;
	padding-bottom: 30px;
	padding-left: 14px;
	float: right;
	width: 500px;
}


.imgOffset .colL.text {
	padding-right: 6px;
}
.imgOffset .colR.text {
	padding-left: 6px;
}
.imgOffset .text {
	width: 454px;
}

.imgOffset .text_menor {
	width: 254px;
}
.imgOffset h3 {
	font-size: 12px;
	margin-bottom: 20px;
}
.imgOffset .colR img {
	margin: -30px -14px 0 0;
}
.imgOffset .colL img {
	margin: -30px 0 0 -14px;
}

/* ----- Image Centered Fade Rotator ----- */
.imgCentered img {
	margin: 10px 0;
}

/* ----- Bottom Controls 980 Width Fade Rotator ----- */
.btmControls980 {
	margin-bottom: 52px;
}
.btmControls980 .slide {
	width: 980px;
}
.btmControls980 .rotatorArrow,
.btmControls980 .rotatorBullets {
	bottom: -32px;
	top: auto;
}

/* ----- Home Hero Slide Rotator ----- */
.homeHero {
	left: 50%;
	margin-left: -600px;
	min-height: 574px;
	overflow: hidden;
	position: relative;
	width: 1200px;
}
.homeHero .infoBlock {
	position: absolute;
	z-index: 1;
}
.homeHero p {
	font: 700 14px "ff-meta-web-pro",arial,helvetica,sans-serif;
	margin-bottom: 5px;
	-webkit-text-stroke: 1px transparent;
}
.homeHero .btn {
	display: inline-block;
}

/* ----- Product Hero Slide Rotator ----- */
/* Vertical */
.productHero {
	left: -110px;
	min-height: 780px;
	overflow: hidden;
}
.container730 .productHero {
	margin-bottom: 20px;
}
.productHero .slide {
	width: 840px;
}
/* Horizontal */
.contentWide .productHero {
	left: 50%;
	margin-left: -600px;
	min-height: 480px;
}
.contentWide .productHero .slide {
	width: 1200px;
}
/* Horizontal Split */
.productHero.split {
	left: 50%;
	margin-left: -600px;
	min-height: 480px;
	padding-right: 340px;
}
.productHero.split .slide {
	margin-left: 340px;
	width: 860px;
}
.productHero.split #fixedHero {
	left: 0;
	position: absolute;
	top: 0;
	z-index: 3;
}
/* Eames */
.container860 .productHero.split {
	margin-left: -770px;
}

/* Inset Block */
#insetBlock {
	background-color: #f30;
	left: 110px;
	overflow: hidden;
	padding: 10px 15px 0 20px;
	position: absolute;
	top: 90px;
	width: 195px;
	z-index: 3;
}
#insetBlock h1 {
	color: #fff;
	font-size: 24px;
	line-height: 1.2;
	margin-bottom: 5px;
}
#insetBlock a.btn {
	float: right;
	margin-bottom: 13px;
}
#insetBlock .toggle {
	background: #f2f2f2 url("../img/icons/arrow-up-gray.png") 50% 50% no-repeat;
	border: 1px solid #c2c2c2;
	border-top: 0;
	clear: both;
	cursor: pointer;
	display: block;
	font-size: 11px;
	*height: 20px; /* IE7 */
	line-height: 20px;
	margin: 0 -15px 0 -20px;
	text-align: center;
	text-indent: -999.9em;
}
#insetBlock .toggle:hover {
	background-position: 33% 50%;
	text-indent: 0;
}
#insetBlock .toggle.hide { background-image: url("../img/icons/arrow-down-gray.png"); }

/* Nav Product Links */
#navProduct {
	background-color: #fff;
	border: 1px solid #f30;
	clear: both;
	margin: 0 -15px 0 -20px;
	width: 228px;
}
#navProduct a {
	border-top: 1px solid #e6e6e6;
	color: #414141;
	display: block;
	font-size: 11px;
	font-weight: bold;
	margin: 0 20px;
	padding: 11px 0 12px 0;
	text-decoration: none;
}
#navProduct a:hover {
	color: #f30;
}
#navProduct .optionalLinks {
	background-color: #e5e5e5;
}
#navProduct .optionalLinks a {
	border-top: 1px solid #cfcfcf;
	padding-left: 15px;
}
#navProduct a:first-child {
	border: 0;
}
#navProduct .external {
	background: url("../img/icons/external.png") 0 50% no-repeat;
}
#navProduct .arrow {
	background: url("../img/icons/arrow-right-red.png") 0 50% no-repeat;
}

/* ----- Caption ----- */
.productHero .caption {
	background: #000;
	background: rgba(0,0,0,0.7);
	bottom: 0;
	color: #fff;
	display: none;
	font-size: 11px;
	left: 110px;
	padding: 8px 10px 10px 10px;
	position: absolute;
	width: 960px;
	z-index: 2;
}
.productHero.split .caption {
	left: 0;
	width: 840px;
}
.container730 .productHero .caption {
	left: auto;
	right: 0;
	width: 710px;
}


/* =Carousel
----------------------------------------------------*/
/* ----- Base Containers ----- */
.carouselWrap {
	position: relative;
}
.carousel {
	margin: 18px auto;
	width: 100%;
}
.tabContent .carouselWrap {
	margin: -14px;
	*margin-bottom: 0; /* IE7 */
}

/* ----- List Structure ----- */
.carousel ul {
	max-height: 155px;
	overflow: hidden;
	visibility: hidden;
}
.carousel li {
	float: left;
	margin: 0 4px;
}

/* ----- Overlay ----- */
.carousel .overlay {
	background: rgb(0,0,0);
	background: rgba(0,0,0,0.75);
	bottom: 0;
	color: #fff;
	font-size: 11px;
	font-weight: bold;
	height: 28px;
	left: 0;
	line-height: 1.2;
	padding: 8px 10px;
	position: absolute;
	width: 90%;
	z-index: 5;
}
.carousel a:hover .overlay {
	color: #f30;
}

/* ----- Item Link ----- */
.carousel a {
	display: block;
	position: relative;
}
.carousel a:hover {
	text-decoration: none;
}

/* ----- Directional Arrow Buttons ----- */
.carouselWrap a.next,
.carouselWrap a.prev {
	background-image: url("../img/btns/controls-arrows-circle.png");
	background-position: no-repeat;
	cursor: pointer;
	height: 25px;
	position: absolute;
	text-indent: -999.9em;
	width: 25px;
	z-index: 5;
	-webkit-user-select: none;
}
.carouselWrap a.next { background-position: -25px 0; margin-top: -13px; right: 7px; top: 50%; }
.carouselWrap a.next:hover { background-position: -25px -25px; }
.carouselWrap a.prev { background-position: 0 0; left: 7px; margin-top: -13px; top: 50%; } 
.carouselWrap a.prev:hover { background-position: 0 -25px; }
.linkBelow a.next,
.linkBelow a.prev {
	margin-top: -20px;
	*margin-top: -30px; /* IE7 */
}

/* ----- Span Style ----- */
.carousel span {
	display: block;
	font-size: 11px;
	line-height: 1.1;
}

/* ----- Text Link ----- */
.carousel .link {
	margin-top: 5px;
}
.carousel a:hover .link {
	text-decoration: underline;
}

/* ----- Version with Product Names ----- */
.linkBelow .carousel {
	margin-bottom: 0;
}
.linkBelow ul {
	*padding-bottom: 18px; /* IE7 */
	max-height: 170px;
}
.linkBelow li {
	margin: 0 8px;
	padding-bottom: 14px;
}
.linkBelow .link {
	padding-bottom: 1px;
	text-align: center;
	width: 140px;
}
.container310 .linkBelow .link {
	width: 200px;
}
.linkBelow a {
	text-align: center;
}

/* ----- Version with Text ----- */
.container710 .textBelow {
	padding: 0 30px;
}
/*
.textBelow ul {
	max-height: 275px;
}*/
.textBelow li {
	text-align: center;
}
.textBelow li a {
	padding: 0 20px;
}
.cols480 .textBelow li a {
	padding: 0;
}
/*.textBelow li a {
	padding: 0 20px;
}
.cols480 .textBelow li a {
	padding: 0;
}*/
.textBelow span {
	text-align: left;
	width: 100%;
}
.textBelow img {
	margin: 0 20px;
}
/*.textBelow img {
	margin: 0 auto;
}*/
.cols480 .textBelow img {
	margin: 0;
}
.textBelow .title {
	color: #414141;
	font-size: 16px;
	font-weight: bold;
	margin-top: 12px;
}
.textBelow .text {
	color: #7f7f7f;
	margin-top: 8px;
}

/* ----- Slideshow Version ----- */
.slideshowWrap {
	clear: both;
}
.modalWin .slideshowWrap {
	margin: 0 -20px;
}
#slideshowImg {
	border-bottom: 1px solid #e5e5e5;
	margin-top: 12px;
	min-height: 345px;
	position: relative;
	text-align: center;
}
.modalWin #slideshowImg {
	padding: 0;
}
.modalWin .slideshow .carousel {
	margin-bottom: -10px;
}
#slideshowImg img {
	display: none;
}
.slideshowWrap .caption {
	color: #7f7f7f;
	display: block;
	font-size: 11px;
	margin: 10px 0 10px 12px;
	text-align: left;
}
.modalWin .caption {
	margin: 10px auto;
	width: 800px;
}
.slideshow .carousel {
	margin: 8px auto;
}
.slideshow li {
	cursor: pointer;
	margin: 0 1px;
	padding-top: 3px;
}
.slideshow li img {
	border: 1px solid #fff;
	padding: 1px;
}
.slideshow li.active {
	background: url("../img/icons/arrow-up-gray.png") 50% 0 no-repeat;
}
.slideshow li.active img {
	border-color: #7d7d7d;
}

/* ----- Slideshow Version Image Arrows ----- */
#slideshowImg a {
	background: url("../img/btns/controls-arrows.png") 0 0 no-repeat;
	cursor: pointer;
	height: 27px;
	margin-top: -13px;
	overflow: hidden;
	position: absolute;
	text-indent: -999.9em;
	top: 50%;
	width: 25px;
	z-index: 10;
	-webkit-user-select: none;
}
#slideshowImg .next {
	background-position: -25px 0;
	right: 30px;
}
#slideshowImg .next:hover { background-position: -25px 0; right: 25px; }
#slideshowImg .prev {
	left: 30px;
	right: auto;
}
#slideshowImg .prev:hover { background-position: 0 0; left: 25px; }

/* ----- Image Border ----- */
.imgBorder img {
	border: 1px solid #e5e5e5;
}
/* Localized */