/* Screen Reader Styles - must haves */
  /*
	Improved screen reader only CSS class
	@author Gaël Poupard
		@note Based on Yahoo!'s technique
		@author Thierry Koblentz
		@see https://developer.yahoo.com/blogs/ydn/clip-hidden-content-better-accessibility-53456.html
	* 1.
		@note `clip` is deprecated but works everywhere
		@see https://developer.mozilla.org/en-US/docs/Web/CSS/clip
	* 2.
		@note `clip-path` is the future-proof version, but not very well supported yet
		@see https://developer.mozilla.org/en-US/docs/Web/CSS/clip-path
		@see http://caniuse.com/#search=clip-path
		@author Yvain Liechti
		@see https://twitter.com/ryuran78/status/778943389819604992
	* 3.
		@note preventing text to be condensed
		author J. Renée Beach
		@see https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
		@note Drupal 8 goes with word-wrap: normal instead
		@see https://www.drupal.org/node/2045151
		@see http://cgit.drupalcode.org/drupal/commit/?id=5b847ea
	* 4.
		@note !important is important
		@note Obviously you wanna hide something
		@author Harry Roberts
		@see https://csswizardry.com/2016/05/the-importance-of-important/
  */

  .sr-only {
	border: 0 !important;
	clip: rect(1px, 1px, 1px, 1px) !important; /* 1 */
	-webkit-clip-path: inset(50%) !important;
		clip-path: inset(50%) !important;  /* 2 */
	height: 1px !important;
	margin: -1px !important;
	overflow: hidden !important;
	padding: 0 !important;
	position: absolute !important;
	width: 1px !important;
	white-space: nowrap !important;            /* 3 */
  }

  /*
	Use in conjunction with .sr-only to only display content when it's focused.
	@note Useful for skip links 
	@see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
	@note Based on a HTML5 Boilerplate technique, included in Bootstrap
	@note Fixed a bug with position: static on iOS 10.0.2 + VoiceOver
		@author Sylvain Pigeard
		@see https://github.com/twbs/bootstrap/issues/20732
  */
  .sr-only-focusable:focus,
  .sr-only-focusable:active {
	clip: auto !important;
	-webkit-clip-path: none !important;
		clip-path: none !important;
	height: auto !important;
	margin: auto !important;
	overflow: visible !important;
	width: auto !important;
	white-space: normal !important;
  }
	
  .skip-link:focus, .skip-link:active {		
	cursor: pointer;
	padding: 13px 26px !important;
    border-radius: 300px !important;
    font-weight: 700;
    font-style: normal;	
    text-transform: uppercase;
    text-decoration: none;
    letter-spacing: 0.2em;
	font-size: 11px;
	line-height: 13px;  
	text-align: left;
	border: #082069 2px solid !important; 
	outline: none !important;
	background-color: #FFFFFF !important;
	color: #082069;    
	transition: 0.4s;
	
	top: 1.4rem !important;
	left: 20px;
	z-index: 100100;
	box-shadow: inset 0 0 2px 1px rgba(142,41,38, 0.9), inset 0 0 3px 0 rgba(142,41,38, 0.6), inset 0 0 5px 0 rgba(142,41,38, 0.2), 0 0 2px 2px rgba(255,255,255, 0.8);
  }
  /* Theme specific styles adjusted */
  .main-header__item:focus-within>.main-header__dropdown,.main-header__dropdown-item:focus-within>.main-header__dropdown {
        visibility: visible;
        opacity: 1;
        transition: visibility .2s 0s, opacity .2s 0s
    }
	a {
	 min-height: 24px !important;
	 line-height: 24px;
 }
 a.badge {
	 min-width: 24px;
	 font-weight: 700;
	 padding-top: 4px;
 }
 .bg-danger {
	 color: #FFFFFF !important;
	 background: #C10000 !important;
 }
 .btn-del {
	 color: #FFFFFF;
	 font-weight: 700;
 }
	:focus {
		border: 6px solid;
    border-image-slice: 1;
    border-width: 2px;
		/*border-image-source: linear-gradient(to left, #0171bc, #75EE45, #F8C323);*/
		border-image-source: linear-gradient(to top left, #082069, #0000FF);
		outline-offset: 2px;
		outline: 2px solid #FF5733;
	}
  .btn:focus {
    border: 6px solid;
    border-image-slice: 1;
    border-width: 2px;
		/*border-image-source: linear-gradient(to left, #0171bc, #75EE45, #F8C323);*/
		border-image-source: linear-gradient(to top left, #A9D5F2, #0000FF);
  	outline-offset: 2px;
		outline: 2px solid #FF5733 !important;
  }
  .hydrated:focus-within, chat-widget:focus-within , .chat-test:focus-within {
    border: 2px solid #0000FF !important;
  	outline-offset: 10px !important;
		outline: 2px solid #FF5733 !important;
    z-index: 10000001;
  }
  :host .lc_text-widget--bubble:focus {
    border: 2px solid #0000FF !important;
  	outline-offset: 2px !important;
		outline: 2px solid #FF5733 !important;
  }
  .radio:checked:active+label::before,.checkbox:checked:active+label::before,.radio:focus+label::before,.checkbox:focus+label::before, select:focus
  {
  border: 6px solid;
    border-image-slice: 1;
    border-width: 2px;
		/*border-image-source: linear-gradient(to left, #0171bc, #75EE45, #F8C323);*/
		border-image-source: linear-gradient(to top left, #A9D5F2, #0000FF);
  	outline-offset: 2px;
		outline: 2px solid #FF5733 !important;
  }
 
  a.img-link-focus:focus, a.svg-link-focus:focus {
	  border: none !important;
	  outline: none !important;
  }
  
  a.img-link-focus:focus img, a.svg-link-focus:focus svg {
	  border: 6px solid;
    border-image-slice: 1;
    border-width: 2px;
		/*border-image-source: linear-gradient(to left, #0171bc, #75EE45, #F8C323);*/
		border-image-source: linear-gradient(to top left, #082069, #0000FF);
		outline-offset: 2px;
		outline: 2px solid #FF5733;
  }
  
    /* fix banner cards */
  .banner-card {
  	min-height: 600px;
  }
  
  input[type="radio"], input[type="checkbox"] {
	width: 24px !important;
	height: 24px !important;
}
.slider__input {
	min-height: 24px !important;
}
  
 
  .btns--grid-layout:focus-within input[type="radio"]:checked + label, .btns--grid-layout:focus-within input[type="checkbox"]:checked + label {
    box-shadow: none;
     border: 6px solid;
    border-image-slice: 1;
    border-width: 2px;
		/*border-image-source: linear-gradient(to left, #0171bc, #75EE45, #F8C323);*/
		border-image-source: linear-gradient(to top left, #082069, #0000FF);
		outline-offset: 2px;
		outline: 2px solid #FF5733;
}

.gui a.gui-button-large, .gui a.gui-button-small {
    color: #686868;
}
  

/* Example Placeholder CSS */
	::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: #686868; 
}
::-moz-placeholder { /* Firefox 19+ */
    color: #686868; 
}
:-ms-input-placeholder { /* IE 10+ */
    color: #686868; 
}
:-moz-placeholder { /* Firefox 18- */
    color: #686868; 
}
  
  .btn-info {
  	color: #000;
    background-color: #0dcaf0;
    border: 2px solid #0dcaf0;
    font-weight: 700;
  }
  .btn-info:hover, .btn-info:focus {
  	background-color: transparent;
  }
  .btn-white {
  	color: #000 !important;
    background-color: #fff;
    border: 2px solid #fff;
    font-weight: 700;
  }
  .btn-white:hover, .btn-white:focus {
  	background-color: transparent;
    color: #FFF !important;
  }
  .btn-sm {
  	padding: .25rem .5rem;
    font-size: .875rem;
    border-radius: .2rem;
  }
  .btn-trans {
  	color: #000000 !important;
    margin-top: 10px;
    margin-bottom: 16px;
  }
  .btn-trans:hover, .btn-trans:focus {
  	color: #000000 !important;
  }
  .pt-1half {
  	padding-top: 1.5rem;
  }
  .m-half {
  	margin: 0.5rem;
  }
  
  /*touch target related fixes */
  .ml-trgt {
  	margin-left: 5px !important;
  }
  .mr-trgt {
  	margin-right: 5px !important;
  }
  .pl-trgt {
  	padding-left: 5px !important;
  }
  .pr-trgt {
  	padding-right: 5px !important;
  }
  
   .js .number-input--v2 .number-input__btn {
	  min-height: 24px !important;
	  min-width: 24px !important;  
	  
  }
  .js .number-input--v2 .number-input__btn--plus {
  	margin-left: 7px !important;
  }
   .js .number-input--v2 .number-input__btn--minus {
  	margin-right: 7px !important;
  }
  .js .number-input--v2 .form-control, .js .number-input--v2 .product-configure select, .product-configure .js .number-input--v2 select, .js .number-input--v2 .product-configure input:not([type="checkbox"]):not([type="radio"]), .product-configure .js .number-input--v2 input:not([type="checkbox"]):not([type="radio"]) {
    
	min-width: 100px;
	
}
  
  /*  .gui-number .gui-handle a {
    display: block;
    width: 28px;
    min-width: 24px !important;
    height: 24px;
    min-height: 24px !important;
    text-indent: -9999px;
    
}*/
  .gui ul.gui-products li .gui-products-title, .gui-products-title {
    min-height: 30px;
    vertical-align: middle;
  }
  .gui ul.gui-products li .gui-products-info,  .gui-products-info {
  	min-height: 26px;
    vertical-align: middle;
  }
  
  .color-contrast-medium, header .color-contrast-medium, footer .color-contrast-medium, .color-grey {
    color: #686868 !important;
}
  
  .gui-button-small:hover, .gui-button-small:focus, .gui-button-large:hover, .gui-button-large:focus {
   border: 6px solid;
    border-image-slice: 1;
    border-width: 2px;
		/*border-image-source: linear-gradient(to left, #0171bc, #75EE45, #F8C323);*/
		border-image-source: linear-gradient(to top left, #082069, #0000FF);
		outline-offset: 2px;
		outline: 2px solid #FF5733;
  }
  .btn--primary:hover, .btn--primary:focus {
  	color: #ffffff;
  }
  .gui-input-phone-number .gui-input-phone-number-code-placeholder {
    
    color: #686868 !important;
   
}

/* Cards */
  .mt-1 {
  	margin-top: 1rem;
  }
.card {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0, 0, 0, .125);
    border-radius: .25rem;
}
 
 .card-header:first-child {
    border-radius: calc(.25rem - 1px) calc(.25rem - 1px) 0 0;
}
.card-header {
    padding: 0.5rem 0.45rem;
    margin-bottom: 0;
    background-color: rgba(0, 0, 0, .175);
    border-bottom: 1px solid rgba(0, 0, 0, .325);
}
.card-header h4, .card-header .h4 {
	font-size: 0.925rem;
	font-weight: 700;
	text-align: center;
}
.card-body {
    flex: 1 1 auto;
    padding: 0.5rem 0.65rem;
}
.card-body p {
	font-size: 0.875rem;
  line-height: 1.1rem;
}
.bg-redBrwn {
	 background: #8E302E;
 }
 .text-white {
	 color: #FFFFFF !important;
 }
 .epic_link {
	padding: 6px 13px !important;
    border-radius: 300px !important;
    font-weight: 700;
    font-style: normal;    
    text-decoration: none;
    /*letter-spacing: 0.2em;*/
	font-size: 1em;
	line-height: 14px; 
	text-align: left;
	border: #082069 2px solid; 	
	background-color: #082069 !important;
	color: #ffffff;   
	margin: 2px; 
}
.epic_link:hover, .epic_link:focus {
background-color: #752826 !important;
border: #752826 2px solid; 	
  color: #FFFFFF;
}
.epic-phone {
color: #ffffff !important;
}
  .epic-top-ann {
   width: 50%;
    vertical-align: center;
    /*margin-top: 8px;*/
    margin-left: 15px;
    margin-top: 12px    
  }
  .epic-top-container {
    width: 50%;
    text-align: right;
    /*float: right;*/
  	/*margin-left: auto;
    margin-right: auto;*/
    font-family: 'Raleway', Raleway;
    /*margin-top: -14px;*/
    margin-right: 15px;
    margin-top: 15px;
  }
  .epic-top-login {
    width: 0;
    display: none;
  }
  @media only screen and (min-width: 1024px) {
  .epic-top-ann {
   width: 33%;
    margin-top: 0;
  }
  .epic-top-container {
    width: 33%;
    margin-top: 0;
    text-align: center;
    float: unset;
  	/*margin-left: auto;
    margin-right: auto;*/
  }
    .epic-top-login {
    width: 33%;
      display: block;      
      text-align: right;
      margin-right: 15px;
  }
  }
  .bg-contrast-lower::before, .bones__line, .s-tabs__list::after {
    background-color: rgba(0, 0, 0, 0.40) !important;
}
  .banner-card {
  	background-color: #547697 !important;
  }
  .epic-phone-link {
  padding: 6px 13px !important;
    border-radius: 300px !important;
    font-weight: 700;
    font-style: normal;    
    text-decoration: underline;
    /*letter-spacing: 0.2em;*/
	font-size: 1em;
	line-height: 14px; 
	text-align: left;
	/*border: #082069 2px solid; 	
	background-color: #082069 !important;*/
	color: #ffffff;   
	margin: 10px; 
  }
  .epic-phone-link:hover, .epic-phone-link:focus {
    color: #A9D5F2;
  }
  .product-card__title, .category-card__title a:link, .category-card__title a:visited,
  .story__title a:link, .story__title a:visited, .main-footer__link, article a:link, article a:visited,
  .gui-block-linklist a:link, .gui-block-linklist a:visited {
  	text-decoration: underline;
  }
  article p, article ol, article ul {
  	margin-bottom: 1rem !important;
  }
  #ikeono_webchat_widget div:nth-child(3) > div > div {
  	color: #686868 !important;
  }
  .flex-row {
    flex-direction: row !important;
}

.d-flex {
    display: flex !important;
}
  .justify-content-between
 {
    justify-content: space-between !important;
}
  .justify-content-around
 {
    justify-content: space-around !important;
}
  .justify-content-evenly {
    justify-content: space-evenly !important;
}
  .prod-card:focus-within .prod-card__action-button {
    opacity: 1 !important;
    visibility: visible !important;
  }
  .bg-light-blue .card-header {
    color: #000000;
  }
  .pagination__item--disabled
 {
    opacity: 1;
    pointer-events: none;
   color: #686868;
}
  #gui-wrapper a:link, #gui-wrapper a:visited {
  	text-decoration: underline;
  }
  .out-of-stock {
  	color: #686868;
    opacity: 1;
  }
  .opacity-60\% {
      opacity: 1;
      font-style: italic;
      color: #8E302E;
  }
  /* 360 */
  .ss360-nav__entry--active{
  color: #082069;
  }
  #input_11, .btn-primary {
  background-color: #082069 !important;
  color: #FFFFFF !important;
  }
   .btn-primary:hover,  .btn-primary:focus {
  	background-color: #0000FF !important;
  }

/* Messages */
.messages ul.success {
	padding: 20px 15px;
  color: #06402B;
  border: 2px solid #06402B;
  background: #84E085;
  text-align: center;
  font-weight: 700;
}
.messages ul.error .messages ul.success {
	padding: 20px 15px;
  color: #C10000;
  border: 2px solid #C10000;
  background: #FAD6D6;
  text-align: center;
  font-weight: 700;
}