//
// Magento Enterprise Edition
//
// NOTICE OF LICENSE
//
// This source file is subject to the Magento Enterprise Edition End User License Agreement
// that is bundled with this package in the file LICENSE_EE.txt.
// It is also available through the world-wide-web at this URL:
// http://www.magento.com/license/enterprise-edition
// If you did not receive a copy of the license and are unable to
// obtain it through the world-wide-web, please send an email
// to license@magento.com so we can send you a copy immediately.
//
// DISCLAIMER
//
// Do not edit or add to this file if you wish to upgrade Magento to newer
// versions in the future. If you wish to customize Magento for your
// needs please refer to http://www.magento.com for more information.
//
// @category    design
// @package     rwd_default
// @copyright Copyright (c) 2006-2017 X.commerce, Inc. and affiliates (http://www.magento.com)
// @license http://www.magento.com/license/enterprise-edition
//

/* ============================================ *
 * Header
 * ============================================ */

body {
	.header-language-background {
		position: fixed;
	    top: 0;
	    width: 100%;
	    z-index: 2;
	}
	.page-header {
		position: fixed;
		top:35px;
	    z-index: 99;
	    width: 100%;
	}
}

@include bp(min-width, $bp-medium + 1) {
body {
	padding-top: 35px;
}
	body.header-ffffff .page-header {
		.logo {
			background: url('../images/KINLY-logo-AN-stroke_white.svg');
		    background-position: 0 22px;
		    background-repeat: no-repeat;
		    background-size: 90px;
		    img {
				opacity:0;
				transition: $transition;
			}
			
			@include bp(max-width, $bp-medium) {
		    	background-position: 1px 14px;
			}
			
		}
		
		.nav-primary a {
			color:#fff;
			transition: $transition;
		}
		.skip-link {
			color: #fff;
			transition: $transition;
			.icon {
				background-position-x: -97px;
			}
		}
		//@include after-shadow;
	}
}
@include bp(min-width, $bp-medium + 1) {
	body.header-ffffff .page-header:hover {
		.skip-link {
			.icon {
				background-position-x: 3px;
			}
			
		}

	}
}

	body.skip-open {
		
		.header-language-background {
/*
		    .welcome-msg {
			    background: #fff;
		    }
*/
		}
		.page-header {
		    background: #fff;
		    transition: $transition;

			.logo {
				background: transparent !important;
			    img {
					opacity:1 !important;
					transition: $transition;
				}
			}
			
			.nav-primary a {
				color: $c-text !important;
			    transition: $transition;
			    &:hover {
					color: $c-action !important;
			    }
			}
			.skip-link {
				color: $c-text !important;
			    transition: $transition;
/*
				@include bp(min-width, $bp-medium + 1) {
				    .icon {
					    background-position-x: 3px;
					}
				}
*/
			}
			    
			@include bp(min-width, $bp-medium + 1) {
				    
			    &:after {
				    display: block;
					transition: $transition;
					
			    }
			}


		}
		
	}




@include bp(min-width, $bp-medium + 1) {

	.top-banner {
		@include after-shadow;
		&:after {
	    	display: block;
	    }

	}

    .page-header {
        //padding: 0 $trim;
	    font-family: $f-stack-gt-condensed-medium;
	    font-size: $f-size;
	    letter-spacing: 1.4px;
	    position: relative;
	    transition: $transition;
	    padding: 0 $trim;
	    height: 78px;

	    
	    
	    @include after-shadow;
        
/*
        &:after {
	        display: none;
		    height: 12px;
		    content: '';
		    width: 100%;
		    left: 0;
		    top: 100%;
		    position: absolute;
			background: -webkit-linear-gradient(rgba(0, 0, 0, 0.2), transparent); 
			background: -o-linear-gradient(rgba(0, 0, 0, 0.2), transparent); 
			background: -moz-linear-gradient(rgba(0, 0, 0, 0.2), transparent); 
			background: linear-gradient(rgba(0, 0, 0, 0.2), transparent); 
			transition: $transition;			    
        }
*/
        
		.animate-container {
			height: 78px;
			transition: $transition;
		}


	    //&:hover {
		    background: #fff !important;
		    transition: $transition;
		    
			.logo {
				background: transparent !important;
			    img {
					opacity:1 !important;
					transition: $transition;
				}
			}
			
			.nav-primary a {
				color: $c-text !important;
			    transition: $transition;
			    &:hover {
				    color: $c-action !important;
			    }
			}
			.skip-link/* :not( .skip-cart ) */ {
				color: $c-text !important;
			    transition: $transition;
/*
			    .icon{
				    background-position-x: 3px !important;
			    }
*/
			}
		    
		    
		    &:after {
			    display: block;
				transition: $transition;
		    }
    	//}
    	
/*
    	#nav {
	    	display: none;
    	}
*/
    	
    }

    .page-header-container {
        max-width: $max-container-width;
        position: relative;
        margin: 0 auto;
    }
    
    body.scrolled .page-header {
		    background: #fff !important;
		    transition: $transition;
		    
			.logo {
				background: transparent !important;
			    img {
					opacity:1 !important;
					transition: $transition;
				}
			}
			
			.nav-primary a {
				color: $c-text !important;
			    transition: $transition;
			    &:hover {
				    color: $c-action !important;
			    }
			}
			.skip-link/* :not( .skip-cart ) */ {
				color: $c-text !important;
			    transition: $transition;
			}
		    
		    
		    &:after {
			    display: block;
				transition: $transition;
		    }
	    
    }
    

}

