/** Import Compass */
/* ========================================================================== Icon Library Mixin ========================================================================== */
/* ========================================================================== Shadows ========================================================================== */
/* ========================================================================== Regions ========================================================================== */
/** Region Component This is a region component which provides a container to place other components in. Using a region will provide you with a header and body which you can style and use within your UI. Example HTML: <div class="t-Region [modifiers]"> <div class="t-Region-header"> <h2 class="t-Region-title">Region Title</h2> </div> <div class="t-Region-body"> Body </div> </div> <div class="t-Region [modifiers]"> <div class="t-Region-header"> <div class="t-Region-headerItems t-Region-headerItems--left"> <h2 class="t-Region-title">Region Title</h2> </div> <div class="t-Region-headerItems t-Region-headerItems--right"> [Optional Buttons] </div> </div> <div class="t-Region-body"> Body </div> </div> */
/* ========================================================================== Region ========================================================================== */
.t-Region { display: block; border: 1px solid rgba(0, 0, 0, 0.1); box-shadow: 0 2px 4px -2px rgba(0, 0, 0, 0.075); }

/* Sub-section comment block ========================================================================== */
/** Modifier: Padded Region This applies a 16px padding to the region body */
.t-Region .t-Region-body { padding: 16px; }

.t-Region { margin-bottom: 16px; }

/** Modifier: Transparent Background This removes the background from the region */
/** Modifier: No Border Remove borders and shadows from the region. */
.t-Region--noBorder { border: none !important; box-shadow: none !important; }

.t-Region--noBorder > .t-Region-header { border-bottom: none !important; }

.t-Region--noBorder > .t-Region-bodyWrap > .t-Region-body { padding-top: 0; }

/** Modifier: No Padding Remove borders and shadows from the region. */
.t-Region--noPadding > .t-Region-bodyWrap > .t-Region-body { padding: 0 !important; /* When region has no Padding, remove borders on IRR */ }

.t-Region--noPadding > .t-Region-bodyWrap > .t-Region-body > .a-IRR-container .a-IRR { border-width: 0; }

.t-Region--noPadding > .t-Region-bodyWrap > .t-Region-body > .t-MediaList { border-width: 0; }

/** Modifier: Stacked Regions Remove side borders and shadows.  This is useful for accordions, and regions that can be grouped togehter into stacks. */
.t-Region--stacked { box-shadow: none !important; border-width: 1px 0 !important; border-radius: 0 !important; margin-bottom: 0; }

.t-Region--stacked:first-child { border-top: 0 !important; }

.t-Region--stacked + .t-Region--stacked { margin-top: -1px; }

/** Modifier: Text Content Regions This region style is used for displaying text content. */
.t-Region--textContent { box-shadow: none; border-width: 0; margin-bottom: 0; background-color: transparent !important; }

.t-Region--textContent > .t-Region-header { border-width: 0; font-size: 2.0rem; line-height: 2.4rem; font-weight: bold; }

.t-Region--textContent > .t-Region-header, .t-Region--textContent > .t-Region-bodyWrap > .t-Region-body { background-color: transparent !important; }

/** Side Column Regions */
.t-Body-side .t-Region, .t-Body-actions .t-Region { box-shadow: none !important; border-width: 1px 0 !important; border-radius: 0 !important; margin-bottom: 0; border-bottom-width: 0 !important; }

.t-Body-side .t-Region:first-child, .t-Body-actions .t-Region:first-child { border-top: 0 !important; }

.t-Body-side .t-Region + .t-Region, .t-Body-actions .t-Region + .t-Region { margin-top: -1px; }

.t-Body-side .t-Region .t-Region-buttons-left { padding-left: 1.6rem; }

.t-Body-side .t-Region .t-Region-buttons-right { padding-right: 1.6rem; }

.t-Body-actions .t-Region > .t-Region-header { border-bottom-width: 0; }

