html, body { position: relative; height: 100%; overflow: hidden; }

/* CHROME */
.Chrome { position: absolute; width: 100%; height: 100%; z-index: 100; }
.ChromeHead { z-index: 100; position: absolute; left: 0px; right: 0px; top: 0px; padding: 5px 0; height: 60px;
	background: url(../img/metal-bg.jpg) repeat-x; 
	/*
	background: #123b6f;  Old browsers 
	background: -moz-linear-gradient(-45deg,  #123b6f 0%, #00679f 100%); /* FF3.6+ 
	background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#123b6f), color-stop(100%,#00679f)); /* Chrome,Safari4+ 
	background: -webkit-linear-gradient(-45deg,  #123b6f 0%,#00679f 100%);  Chrome10+,Safari5.1+ 
	background: -o-linear-gradient(-45deg,  #123b6f 0%,#00679f 100%); /* Opera 11.10+ 
	background: -ms-linear-gradient(-45deg,  #123b6f 0%,#00679f 100%); /* IE10+ 
	background: linear-gradient(135deg,  #123b6f 0%,#00679f 100%); /* W3C 
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#123b6f', endColorstr='#00679f',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
.ChromeFoot { z-index: 100; position: absolute; left: 0px; right: 0px; bottom: 0px; padding: 0px 10px; height: 35px; background: url(../img/metal-bg.jpg) repeat-x;
	/*background: #123b6f;  Old browsers 
	background: -moz-linear-gradient(-45deg,  #123b6f 0%, #00679f 100%); /* FF3.6+ 
	background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#123b6f), color-stop(100%,#00679f)); /* Chrome,Safari4+ 
	background: -webkit-linear-gradient(-45deg,  #123b6f 0%,#00679f 100%); /* Chrome10+,Safari5.1+ 
	background: -o-linear-gradient(-45deg,  #123b6f 0%,#00679f 100%); /* Opera 11.10+ 
	background: -ms-linear-gradient(-45deg,  #123b6f 0%,#00679f 100%); /* IE10+ 
	background: linear-gradient(135deg,  #123b6f 0%,#00679f 100%); /* W3C 
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#123b6f', endColorstr='#00679f',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}

/* VIEWPORTS */
.VPHolder { position: relative; width: 200%; height: 100%; }

.VP { position: absolute; width: 50%; height: 100%; }
.VP.current { z-index: 10; }
.VP.next { left: 50%; z-index: 20; }

.Loader { display: none; position: absolute; top: 70px; bottom: 35px; width: 50%; background: rgba(0, 0, 0, 0.5); z-index: 30; }
.Loader .loadingIndicator { width: 140px; height: 40px; position: absolute; left: 50%; margin-left: -70px; top: 50%; margin-top: -20px; }
.Loader .loadingIndicator span { position: absolute; bottom: 0px; left: 0px; display: block; width: 140px; background: url(../img/loadingLogo.png) left bottom no-repeat; }

/* PANES */
.pane { position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px; z-index: 40; }

/* PROJECT PLAYER PANE */
.pane.projectPlayer .projectSlide { position: absolute; width: 100%; height: 100%; background-repeat: no-repeat; background-position: center center; background-size: cover; }
.pane.projectPlayer .projectSlide.hide { display: none; }
.projectPlayerControls { position: absolute; bottom: 70px; right: 20px; z-index: 60; }
.projectPlayerControls .info { float: right; text-align: right; cursor: pointer; }
.projectPlayerControls .info p { margin: 0; height: 20px; color: #fff; opacity: 0.6; }
.projectPlayerControls .info p strong { font-size: 14px; }
.projectPlayerControls .info p em { font-size: 13px; }
.projectPlayerControls .info:hover p { opacity: 1.0; }
.projectPlayerControls a.control { float: right; margin-top: 5px; margin-left: 10px; width: 30px; height: 30px; }
.projectPlayerControls a.control.pause { background: url(../img/player_pause.png); }
.projectPlayerControls a.control.play { background: url(../img/player_play.png); }


.projectPlayerPager { z-index: 50; position: absolute; top: 50%; margin-top: -25px; width: 50px; height: 50px; background-color: rgba(0,0,0,0.5); background-position: center center; background-repeat: no-repeat; position: absolute; display: block }

.projectPlayerPager:hover { background-color: white; }
.projectPlayerPager.next { background-image: url(../img/icons/white_next.png); right: 0px; }
.projectPlayerPager.next:hover { background-image: url(../img/icons/black_next.png); }

.projectPlayerPager.prev { background-image: url(../img/icons/white_prev.png); left: 0px; }
.projectPlayerPager.prev:hover { background-image: url(../img/icons/black_prev.png); }

/* TYPOGRAPHY PANE */
.pane.typography { display: none; background: url(../img/diagonal-on-light-image20.png) 0 0 repeat; padding-top: 100px; padding-bottom: 60px; z-index: 50; }
.pane.typography.us { width:45%; background: url(../img/diagonal-on-light-image50-blue.png) 0 0 repeat;}
.typographyContentHolder { position: absolute; top: 70px; left: 0px; right: 0px; }
/*.pane.typography.us .typographyContentHolder { background: rgba(32,32,32,0.9); width: 35%; left:10%; right:auto; padding: 15px 0;}*/
.pane.typography.us .typographyContentHolder h1 { padding: 0 10%; text-align:left; }
.pane.typography.us .typographyContentHolder p { padding: 0 10%; width:80%; text-align:left; }

/* SUBCONTENT WIDGET */
.subContentInactiveHeading, .subContentInactiveContent { display: none; }

/* PROJECTBROWSER */
.pane.projectBrowser { background: #222; }
.pane.projectBrowser .projectFilters { position: absolute; top: 70px; left: 0px; right: 0px; height: 40px; background: #111; }

.scrollWrapper, .scrollableArea, .projectRowHolder { height: 100%; overflow: hidden; }
.scrollingHotSpotLeft, .scrollingHotSpotRight { cursor: pointer; background: url(../img/black-opac.png); height: 100%; width: 40px; z-index: 900; }
.scrollingHotSpotLeft { position: absolute; left: 0px; }
.scrollingHotSpotLeft span { position: absolute; height: 100%; width: 100%; background: url(../img/icons/white_prev.png) no-repeat center center; }
.scrollingHotSpotRight { position: absolute; right: 0px; }
.scrollingHotSpotRight span { position: absolute; height: 100%; width: 100%; background: url(../img/icons/white_next.png) no-repeat center center; }
.scrollingHotSpotRight::after { content:"More"; display: block; position: absolute; top: 52%; left: 4px; width: 100px; height: 20px; color: #fff; }
.scrollingHotSpotRight:hover::after { left: 16px }

.pane.projectBrowser .projectFilters p { display: inline-block; float: left; margin: 0 0 0 20px; height: 40px; line-height: 40px; color: #fff; font-weight: bold; font-size: 14px; }
.pane.projectBrowser .projectFilters ul { float: left; margin: 0 0 0 20px; } 
.pane.projectBrowser .projectFilters ul li { float: left; height: 24px; list-style-type: none; padding: 0 20px; } 
.pane.projectBrowser .projectFilters ul li a { font-size: 14px; display: block; padding: 0;  color: #fff; border-bottom: 2px solid transparent; margin-top: 3px; line-height: 35px; }
.pane.projectBrowser .projectFilters ul li a:hover { text-decoration: none; border-bottom: 2px solid white; }
.pane.projectBrowser .projectFilters ul li a.active { border-bottom: 2px solid #018174; }

.pane.projectBrowser .projectTiles { position: absolute; background: black; top: 70px; bottom: 35px; left: 0px; right: 0px; padding-bottom: 10px; }
.pane.projectBrowser .projectTiles .projectRow { height: 33.33%; width: 100%; }
.pane.projectBrowser .projectTiles .tile { height: 100%; display: block; position: relative; float: left; overflow: hidden; }
.pane.projectBrowser .projectTiles .tile a { position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px; border: 10px solid black; border-bottom-width: 0px; border-right-width: 0px; }

.pane.projectBrowser .projectTiles .tile img { position: absolute; width: 100%; height: 100%; }
.pane.projectBrowser .projectTiles .tile span { color: #536d8d; font-size: 11px; position: absolute; left: 0px; bottom: 0px; padding: 10px; background: black;}
.pane.projectBrowser .projectTiles .tile span strong { font-size: 14px; display: block; text-transform: uppercase; color: white; font-weight: normal }
.pane.projectBrowser .projectTiles .tile a:hover span { color: #6e90bc; }
.pane.projectBrowser .projectTiles .tile a:hover span strong { color: white; }

/* NEWS BROWSER */
.pane.newsBrowser { background: black; }

.pane.newsBrowser .newsPort { position: absolute; background: black; top: 70px; bottom: 35px; left: 0px; right: 0px; }

.pane.newsBrowser .newsTiles { position: absolute; background: black; top: 0px; height: 66%; left: 0px; right: 0px; }
.pane.newsBrowser .newsTiles .newsRowHolder { height: 100%; overflow: hidden; }
.pane.newsBrowser .newsTiles .newsRow { height: 50%; width: 100%; }
.pane.newsBrowser .newsTiles .tile { height: 100%; display: block; position: relative; float: left; overflow: hidden; }
.pane.newsBrowser .newsTiles .tile a { position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px; border: 10px solid black; border-bottom-width: 0px; border-right-width: 0px; }
.pane.newsBrowser .newsTiles .tile img { position: absolute; width: 100%; height: 100%; }
.pane.newsBrowser .newsTiles .tile span { color: #018174; font-size: 11px; position: absolute; left: 0px; bottom: 0px; padding: 10px; background: black;}
.pane.newsBrowser .newsTiles .tile span strong { font-size: 14px; display: block; text-transform: uppercase; color: white; font-weight: normal }
.pane.newsBrowser .newsTiles .tile a:hover span { color: #018174; }
.pane.newsBrowser .newsTiles .tile a:hover span strong { color: white; }

.pane.newsBrowser .tweetTiles { position: absolute; background: black; bottom: 0px; height: 33%; left: 0px; right: 0px; }
.pane.newsBrowser .tweetTiles .tweetRowHolder { height: 100%; overflow: hidden; }
.pane.newsBrowser .tweetTiles .tweetRow { height: 100%; width: 100%; }
.pane.newsBrowser .tweetTiles .tile { height: 100%; display: block; position: relative; float: left; overflow: hidden; background: #121212; }
.pane.newsBrowser .tweetTiles .tile .insert { position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px; border: 10px solid black; border-bottom-width: 0px; border-right-width: 0px; background: url(../img/icons/white_twitter.png) no-repeat 15px 15px; }
.pane.newsBrowser .tweetTiles .tile img { position: absolute; width: 100%; height: 100%; }
.pane.newsBrowser .tweetTiles .tile span { position: absolute; color: white; }
.pane.newsBrowser .tweetTiles .tile span.date { right: 20px; top: 20px; font-size: 12px; line-height: 12px; }
.pane.newsBrowser .tweetTiles .tile span.content { top: 30%; font-size: 16px; line-height: 18px; left: 20px; right: 20px; }
.pane.newsBrowser .tweetTiles .tile span.content a { color: #018174; text-decoration: underline; }
.pane.newsBrowser .tweetTiles .tile span.functions { right: 20px; bottom: 20px; }
.pane.newsBrowser .tweetTiles .tile span.functions a { display: block; float: left; height: 20px; width: 40px; background: url(../img/icons/white_rt.png) no-repeat center center; background-size: cover; }
.pane.newsBrowser .tweetTiles .tile span.functions a.reply { background-image: url(../img/icons/white_reply.png); }
.pane.newsBrowser .tweetTiles .tile span.functions a.retweet { background-image: url(../img/icons/white_rt.png); }
.pane.newsBrowser .tweetTiles .tile span.functions a.favourite { background-image: url(../img/icons/white_favourite.png); }
/*
.pane.newsBrowser .tweetTiles .tile span { color: #018174; font-size: 11px; position: absolute; left: 0px; bottom: 0px; padding: 10px; background: black;}
.pane.newsBrowser .tweetTiles .tile span strong { font-size: 14px; display: block; text-transform: uppercase; color: white; font-weight: normal }
.pane.newsBrowser .tweetTiles .tile a:hover span { color: #018174; }
.pane.newsBrowser .tweetTiles .tile a:hover span strong { color: white; }
*/

/* CLIENT BROWSER */
.pane.clientBrowser { background: #151515 url(../img/backgrounds/clients.jpg) no-repeat bottom left; }
.pane.clientBrowser .clientTiles { position: absolute; top: 70px; bottom: 35px; left: 0px; right: 0px; }
.pane.clientBrowser .clientTiles .clientRowHolder { height: 80%; top: 10%; margin-left: 40px; margin-right: 40px; position: relative; overflow: hidden; border-bottom: 1px solid #454545; border-left: 1px solid #454545 }
.pane.clientBrowser .clientTiles .clientRow { height: 25%; width: 100%; }
.pane.clientBrowser .clientTiles .tile { height: 100%; display: block; position: relative; float: left; overflow: hidden; border-right: 1px solid #454545; border-top: 1px solid #454545; }
.pane.clientBrowser .clientTiles .tile a { position: absolute; left: 20px; right: 20px; top: 11px; bottom: 11px; left: 0px; right: 0px; top: 0px; bottom: 0px; }
.pane.clientBrowser .clientTiles .tile a img { position: absolute; width: 100%; height: 100%; opacity: 0.6; }
.pane.clientBrowser .clientTiles .tile a div { position: absolute; width: 100%; height: 100%; top: 100%; background: #357b71; }
.pane.clientBrowser .clientTiles .tile a div span { display: block; padding: 20px; color: white; font-size: 16px; }
.pane.clientBrowser .clientTiles .tile a div span strong { display: block; font-size: 20px; margin-bottom: 10px; text-transform: uppercase; }
/*
.pane.clientBrowser .clientTiles .tile span { color: #018174; font-size: 11px; position: absolute; left: 0px; bottom: 0px; padding: 10px; background: black;}
.pane.clientBrowser .clientTiles .tile span strong { font-size: 14px; display: block; text-transform: uppercase; color: white; font-weight: normal }
.pane.clientBrowser .clientTiles .tile a:hover span { color: #018174; }
.pane.clientBrowser .clientTiles .tile a:hover span strong { color: white; }
*/
/* PROJECTDETAILS */
/* standard project details pane */
.pane.projectDetails { top: 70px; bottom: 35px; background-color: black; overflow: hidden; }
.pane.projectDetails .closeButton { z-index: 30; position: absolute; display: block; width: 50px; height: 50px; background: rgba(255,255,255,0.5) url(../img/icons/black_close.png) no-repeat center center; top: 5%; right: 0px; }
.pane.projectDetails .closeButton:hover { background-color: white; }

.pane.projectDetails .sliderPages { position: absolute; z-index: 30; left: 0px; right: 0px; bottom: 0px; text-align: center; }
.pane.projectDetails .sliderPages a { display: inline-block; height: 30px; width: 30px; background: black; color: transparent; background: rgba(0, 0, 0, 0.7) url(../img/pager-inactive.png) no-repeat center center; }
.pane.projectDetails .sliderPages a.activeSlide { background-image: url(../img/pager-active.png); }

.pane.projectDetails .projectInfoSlider { z-index: 30; position: absolute; width: 500px; height: 100%; top: 0px; left: -500px; }

.pane.projectDetails .projectInfoSlider .projectInfo { width: 500px; position: absolute; right: 0px; top: 5%; max-height: 90%; background: rgba(0, 0, 0, 0.7); overflow: auto; }
.pane.projectDetails .projectInfoSlider .infoButton { position: absolute; display: block; width: 50px; height: 50px; background: rgba(0, 0, 0, 0.7) url(../img/icons/white_info.png) no-repeat center center; top: 5%; right: -50px; }
.pane.projectDetails .projectInfo .content { padding: 20px; }
.pane.projectDetails .projectInfo h1 { margin-top: 0px; font-size: 35px; margin-bottom: 30px; }
.pane.projectDetails .projectInfo h2 { font-weight: normal; text-transform: uppercase; margin: 0px; font-size: 25px; }
.pane.projectDetails .projectInfo * { color: white; }
.pane.projectDetails .projectInfo p { font-size: 13px; }
.pane.projectDetails .projectInfo p.tags { line-height: 20px; text-align: center; }

/* PROJECT DETAILS SCROLLER */

/*
.pane.projectDetailsScrollerHolder { top: 70px; bottom: 35px; background: #1a1a1a; overflow: hidden; }
.pane.projectDetailsScroller { top: 0px; bottom: 0px; }
.projectDetailsScroller .colElement { height: 100%; position: relative; float: left; margin-right: 40px; }

.pane.projectDetailsScrollerHolder .closeButton { z-index: 50; position: absolute; display: block; width: 50px; height: 50px; background: rgba(255,255,255,0.5) url(../img/icons/black_close.png) no-repeat center center; top: 0px; right: 80px; }
.pane.projectDetailsScrollerHolder .closeButton:hover { background-color: white; }
*/

.pane.projectBasic { top: 70px; /*bottom: 35px;*/ overflow: auto; overflow-y:hidden; -webkit-overflow-scrolling: touch; }
.pane.projectBasic .projectScroller { height: 100%; }
.pane.projectBasic .projectScroller .colElement { height: 100%; position: relative; float: left; margin-right: 40px; overflow: hidden; }

.colElement.imageAndOverlay { overflow: hidden; }
.colElement.imageAndOverlay .overlay { z-index: 10; position: absolute; top: 40px; left: 40px; width: 460px; padding: 20px; background: rgba(32,32,32,0.9); }
.colElement.imageAndOverlay .mask { z-index: 9; position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px; background: url(../img/diagonal-on-light-image.png); }
.colElement.imageAndOverlay img { z-index: 8; position: absolute; width: 100%; height: auto; }

.colElement.textOnly { width: 500px; }
.colElement.textOnly .cms { padding: 40px 0; }
.colElement.twoUp .rowElement { height: 50%; }
.colElement .videoPlayer a, .colElement.videoPlayer a { display: block; height: 100%; width: 100%; }
.colElement.fourUp { position: relative; }
.colElement.fourUp .fourUpHolder { position: absolute; left: 40px; right: 40px; top: 40px; bottom: 35px; }
.colElement.fourUp .fourUpHolder div { height: 48%; position: absolute; }
.colElement.fourUp .fourUpHolder .one { left: 0px; top: 0px; }
.colElement.fourUp .fourUpHolder .two { right: 0px; top: 0px; }
.colElement.fourUp .fourUpHolder .three { left: 0px; bottom: 0px; }
.colElement.fourUp .fourUpHolder .four { right: 0px; bottom: 0px; }
.colElement.iframe iframe { width: 100%; height: 100%; }
.colElement.iframe .iframeOverlay { position:absolute; top:0; bottom:0; left:0; right:0; background: url(../img/black-opac.png); background: rgba(0,0,0,0.8) }
.colElement.iframe .iframeOverlay .text h1 { font-weight: 300; text-align: center; color: #888; font-size: 48px; }
.colElement.iframe .iframeOverlay .text h1 strong { font-weight: 700; color: #fff; }
.colElement.iframe .iframeOverlay .text h2 { text-align: center; color: #fff; text-transform: uppercase; font-size: 18px; font-weight: 300; }


.colElement.iframe .iframeOverlay .text  { position:absolute; left:0; right:0; top:45%; }

.bgcover { background-repeat: no-repeat; background-position: center center; background-size: cover; }

.icon { display: inline-block; width: 20px; height: 20px; line-height: 20px; margin-right: 10px; }
.icon.client { background: url(../img/icon_client.png) no-repeat center center; }
.icon.location { background: url(../img/icon_location.png) no-repeat center center; }

.pane.projectDetails .projectImageSlides { position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; }
.pane.projectDetails .projectImageSlides .projectImageSlide { position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; background-repeat: no-repeat; background-position: center center; background-size: cover; }
.pane.projectDetails .projectImageSlides .projectImageSlide.video .playButton { background: url(../img/icons/play.png) no-repeat center center; position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px; }

/* NEWSDETAILS */
/* standard project details pane */
.pane.newsDetails { top: 70px; bottom: 35px; background-color: black; overflow: hidden; }
.pane.newsDetails .closeButton { z-index: 30; position: absolute; display: block; width: 50px; height: 50px; background: rgba(255,255,255,0.5) url(../img/icons/black_close.png) no-repeat center center; top: 5%; right: 0px; }
.pane.newsDetails .closeButton:hover { background-color: white; }

.pane.newsDetails .sliderPages { position: absolute; z-index: 30; left: 0px; right: 0px; bottom: 0px; text-align: center; }
.pane.newsDetails .sliderPages a { display: inline-block; height: 30px; width: 30px; background: black; color: transparent; background: rgba(0, 0, 0, 0.7) url(../img/pager-inactive.png) no-repeat center center; }
.pane.newsDetails .sliderPages a.activeSlide { background-image: url(../img/pager-active.png); }

.pane.newsDetails .newsInfoSlider { z-index: 30; position: absolute; width: 500px; height: 100%; top: 0px; left: 0px; }

.pane.newsDetails .newsInfoSlider .newsInfo { width: 500px; position: absolute; right: 0px; top: 5%; max-height: 90%; background: rgba(0, 0, 0, 0.7); overflow: auto; }
.pane.newsDetails .newsInfoSlider .infoButton { position: absolute; display: block; width: 50px; height: 50px; background: rgba(0, 0, 0, 0.7) url(../img/icons/white_info.png) no-repeat center center; top: 5%; right: -50px; }
.pane.newsDetails .newsInfo .content { padding: 20px; }
.pane.newsDetails .newsInfo h1 { margin-top: 0px; font-size: 35px; margin-bottom: 30px; }
.pane.newsDetails .newsInfo h2 { font-weight: normal; text-transform: uppercase; margin: 0px; font-size: 25px; }
.pane.newsDetails .newsInfo * { color: white; }
.pane.newsDetails .newsInfo p { font-size: 13px; }
.pane.newsDetails .newsInfo p.tags { line-height: 20px; text-align: center; }

.pane.newsDetails .newsImageSlides { position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; }
.pane.newsDetails .newsImageSlides .newsImageSlide { position: absolute; top: 0px; bottom: 0px; left: 0px; right: 0px; background-repeat: no-repeat; background-position: center center; background-size: cover; }

/* slide in project details */
.pane.projectDetailsModal { left: 100%; }

.pane.newsDetailsModal { left: 100%; }

/* scroll bar customisation */
.jspVerticalBar { width: 10px; background: none; }
.jspVerticalBar:hover { width: 15px; }
.jspTrack { background: none; }
.jspDrag { margin: 4px; background: white; }

/* CONTACTS PANE */
.contactsPane { overflow: hidden; }
.pancontainer { height: 100%; width: 100%; background:#1d3b42; background: rgba(29,59,66,0.8); overflow: hidden; }

.pancontainer .overlay { position: absolute; top: 70px; left: 0px; right: 0px; height: 40px; background: rgba(0,0,0,0.5); z-index: 23 }
.pancontainer .overlay p { display: inline-block; float: left; margin: 0 0 0 20px; height: 40px; line-height: 40px; color: #fff; font-weight: bold; font-size: 14px; }
.pancontainer .overlay ul { float: left; margin: 0 0 0 20px; } 
.pancontainer .overlay ul li { float: left; height: 24px; list-style-type: none; padding: 0 20px; } 
.pancontainer .overlay ul li a { font-size: 12px; display: block;  color: #fff; border-bottom: 2px solid transparent; margin-top: 3px; line-height: 35px; }
.pancontainer .overlay ul li a:hover { text-decoration: none; border-bottom: 2px solid white; }
.pancontainer .overlay ul li a.active { border-bottom: 2px solid #123B6F; }
/*
.pancontainer .overlay{ position:absolute; z-index:1000; top:0; left:0; width:100%; height:60px;background:rgba(0,0,0,0.3); }
.pancontainer .overlay ul { list-style-type:none; margin:0; padding:0; width:450px; margin:auto; height: 60px; }
.pancontainer .overlay ul li { float:left; color:white; height:60px; line-height:60px; margin-right:40px; }
.pancontainer .overlay ul li:last-child { margin-right:0px; }
.pancontainer .overlay ul li a { background:url(../img/icon_eyeballs.png) no-repeat top left; color:white; background-position:0 -20px; height: 20px; padding-left:30px; }
.pancontainer .overlay ul li a.active { background-position:0 0; }
*/
.pancontainer .map {width: 5411px; height: 3140px; position: absolute; left: -1874px; top: -1217px; }
.pancontainer .crosshair { position:absolute; z-index:21; top:343px; left:630px; width:20px; height:20px;background:url(../img/crosshair.png) no-repeat top left; }
.pancontainer span.marker { position:absolute; z-index:21; width:52px; height:71px; background:url(../img/icon_pin_rectangle.png) no-repeat top left; }
.pancontainer span.marker a { display:block; width:22px; height:29px; position: absolute;bottom: 0;left: 15px; }
.pancontainer span.marker a.active { display:none; }
.pancontainer span.marker.London { left:2558px; top: 1034px; }
.pancontainer span.marker.Brazil { left:1887px; top: 2245px; }
.pancontainer span.marker.Mexico { left:1033px; top: 1514px; }
.pancontainer span.marker.large { background-position: 0 -71px; }

.pancontainer .map img.seg { width:auto; height:auto; margin:0;float:left; padding:0; vertical-align:top; }
.pancontainer .map .contact-modal { opacity:0; display:none; position:absolute; z-index:22; left: 2624px; top: 920px; width:240px; height:240px; padding:20px;background: #123B6F; box-shadow: 0 1px 0 rgba(0, 0, 0, 0.5); }
.pancontainer .map .contact-modal span.tick { position:absolute; left:-22px; top:118px; width:22px; height:44px; background: url("../img/modal_arrow_rectangle.png") no-repeat top left; }
.pancontainer .map .contact-modal h2 { margin:0 0 10px 0; color:white; text-shadow: 0 1px 0 rgba(0,0,0,0.4); font-size: 24px; line-height: 22px; }
.pancontainer .map .contact-modal h3 { margin:0; color:#fff; text-shadow: 0 1px 0 rgba(0,0,0,0.4); font-size: 16px; line-height: 16px; }
.pancontainer .map .contact-modal .details { margin-top:20px; }
.pancontainer .map .contact-modal .details .detail { clear:both; }
.pancontainer .map .contact-modal .details .detail p { color:white; text-shadow: 0 1px 0 rgba(0,0,0,0.4); margin-left:40px; padding-top: 4px; }
.pancontainer .map .contact-modal .details .detail p a { color:white; }
.pancontainer .map .contact-modal .details .detail p a:hover { text-decoration:underline; }

.pancontainer .map .contact-modal.London { left:2630px; top: 924px; }
.pancontainer .map .contact-modal.Brazil { left:1959px; top: 2134px; }
.pancontainer .map .contact-modal.Mexico { left:1104px; top: 1404px; }

.pancontainer .map .contact-modal .details .detail span.icon30 { margin-bottom:10px; float:left; display:block; width:30px; height:30px; background: url(../img/icons_white.png) no-repeat top left; }
.pancontainer .map .contact-modal .details .detail span.icon30.address { background-position: 0 0; }
.pancontainer .map .contact-modal .details .detail span.icon30.phone { background-position: 0 -30px; }
.pancontainer .map .contact-modal .details .detail span.icon30.email { background-position: 0 -60px; }