@include bp(min-width, $bp-small + 1) {
		
	.page-header {
    	#nav {
	    	display: none;
    	}
    }

}

/* ============================================ *
 * Language switcher + welcome message
 * ============================================ */

.header-language-background {
    padding: $gap $trim;
    background-color: $c-black;
    text-transform: uppercase;
    font-family: $f-stack-gt-extended-medium;
    font-size: $f-size-xxs;
    letter-spacing: .4px;
    
    .header-language-container {
        max-width: $max-container-width;//$max-content-width;
        margin-left: auto;
        margin-right: auto;
        
        .store-links {
	        float:left;
	        li {
		        display: inline-block;
		        padding-right: 20px;
		        a {
			        color: $c-text-gray;
			        &.current {
				        color: $c-text-white;
			        }
		        }
	        }
        }
        
        
    }

    &:after {
        @include clearfix;
    }

    .form-language,
    .currency-switcher {
        float: left;
        margin-right: $gap;
    }

    .welcome-msg {
        float: right;
    }
}

.page-header-container .store-language-container {
    float: right;
    max-width: 35%;
    padding: 13px 15px 10px 10px;

    label {
        display: none;
    }
    select {
        max-width: 100%;
    }
}

@include bp(max-width, $bp-xsmall) {
    .page-header-container .store-language-container {
        padding-top: 8px;

        select {
            // Setting this font-size will causing zooming on iOs devices, but it keeps header more tidy
            font-size: $f-size-xs;
        }
    }
}

.header-language-background,
.header-language-background a {
    color: $c-text-white;
}

@include bp(max-width, $bp-medium) {

		body {
		.header-language-background {
			position: fixed;
		    top: 0;
		    z-index: 5;
		    width: 100%;
		}
		.page-header {
			position: fixed;
			top:35px;
		    background: #fff;
		    transition: $transition;
		}
			
		}


    .page-header {
	    height: 58px;
		border-bottom: 1px solid $c-module-border-light;
		
	    .logo {
	        width: 10%;
		    position: absolute;
		    left: 50%;
			-webkit-transform: translateX(-50%);
			transform: translateX(-50%);
		    padding-top: 13px;
		    z-index: 100;
	    }
	    
/*
	    #home_nav {
		    display: none;
	    }
*/
	    
    }
    
    body.cms-home .page-header,
    body.background-color .page-header {
		border-bottom: 0 none;
    }

}

@include bp(max-width, $bp-small) {

    .header-language-background {
    //    display: none;
	    padding: $gap 0;
	    padding-bottom: 0;
	    text-align: center;

		.header-language-container .store-links {
			float: none;
			padding-bottom: 10px;
		}
	    
    }
    .welcome-msg {
	    
	    text-transform: uppercase;
	    font-family: $f-stack-gt-extended-medium;
	    font-size: $f-size-xxs;
	    letter-spacing: .4px;
		text-align: center;
		float: none;
	    clear: both;
	    width: 100%;
	    position: relative;
	    padding: 10px 0;
	    //background: #dbc4c1;
	    box-sizing: content-box;
	    border-bottom: 1px solid $c-text;
	    color: $c-text;
	    transition: $transition;
	    white-space: nowrap;

	}

    .page-header {
	    #home_nav {
		    display: none;
	    }
	}
}


