@charset "utf-8";
/* CSS Document */


@font-face{font-family:'BrandonGrotesque';src:url("https://prd-static-default.sf-cdn.com/resources/css/fonts/BrandonGrotesque/Regular/brandon_reg-webfont.eot");src:url("https://prd-static-default.sf-cdn.com/resources/css/fonts/BrandonGrotesque/Regular/brandon_reg-webfont.eot?#iefix") format("embedded-opentype"),url("https://prd-static-default.sf-cdn.com/resources/css/fonts/BrandonGrotesque/Regular/brandon_reg-webfont.woff") format("woff"),url("https://prd-static-default.sf-cdn.com/resources/css/fonts/BrandonGrotesque/Regular/brandon_reg-webfont.ttf") format("truetype"),url("https://prd-static-default.sf-cdn.com/resources/css/fonts/BrandonGrotesque/Regular/brandon_reg-webfont.svg#brandon_grotesque_regularRg") format("svg");font-weight:normal;font-style:normal}

@font-face{font-family:'BrandonGrotesqueMedium';src:url("https://prd-static-default.sf-cdn.com/resources/css/fonts/BrandonGrotesque/Medium/brandon_med-webfont.eot");src:url("https://prd-static-default.sf-cdn.com/resources/css/fonts/BrandonGrotesque/Medium/brandon_med-webfont.eot?#iefix") format("embedded-opentype"),url("https://prd-static-default.sf-cdn.com/resources/css/fonts/BrandonGrotesque/Medium/brandon_med-webfont.woff") format("woff"),url("https://prd-static-default.sf-cdn.com/resources/css/fonts/BrandonGrotesque/Medium/brandon_med-webfont.ttf") format("truetype"),url("https://prd-static-default.sf-cdn.com/resources/css/fonts/BrandonGrotesque/Medium/brandon_med-webfont.svg#brandon_grotesquemedium") format("svg");font-weight:normal;font-style:normal}

body {
	font-family:"BrandonGrotesque", Arial, Helvetica, sans-serif;
	color:#000;
	-webkit-text-size-adjust:none;
	-ms-text-size-adjust:none;
	

}

body, p, h1, h2, h3 {
	margin:0px;
	padding:0px;
}

h1, h2, h3 {
	font-weight:normal;
}

img {
	border:none;
}

a {
	color:#666;
}

#wrapper {
	min-width:320px; 
	position:relative;
	overflow:hidden;
}


/****************************************/
/*****************HEADER*****************/
/****************************************/


header {
	width:100%;
	background:#17adc1;
	text-align:center;
}

header .inner {
	padding:7px 0px;
}

header .inner img {
	vertical-align:middle;
}

/****************************************/
/******************TOP*******************/
/****************************************/


section.top {
	position: relative;
	text-align: center;
	height: 538px;
	background:#8bcce9;
}

section.top .right {
	position:absolute;
	right:0px; left:50%;
	height:538px;
	background:#a2d6ed;
}


/****************************************/
/*****************BODY*******************/
/****************************************/


.sf {display:none;}

section.content {
	max-width:1340px;
	margin:0px auto;
}


.copy {
	padding: 30px 20px 30px 20px;
	text-align:center;
}

.copy h3 {
	font-weight:bold;
	padding:0px 0px 20px;
}


.legend {
	position:absolute;
	top:70px;
	right:20px;
	padding:10px;
	z-index:150;
	background:#e4f3f9;
}


.legend .lg {
	position:relative;
	padding:4px 0px 4px 25px;
	text-align:left;
	color:#000;
	font-size:13px;
}


.legend span {
	position:absolute;
	left:0px;
	height:15px;
	width:15px;
	background:#60833f;
}

.legend span.eu {
	background:#80a852;
}

.legend span.usa {
	background:#b1c19a;
}



#map {
	position:relative;
	margin:0px auto;
	width:885px;
	height:538px;
}

#map .bg, #map .overlay {
	position:absolute;
	top:0px; left:0px;
	width:885px;
	height:538px;
}

#map .bg {
	background:url(../images/map.png);
}

#map .bg .overlays{
	position:absolute;
	z-index:5;
}

#map .bg .popups{
	position:absolute;
	z-index:250;
}

#map .bg .map{
	position:absolute;
	z-index:10;
	
}

#map .overlay, #map .popup {
	display:none;
}

.popup.choice  {
	width: 300px;
}

.popup  {
	width: 250px;
	position: absolute;
	display:none;
	color:#666;
	z-index:5000;
}

.popup  a {
	color:#666;
}

.popup .content  {
	width:100%;
	position:absolute;
	bottom:7px;
	
	min-height:50px;
	text-align:center;
	margin-left:-109px;
}

.popup.choice .content  {
	margin-left:-136px;
}


.popup.rev .content  {
	top:7px;
}

area {outline:none;}

.popup .content .inner  {
	padding:10px 20px;
	text-align:left;
	font-size:0px;
	background:#FFF;
}

.order_country {
	font-size:13px;
	display:inline-block;
	width:50%;
	text-align:center;
	padding:7px 0px;
}


.order_country._uk {
	border-right:1px solid #dcdcdc;
}

.popup .content .inner strong  {
	display:block;
	text-align:center;
	padding:0px 0px 10px;
	margin:0px 0px 10px;
	border-bottom:1px solid #dcdcdc;
	font-size:24px;
}

.popup .content .inner .flag  {
	text-align:center;
}

.popup .content .inner .flag img  {
	height:auto;
	width:22px;
}

.popup.choice .content .inner .order  {
	padding:0px 0px 5px 0px;
}


.popup .content .inner .order  {
	padding:10px 0px 7px 0px;
	font-size:17px;
	line-height:21px;
	color:#333333;
	text-align:center;
}

.popup .content .inner .metric  {
	padding:5px 0px 0px 0px;
	font-size:14px;
	line-height:17px;
	color:#b9b9b9;
}

.popup .content .inner .metric a  {
	color:#b9b9b9;
}

.popup.choice .arrow {
	left:-137px;

}

.popup .arrow {
	background:url(../images/arrow.png) no-repeat center;
	height:7px;
	position:absolute;
	bottom:0px;
	width:100%;
	left:-109px;

}

.popup.rev .arrow {
	background:url(../images/arrow_reverse.png) no-repeat center;
	top:0px;

}

.content {
	/*width:885px;*/
	margin:0px auto;
}


.copy {
	padding:25px 40px;
	border-bottom:1px solid #e5e5e5;
}


.links {
	text-align:center;
	padding:20px 100px 30px;
}

.links a, .popup a {
	text-decoration:none;
}

/*****************FOOTER*****************/

footer {
	background:#f4f3f4;
	font-size:10px;
}

footer .inner {
	width:885px;
	margin:0px auto;
	padding:20px 20px;
}




@media only screen and (max-width: 850px) {
	.legend {
		top:45px;
		right:60px;
	}
	
	#map {
		left:-85px;
	}
}