/**
VARIABLES
Place all variables not related to susy in here.
**/
/* Colors */
/* Color Palette Colors from \RGAWORK\clients\Samsung\Global_Ecomm\05_Visual_Design\_PSDs\ForDesigners\_SourcePSDs\_SharedRerouces\PSDs */
/* BaseLine Font */
/*Breakpoints*/
/*360px*/
/*640px*/
/*800px*/
/*1280*/
/*1440*/
/*1600*/
/*1920*/
/*361px*/
/*641px*/
/*801px*/
/*1281*/
/*1920*/
/*Breakpoints*/
/*0 to 360px*/
/*361 to 640px*/
/*641 to 800px*/
/*801 to 1280*/
/*1281 to 1920*/
/* iOS Breaks */
/*320px*/
/*480px*/
/*568px*/
/*768px*/
/*1024*/
/*Icons*/
/* IE fixes screen width */
/* navigation variables */
/*Android mobile portrait variable*/
/*ios landscape variable*/
/*android landscape variable*/
/*tablet icon variable*/
/*ios Menu width */
/*ios Menu width */
/*Instore margin grid*/
/*GlanceGrid*/
/* 800px */
/* End navigation variables */
/** 
MIXINS & FUNCTIONS
All mixins and functions not relating to susy.
**/
/* 
* FUNCTIONS 
*/
/**
@function px2em
Returns em value
@param pxval - pixel value
Usage: @include px2em(120px)
**/
/**
@function em2px
Returns pixel value
@param emval - em value
Usage: @include em2px(2em)
**/
/**
@function px2rem
Convert PX to REM function.
@param pxval - px value
Usage: @include px2rem(2px)
**/
/* 
* MIXINS
*/
/**
@mixin vendor
Easily apply styles and adding vendor prefixes will be added with ease.
@param name - css property
@param arg - css values 
Usage: @include vendor(border-radius, 4px);
**/
/**
@mixin keyframes
Add keyframes to any element and it will include all the prefixes.
@param name - name of animation
Usage: 
	@include keyframes(example) {
		0% {opacity: 0}
		100% {opacity:1} 
	} 
**/
/**
@mixin font-size 
Convert px to rem and output fallback.
@param sizeValue - rem value
Usage: @include font-size(1.6)
**/
/**
@mixin line-height
Convert px to rem and output fallback.
@param sizeValue - rem value
Usage: @include line-height(1.6)
**/
/**
@mixin cta
@param size - size of font in rem
@param ctaSize - size of icon font in rem
Usage: @include cta(3);
**/
/* Samsung Font Regular */
/* Samsung Font Bold */
/* Samsung Font Black */
/* Hide Text */
/* Text OverFlow */
/* Cart Price Text */
/* Clear Elements */
/* Removes Margin on Last Column */
/**
@mixin cssTriangle
Creates a css triangle http://cssarrowplease.com
@param size - size of the triangle
@param borderWidth - width of the border
@param borderColor - color of the border
@param position - where the arrow should appear (top, right, bottom, left)
@param bg - background color of the triangle
Usage: @include cssTriangle(10px, 1px, #ccc, right, #000);
**/
/**
@mixin opacity
Sets opacity to element with vendor prefixes.
@param decimal - decimal point for opacity
Usage: @include opacity(.5);
**/
/* Sample Button Mixin */
/**
@mixin navigation-list
Creates navigation layout with li elements
@param $space - px value in margin-right
Usage: @include navigation-list(12px);
**/
/* Input Placeholder */
/* Custom Scrollbar */
/* Grid Margin */
/* Grid Padding */
/**
@mixin box-sizing
Applying box model
@param box-model - box module value
Usage: @include box-sizing(border-box);
**/
/**
@mixin nontop
Add handler for when the page is removed from top 
Usage: @include nontop(){ @param: @value};
**/
/* mixin to use in simple transition */
/**
@mixin ie-window
Add handler for max width window on ie 8 and below
Usage: @include ie-window();
**/
/* hover active mixin */
/* pagination mixin */
.fade { opacity: 0; -webkit-transition: opacity 0.15s linear; transition: opacity 0.15s linear; }

.fade.in { opacity: 1; }

.collapse { display: none; }

.collapse.in { display: block; }

.collapsing { position: relative; height: 0; overflow: hidden; -webkit-transition: height 0.35s ease; transition: height 0.35s ease; }