/* ============================================ *
 * Logo
 * ============================================ */

.logo {
    display: block;
    float: left;
    width: 65%;
    min-width: 100px;
    min-height: 44px;
    text-align: center;
    padding: 22px 10px 22px 0;
				@include bp(min-width, ( $bp-medium + 1 ) ) {
			    	position: relative;
					z-index: 5;
				}

    img {
        max-width: 100%;
    }

    .small {
        display: block;
        max-width: 90px;
		max-height: 29px;

    }
    .large {
        display: none;
    }
}

.logo:hover {
    opacity: 0.8;
}

// ---------------------------------------------

@include bp(min-width, $bp-medium + 1) {

    .logo {
        max-width: 97px;
        //min-height: 90px;

        .small {
            display: none;
        }
        .large {
            display: block;
            max-width: 90px;
			max-height: 28px;
        }
    }

}

/* ============================================ *
 * Skip Links
 * ============================================ */

.skip-links {
/*
    clear: both;
    overflow: hidden;
    border-top: 1px solid #EDEDED;
    border-bottom: 1px solid #EDEDED;
*/
}

// ---------------------------------------------

@include bp(min-width, $bp-medium + 1) {

    .skip-links {
        border: 0;
    }

}

/* -------------------------------------------- *
 * Skip - Link
 */

.skip-link {
    position: relative;
    float: left;
    width: 20%;
    //background: #FFFFFF;
    color: $c-text;
    text-align: left;
    line-height: 30px;


		&.skip-currency {
			padding: 0 28px 0 10px;			
			.label {
				position: relative;
				&:after {
					@include arrow(down, 3px, 1.8px);
				    position: absolute;
				    left: 100%;
				    top:50%;
					margin-top: -5px;
					margin-left: 12px;
				}
			}
			.icon {
				display: none; 
			}
		}



	@include bp(max-width, $bp-medium) {
		height: 44px;
	    line-height: 42px;
	}


	&.level0 {
		float: none;
	}

}




a.skip-link {
    text-decoration: none;
    
    &.skip-cart {
	    .label {
		    display: none;
	    }
	}
    
}

.skip-link:not(.skip-active):hover {
    opacity: 0.8;
}

// ---------------------------------------------

@include bp(max-width, $bp-medium) {

/*
    .skip-link {
        //border-right: 1px solid #EDEDED;
    }

    .skip-link:last-child {
        //border-right: 0;
    }
*/

	.skip-link {
		
		position: absolute;
		top: 0;
		padding-top: 7px;
		width: auto;
		
		.icon {
			 
		}
		.label {
			display: none;
			
		}
		&.skip-currency {
			
			left: auto;
			right: 92px;
			padding-top: 11px;
			
			.label {
				display: inline;
			}
			.icon {
				display: none; 
			}
		}
		
		&.skip-cart {
			right: 17px;
			text-align: right;
			
			
			
		}
		
		&.skip-search,
		&.skip-account {
			display: none;
		}

	}


	#header-currency {
		margin-left: 0;
	    width: 100%;
	    height: auto;
	    overflow: visible;
	    top: 41px;
	}

	body,
	body.cms-home {
		
		.header-language-background {
			position: fixed;
		    top: 0;
		    z-index: 5;
		    width: 100%;
		}
		.page-header {
			position: fixed;
			top:35px;
		    background: #fff;
		    transition: $transition;
		}
/*
		.main-container {
			padding-top: 73px;
		}
*/
	}

	body.scrolled,
	body.scrolled.cms-home {
		
/*
		.header-language-background {
			position: fixed;
		    top: 0;
		    z-index: 5;
		    width: 100%;
		}
*/
		.page-header {
/*
			position: fixed;
			top:35px;
		    background: #fff;
		    transition: $transition;
*/

			.logo {
				background: transparent !important;
			    img {
					opacity:1 !important;
					transition: $transition;
				}
			}
			
			.nav-primary a {
				color: $c-text !important;
			    transition: $transition;
			}
			.skip-link {
				color: $c-text !important;
			    transition: $transition;
			    .icon {
				    background-position-x: 0px;
				}
				&.skip-nav .icon {
				    background-position-x: 4px;
				}
			}
			    
			@include after-shadow;    
		    &:after {
			    display: block;
				transition: $transition;
		    }



		}
/*
		.main-container {
			padding-top: 73px;
		}
*/


/*
	    &:hover {
		    background: #fff;
		    transition: $transition;
		    
		    
		.logo {
			background: transparent !important;
		    img {
				opacity:1 !important;
				transition: $transition;
			}
		}
		
		.nav-primary a {
			color: $c-text !important;
		    transition: $transition;
		}
		.skip-link {
			color: $c-text !important;
		    transition: $transition;
		}
		    
		    
		    &:after {
			    display: block;
				transition: $transition;
		    }
    	}
*/


		
	}


}


