#globalHeader:root {font-size: 16px;}
input[type="search"] {font-size: 1rem;}
a {text-decoration: none; color: #666;}

#main {-webkit-transition: all .3s ease;}

.cancel {text-align: right; padding: 18px 18px 0;}
.cancel:before {content: url("/img/icon_close.png"); margin-right: 5px;}
.annotation {font-size: 12px;}

#globalHeader {height: 70px; position: relative; z-index: 100; width: 100%;}
#globalHeader.white .wrapper li a,
#globalHeader.white_back .wrapper li a {color: #fff;}
#globalHeader .wrapper li a {color: #333;}
#globalHeader .wrapper li a:hover {color: #999;}
#globalHeader.white_back {
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjUiLz4KICAgIDxzdG9wIG9mZnNldD0iNDAlIiBzdG9wLWNvbG9yPSIjMDAwMDAwIiBzdG9wLW9wYWNpdHk9IjAuMiIvPgogICAgPHN0b3Agb2Zmc2V0PSI5MCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMCIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjMDAwMDAwIiBzdG9wLW9wYWNpdHk9IjAiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);
	background: -moz-linear-gradient(top, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.2) 40%, rgba(0,0,0,0) 90%, rgba(0,0,0,0) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.5)), color-stop(40%,rgba(0,0,0,0.2)), color-stop(90%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0)));
	background: -webkit-linear-gradient(top, rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.2) 40%,rgba(0,0,0,0) 90%,rgba(0,0,0,0) 100%);
	background: -o-linear-gradient(top, rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.2) 40%,rgba(0,0,0,0) 90%,rgba(0,0,0,0) 100%);
	background: -ms-linear-gradient(top, rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.2) 40%,rgba(0,0,0,0) 90%,rgba(0,0,0,0) 100%);
	background: linear-gradient(to bottom, rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.2) 40%,rgba(0,0,0,0) 90%,rgba(0,0,0,0) 100%);
}
#globalHeader.white_back  #hSearch h1 {text-indent: -9999px; background: url(../img/icon_search_w.png) no-repeat center center; width: 20px; height: 21px; background-size: 20px 21px; position: absolute; top: 10px; right: 0; padding: 17px 20px; margin: 0; box-sizing: border-box; line-height: 2; padding-left: 30px; min-height: 28px; font-size: 14px; outline: none;}
.ua-desktop-windows.ua-ie-8 #globalHeader.white_back {display: block; background: url(/img/ie_header_back.png);}	
#hSearch h1 {text-indent: -9999px; background: url(../img/icon_search_b.png) no-repeat center center; width: 20px; height: 21px; background-size: 20px 21px; position: absolute; top: 10px; right: 0; padding: 25px; margin: 0; box-sizing: border-box; line-height: 2; padding-left: 30px; min-height: 28px; font-size: 14px; outline: none;}
.white #hSearch h1 {text-indent: -9999px; background: url(../img/icon_search_w.png) no-repeat center center; width: 20px; height: 21px; background-size: 20px 21px; position: absolute; top: 10px; right: 0; padding: 17px 20px; margin: 0; box-sizing: border-box; line-height: 2; padding-left: 30px; min-height: 28px; font-size: 14px; outline: none;}

#globalHeader .wrapper {background: rgba(0,0,0,.8); position: absolute; z-index: 1000; width: 100%; color: #fff; font-size: 16px; padding: 0; box-sizing: border-box;}
#globalHeader .wrapper li {list-style: none; font-size: 13px; padding: 28px 10px; line-height: 1;}
#globalHeader .wrapper li a {display: block;}

#hGlobalNav .wrapper {display: none;}
body.menuOpen #hGlobalNav .wrapper {display: block;}
body.menuOpen #main,
body.menuOpen #hGlobalNav h1,
body.menuOpen #siteName img,
body.menuOpen #hSearch h1 {-webkit-filter: blur(5px); filter: blur(5px);}