/** Modifier: Hide Header Hides region header (Accessible) */
.t-Region--hideHeader > .t-Region-header { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/** Modifier: Remove Header Removes region header (Not Accesible) */
.t-Region--removeHeader > .t-Region-header { display: none; }

/** Modifier: No UI Remove borders and shadows from the region. */
.t-Region--noUI, .t-Region--noUI > .t-Region-header { background: none transparent !important; box-shadow: none; border-width: 0; }

.t-Region--noUI > .t-Region-bodyWrap > .t-Region-body { padding: 0; background: none transparent !important; }

.t-Region--noUI > .t-Region-header .t-Region-headerItems--title { padding-right: 0; padding-left: 0; }

/* Region Header ========================================================================== */
.t-Region-header { border-bottom-right-radius: 0 !important; border-bottom-left-radius: 0 !important; border-bottom: 1px solid rgba(0, 0, 0, 0.075); box-sizing: border-box; display: table; /* 1 */ table-layout: auto; width: 100%; font-size: 1.6rem; font-weight: 400; line-height: 1.6rem; }

.t-Region-title { font-size: inherit; line-height: inherit; font-weight: inherit; }

.t-Region-headerItems { display: table-cell; vertical-align: middle; }

.t-Region-headerItems--controls { width: 1%; white-space: nowrap; padding-left: .8rem; text-align: left; }

.u-RTL .t-Region-headerItems--controls { text-align: right; }

.u-RTL .t-Region-headerItems--controls { padding-left: 0; padding-right: .8rem; }

.t-Region-headerItems--title { text-align: left; padding: 1.6rem 1.2rem; }

.u-RTL .t-Region-headerItems--title { text-align: right; }

.t-Region-headerItems--buttons { text-align: right; }

.u-RTL .t-Region-headerItems--buttons { text-align: left; }

.t-Region-body { font-size: 1.4rem; line-height: 2.0rem; overflow: auto; position: relative; }

.t-Region-body > .container { /* hide horizontal scrollbars due to updated grid settings */ overflow: hidden; }

.t-Region-body--noBorder { border: none !important; }

.t-Region-buttons { overflow: hidden; }

.t-Region-buttons-left { float: left; }

.t-Region-buttons-right { float: right; }

.t-Region-buttons-left, .t-Region-buttons-right { padding: .8rem 1.1rem; }

.t-Region-buttons-left:empty, .t-Region-buttons-right:empty { display: none; }

.t-Region--hiddenOverflow > .t-Region-bodyWrap > .t-Region-body, .t-Region--hiddenOverflow > .t-Region-body { overflow: hidden; }

.t-Region--hideShow > .t-Region-header .t-Region-headerIcon { transition: -webkit-transform .2s; transition: transform .2s; transition: transform .2s, -webkit-transform .2s; }

.t-Region--hideShow > .t-Region-header .t-Region-headerIcon:before { padding-left: 1px; }

.t-Region--hideShow > .t-Region-header .t-Region-headerIcon:before { content: "\e016"; }

.t-Region--hideShow.is-expanded > .t-Region-bodyWrap { display: block; height: auto; }

.t-Region--hideShow.is-expanded > .t-Region-header .t-Button--hideShow:hover .t-Region-headerIcon { -webkit-transform: rotate(0deg); transform: rotate(0deg); }

.t-Region--hideShow.is-expanded > .t-Region-header .t-Region-headerIcon { -webkit-transform: rotate(90deg); transform: rotate(90deg); }

.t-Region--hideShow.is-collapsed > .t-Region-bodyWrap { height: 0; overflow: hidden; }

.t-Region--hideShow.is-collapsed > .t-Region-header .t-Button--hideShow:hover .t-Region-headerIcon { -webkit-transform: rotate(90deg); transform: rotate(90deg); }

.t-Region--hideShow > .t-Region-header .t-Region-headerItems--title { padding-left: .4rem; }

.t-Region--scrollBody > .t-Region-bodyWrap > .t-Region-body { overflow: auto; -webkit-overflow-scrolling: touch; }

.t-Region--shadowScroll { position: relative; overflow: hidden; }

.t-Region--shadowScroll > .t-Region-bodyWrap > .t-Region-body { overflow: auto; -webkit-overflow-scrolling: touch; }

/* Action Regions ========================================================================== */
.t-Body-actions .t-Region { font-size: 1.2rem; }

.t-Body-actions .t-Region--scrollBody > .t-Region-bodyWrap > .t-Region-body { background: transparent; box-shadow: none; }

.t-Body-actions .t-Region-header { font-size: 1.4rem; line-height: 1.4rem; }

.t-Body-actions .t-Region .t-Region-body { padding: 0 12px 12px 12px; }

.t-Region-title { display: inline-block; margin: 0; }

.t-Region-title--withBadge { padding: 10px 0; line-height: 20px; }

/* Carousel Region ========================================================================== */
.t-Region--carousel { overflow: hidden; }

.t-Region--carousel .t-Region-body { padding: 0; }

.t-Region--carousel .a-Region-carouselNav { position: absolute; bottom: 0; left: 0; width: 100%; z-index: 110; margin: 8px 0; text-align: center; }

.t-Region--carousel .a-Region-carouselItems { overflow: hidden; position: absolute; top: 0; left: 0; bottom: 0; right: 0; margin: 0; }

.t-Region--carousel .a-Region-carouselItem { overflow: hidden; position: absolute; opacity: 0; top: 0; left: 0; right: 0; }

.t-Region--carousel .a-Region-carouselItem { transition: all .5s ease; }

.t-Region--carousel .a-Region-carouselItem.a-Tabs-element-selected { opacity: 1; z-index: 10; }

.t-Region--carousel.t-Region--carouselSlide > .t-Region-bodyWrap .a-Region-carouselItem.a-Tabs-before { -webkit-transform: translateX(-100%); transform: translateX(-100%); }

.t-Region--carousel.t-Region--carouselSlide > .t-Region-bodyWrap .a-Region-carouselItem.a-Tabs-after { -webkit-transform: translateX(100%); transform: translateX(100%); }

.t-Region--carousel.t-Region--carouselSlide > .t-Region-bodyWrap .a-Region-carouselItem.a-Tabs-element-selected { -webkit-transform: translateX(0); transform: translateX(0); }

.t-Region--carousel.t-Region--carouselSpin > .t-Region-bodyWrap .a-Region-carouselItem.a-Tabs-before { -webkit-transform: rotateY(90deg); transform: rotateY(90deg); }

.t-Region--carousel.t-Region--carouselSpin > .t-Region-bodyWrap .a-Region-carouselItem.a-Tabs-after { -webkit-transform: rotateY(-90deg); transform: rotateY(-90deg); }

.t-Region--carousel.t-Region--carouselSpin > .t-Region-bodyWrap .a-Region-carouselItem.a-Tabs-element-selected { -webkit-transform: rotateY(0); transform: rotateY(0); }

.t-Region--carousel .a-Tabs-button { border: none; display: none; position: absolute; top: 50%; width: 24px; height: 64px; padding: 16px 4px; border-radius: 2px; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset; margin-top: -32px; z-index: 100; opacity: .5; transition: all .2s ease; }

.t-Region--carousel .a-Tabs-button:hover { opacity: 1; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset, 0 1px 1px rgba(0, 0, 0, 0.05); -webkit-transform: translateX(0); transform: translateX(0); }

.t-Region--carousel .a-Tabs-button:active, .t-Region--carousel .a-Tabs-button:active:focus { opacity: 1; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset, 0 1px 1px rgba(0, 0, 0, 0.05) inset; }

.t-Region--carousel .a-Tabs-button:focus { opacity: 1; box-shadow: 0 0 0 1px #4696FC; outline: none; }

.t-Region--carousel .a-Tabs-next-region { right: 8px; }

.t-Region--carousel .a-Tabs-previous-region { left: 8px; }

.t-Region--carousel .a-Region-carouselNavItem { display: inline-block; margin: 0 4px; }

.t-Region--carousel .a-Region-carouselNavItem.a-Tabs-selected .a-Region-carouselLink:focus { outline: none; box-shadow: 0 0 1px 1px #4696FC; }

.t-Region--carousel .a-Region-carouselLink { display: block; width: 8px; height: 8px; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1) inset; border-radius: 100%; }

.t-Region--carousel .a-Region-carouselLabel { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

.t-Region--showCarouselControls > .t-Region-bodyWrap > .t-Region-body > .t-Region-carouselRegions > .a-Region-carouselControl .a-Tabs-button { display: block; }

.js-showMaximizeButton.is-maximized { z-index: 500; position: fixed; top: 0; left: 0; right: 0; bottom: 0; margin: 0; }

.t-Region.is-maximized .t-Report { overflow: visible; }

.t-Region.is-maximized .t-Report .t-Report-wrap { float: none; }

.t-Region.is-maximized > .t-Region-bodyWrap > .t-Region-body { overflow: visible !important; height: auto !important; }

.t-Region.is-maximized > .t-Region-bodyWrap { position: absolute; overflow: auto; left: 0; right: 0; bottom: 0; top: 49px; }

.t-Region.is-maximized .a-Region-carouselControl .a-Tabs-button { position: fixed; z-index: 500; }

.js-regionIsMaximized .a-Menu, .js-regionIsMaximized .ui-widget, .js-regionIsMaximized .ui-dialog, .js-regionIsMaximized .a-IRR-sortWidget, .js-regionIsMaximized .ui-widget-overlay { visibility: visible; }

.js-regionIsMaximized { visibility: hidden; }