@include bp(max-width, $bp-small) {

	body,
	body.cms-home {

	    .welcome-msg {
		    background: #fff;
		    position: fixed;
		    top:36px;
		    z-index: 5;
	    }
		.page-header {
			top:73px;
		}
		.main-container {
			padding-top: 136px;
		}

	}
	.skip-link {
		&.skip-currency {
			right: 19%;
			display: none;
		}
	}
	
	
}

// ---------------------------------------------

/*
@include bp(min-width, 500px) {

    .skip-link {
        width: 25%;
    }

}
*/

/* -------------------------------------------- *
 * Skip Link - Active
 */
@include bp(max-width, $bp-medium) {

    .skip-link.skip-active {
        //sbackground: #EDEDED;
        color: inherit;
    }

    .skip-link.skip-active span {
        color: inherit;
    }

}

/* -------------------------------------------- *
 * Skip Link - Icon
 */

.skip-link .icon {
    display: inline-block;
    width: 30px;
    height: 30px;
    vertical-align: middle;
    position: relative;
    margin-top: -3px;
    
/*
	@include bp(min-width, ($bp-medium + 1 )) {
		display: none;	
	}
*/

}

.skip-link.skip-nav .icon,
.skip-link.skip-cart:not(.no-count) .icon {
    margin-right: 3px;
}

@include bp(min-width, 500px) {

    .skip-link .icon {
        margin-right: 3px;
    }

}

/* -------------------------------------------- *
 * Skip Link - Label
 */

.skip-link .label {
    display: none;
}

// ---------------------------------------------

@include bp(min-width, ($bp-medium + 1)) {

    .skip-link .label {
        display: inline;
    }

}

/* ============================================ *
 * Skip Content
 * ============================================ */

.skip-content {
    display: none;
}

.skip-content.skip-active {
    display: block;
    background: #fff;
}

#header-currency {
	
	position: absolute;
    margin-top: 18px;
    //margin-left: 92px;
    height: 300px;
    overflow-y: scroll;
    font-size: 14px;
    line-height: 35px;
    text-transform: uppercase;
    padding: 10px 15px;
    width: 200px;
    z-index: 9;
    li.current {
	    border-bottom: 2px solid $c-text;
    }	
    @include bp(max-width, $bp-medium) {
		margin-top: 17px;
	    margin-left: 0;
	    width: 100%;	
	    height: auto;
	}
    
}



/* ============================================ *
 * Global Header Navigation
 * ============================================ */

@include bp(max-width, $bp-medium) {
    // ---------------------------------------------
    // Link

    #header-account li a,
    .nav-primary a.level0 {
        padding: 0 15px 0 25px;
        //border-bottom: 1px solid $c-module-border;
        text-align: left;
        color: $c-text;
        text-transform: uppercase;
        line-height: 30px;
        font-family: $f-stack-gt-compressed-medium;
        font-size: 22px;
    }

    #header-account li li a {
	    font-family: $f-stack-gt-standard-medium;
        font-size: 11px;

    }


    #header-account li:last-child a,
    .nav-primary li.level0:last-child a.level0 {
        border-bottom: 0;
    }

    .no-touch #header-account a:hover,
    .no-touch .nav-primary a:hover {
        //background-color: $c-module-background;
        text-decoration: none;
    }

}

.account-cart-wrapper {
    position: absolute;
    top:0px;
    right:-23px;
    padding: 25px 0 0;

    @include bp(max-width, $bp-medium) {
        position: static;
    }
}