.notification-background { *zoom: 1; filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF6B0000', endColorstr='#FF6EFFFF'); background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjUwJSIgeTE9IjAlIiB4Mj0iNTAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjQyIi8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjZmZmZmZmIiBzdG9wLW9wYWNpdHk9IjAuMSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.42) 0%, rgba(255, 255, 255, 0.1) 100%); background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.42) 0%, rgba(255, 255, 255, 0.1) 100%); background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.42) 0%, rgba(255, 255, 255, 0.1) 100%); background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.42) 0%, rgba(255, 255, 255, 0.1) 100%); z-index: 9999; height: 100%; position: fixed; top: 0; width: 100%; }

#open-notification { position: fixed; background: #e3e3e3; overflow: hidden; *zoom: 1; padding: 25px; left: 0; top: 0; right: 0; z-index: 9999; width: 100%; }
#open-notification, #open-notification * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
@media (min-width: 50.063em) { #open-notification { width: 603px; left: 50%; margin: 0 0 0 -301px; right: inherit; } }
#open-notification .helper { position: relative; }
#open-notification .close { position: absolute; top: 16px; right: 13px; cursor: pointer; }
#open-notification .close:before { font-family: 'samsungIcon'; font-size: 39px; font-size: 2.4375rem; margin-right: 10px; color: #000; }
#open-notification .close:hover { text-decoration: none; }
#open-notification h3 { font-family: 'SamsungIFRg', Arial, sans-serif; font-weight: normal; font-size: 24px; font-size: 1.5rem; margin: 0 0 20px; width: 91%; }
@media (min-width: 50.063em) { #open-notification h3 { font-size: 36px; font-size: 2.25rem; } }
#open-notification p { font-family: 'SamsungIFRg', Arial, sans-serif; font-weight: normal; font-size: 13px; font-size: 0.8125rem; margin: 0 0 20px; }
@media (min-width: 50.063em) { #open-notification p { font-size: 20px; font-size: 1.25rem; } }

.tooltip { position: absolute; z-index: 1030; display: block; font-size: 12px; line-height: 1.4; opacity: 0; filter: alpha(opacity=0); visibility: visible; }

.tooltip.in { opacity: 0.9; filter: alpha(opacity=90); }

.tooltip.top { padding: 5px 0; margin-top: -3px; }

.tooltip.right { padding: 0 5px; }
html.ltr .tooltip.right { margin-left: 3px; }
html.rtl .tooltip.right { margin-right: 3px; }

.tooltip.bottom { padding: 5px 0; margin-top: 3px; }

.tooltip.left { padding: 0 5px; }
html.ltr .tooltip.left { margin-left: -3px; }
html.rtl .tooltip.left { margin-right: -3px; }

.tooltip-inner { max-width: 200px; padding: 3px 8px; color: #ffffff; text-align: center; text-decoration: none; background-color: #e5e5e5; border-radius: 4px; }

.tooltip-arrow { position: absolute; width: 0; height: 0; border-color: transparent; border-style: solid; }

.tooltip.top .tooltip-arrow { bottom: 0; left: 50%; border-top-color: #e5e5e5; border-width: 5px 5px 0; }
html.ltr .tooltip.top .tooltip-arrow { margin-left: -5px; }
html.rtl .tooltip.top .tooltip-arrow { margin-right: -5px; }

.tooltip.top-left .tooltip-arrow { bottom: 0; left: 5px; border-top-color: #e5e5e5; border-width: 5px 5px 0; }

.tooltip.top-right .tooltip-arrow { right: 5px; bottom: 0; border-top-color: #e5e5e5; border-width: 5px 5px 0; }

.tooltip.right .tooltip-arrow { top: 50%; left: 0; margin-top: -5px; border-right-color: #e5e5e5; border-width: 5px 5px 5px 0; }

.tooltip.left .tooltip-arrow { top: 50%; right: 0; margin-top: -5px; border-left-color: #e5e5e5; border-width: 5px 0 5px 5px; }

.tooltip.bottom .tooltip-arrow { top: 0; left: 50%; border-bottom-color: #e5e5e5; border-width: 0 5px 5px; }
html.ltr .tooltip.bottom .tooltip-arrow { margin-left: -5px; }
html.rtl .tooltip.bottom .tooltip-arrow { margin-right: -5px; }

.tooltip.bottom-left .tooltip-arrow { top: 0; left: 5px; border-bottom-color: #e5e5e5; border-width: 0 5px 5px; }

.tooltip.bottom-right .tooltip-arrow { top: 0; right: 5px; border-bottom-color: #e5e5e5; border-width: 0 5px 5px; }

.popover { position: absolute; top: 0; left: 0; z-index: 1022; display: none; padding: 1px; text-align: left; white-space: normal; background-color: #ffffff; border: 1px solid #e5e5e5; border: 1px solid #e5e5e5; background-clip: padding-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.popover.showOnly {
	z-index: 890;
}
.popover.lightbox { z-index: 9999; }

.popover.top { margin-top: -10px; }


html.ltr .popover.right { margin-left: 10px; }
html.rtl .popover.right { margin-right: 10px; }

.popover.bottom { margin-top: 10px; }

html.ltr .popover.left { margin-left: -10px; }
html.rtl .popover.left { margin-right: -10px; }

.popover-title { padding: 8px 14px; margin: 0; font-size: 14px; font-weight: normal; line-height: 18px; background-color: #f7f7f7; border-bottom: 1px solid #ebebeb; border-radius: 5px 5px 0 0; }

.popover-content { padding: 15px 20px 0; }

.popover .arrow, .popover .arrow:after { position: absolute; display: block; width: 0; height: 0; border-color: transparent; border-style: solid; }

.popover .arrow { border-width: 11px; }

.popover .arrow:after { border-width: 14px; content: ""; }

.popover.top .arrow { bottom: -11px; left: 50%; border-top-color: #e5e5e5; border-top-color: #e5e5e5; border-bottom-width: 0; }
html.ltr .popover.top .arrow { margin-left: -11px; }
html.rtl .popover.top .arrow { margin-right: -11px; }

.popover.top .arrow:after { bottom: 1px; border-top-color: #ffffff; border-bottom-width: 0; content: "  "; }
html.ltr .popover.top .arrow:after { margin-left: -14px; }
html.rtl .popover.top .arrow:after { margin-right: -14px; }

.popover.right .arrow { top: 50%; left: -11px; margin-top: -11px; border-right-color: #e5e5e5; border-right-color: #e5e5e5; border-left-width: 0; }

.popover.right .arrow:after { bottom: -10px; left: 1px; border-right-color: #ffffff; border-left-width: 0; content: " "; }

.popover.bottom .arrow { top: -11px; left: 50%; border-bottom-color: #e5e5e5; border-bottom-color: #e5e5e5; border-top-width: 0; }
html.ltr .popover.bottom .arrow { margin-left: -11px; }
html.rtl .popover.bottom .arrow { margin-right: -11px; }

.popover.bottom .arrow:after { top: 2px; border-bottom-color: #ffffff; border-top-width: 0; content: " "; }
html.ltr .popover.bottom .arrow:after { margin-left: -14px; }
html.rtl .popover.bottom .arrow:after { margin-right: -14px; }

.popover.left .arrow { top: 50%; right: -11px; margin-top: -11px; border-left-color: #e5e5e5; border-left-color: #e5e5e5; border-right-width: 0; }

.popover.left .arrow:after { right: 1px; bottom: -10px; border-left-color: #ffffff; border-right-width: 0; content: " "; }

@media (min-width: 80.063em) { .popover .arrow { border-width: 12px; }
  .popover .arrow:after { border-width: 18px; }
  .popover.bottom .arrow { top: -12px; }
  html.ltr .popover.bottom .arrow { margin-left: -11px; }
  html.rtl .popover.bottom .arrow { margin-right: -11px; }
  .popover.bottom .arrow:after { top: 2px; }
  html.ltr .popover.bottom .arrow:after { margin-left: -18px; }
  html.rtl .popover.bottom .arrow:after { margin-right: -18px; }
  .popover.top .arrow { bottom: -12px; }
  html.ltr .popover.top .arrow { margin-left: -11px; }
  html.rtl .popover.top .arrow { margin-right: -11px; }
  .popover.top .arrow:after { bottom: 2px; }
  html.ltr .popover.top .arrow:after { margin-left: -18px; }
  html.rtl .popover.top .arrow:after { margin-right: -18px; }
  .popover.right .arrow { top: 50%; left: -12px; margin-top: -12px; }
  .popover.right .arrow:after { bottom: -18px; left: 2px; }
  .popover.left .arrow { top: 50%; right: -12px; margin-top: -12px; }
  .popover.left .arrow:after { right: 2px; bottom: -18px; } }
.alert-notification { padding: 15px 21px; font-family: 'SamsungIFBd', Arial, sans-serif; font-weight: normal; font-size: 16px; font-size: 1rem; }
@media (min-width: 48em) { .alert-notification { font-size: 18px; font-size: 1.125rem; } }
.alert-notification p { line-height: 1; }
.alert-notification.error { background: #e10c32; color: white; }
.alert-notification span { font-size: 24px; font-size: 1.5rem; margin: -3px 2px 0 0; }
html.ltr .alert-notification span { float: left; }
html.rtl .alert-notification span { float: right; }

/* Skrim for Popovers with lightbox: true */
.lightbox-skrim { position: fixed; top: 0; left: 0; background: #000; width: 100%; height: 100%; z-index:1021; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=66); opacity: 0.66; }