#siteName {z-index: 1001; top: 0; left: 0; margin: 0; position: absolute; font-size: 1em;}
#siteName a {padding: 10px 10px 10px 0; margin-top: 14px; display: block; line-height: 1;}

#siteName img {width: 130px; vertical-align: bottom;}

@media only screen and (min-width : 768px){
#globalHeader .wrapper ul {padding-left: 140px; margin: 0;}
}


#globalHeader:after {content: ''; clear: both; display: table;}
#hSearch li:nth-child(9) {width: 100%;}
#hSearch ul:after,
footer:after {content: ""; display: block; clear: both;}

#hSearch .wrapper {display: none;}
body.searchOpen #hSearch .wrapper {display: block;}
body.searchOpen #main,
body.searchOpen #hGlobalNav h1,
body.searchOpen #siteName img,
body.searchOpen #hSearch h1 {-webkit-filter: blur(5px); filter: blur(5px);}

#hAccount .wrapper {display: none;}
#hAccount .name div {display: inline;}
.avater {width: 22px; height: 22px; position: absolute; right: 5px; top: 0; padding: 13px 15px 15px; z-index: 1001;}
.avater img {width: 22px; height: 22px; border: 1px solid #fff; border-radius: 50%; cursor: pointer;}

.notificationCount {background: #7f0019; border-radius: 50%; color:#fff; font-size: 12px; width: 10px; height: 10px; display: block; padding: 4px; text-align: center; line-height: 10px;position: absolute; top: 5px; right: 0;}

footer {background: #000; line-height: 1;}
footer ul {margin: 0; list-style: none;}
footer {font-size: 14px; padding: 0 15px 15px;}
footer ul {margin: 0; padding: 15px 0;}
footer section + section ul {border-top: 1px solid #888;}
footer ul:after {content: ''; display: block; clear: both;}
footer li {float: left; width: 50%;}
footer li a {color: #e7e7e7; display: inline-block; padding: 10px 0;}
.footerNav5 {position: relative;}
.country img {width: 18px; height: 12px; margin-right: 8px;}

.account {position: relative; padding: 0 20px;}
.accountNotification .title {display: block; margin-bottom: 5px;}
.accountNotification .time {margin-right: 10px; font-size: small; color: #ccc;}
.accountNotification ul {background: rgba(0,0,0,.3); margin: 0;}
.accountMilePoint dt {font-size: small;}

#copyright {color: #ccc; width: 80%; margin: 0 auto; text-align: left;}
.copyright {display: inline-block; float: left; padding: 10px 20px 0 0; color: #888;}
footer nav.another ul {padding: 0;}
footer nav.another li {width: auto;}
footer nav.another li a {color: #ccc;}
footer nav.another li span {padding: 10px 20px 0 0; display: inline-block; color: #888;}

#trademark {position: absolute; top: 0; right: 0;}
#trademark img {height: 20px; margin: 25px 0 0 20px;}

.ua-desktop-windows.ua-ie-8 #globalHeader .wrapper li a,
.ua-desktop-windows.ua-ie-9 #globalHeader .wrapper li a {font-weight: bold;}
.ua-ie-8 #hSearch input[type="search"],
.ua-ie-8 .black_back #hSearch input[type="search"] {
	z-index: 1001; width: 150px; border: 1px solid #666; border-radius: 15px; position: absolute; right: 10%; top: 15px;
	background: url(/img/icon_search_b.png) no-repeat 10px center;
	padding-left: 30px; margin: 0; line-height: 2; min-height: 28px; font-size: 14px; outline: none;
}
.ua-ie-8 .white #hSearch input[type="search"],
.ua-ie-8 .white_back #hSearch input[type="search"] {
	z-index: 1001; width: 150px; border: 1px solid #eee; border-radius: 15px; position: absolute; right: 10%; top: 15px;
	background: url(/img/icon_search_w.png) no-repeat 10px center;
	padding-left: 30px; margin: 0; line-height: 2; min-height: 28px; font-size: 14px; outline: none;
}

@media screen and (max-width : 1152px){
	.white #hGlobalNav h1,
	.white_back #hGlobalNav h1 {background: url(../img/menu_w.png) no-repeat center center; text-indent: -9999px; background-size: 20px 15px; position: absolute; top: 0; left: 0; padding: 27px; margin: 0; cursor: pointer; width: 20px; height: 15px; z-index: 1001;}
	#hGlobalNav h1,
	.black_back #hGlobalNav h1 {background: url(../img/menu_b.png) no-repeat center center; text-indent: -9999px; background-size: 20px 15px; position: absolute; top: 0; left: 0; padding: 27px; margin: 0; cursor: pointer; width: 20px; height: 15px; z-index: 1001;}	
}

@media screen and (max-width : 767px){
	body {font-size: 1em;}
	#hGlobalNav,
	#hSearch {z-index: 1001;}
	#hSearch input[type="search"] {width: 90%;}
	.white #hSearch input[type="search"],
  #hSearch input[type="search"] {background: none; border: solid #ccc; border-width: 0 0 1px; border-radius: 0; -webkit-appearance: none; width: 90%; box-sizing: border-box; background: url(/img/icon_search_w.png) no-repeat left center; background-size: 20px 21px; line-height: 2; padding-left: 30px; min-height: 28px; font-size: 14px; outline: none;}
	
	#globalHeader .wrapper {background: rgba(0,0,0,.8); position: fixed; z-index: 1000; width: 100%; height: 100%; color: #fff; font-size: 16px; padding: 0; box-sizing: border-box;}
	#globalHeader #hGlobalNav .wrapper li {font-size: 16px; padding: 0;}
	#globalHeader .wrapper li {padding: 0;}
	#globalHeader .wrapper li a,
	#globalHeader.white .wrapper li a {display: block; padding: 12px 20px; color: #fff;}
	#globalHeader .wrapper ul {padding: 0;}

	#siteName {position: absolute; top: 0; left: 0; z-index: 20; margin: 0; padding: 0; text-align: center; width: 100%;}
	#siteName a {padding: 10px; margin-top: 16px;}
	#siteName img {width: 111px; border: 0;}
	#trademark {padding: 15px 0; position: absolute; left: 50%; top: 10px}
	#trademark img {height: 16px; margin: 0;}
	#trademark img:last-child {margin: 0 0 0 20px;}

	footer {font-size: 14px; padding: 0 15px 15px;}
	footer ul {margin: 0; padding: 15px 0;}
	footer section + section ul {border-top: 1px solid #888;}
	footer ul:after {content: ''; display: block; clear: both;}
	footer li {float: left; width: 50%;}
	footer nav.another ul {padding: 0;}
	footer nav.another li {width: 50%; padding-left: 0;}
	footer li a {color: #e7e7e7; display: block; padding: 10px 0;}
	footer nav.another li a {color: #ccc;}
	
	#copyright {text-align: left; width: 100%;}
	.copyright {display: block; float: none;}
}

@media only screen and (min-width : 768px){
	#hGlobalNav h1,
	.cancel {display: none;}
	#globalHeader {z-index: 100; width: 100%; top: 0;}
	#globalHeader.back {background: rgba(0,0,0,.2); height: 70px;}
	#globalHeader .wrapper {background: none; height: auto; font-size: 13px; padding: 10px;}
	#globalHeader #hGlobalNav .wrapper {
		display: block;
		background: none; height: auto; width: 100%; padding: 0;
		margin: 0 auto;
		-webkit-box-sizing: border-box; 
		-moz-box-sizing: border-box; 
		box-sizing: border-box;
		left: 0;
	}
	#globalHeader .headerWrap {width: 80%; margin: 0 auto; position: relative;}
	#globalHeader .wrapper li {list-style: none; float: left;}
	#globalHeader .wrapper li.home {display: none;}
	#globalHeader .wrapper li a {border: 0; /* text-shadow: 1px 1px 3px rgba(0,0,0,.5);  */}
	.white #hSearch h1 {background: url(/img/icon_search_w.png) no-repeat center center; width: 20px; height: 21px; background-size: 20px 21px; position: absolute; right: 10px; top: 20px;}
	#hSearch h1 {background: url(/img/icon_search_b.png) no-repeat center center; width: 20px; height: 21px; background-size: 20px 21px; position: absolute; right: 10px; top: 20px;}
	#hSearch h1 {display: none;}
	.avater {z-index: 1001; position: absolute; right: 0; top: 0; width: 30px; }
	.avater img {width: 30px; height: 30px;}
	#hSearch .wrapper {display: block; left: 0;}
	#globalHeader #hSearch .wrapper ul {display: none;}

	#hSearch input[type="search"],
	.black_back #hSearch input[type="search"] {
		z-index: 1001; width: 150px; border: 0; border-radius: 15px; position: absolute; right: 5%; top: 20px;
		background: url(/img/icon_search_b.png) no-repeat 10px center rgba(0,0,0,.05);
		background-size: 18px 19px; color: #000;
		padding-left: 30px; margin: 0; box-sizing: border-box; line-height: 2; min-height: 28px; font-size: 14px; outline: none;
		::-webkit-input-placeholder {color: #333}
		::-moz-placeholder {color: #333}
		:-moz-placeholder {color: #333}
		:-ms-input-placeholder {color: #333}
	}
	.white #hSearch input[type="search"],
	.white_back #hSearch input[type="search"] {
		z-index: 1001; width: 150px; border: 0; border-radius: 15px; position: absolute; right: 10%; top: 15px;
		background: url(/img/icon_search_w.png) no-repeat 10px center rgba(255,255,255,.2);
		background-size: 18px 19px;
		padding-left: 30px; margin: 0; box-sizing: border-box; line-height: 2; min-height: 28px; font-size: 14px; outline: none;
	}

	#globalHeader #hAccount .wrapper {
		padding: 0; font-size: 14px; background: rgba(0,0,0,.75); position: absolute; top: 60px; height: 550px; width: 50%; margin-left: 50%;
		-webkit-box-sizing: border-box; 
		-moz-box-sizing: border-box; 
		box-sizing: border-box;
	}

	#globalHeader #hAccount .wrapper li a {border-bottom: 1px solid rgba(255,255,255,0.1); display: block; padding: 10px; padding-right: 30px; background: url("/img/arrow_right.png") no-repeat center right; display: block; background-size: 12px auto;}
	#globalHeader #hAccount .wrapper ul {padding: 0; margin: 0;}
	#globalHeader #hAccount .wrapper li {list-style: none; float: none;}
	#globalHeader #hAccount .wrapper .cancel {display: block; cursor: pointer; padding: 20px 20px 0;}
	
	.accountNotification {
		float: left; width: 100%; margin-right: 40px; height: 280px; overflow: scroll; overflow-x: hidden;
		-webkit-box-sizing: border-box; 
		-moz-box-sizing: border-box; 
		box-sizing: border-box;
	}
	#globalHeader #hAccount .wrapper .accountNotification li {
		padding: 10px 15px;
		-webkit-box-sizing: border-box; 
		-moz-box-sizing: border-box; 
		box-sizing: border-box;
	}
	#globalHeader #hAccount .wrapper .accountNotification li a {
		-webkit-box-sizing: border-box; 
		-moz-box-sizing: border-box; 
		box-sizing: border-box;
	}
	
	#globalHeader #hAccount .wrapper .accountMenu {width: 40%; float: left;}
	#globalHeader #hAccount .wrapper .accountMenu a {background: none;}
	#globalHeader #hAccount .wrapper .accountMenu li a {border: 0;}
	
	.account {margin: 0 0 40px 0; clear: both;}
	.accountMilePoint {width: 60%; margin-left: 40%; position: relative;}
	.accountMilePoint a {background: url("/img/arrow_right.png") no-repeat center right; display: block; background-size: 12px auto;}
	.accountMilePoint dd {margin-left: 0; border-bottom: 1px solid rgba(255,255,255,0.1); padding-bottom: 5px;}
	.accountMilePoint .num {font-size: 130%; font-family: Helvetica, Arial;}
	.accountNotification img {vertical-align: middle; width: 30px; height: auto;}
	.account:after {content: "";
	position: absolute;
	top: -50px; right: 23px;
	margin-left: -10px;
	display: block;
	width: 0px;
	height: 0px;
	border-style: solid;
	border-width: 0 8px 8px 8px;
	border-color: transparent transparent #333 transparent;
	}
	
	#footerNav,
	#misc .content {width: 80%; margin: 0 auto;}
	footer li {width: auto; margin-right: 20px;}
}

@media screen and (min-width: 768px) and (max-width: 1152px)  {
	#hGlobalNav h1 {z-index: 1001;}
	#globalHeader .headerWrap {width: 90%;}	
	#hSearch input[type="search"] {right: 5%;}
}

@media screen and (min-width: 767px) and (max-width: 768px)  {
/* 	#globalHeader {position: relative; height: 40px;} */
	#globalHeader #hGlobalNav .wrapper {display: none;} 
	#siteName {position: absolute; top: 0; left: 0; z-index: 100; margin: 0; padding: 0; text-align: center; width: 100%; height: 70px;}
	#siteName a {padding: 7px 0;}
	#siteName img {width: 80px; vertical-align: top; padding: 15px; border: 0;}
	#hGlobalNav h1 {display: block; width: 15px; height: 12px; position: absolute; top: 0; left: 0; padding: 25px; margin: 0; cursor: pointer; z-index: 200;}
	#globalHeader #hGlobalNav .wrapper {background: rgba(0,0,0,.8); position: fixed; z-index: 1000; width: 100%; height: 100%; color: #fff; font-size: 16px; padding: 0; box-sizing: border-box;}
	#globalHeader #hGlobalNav .wrapper a {color: #fff;}
	#globalHeader #hGlobalNav .wrapper ul {padding: 0;}
	#globalHeader #hGlobalNav .wrapper li {list-style: none; float: none; padding: 0;}
	#hSearch li {width: 50%; float: left;}
	#hSearch li:nth-child(9) {width: 100%;}
	#hSearch ul:after {content: ""; display: block; clear: both;}
	#globalHeader .wrapper li {font-size: 16px;}
	#globalHeader .wrapper li a {display: block; padding: 10px 15px;}
	#hSearch .wrapper {display: none;}
	#globalHeader .headerWrap {width: 100%;}
	.cancel {display: block; padding: 20px 20px 0; z-index: 1002;}
	#hSearch input[type="search"],
	.white #hSearch input[type="search"] {background: none; border: solid #ccc; border-width: 0 0 1px; border-radius: 0; -webkit-appearance: none; width: 90%; box-sizing: border-box; background: url(/img/icon_search_w.png) no-repeat left center; background-size: 20px 21px; line-height: 2; min-height: 28px; font-size: 14px; outline: none; position: relative; left: 5%; /* top:0; */}
	#hSearch h1 {display: block; position: absolute; top: 10px; right: 0; padding:25px; margin: 0;z-index: 101;}
	#globalHeader #hSearch .wrapper {background: rgba(0,0,0,.7); position: fixed; z-index: 1000; width: 100%; height: 100%; color: #fff; font-size: 16px; padding: 0; box-sizing: border-box;}
	#globalHeader #hSearch .wrapper a {color: #fff;}
	#globalHeader #hSearch .wrapper ul {padding: 10px; display: block; width: 90%; margin: 20px auto;}
	#globalHeader #hSearch .wrapper li {list-style: none; padding: 0;}
}